News and Tools for Frontend Development (12)
(Stay up-to-date on all topics by feed or on Mastodon.)
- 13 Advanced (But Useful) Git Techniques and Shortcuts (toot or tweet) · · videos, git
- 5 Steps for Writing Alt Text for Accessibility (toot or tweet) · · accessibility, writing
- Becoming a Design Tokens Ambassador (toot or tweet) · · design-tokens
- Defining Basic JavaScript Terms: “map”, “filter”, and “reduce” (toot or tweet) · · javascript
- Fractional SVG Stars with CSS (toot or tweet) · · css, svg
- Using CSS 3 Overflow Properties to Make Containers Meet WCAG 2.1 (toot or tweet) · · css, accessibility, wcag
- What’s New in PHP 8.1: Features, Changes, Improvements, and More (toot or tweet) · · php
- Firefox’s “bolder” Default Is a Problem for Variable Fonts (toot or tweet) · · css, fonts, user-agents, mozilla, firefox
- What’s New with DevTools: Cross-Browser Edition (toot or tweet) · · dev-tools, user-agents, google, chrome, microsoft, edge, mozilla, firefox, apple, safari
- A Practical Guide to Creating Reusable React Components (toot or tweet) · · guides, react, components
- Color and Universal Design (toot or tweet) · · design, colors, accessibility
- HTTP/3: Practical Deployment Options (toot or tweet) · · http, protocols, deploying
- Designing for Long Waits and Interruptions: Mitigating Breaks in Workflow in Complex Application Design (toot or tweet) · · user-experience, performance, complexity
- Avoiding FOUT with Async CSS (toot or tweet) · · css
- Stop! Put Down That Ternary, Lines Are Free (toot or tweet) · · maintainability
- Make Accessibility Part of Your Startup’s Products and Culture from Day One (toot or tweet) · · accessibility, culture
- Reducing Carbon Emissions on the Web (toot or tweet) · · sustainability
- The Pros and Cons of Professional Language (toot or tweet) · · career
- Multiple Accounts and Git (toot or tweet) · · git
- Element Diversity (toot or tweet) · · html
- Getting Started with Web Accessibility Testing (toot or tweet) · · accessibility, testing
- Interactive Learning Tools for Front-End Developers (toot or tweet) · · learning
- The Effect of CSS on Screen Readers (toot or tweet) · · css, accessibility, user-agents, assistive-tech
- Threats of Using Regular Expressions in JavaScript (toot or tweet) · · javascript, regex
- Understanding Next.js Data Fetching (CSR, SSR, SSG, ISR) (toot or tweet) · · nextjs, data-fetching, client-side-rendering, server-side-rendering
- Best Practices for Logging in Node.js (toot or tweet) · · nodejs, logging, best-practices
- It Takes a PhD to Develop That (toot or tweet) · · career, quality, complexity
- Twitter’s “div” Soup and Uglyfied CSS, Explained (toot or tweet) · · html, css, twitter
- Web Scraping with JavaScript and Node.js (toot or tweet) · · javascript, nodejs, scraping
- Building a Split-Button Component (toot or tweet) · · components, html, css, javascript
- 1995: Apache and Microsoft IIS Shake Up the Web Server Market (toot or tweet) · · history, servers
- Building a Stepper Component (toot or tweet) · · components, html, css
- Building Reactive Systems with Node.js (toot or tweet) · · nodejs
- Color and Contrast, What Does It Mean? (toot or tweet) · · accessibility, colors, contrast
- Rethinking User Personas (toot or tweet) · · usability, user-experience, personas
- Shifting Accessibility Testing to the Left (toot or tweet) · · accessibility, design, usability
- State Management in Next.js (toot or tweet) · · state-management, nextjs
- Understanding Target Size Under WCAG 2.2 and How It Affects People with Disabilities (toot or tweet) · · accessibility, wcag
- Using SVG with Media Queries (toot or tweet) · · svg, css, media-queries
- 9.5 Ways Google Rewrites Your Title Tags (toot or tweet) · · seo, google
- Why You Should Manage Your Energy, Not Your Time (toot or tweet) · · career, productivity
- Writing High-Performance JavaScript (toot or tweet) · · javascript, performance
- 7 Practices to Create Good JavaScript Variables (toot or tweet) · · javascript
- Common npm Mistakes Every Developer Should Avoid (toot or tweet) · · npm
- Exploring the CSS Paint API: Blob Animation (toot or tweet) · · css, apis, animations
- Times New Roman Doesn’t Have to Be Boring—Here’s Why (toot or tweet) · · typography, fonts
- What Are the Web Performance Metrics That Actually Matter? (toot or tweet) · · performance, metrics
- 10 Fun Things You Can Do with GitHub.dev (toot or tweet) · · github
- 7 Useful CSS Cheat Sheets to Improve Your Skills (toot or tweet) · · css, cheat-sheets
- Creating a Positive Culture Around Accessibility (toot or tweet) · · accessibility, culture
- Essential Concepts in JS (toot or tweet) · · javascript, concepts
- 5 Tools to Automate Your Development (toot or tweet) · · tooling, automation, productivity
- Compound Components in React (toot or tweet) · · react, components
- Getting Started with CSS Animations (toot or tweet) · · css, animations
- Named and Framed (toot or tweet) · · accessibility, html
- Small Wins for Accessibility and Resilience (toot or tweet) · · accessibility, html
- Why Are Hyperlinks Blue? (toot or tweet) · · design, hypertext
- How to Use “Promise.any()” (toot or tweet) · · javascript, promises
- Embracing Asymmetrical Design and Overcoming the Harmful Effects of “text-overflow: ellipsis” in CSS (toot or tweet) · · design, css
- Flexbox or CSS Grid? How to Make Layout Decisions That Make Sense (toot or tweet) · · css, layout, comparisons
- jsc: My New Best Friend (toot or tweet) · · javascript, tooling
- 8 Fundamental Principles of Effective Web Design (toot or tweet) · · principles
- Scrollbar Reflowing (toot or tweet) · · scrolling, user-experience
- Key Data Structures and Their Roles in RenderingNG (toot or tweet) · · user-agents, engines, chromium, google, rendering
- 4 Important Differences Between Regular and Arrow Functions (toot or tweet) · · javascript, comparisons
- 5 Ways to Undo Mistakes with Git (toot or tweet) · · git, command-line
- HTTP/3: Performance Improvements (toot or tweet) · · http, protocols, performance
- 6 CSS Shorthand Properties to Improve Your Web Application (toot or tweet) · · css, optimization
- How I Experience Web Today (toot or tweet) · · websites, web
- Using the Platform (toot or tweet) · · web-platform
- Bootstrapping a Node.js TypeScript API: Routing, Middleware, and Custom Types and Errors Modules (toot or tweet) · · nodejs, typescript, apis, routing, errors, modules
- Accessibility from the Ground Up (toot or tweet) · · accessibility
- How to Calculate REMs from Pixels (toot or tweet) · · css
- UI Cheat Sheet: Spacing Friendships (toot or tweet) · · design, spacing, cheat-sheets
- What’s on the Menu? (toot or tweet) · · vuejs, accessibility
- I Give You Feedback on Your Blog Post Draft but You Don’t Send It to Me (toot or tweet) · · writing, blogging
- I Tried Angular as a React Developer: Here Are 6 Things I Like About It (toot or tweet) · · angular, react, comparisons
- Top 9 Lessons Learned in 12 Years as a Software Developer (toot or tweet) · · career
- Truthy and Falsy: When All Is Not Equal in JavaScript (toot or tweet) · · javascript
- Web Accessibility Checklist (toot or tweet) · · websites, accessibility, checklists
- Building the Same App 5 Times (toot or tweet) · · comparisons, jquery, angular, react, vuejs, svelte
- One Favicon to Rule Them All (toot or tweet) · · html, images, favicons
- ARIA Spec for the Uninitiated (toot or tweet) · · html, accessibility, aria
- Level Up Your CSS Linting Using Stylelint (toot or tweet) · · css, consistency, linting
- State Management in Svelte Applications (toot or tweet) · · state-management, svelte
- Using CSS Module Scripts to Import Stylesheets (toot or tweet) · · css, javascript, modules
- What’s New in Bootstrap 5 (toot or tweet) · · frameworks
- CSS Grid Tooling in DevTools (toot or tweet) · · dev-tools, css, layout, user-agents, google, chrome
- Practical Uses of CSS Math Functions: “calc”, “clamp”, “min”, “max” (toot or tweet) · · css, math
- You Don’t Know “useEffect” (toot or tweet) · · react
- Does Shadow DOM Improve Style Performance? (toot or tweet) · · dom, shadow-dom, performance, rendering
- Reviewing a Design for Accessibility (toot or tweet) · · accessibility, code-reviews, user-experience
- A Guide to Designing Accessible, WCAG-Compliant Focus Indicators (toot or tweet) · · guides, accessibility, wcag, compliance
- Big O, Code Efficiency Analysis (toot or tweet) · · algorithms, performance
- Decoding AVIF: Deep Dive with Cats and imgproxy (toot or tweet) · · images, avif
- Breaking the Web Forward (toot or tweet) · · web, user-agents
- Accessible Design Systems: Look Good While Doing Good (toot or tweet) · · design-systems, accessibility
- How to Test for Accessibility with Users at Every Design Stage (toot or tweet) · · accessibility, testing
- Static vs. Dynamic vs. Jamstack: Where’s the Line? (toot or tweet) · · comparisons, tooling, jamstack
- CSS “accent-color” (toot or tweet) · · css
- Accessible Contrast Ratios and A-Levels Explained (toot or tweet) · · accessibility, colors, contrast
- Adding 100 Underline/Overlay Animations: The Impressive CSS Collection (toot or tweet) · · css, animations
- “<Lazy>” Rendering in Vue to Improve Performance (toot or tweet) · · vuejs, client-side-rendering, performance, optimization
- Principles by Design (toot or tweet) · · design, principles
- The Complete Guide to HTML Forms and Constraint Validation (toot or tweet) · · guides, html, forms, validation
- The State of Mobile First and Desktop First (toot or tweet) · · responsive-design, mobile-first, desktop-first
- “return await promise” vs. “return promise” in JavaScript (toot or tweet) · · javascript, promises, comparisons
- Exploring the CSS Paint API: Image Fragmentation Effect (toot or tweet) · · css, apis, images, effects
- Google vs. the Web (toot or tweet) · · google, web
- How Writing Can Advance Your Career as a Developer (toot or tweet) · · career, writing
- HTTP/3 from A to Z: Core Concepts (toot or tweet) · · http, protocols, concepts
- JavaScript Development: Making a Web Worker Optional (toot or tweet) · · javascript, web-workers
- The World of CSS Transforms (toot or tweet) · · css
- A Performance-Focused Workflow Based on Google Tools (toot or tweet) · · performance, web-vitals, tooling, google
- Next-Level List Bullets with CSS “::marker” (toot or tweet) · · css, selectors
- Uploading Multiple Files with Fetch (toot or tweet) · · javascript
- Browsers and Representation (toot or tweet) · · user-agents
- On the “<dl>” (toot or tweet) · · html
- A Guide to Accessible Digital UX Design (toot or tweet) · · guides, accessibility, user-experience, design
- Inclusive Usability Testing: The Benefits of Inclusive Design (toot or tweet) · · usability, testing, inclusion
- Sustainable Web Design, an Excerpt (toot or tweet) · · sustainability
- Visualizing a Codebase (toot or tweet) · · tooling, developer-experience
- Why Are We Talking So Much About Design Leadership? (toot or tweet) · · design, leadership
- Accessibility Testing with Storybook (toot or tweet) · · accessibility, testing, storybook
- React Children and Iteration Methods (toot or tweet) · · react
- Using CSS Shapes for Interesting User Controls and Navigation (toot or tweet) · · css, navigation
- What Are Accessibility Overlays Good For? (toot or tweet) · · accessibility, overlays
- Writing Great Alt Text: Emotion Matters (toot or tweet) · · accessibility, writing, user-experience
- Refresher on JavaScript Callbacks and Promises (toot or tweet) · · javascript, promises
- CSS Nesting, Specificity, and You (toot or tweet) · · css, cascade, nesting
- A Deep Dive on Skipping to Content (toot or tweet) · · accessibility, html, css
- Building the Perfect GitHub CI Workflow for Your Frontend Team (toot or tweet) · · github, ci-cd
- How to Build Resilient JavaScript UIs (toot or tweet) · · javascript, user-experience
- Using localStorage with React Hooks (toot or tweet) · · storage, react, hooks
- Web Accessibility Myths: Debunking 7 Common Misconceptions (toot or tweet) · · accessibility
- What Devs Need (toot or tweet) · · services, tooling, link-lists
- How to Use “Promise.allSettled()” (toot or tweet) · · javascript, promises
- Mitigating User Errors (toot or tweet) · · user-experience, errors
- Refactoring CSS: Strategy, Regression Testing, and Maintenance (toot or tweet) · · css, maintenance, refactoring, testing, strategies
- The (Most Comprehensive) JavaScript Design Principles Guide (toot or tweet) · · guides, software-design, javascript, principles
- How We Reduced Next.js Page Size by 3.5× and Achieved a 98 Lighthouse Score (toot or tweet) · · performance, nextjs, lighthouse, google
- 2021 Scroll Survey Report (toot or tweet) · · surveys, css, scrolling
- Why It’s Okay for Web Components to Use Frameworks (toot or tweet) · · frameworks, components
- 101 Digital Accessibility Tips and Tricks (toot or tweet) · · accessibility, tips, tricks
- Avoid the Most Common 18 Mistakes to Make Your UI/UX Design Better (toot or tweet) · · design, user-experience
- Chrome DevTools: Better Accessibility Inspection with the Source Order Viewer (toot or tweet) · · dev-tools, accessibility, debugging, user-agents, google, chrome
- 5 Git Tips to Level Up Your Workflow (toot or tweet) · · git, tips, command-line
- CSS Architecture and Performance in Micro Frontends (toot or tweet) · · css, architecture, performance, micro-frontends
- How to Stay Focused as a Self-Taught Frontend Web Developer (toot or tweet) · · career, learning, productivity
- Optimizing Your Own Performance as a Designer (toot or tweet) · · design, career
- There Is No Such Thing as a CSS Absolute Unit (toot or tweet) · · css, units
- Best Practices for Tags and Tag Managers (toot or tweet) · · web-vitals, best-practices
- Architecting and Scaffolding a TypeScript and Express API (toot or tweet) · · typescript, express, apis
- Creating an Accessible Dialog from Scratch (toot or tweet) · · accessibility
- How to Hand Off Accessible Designs to Developers? (toot or tweet) · · accessibility, processes
- Learnings from a WebPageTest Session on CSS-Tricks (toot or tweet) · · performance
- Using Absolute Value, Sign, Rounding, and Modulo in CSS Today (toot or tweet) · · css
- Safari Isn’t Protecting the Web, It’s Killing It (toot or tweet) · · user-agents, apple, safari, web
- CSS Logical Properties and Values (toot or tweet) · · css, logical-properties
- Global vs. Local Styling in Next.js (toot or tweet) · · css, nextjs, comparisons
- Thinking About the Cut-Out Effect: CSS or SVG? (toot or tweet) · · css, svg, techniques, effects
- When You Cannot Run Away from Using Tables on Mobile (toot or tweet) · · layout, user-experience, tables
- Is It Time to Ditch the Design Grid? (toot or tweet) · · design, layout
- Accessible Design from the Get-Go (toot or tweet) · · accessibility
- Getting Started with React “useContext” Hook and React Context (toot or tweet) · · react, hooks
- My First CSS—What I Wish I Knew About CSS When Starting Out as a Frontender (toot or tweet) · · css, layout
- Takeaways from the 2021 State of Digital Accessibility Report (toot or tweet) · · surveys, accessibility
- UX Principles That Include Cognitive Accessibility (toot or tweet) · · accessibility, user-experience, principles
- Overview of the RenderingNG Architecture (toot or tweet) · · user-agents, engines, chromium, google, rendering
- 5 UI Tips to Become a Better Front-End Developer (toot or tweet) · · design, colors, tips
- Break HTML Content into Newspaper-Like Columns Using Pure CSS (toot or tweet) · · css, layout
- Complete Introduction to CSS Flexbox (toot or tweet) · · introductions, css, layout
- Four Factors in UX Maturity (toot or tweet) · · user-experience
- It Is Time to Ditch the Title “Evangelist” from Accessibility (toot or tweet) · · accessibility
- You Don’t Need React for Building Websites (toot or tweet) · · react
- Accessibility Strategy for Product Management (toot or tweet) · · accessibility, strategies, product-management
- How to Eliminate Render-Blocking Resources: a Deep Dive (toot or tweet) · · performance, rendering
- The Vanishing Designer (toot or tweet) · · design, career
- Using Google Drive as a CMS (toot or tweet) · · content-management, google
- What We Learned About Accessibility by Scanning More Than 2 Million Federal .gov Web Pages (toot or tweet) · · accessibility
- Custom Properties and “@ property” (toot or tweet) · · css, custom-properties
- Definition of Done vs. Acceptance Criteria (toot or tweet) · · agile, scrum, processes, comparisons
- Simple Monorepos Via npm Workspaces and TypeScript Project References (toot or tweet) · · monorepos, npm, typescript
- Why the WCAG Colour Contrast Ratio Doesn’t Always Seem to Work (toot or tweet) · · accessibility, wcag, colors, contrast
- A Visual Guide to React Rendering—It Always Re-Renders (toot or tweet) · · guides, react
- From a Colourblind Designer to the World: Please Stop Using Red and Green Together (toot or tweet) · · accessibility, colors
- The Accessibility Stalemate (toot or tweet) · · accessibility
- 6 Useful Frontend Techniques That You May Not Know About (toot or tweet) · · html, css, javascript, techniques
- An Introduction to Frameworkless Web Components (toot or tweet) · · introductions, components, javascript, dom
- Journey of a Web Page—How Browsers Work (toot or tweet) · · user-agents, concepts
- Maintaining End-to-End Quality with Visual Testing (toot or tweet) · · testing, quality, design
- The Ultimate Cheat Sheet List for Web Developers (toot or tweet) · · html, css, javascript, cheat-sheets
- Practical Use Cases for Scroll-Linked Animations in CSS with Scroll Timelines (toot or tweet) · · css, animations
- Designing for Information Density (toot or tweet) · · design
- The State of Developer Ecosystem 2021 (toot or tweet) · · surveys
- What I Learned from “Software Engineering at Google” (toot or tweet) · · google
- Accessibility of the “Section” Element (toot or tweet) · · accessibility, html
- Content Accessibility Fact Sheet (toot or tweet) · · content, accessibility
- Designing for the Unexpected (toot or tweet) · · design, html, css
- Hobson’s Browser—How Apple, Facebook, and Google Broke the Mobile Browser Market by Silently Undermining User Choice (toot or tweet) · · user-agents, user-experience, apple, meta, google
- How to Get a Pixel-Perfect, Linearly Scaled UI (toot or tweet) · · css, preprocessors, layout
- There’s No Such Thing as Fully Automated Web Accessibility (toot or tweet) · · accessibility, automation
- What Is Tree Shaking? (toot or tweet) · · javascript, concepts, tree-shaking
- The Performance Effects of Too Much Lazy-Loading (toot or tweet) · · performance, web-vitals
- For Developers, Apple’s Safari Is Crap and Outdated (toot or tweet) · · user-agents, apple, safari
- Angular Is Costing Companies Billions (toot or tweet) · · angular
- Build Complex CSS Transitions Using Custom Properties and “cubic-bezier()” (toot or tweet) · · css, transitions, custom-properties, complexity
- I’m Changing How I Review Code (toot or tweet) · · code-reviews, quality
- The 3-Second Frontend Developer Test (toot or tweet) · · html, css, conformance, quality
- The Most Important Lessons I’ve Learned from Senior Software Engineers (toot or tweet) · · career
- The Ultimate Guide to Browser-Side Storage (toot or tweet) · · guides, user-agents, storage, javascript
- What’s the Difference Between the Alignment Values of “start”, “flex-start”, and “self-start”? (toot or tweet) · · css
- How to Migrate from jQuery to Next.js (toot or tweet) · · migration, jquery, nextjs
- Detecting Media Query Support in CSS and JavaScript (toot or tweet) · · css, javascript, media-queries, support
- Gridless Design (toot or tweet) · · websites, design, layout
- Refactoring CSS: Introduction (toot or tweet) · · introductions, css, maintenance, refactoring
- TypeScript Interfaces: A Quick Guide to Help You Get Started (toot or tweet) · · guides, typescript
- What People Should Know Before Writing Articles or Creating Products About Accessibility (toot or tweet) · · accessibility, writing
- Freelance React Developer Checklist (toot or tweet) · · react, checklists
- How to Convert Arrays to Human-Readable Lists in JavaScript (toot or tweet) · · javascript, conversion, arrays
- Image Descriptions: A Human Technique That Robots Can’t Grasp (toot or tweet) · · accessibility, images
- Making a Strong Case for Accessibility (toot or tweet) · · accessibility
- The Document Outline (toot or tweet) · · html, accessibility
- Creating Accessible CSS Art (toot or tweet) · · css, accessibility, art
- Performance Design: The Illusion of Speed (toot or tweet) · · performance, user-experience
- The Numeric Colour Palettes in Modern Web Frameworks Explained (toot or tweet) · · color-palettes, frameworks
- The Large, Small, and Dynamic Viewports (toot or tweet) · · layout, responsive-design, css
- Five Ways to Include D/Deaf Users in Your Designs (toot or tweet) · · accessibility, design
- TypeScript and Native ESM on Node.js (toot or tweet) · · javascript, typescript, nodejs
- ARIA in HTML (toot or tweet) · · html, accessibility, aria
- Accessibility and Inclusivity: Distinctions in Experience Design (toot or tweet) · · accessibility, inclusion, user-experience
- The Dilemma of Naming Font Size Variables (toot or tweet) · · css, preprocessors, custom-properties
- How Does Node.js Load Its Built-In/Native Modules? (toot or tweet) · · javascript, nodejs, modules
- How to Use “Promise.all()” (toot or tweet) · · javascript, promises
- Using HSL Colors in CSS (toot or tweet) · · css, colors
- Where Did This Interaction Come From?—A Brief History of Interaction Design (toot or tweet) · · history, interaction-design
- Basics of JavaScript Test Driven Development (TDD) with Jest (toot or tweet) · · javascript, testing, jest
- Feature Checklists Are Not Enough: How to Avoid Making Bad Software (toot or tweet) · · usability, design, checklists
- “export default thing” Is Different to “export { thing as default }” (toot or tweet) · · javascript
- Evaluating Color and Contrast—How Hard Can It Be? (toot or tweet) · · accessibility, colors, contrast
- Short Note on Skip Links with Sticky Headers (toot or tweet) · · accessibility, css
- Accessibility and SEO (toot or tweet) · · accessibility, seo, html
- It’s a (Front-End Testing) Trap! Six Common Testing Pitfalls and How to Solve Them (toot or tweet) · · testing, quality
- Towards Richer Colors on the Web (toot or tweet) · · design, colors
- 10 Figma Best Practices to 10× Your Workflow (toot or tweet) · · design, figma, productivity, best-practices
- 9 Tips to Help You Ace a Whiteboard Interview (toot or tweet) · · interviewing, career, tips
- Encoding Data for POST Requests (toot or tweet) · · javascript, security
- How We Built React Components for Any Front End (toot or tweet) · · react, components
- The Internet Is Rotting (toot or tweet) · · link-rot, web
- The State of Web Workers in 2021 (toot or tweet) · · javascript, web-workers