2019 Nov 18th Reading Ref

SASS, CSS

• 8 Fantastic Pure CSS Border Effect Code Snippets
• Sticky Positioning Without JavaScript (Thanks to CSS Position: Sticky)
• Smoother & sharper shadows with layered box-shadows
• Link Underlines That Animate Into Block Backgrounds ★★★★★
• Jagged Little Pill: Issues with Rounded Buttons
• CSS Grid: illustrated introduction
• The wondrous world of CSS counters
• Toucaan—Rethinking CSS Frameworks ★★★
• Why the Box Model is Integral to Web Design ★
• Digging Into the Preview Loading Animation in WordPress
• Making Tables Responsive With Minimal CSS
• Patterns for Practical CSS Custom Properties Use
• The two-value syntax of the CSS Display property
• Things We Can’t (Yet) Do In CSS
• CSS variables, input[type="color"] and form animations
• Everyone uses CSS frameworks
• Bidirectional horizontal rules in CSS
• Some Things You Oughta Know When Working with Viewport Units
• CSS Variables With Inline Styles
• Uncommon Use Cases For Pseudo Elements ★★
• Thoughts After Looking at the Web Almanac’s Chapter on CSS
• Finally, it Will Be Easy to Change the Color of List Bullets
• Some CSS Grid Strategies for Matching Design Mockups
• iOS vs. Android App UI Design: The Complete Guide

JS

• React Redux Tutorial for Beginners: The Definitive Guide (2019)
• How to simplify your codebase with map(), reduce(), and filter() in JavaScript
• 30 天 Javascript 從入門到進階
• Understanding How Reducers are Used in Redux
• What Is Functional Programming?
• What is super() in JavaScript?
• React Query ★★★★★

Front-End

• Inconsistent behavior among browsers when clicking on buttons
• Optimize Images for Web ★★★
• IS IT TIME TO EMBRACE AMP?
• What I Like About Writing Styles with Svelte
• Become a Front-End Master in 2020 With These 10 Project Ideas ★★

Web Design / UX

• UX vs UI vs IA vs IxD : 4 Confusing Digital Design Terms Defined ★★★
• All You Need To Know About UX Team Structure ★★★★★
• Where to put buttons on forms ★★★
• 7 CTA button design guidelines ★★★★★
• Dark Mode — Working with Color Systems
• Light Theme, Redeemed
• Is There Such A Thing As Too Much Social Proof?
• Mind the gap, user centered design in large organizations with Luke Wroblewski (Youtube Video)
• Practicing ethical design
• 10 Small Design Mistakes We Still Make
• How to design delightful dark themes
• Designing accessible color systems ★★★★
• Dark Mode Looks Good, But Is It Actually Hurting You? ★★★
• Building the Constellation Design System
• What Newspapers Can Teach Us About Web Design
• The Evolution of Material Design’s Text Fields ★★★
• Mobile Dark Patterns
• Better Design With Deep Thinking ★★★
• 5 essential UX design tips

Others

• 前端工程師面試問題集
• How to Build a Web App with GraphQL and React

Tools/Materials

• Storybook
• CopyPalette ★★★
• CHART.XKCD (hand-drawn chart)
• 20+ Best Cursive Fonts
• Color Mixer ★★★★★
• Rough Charts
• overflow ★★★
• Easy Peasy Password
• Lordicon ★