News and Tools for Frontend Developers (18)
(Stay up-to-date on all topics by RSS feed, on Mastodon, or through other channels.)
- Quick Tip: How to Check if a Variable Is Set in PHP (via) · · how-tos, php, tips-and-tricks
- Mozilla, Like Google, Is Looking Ahead to the End of Apple’s WebKit Rule (by/via) · · user-agents, browser-engines, mozilla, google, apple, webkit
- Modularizing React Applications With Established UI Patterns (by/via) · · react, components, modules
- How to Write Semantic CSS (by) · · videos, how-tos, css, semantics
- How to Build Accessible Main Navigation? (by/via) · · how-tos, accessibility, navigation
- How to Add an Event Handler in React (by) · · how-tos, react, dom, events
- Focus Appearance Thoughts (by) · · accessibility, focus, css
- Advanced Figma Prototyping Tips and Tricks (by/via) · · figma, prototyping, tips-and-tricks
- A “color-contrast()” Strategy for Complimentary Translucent Backgrounds (by) · · css, colors, contrast, backgrounds, strategies
- Qodana Code Quality Platform—Overview (by/via) · · videos, overviews, jetbrains, qodana, quality, ci-cd
- The “margin-trim” Property (by) · · css
- The Different Names for Values in CSS (by) · · css
- The Difference Between Iteration and Prototyping (by) · · processes, prototyping, comparisons
- Testing Vue Components the Right Way (by) · · vuejs, components, testing
- Supporting CSS Multi Direction Languages in 2023 (by/via) · · css, internationalization, logical-properties
- Should Inclusive Design Be a UX Concern? (by/via) · · design, dei, user-experience
- Non-Text Content Contrast Also Matters (by) · · accessibility, colors, contrast
- My Favourite 3 Lines of CSS (by) · · css
- Mozilla’s Abandoned Servo Web Engine Is Making a Comeback in 2023 (by/via) · · mozilla, browser-engines, servo, user-agents
- Interop 2023 CMS Checkin (by) · · interoperability, html, syndication, rss, atom, semantics
- How to Favicon in 2023: Six Files That Fit Most Needs (by/via) · · how-tos, images, favicons
- How to Build a Magazine Layout With CSS Grid Areas (by/via) · · how-tos, layout, css
- Frontend Frameworks for Web-App Development (via) · · frameworks, web-apps
- Building a Dev Blog With the Pelican Static Site Generator (by) · · site-generators, blogging
- A Historical Reference of React Criticism (by) · · react, history
- Speeding Up the JavaScript Ecosystem—ESLint (by) · · javascript, performance, eslint, linting
- React Anti-Patterns and Best Practices—Dos and Don’ts (by) · · react, anti-patterns, best-practices
- How to Pick a Font (That Doesn’t Suck) (by) · · how-tos, guides, fonts, typography
- Discovery in Agile (by/via) · · agile, processes
- The Market for Lemons (by) · · web-platform, javascript, frameworks
- Rotating Gallery With CSS Scroll-Driven Animations (by) · · html, css, javascript, animations, scrolling
- Typography Manual (by) · · code-pens, typography
- Multi-Threaded React App Using useWorker (by) · · multithreading, react, javascript, web-workers
- How to Make a Zoom Effect Using CSS (by/via) · · how-tos, css, effects
- Foundation: The Best Framework for Building Responsive Sites (via) · · foundation
- Advice for Engineers, From a Manager (by) · · tips-and-tricks, career, communication, collaboration
- What Is Bootstrap: A Beginner’s Guide (by/via) · · guides, bootstrap
- WCAG 2.2 Update: It’s Time to Say Goodbye to the Parsing Criterion (by) · · accessibility, wcag, standards
- The YAML Document From Hell—JavaScript Edition (by) · · javascript, yaml
- How to Get the Last Matching Item in an Array With Vanilla JavaScript (by) · · how-tos, javascript, arrays
- How to Build a Static Website (by/via) · · how-tos, fundamentals
- High Definition CSS Color Guide (by/via) · · guides, css, colors
- WordPress.com Introduces Browse Mode, Style Book, and Push to Global Styles Features (by/via) · · wordpress
- Why Is Making a Dark Mode Greyscale So Hard to Get Right? (by) · · dark-mode, contrast, colors, design
- Understanding App Directory Architecture in Next.js (by/via) · · architecture, nextjs
- The Guide to Responsive Design in 2023 and Beyond (by) · · responsive-design, css
- The Gotcha With Animating Custom Properties (by/via) · · css, animations, custom-properties, performance
- Screen Reader Quick Guide (by) · · guides, user-agents, assistive-tech, screen-readers
- Quick Tip: How to Manage Timezones in PHP (via) · · how-tos, php, internationalization, tips-and-tricks
- Pushing Interop Forward in 2023 (by+/via) · · interoperability, web-platform
- Modular Web Design: Flexibility, Examples, and Alternatives · · design
- Microsoft Edge and Interop 2023 (via) · · interoperability, web-platform, user-agents, microsoft, edge
- Learn Images (by/via) · · courses, images, svg, gif, png, jpeg, webp, avif
- Interop 2023 (via) · · interoperability, web-platform
- Interop 2023: Continuing to Improve the Web for Developers (by+/via) · · interoperability, web-platform
- Igalia and Interop 2023 (via) · · interoperability, web-platform
- How the CSS “box-sizing” Property Works (by) · · css, box-model
- Hex Colors Aren’t Great at Anything Except Being Popular (by) · · colors, css
- Gatsby Is Joining Netlify (by/via) · · gatsby, netlify
- Don’t Use Return Types, Unless… (by) · · videos, typescript
- Design for AI: What Should People Who Design AI Know? (by/via) · · design, ai
- Cancel Duplicate Fetch Requests in JavaScript Enhanced Forms (by) · · javascript, data-fetching
- Caching Data in SvelteKit (by/via) · · caching, sveltekit
- Announcing Interop 2023 (via) · · interoperability, web-platform
- 3 Notion Templates to Better Manage Your Design System (by) · · design-systems, templates, maintenance
- Understanding Color and Accessibility (by) · · accessibility, colors
- Typographic Hierarchy in Print, Web, and App Design (by) · · typography, design
- The Ultimate Guide to JavaScript Error Handling (by/via) · · guides, javascript, errors
- Speed for Who? (by) · · performance, frameworks, developer-experience, user-experience
- Should You Start a Web Development YouTube Channel in 2023? (by/via) · · videos, career
- Setting Expectations for Asking ChatGPT Web Accessibility Questions (by) · · accessibility, ai
- New to the Web Platform in January (by/via) · · release-notes, web-platform, user-agents, google, chrome, mozilla, firefox, apple, safari
- Invoking React Components From Your Ember Apps (by) · · emberjs, react, components
- External Links: In or Out (by/via) · · seo, links, accessibility, user-experience
- 6 Approaches for Data Fetching in React (by) · · data-fetching, react
- Using Local Storage in JavaScript and React (by) · · javascript, react, storage
- Easy SVG Customization and Animation: A Practical Guide (by/via) · · guides, images, svg, animations
- CSS “color-mix()” (by/via) · · css
- 19 Must-Visit Sites for Product Design Inspiration (by/via) · · design, link-lists
- Léonie Watson on Accessibility (by+/via) · · podcasts, interviews, accessibility
- You’ve Got Options for Removing Event Listeners (by) · · javascript, events
- New WCAG 2.2 Features Rated (by) · · accessibility, wcag, standards
- An Introduction to MIME Types (by/via) · · introductions, mime-types
- The Pros and Cons of Responsive Web Design in 2023 (via) · · responsive-design
- Is It a Bad Idea to Use “target="_blank"” for Links in an Email? (via) · · email, links, user-experience
- HTML Input Types (by) · · html, forms
- Git Commit Patterns (by) · · git, documentation
- Accessible Hamburger Buttons Without JavaScript · · accessibility, javascript, navigation
- 10 GitHub Repositories You Should Know as a JavaScript Developer (by) · · javascript, cheat-sheets, best-practices, link-lists, github
- Your Web Performance Is Too Reactive; It’s Time to Do More Than Put Out Fires (by/via) · · performance
- Use the Dialog Element (Reasonably) (by) · · html, modals, accessibility
- Screen Readers Support for Text Level HTML Semantics (by/via) · · html, semantics, user-agents, assistive-tech, screen-readers, support
- Login Form UI Design Guide (by/via) · · guides, design, forms
- Flow Control in JavaScript: Callbacks, Promises, “async/await” (by+/via) · · javascript, callbacks, promises
- Creating a High-Contrast Design System With CSS Custom Properties (by/via) · · design-systems, css, custom-properties, contrast, colors
- Container Queries and Typography (by) · · css, container-queries, typography
- The Modern Way of Serving Images (by) · · images, html, performance
- “scrollend”, a New JavaScript Event (by/via) · · javascript, events
- Release Notes for Safari Technology Preview 162 (by/via) · · release-notes, user-agents, apple, safari
- Quick Tip: How to Manage Error Reporting in PHP (via) · · how-tos, php, errors, tips-and-tricks
- Musing Upon an “[alt]” Text Badge on Images (by) · · accessibility, html, css
- CSS Layers for CSS Resets (by/via) · · css, resetting
- Are We There Yet? WCAG 2.2 Is at the Candidate Recommendation Stage Again (by/via) · · accessibility, wcag, standards
- Animating CSS Grid (How-To and Examples) (by/via) · · css, layout, examples
- A “nth-child” CSS Trick (by) · · css, selectors, tips-and-tricks
- 10 Web Development Trends in 2023 (by) · · trends, frameworks, tooling, javascript, monorepos, css, ai, code-completion
- Things to Do and Not to Do During a Wave of Tech Layoffs (by) · · career
- Locking “body” Scroll for Modals on iOS (by) · · scrolling, css, modals
- Introduction to Gulp.js: Beginner’s Guide (via) · · introductions, guides, gulp
- CSS Wishlist 2023 (by) · · css, wish-lists
- Copying Designs Doesn’t Work, and Here’s Why (by/via) · · design, user-experience
- A Simple Custom (by) · · forms, accessibility, usability, css
- Visual Design Rules You Can Safely Follow Every Time (by) · · design
- Ship Small, Ship Fast (by) · · releasing
- Making Sense of TypeScript Using Set Theory (by) · · typescript
- Level Up Your CSS Skills With the “:has()” Selector (by/via) · · css, selectors
- International Domain Names: Where Does meßagefactory.ca Lead You? (by) · · internationalization, domains
- If You Need a Link, Don’t Use a Button (by) · · html, semantics, links, buttons, accessibility
- CSS Named Colors: Groups, Palettes, Facts, and Fun (by) · · css, colors, color-palettes
- CSS Art Tutorial: Create a Cute Cartoon Creature (by) · · tutorials, css, art
- Creating a Community That Values Accessibility (via) · · accessibility, community
- Be a Digital Ally: Further Exploration of WCAG 2.2 (via) · · accessibility, wcag, standards
- 3 Essential Design Trends, January 2023 (by/via) · · design, trends
- Replace Create React App Recommendation With Vite (by/via) · · discussions, react, vite
- Improve Your HTML Semantic With Pico CSS (by) · · html, pico
- How to Review a Web Site (via) · · how-tos, user-experience, performance, seo
- Accessibility Tools and Resources for Designers (by/via) · · tooling, link-lists, design
- Web Scraping—A Complete Guide (by) · · guides, scraping
- Web Accessibility Global Usage Survey · · surveys, accessibility
- How to Use Pico CSS and Next.js? (by) · · how-tos, pico, nextjs
- Comparing Level Access Automated Tools to Manual Accessibility Testing (by) · · accessibility, tooling, testing, automation
- What Is a Core Update? (by/via) · · seo
- Unordered Lists in Main Navigations (by) · · html, semantics, navigation
- The Key to Good Component Design Is Selfishness (by/via) · · components, developer-experience, maintainability
- So You Want to Make a New JS Framework (by) · · javascript, frameworks
- More Real-World Uses for “:has()” (via) · · css, selectors
- Designing a Robust Right-to-Left UI in Arabic, Hebrew, and Farsi (via) · · internationalization, design
- Cascading Components—a Way to Organize Figma Component Variants · · components, figma
- Building Reliable Distributed Systems in Node.js (via) · · nodejs
- 15 Must-Have Cheatsheets for Developers (by) · · cheat-sheets, link-lists
- Unlocking Security Updates for Transitive Dependencies With npm (by/via) · · npm, dependencies, security, maintenance
- Two Ways to Safely Break a Long Word in HTML (by) · · html
- Three Attributes for Better Web Forms (by) · · forms, html
- Optimize Time to First Byte (by/via) · · performance, optimization
- Don’t Target 100% Coverage (by) · · testing, code-coverage
- Comparing Manual and Free Automated WCAG Reviews (by) · · accessibility, wcag, auditing, comparisons
- “::backdrop” Doesn’t Inherit From Anywhere (by) · · css
- Solved With “:has()”: Vertical Spacing in Long-Form Text (via) · · css, selectors
- On-Scroll Typography Animations (by/via) · · typography, animations
- Front-End Is So Much More Than Building Designs (by) · · processes
- Discovering the Capable Web (by/via) · · web-platform
- Deep Cloning Objects in JavaScript, the Modern Way (by/via) · · javascript, objects
- CSS Tip: Style Your Radio Buttons and Checkboxes for Printing (by) · · css, tips-and-tricks, forms, print
- Accessible Writing Is Just Good Writing (via) · · accessibility, writing
- Why We Switched CDNs: How Google’s Core Web Vitals Led Us to Cloudflare Pages · · content-delivery, performance, web-vitals, cloudflare
- Using “:is()” in Complex Selectors Selects More Than You Might Initially Think (by/via) · · css, selectors
- The Truth About CSS Selector Performance (by/via) · · css, selectors, performance
- The Storytelling Power of Simple Design Solutions (by/via) · · design
- Scalable CSS (by) · · css, scaling
- Quick Tip: How to Read a Local File With PHP (via) · · how-tos, file-handling, php, tips-and-tricks
- Promises, Thenables, and Lazy-Evaluation: What, Why, How (by) · · javascript, promises
- Can a Bridge Be Unethical? (via) · · design, ethics
- Blind News Audiences Are Being Left Behind in the data Visualisation Revolution: Here’s How We Fix That (by/via) · · accessibility, information-design
- 6 Common SVG Fails (and How to Fix Them) (by/via) · · svg, images
- Optimizing the Image Element LCP (via) · · performance, web-vitals, images
- Minimal Dark Mode Styling (by) · · css, dark-mode, minimalism
- Greater Styling Control Over Type With “initial-letter” (by) · · css, typography
- A Better Way to Work With Number and Date Inputs in JavaScript (by/via) · · javascript
- User Style Sheets (via) · · videos, user-styles, css
- The Only Markdown Cheatsheet You Will Ever Need (by) · · markdown, cheat-sheets
- Speeding Up the JavaScript Ecosystem—Module Resolution (by) · · javascript, performance, modules
- Interactive SVG Reference (by) · · svg, images
- CSS Nesting Is Coming (by) · · css, nesting
- Complete Guide to Make You a Regex Guru (by) · · guides, regex
- Advanced Usage Patterns for Taking Page Element Screenshots With Playwright (by) · · screenshots, playwright, javascript
- 5 Principles of Readable Code: KISS, YAGNI, DRY, BDU, Occam’s Razor · · principles, maintainability
- Succeed as a Junior Developer (by) · · career
- Four Ways to Chop Up Arrays (with Vanilla JavaScript) (by) · · javascript, arrays
- Foundations: Visible Focus Styles (by/via) · · accessibility, focus, css
- Generics: The Most Intimidating TypeScript Feature (by) · · videos, typescript, generics
- What Can We Really Do About Spam? (via) · · spam, email, sustainability
- Top Front-End Tools of 2022 (by/via) · · tooling, link-lists
- Sibling Scopes in CSS, Thanks to “:has()” (by/via) · · css, selectors
- React, Vite, and TypeScript: Get Started in Under 2 Minutes (by/via) · · react, vite, typescript
- Manual Accessibility Testing (via) · · accessibility, testing
- Is TypeScript Worth It? · · discussions, typescript
- Fixing a Memory Leak in a Production Node.js App (by) · · nodejs, memory
- CSS Color Functions and Custom Properties (by) · · css, colors, functions, custom-properties
- Cookie “Expires” and “Max-Age” Attributes Now Have Upper Limit (by/via) · · cookies, user-agents, google
- 2023 N|Solid Awards: The Top 10 Best Node.js Open Source Projects to Watch (by/via) · · nodejs, foss, tooling, link-lists
- 11 Excellent WordPress Themes for 2023 (via) · · wordpress, themes, link-lists
- The YAML Document From Hell (by) · · yaml, standards
- The State of JavaScript 2022 (by/via) · · surveys, javascript
- The Main Areas of WAI-ARIA (by) · · accessibility, aria
- The Gotcha of Unhandled Promise Rejections (by) · · javascript, promises
- JavaScript, Community (by) · · javascript, community
- How to Destructure Props in Vue (Composition API) (by) · · how-tos, vuejs, props
- “:has” Is an Unforgiving Selector (by/via) · · css, selectors
- Closed Captions and Subtitles UX (by/via) · · accessibility, captions, user-experience
- Why Not “document.write()”? (by) · · javascript, performance
- Versioning Design Systems: Best Practices · · design-systems, versioning, best-practices
- Set Up a React App With TypeScript in 5 Minutes (by) · · react, vite, typescript
- Quick Tip: How to Filter Data With PHP (via) · · how-tos, php, tips-and-tricks
- Our Top Core Web Vitals Recommendations for 2023 (by+/via) · · performance, web-vitals, best-practices
- Faking Min Width on a Table Column (via) · · html, tables, css, responsive-design
- D̶e̶s̶i̶g̶n̶ Token Clusters (by/via) · · design-tokens
- Data URLs and Pool in Your URL (by) · · html, urls
- Data-Driven Design Systems in Practice (by) · · design-systems
- CSS “:readonly” Is Not for Select Fields (by) · · css, selectors
- CSS “:empty” Isn’t Applicable on Form Fields (by) · · css, selectors, forms
- 2023 Design Trends From an Accessibility Perspective (via) · · design, accessibility, trends
- Styling Buttons in WordPress Block Themes (by/via) · · wordpress, themes, buttons, css
- Node.js Retro 2022 (by/via) · · nodejs, retrospectives
- Implementing Microservice Architecture in Node.js (by) · · microservices, architecture, nodejs
- Good Design Is Intentional (by) · · design
- Customizing HTML Form Validation (by) · · html, forms, validation
- Conditional CSS (by) · · css
- Clever Code Considered Harmful (by) · · complexity, maintainability, career
- Building a Design System: Lessons Learned (by/via) · · lessons, design-systems
- A Software Developer’s Guide to Writing (by) · · guides, writing
- 7 Purpose-Driven UX Tips for Your Next Web-Site Redesign (via) · · user-experience, redesign, tips-and-tricks
- 7 Principles of Design Psychology Every UX Designer Should Know (by/via) · · design, user-experience, principles
- Personas Are Living Documents: Design Them to Evolve (by/via) · · usability, personas
- OK LCH, I’m Convinced (by) · · colors, css
- Intro to SolidJS: How to Create Fast, Reactive Web Apps (by) · · introductions, solidjs, web-apps
- Best Node.js Schedulers · · nodejs, cron
- 3D in CSS (by) · · css
- Using GitHub Copilot for Unit Testing (by) · · github, ai, testing
- Stock Photos of People With Disabilities (by/via) · · accessibility, content, images
- Revolutionizing the Web With WebAssembly: A Comprehensive Guide (by) · · webassembly, guides
- Why Web Performance Still Matters in 2023 (by/via) · · performance
- When to Use Flexbox and When to Use CSS Grid (by/via) · · css, layout
- Infinite Scrolling: When to Use It, When to Avoid It (by/via) · · videos, scrolling, usability
- Design Systems in Practice (by) · · videos, design-systems
- A New Accessibility Strategy for the GOV.UK Design System (by+/via) · · accessibility, strategies, design-systems
- 2022 JavaScript Rising Stars (by) · · websites, javascript, research, retrospectives
- When Stakeholders Bypass the Product Owner (by/via) · · agile, scrum, processes
- Using “!important” in Cascade Layers (by) · · css, cascade
- Understanding Git Through Images · · git
- Progressively-Enhanced Dark Mode (by) · · dark-mode, progressive-enhancement
- Microfeatures I’d Like to See in More Languages (by) · · programming
- HTML With Superpowers: An Introduction to Web Components (by) · · websites, books, courses, guides, web-components, introductions
- How to Build Great HTML Form Controls (by/via) · · how-tos, html, forms
- Every Software Developer Should Write a Blog (by) · · blogging, career, learning
- A Guide to Getting Data Visualization Right (by/via) · · guides, information-design
- What Does It Look Like for the Web to Lose? (by) · · web-platform, web
- JAWS, NVDA, and VoiceOver Braille Viewers (by) · · accessibility, user-agents, assistive-tech, screen-readers, jaws, nvda, apple, voiceover
- How to Increase Your Chances of Getting Interviews and Job Offers in Tech (by) · · how-tos, career, interviewing
- CSS “:has()” Feature Detection With “@ supports(selector(…))”: You Want “:has(+ *)”, Not “:has(*)” (by/via) · · css, selectors, at-rules, feature-detection
- Creating Tokens for Your Design System With ChatGPT Assistance (by/via) · · design-tokens, design-systems, ai