News and Tools for Frontend Developers (16)
(Stay up-to-date on all topics by RSS feed, on Mastodon, and through other channels.)
- A Beginners Guide to Digital Accessibility (by) · · guides, accessibility
- Website Issues: On the Relevance of Audience Size and Impact (by) · · processes, quality
- Using “linear()” for Better Animation (by) · · animations, css, javascript
- Measuring Design System “Adoption” (by) · · design-systems, metrics
- How to Build Lean Efficient Websites in 2023 (by) · · how-tos, html, progressive-enhancement, minimalism
- Creating a Shine Effect on a Card With Tailwind CSS (by) · · tailwind, effects
- A New Approach to Measuring Developer Productivity (by) · · productivity, metrics
- Write Better Code by Following These JavaScript Best Practices (by) · · javascript, best-practices
- What Devs Can Do on Global Accessibility Awareness Day (by) · · accessibility, awareness-days
- How to Create a Custom Range Slider Using CSS (by/via) · · how-tos, css, forms
- Getting Started With View Transitions on Multi-Page Apps (by) · · transitions, mpas, introductions
- Are We There Yet? WCAG 2.2 Is at the Candidate Recommendation [Stage] v3 (by/via) · · accessibility, wcag, standards
- Accessible Numbers (by) · · websites, accessibility
- Thinking on Ways to Solve Color Palettes (by/via) · · videos, css, colors, color-palettes
- Release Notes for Safari Technology Preview 170 (by/via) · · release-notes, user-agents, apple, safari
- Jekyll Tutorial: How to Create a Static Website (by/via) · · tutorials, how-tos, jekyll
- ESLint Guide: How to Use It With Confidence (by/via) · · guides, eslint, linting, consistency, maintainability
- A History of Metaphors for the Internet (by/via) · · history, web, terminology
- 6 Tips for Improving Language Switchers on Ecommerce Sites (via) · · videos, usability, internationalization, localization, tips-and-tricks
- Fieldsets, Legends, and Screen Readers Again (by/via) · · accessibility, html, forms, user-agents, assistive-tech, screen-readers
- Why Is Web Accessibility Important? (by/via) · · videos, accessibility
- Python Developers Survey 2022 Results (via) · · surveys, python
- Why Your Design Language System Needs a Product Manager (via) · · design-systems, product-management
- Vertical Rhythm Using CSS “lh” and “rlh” Units (by) · · css, units
- State of Node.js Performance 2023 (by) · · nodejs
- Semantics and the “popover” Attribute: What to Use When? (by) · · html, semantics, accessibility, pop-overs
- It’ll Soon Be (Too) Easy to Develop a Website in A Day (via) · · ai, processes, productivity, creativity
- I Just Did a Test to Apply as a Front End Developer—and Things Aren’t Going Well (by) · · career, interviewing
- GitHub Copilot and ChatGPT Alternatives (by) · · github, ai, comparisons
- Getting an Item an Array With a Negative Index With Modern JavaScript (by) · · javascript, arrays
- Design Patterns Are a Better Way to Collaborate on Your Design System (by/via) · · design-patterns, design-systems, collaboration
- Conditional CSS With “:has” and “:nth-last-child” (by) · · css, selectors
- Comparing Version Control Systems: Git, SVN, CVS, and More · · comparisons, version-control, git, svn, cvs
- Using HTML Landmark Roles to Improve Accessibility (by/via) · · accessibility, html
- Solving Media Object Float Issues With CSS Block Formatting Contexts (by/via) · · css, floats
- Let’s Share Our Salaries, Title, Location, XP · · discussions, career
- HTML Landmark Roles Screen Reader Demo (by/via) · · videos, accessibility, html, user-agents, assistive-tech, screen-readers
- How to Handle Production Support When Using Scrum (by/via) · · how-tos, agile, scrum, processes
- Get Full Type Support With Plain JavaScript (via) · · javascript
- CSS Art: Drawing a Coffee Stain (by) · · css, art
- 10 Books to Improve Coding Skill in 2023 (by) · · books, programming, link-lists
- The Problem With Disabled Buttons and What to Do Instead (by) · · buttons, user-experience, accessibility
- Screen Readers Don’t Announce When the User Reaches the “maxlength” Character Limit (by/via) · · html, accessibility, user-agents, assistive-tech, screen-readers, support
- ES2023 Features (by) · · ecmascript
- Error Message Guidelines (by+/via) · · guidelines, usability, errors, writing
- 7 Secret TypeScript Tricks Pros Use (by) · · typescript, tips-and-tricks
- Building a Frontend Framework—Reactivity and Composability With Zero Dependencies (by) · · frameworks, reactivity, dependencies
- Respect Your Children (by/via) · · accessibility, html, aria
- What Is “Fake Door” Testing in UX? (via) · · testing, user-experience
- Keeping Up With an Ever Changing Web (by/via) · · web-platform, learning
- Building a Greener Web (by/via) · · videos, web, sustainability
- Add Opacity to an Existing Color (by) · · colors, css
- What’s New in CSS and UI: I/O 2023 Edition (by+/via) · · css, retrospectives
- The JavaScript Ecosystem Is Delightfully Weird (by/via) · · javascript
- Regular Expressions in JavaScript (by/via) · · javascript, regex
- Introduction to Screen‐Readers: VoiceOver macOS Edition (by) · · introductions, user-agents, assistive-tech, screen-readers, apple, voiceover
- Introduction to Screen‐Readers: NVDA Edition (by) · · introductions, user-agents, assistive-tech, screen-readers, nvda
- Introduction to Screen‐Readers: JAWS Edition (by) · · introductions, user-agents, assistive-tech, screen-readers, jaws
- Best Practices for All Developers (by) · · best-practices
- An Introduction to the Bun JavaScript Runtime (by/via) · · javascript, runtimes, bun
- The Difference Between Agile and UX Is Not About Quantity vs. Quality (by/via) · · agile, user-experience, processes, comparisons
- Introducing Baseline (by/via) · · introductions, user-agents, support, web-platform
- Introducing INP to Core Web Vitals (via) · · introductions, performance, web-vitals, seo
- Introducing Baseline: A Unified View of Stable Web Features (by/via) · · introductions, user-agents, support, web-platform
- Why an Engineering Manager Should Not Review Code (by/via) · · engineering-management, code-reviews
- What’s New in Web (by/via) · · videos, user-agents, support, web-platform
- What’s New in Web Animations (by/via) · · videos, animations
- The 9 Most Effective Core Web Vitals Opportunities of 2023 (by/via) · · videos, performance, web-vitals
- Slow Design (via) · · websites, design
- Is Data Transfer the Best Proxy for Website Carbon Emissions? (by) · · sustainability, network
- How to Optimize Web Responsiveness With Interaction to Next Paint (by+/via) · · videos, how-tos, performance, web-vitals
- ES2023 Introduces New Array Copying Methods to JavaScript (by/via) · · javascript, ecmascript, standards, arrays
- Developer Tools That Shouldn’t Be Secrets (by/via) · · videos, user-agents, dev-tools
- Crafting a Modern Spotlight Effect With React and CSS (by) · · css, react, effects
- Baseline Features You Can Use Today (by/via) · · user-agents, support, web-platform
- Advancing Interaction to Next Paint (by+/via) · · performance, web-vitals
- The Ongoing Defence of Frontend as a Full-Time Job (by) · · career
- See What’s New in Firefox [113.0] (via) · · release-notes, user-agents, mozilla, firefox
- Script Evaluation and Long Tasks (by/via) · · performance, javascript, web-vitals
- Rearrange/Animate CSS Grid Layouts With the View Transition API (by/via) · · css, layout, transitions, apis
- Optimize Input Delay (by/via) · · performance, web-vitals, optimization
- How to Handle Emojis in Node.js (by) · · how-tos, nodejs, emoji, unicode
- How Large DOM Sizes Affect Interactivity, and What You Can Do About It (by/via) · · performance, dom, html, optimization
- Find Slow Interactions in the Field (by/via) · · performance, web-vitals, auditing
- Diagnose Slow Interactions in the Lab (by/via) · · performance, web-vitals
- Design Systems [Are] a Mindset Not a Library (by/via) · · design-systems
- Client-Side Rendering of HTML and Interactivity (by/via) · · performance, html, client-side-rendering
- An Introduction to Container Queries in CSS (by/via) · · introductions, css, container-queries
- Proportional Design Systems With Proportio.app (by/via) · · design-systems
- Speed Trap (by/via) · · google, amp, web-platform
- ShatGPT (by) · · accessibility, ai
- Pay Attention to Web Performance Metrics to Improve the UX (by/via) · · performance, metrics, user-experience, web-vitals, optimization
- Improving Web-Site Conversion Rates Through Better UX Design (via) · · user-conversion, metrics, optimization, user-experience
- Dithering (by) · · images, dithering
- A Comprehensive Guide to Using Langchain.js and Google Cloud Functions for AI Applications (by/via) · · guides, langchain, google, gcp, functions, ai
- A Complete Guide to Usability Testing (by/via) · · guides, usability, testing
- The Problem With Sticky Menus and What to Do Instead (by) · · navigation, usability, user-experience
- How to Configure Path Aliases in Frontend Projects in the Native Way · · how-tos, aliases, javascript, configuration
- How Far Back in Time Can I Take My Website’s Design · · web, design, history, html, css
- Should the Confirmation Button Come First or Last? (via) · · buttons, interaction-design
- The Image Sorting Experiment (by/via) · · images, information-design, sorting, experiments
- Scaling Node.js Web Apps With Docker (by) · · scaling, nodejs, web-apps, docker
- Cron Job: A Comprehensive Guide for Beginners (via) · · guides, cron
- Complete Guide on Playwright Visual Regression Testing (by/via) · · guides, playwright, design, testing, regressions
- Speed Up or Slow Down a Video (by/via) · · user-agents, dev-tools, multimedia
- Scroll-Driven Animations (by) · · websites, scrolling, animations
- I’m Done With React (by) · · videos, react
- HTTP/1 vs. HTTP/2 vs. HTTP/3 (via) · · http, protocols, comparisons
- htmx Is the Future (by) · · htmx, visions
- How “:not()” Chains Multiple Selectors (by/via) · · css, selectors
- Design Tokens: Beginner’s Guide (by) · · guides, design-tokens, design-systems
- CSS Logical Properties: A Good Use Case (by) · · videos, css, logical-properties
- Using Go for Front End Development (by/via) · · go
- The Frontend Cloud Advantage (via) · · cloud-computing
- React Testing Library and Accessibility (by) · · react, libraries, accessibility, testing, automation
- How Do You Declare Namespace in JavaScript? · · javascript, namespaces
- GitHub Actions: All Actions Will Run on Node 16 Instead of Node 12 (via) · · github, automation, nodejs
- Code Coverage vs. Test Coverage (via) · · code-coverage, testing, quality, comparisons
- An Introduction to the “:has()” Selector in CSS (by/via) · · introductions, css, selectors
- 5 Best Practices to Sustainably Improve Core Web Vitals (by/via) · · performance, web-vitals, best-practices
- 7 Practical CSS Typography Tips and Tricks (by/via) · · videos, css, typography, tips-and-tricks
- Where Would You Take the W3C? (by) · · discussions, w3c
- The Latest Innovations in Drupal (by) · · drupal
- The Intersectionality of Web Performance (by) · · performance, sustainability, dei
- Security Implications of HTTP Response Headers (via) · · security, http
- Release Notes for Safari Technology Preview 169 (by/via) · · release-notes, user-agents, apple, safari
- Make Your Website Load Fast by Optimizing Request Priorities (via) · · performance, optimization, network
- How to Write More Efficient JavaScript Conditions (via) · · how-tos, javascript, efficiency
- How to Make a CSS-Only Hamburger Menu (by) · · how-tos, css, navigation
- Don’t Use Custom CSS Scrollbars (by) · · css, scrolling
- Digital Accessibility Is a Bigger Education Issue Than We Think—Here’s What We Can Do About It (by/via) · · accessibility, training
- Detecting if an Event Was Triggered by a User or by JavaScript (by/via) · · events, javascript
- Angular v16 Is Here (by/via) · · angular, release-notes
- The Simple Trick to Transition From Height “0” to “auto” With CSS (by) · · videos, css, transitions, tips-and-tricks
- CSS Naked Day and the Missing Wikipedia Page (by) · · css, awareness-days, maintainability
- Why “font-size” Must Never Be in Pixels (by) · · css, units, accessibility, responsive-design
- SupportsCSS (by) · · websites, tooling, css, support
- Short Note: Why Isn’t “role=presentation”/“none” Allowed on Focusable Elements? (by) · · accessibility, focus, aria, html
- Do Logical Properties Make CSS Easier to Learn? (by) · · css, logical-properties, learning
- developers.events: Maintaining a GitHub repository—What Have I Learned in 7 Years? (by) · · foss, community, github
- Creating an Animated Gradient Border With CSS (by) · · css, animations, gradients, borders
- An Update on the Lock Icon (by+/via) · · user-agents, google, chrome
- A Radical Proposal: Put UX Research in Charge (by/via) · · user-experience, research, product-management, strategies
- A Complete Guide to Performance Budgets (by/via) · · guides, performance, performance-budgets, metrics
- A/B Testing: A Primer · · introductions, testing, metrics, optimization
- 3 Engineering Mistakes That Kill Startups (by) · · mistakes, architecture
- CDNs: Speed Up Performance by Reducing Latency (by) · · content-delivery, performance
- What’s New in Svelte: May 2023 (by/via) · · release-notes, svelte, sveltekit
- This Blog Is Hosted on My Android Phone (by) · · websites, hosting
- Testing Feature Support for Modern CSS (by) · · css, feature-detection, support
- Tailwind CSS vs. UnoCSS (by) · · tailwind, unocss, css, frameworks, comparisons
- “:root” Isn’t Global (by) · · css
- Practical Guide to Not Blocking the Event Loop · · guides, javascript, event-loop, events, performance
- CSS Wishlist 2023 (by) · · css, wish-lists
- Configuring ESLint, Prettier, and TypeScript Together (by) · · eslint, prettier, linting, formatting, tooling, typescript, configuration
- Beyond Content Creation: How Open Source Contributions Can Help You Get Noticed (by/via) · · foss, content, career
- 7 Things to Remove From Your Job Postings to Be More Inclusive (by/via) · · hiring, dei
- 30th Anniversary of Licensing the Web for General Use and at No Cost (by/via) · · web, web-platform, standards, foss, history, anniversaries
- Two Underused Arguments for Writing Documentation (by) · · writing, documentation, career
- My Favorite Free Courses to Learn JavaScript in Depth (by) · · courses, javascript, training, link-lists
- The Popover API Is Exciting, Sort Of (by) · · apis, pop-overs
- Dark Mode in 3 Lines of CSS and Other Adventures (by) · · css, dark-mode
- Write Better CSS by Borrowing Ideas From JavaScript Functions (by/via) · · css, javascript, functions, quality
- Rebuilding a Featured News Section With Modern CSS: Vox News (by) · · css, refactoring, maintenance, optimization
- New to the Web Platform in April (by/via) · · release-notes, web-platform, user-agents, google, chrome, mozilla, firefox
- JS Private Class Fields Considered Harmful (by) · · javascript
- Everything You Need to Know About Webpack’s Bundle Analyzer (by) · · webpack, bundling, tooling
- Animating the Impossible (by/via) · · videos, animations, transitions
- A Beginner’s Introduction to the Most Common Data Types in Programming (via) · · introductions, data-types, programming
- Progress Over Perfection: The Better Way for Communication and Accessibility Advocacy (by) · · accessibility, communication, advocacy, processes
- Writing Unit Tests in Node.js Using Jest (by+/via) · · testing, nodejs, jest
- What Is the Value of a Design System? (by/via) · · design-systems
- Typography for Everyone (by/via) · · videos, fonts, typography
- The Most Underrated Section of Design Portfolios (by/via) · · design, career
- Modern CSS Layout Is Awesome! (by/via) · · videos, css, layout
- How to Manage Design Tokens (by) · · how-tos, design-tokens, maintenance
- How to Deep Merge Arrays and Objects With JavaScript (by) · · how-tos, javascript, arrays, objects
- Accessible Target Sizes Cheatsheet (by/via) · · accessibility, user-experience
- The Most Important Thing Productivity Tools Are Missing About AI (by/via) · · tooling, productivity, ai
- The Interactive Guide to Rendering in React (by/via) · · guides, client-side-rendering, react
- Discovering the Power of JavaScript Proxy After All This Time (by) · · javascript
- Adding Motion to the Next Decade of Atomic Design (via) · · design, atomic-design
- Transition To and From “display: none” With Upcoming CSS Capabilities (by) · · videos, css, transitions
- The Best Way to Get nvm Working in CI/CD Systems · · nvm, ci-cd
- Reducing the Cost of String Serialization in Node.js Core (by) · · nodejs, performance
- Crafting the Next.js Website (by+) · · nextjs
- Comparing the Best Node.js Version Managers: nvm, Volta, and asdf (by/via) · · nodejs, npm, nvm
- Design Debt: The Hidden Cost of Neglecting UX Investment, and How to Measure and Manage It (by/via) · · design-debt, user-experience, metrics, economics
- Organizing a Web Design System for Scalability in Figma (via) · · design-systems, scaling, figma
- Figma, I Love You but You’re Bringing Me Down (by/via) · · figma
- The “const” Deception (by) · · javascript
- The Potentially Dangerous Non-Accessibility of Cookie Notices (by/via) · · accessibility, cookies, legal, privacy, user-experience
- Scoped CSS Is Back (by) · · css, scope
- npm vs. Yarn vs. pnpm (by) · · npm, yarn, pnpm, comparisons
- Goodbye “create-react-app”: A New Approach (by) · · react
- Frontend Web Performance Checklist (by) · · performance, checklists
- CSS Blend Modes (by) · · css, blend-modes
- Avoiding Dark Patterns in Web Design (by/via) · · dark-patterns, design
- How to Write Comments in React: The Good, the Bad, and the Ugly (by) · · how-tos, react, comments
- Meeting WCAG Level AAA (by/via) · · accessibility, wcag, conformance, standards
- Dark Mode Toggle and “prefers-color-scheme” (by) · · dark-mode, toggles, css
- Transitioning to Height Auto (Two Ways) (by) · · css
- “The Secret List of Websites” (by) · · ai, web, content
- The Effects of Technical Debt on Morale (by) · · technical-debt, productivity
- Exploring the Potential of Web Workers for Multithreading on the Web (by/via) · · web-workers, multithreading, performance, javascript
- “details”/“summary” Inconsistencies (by) · · html, user-agents, assistive-tech, support
- Considering Content Warnings in HTML (by) · · html, content, dei
- This Website Is Under Construction, a Love Letter to the Personal Website (via) · · videos, web, web-platform
- Upgrading Our CSS Habits: “aspect-ratio” (by) · · css
- Spinning Diagrams With CSS (by) · · css, animations
- Read-Only Web Apps (by) · · javascript, progressive-enhancement
- Designing and Coding for Voice (by) · · accessibility, voice
- CSS Custom Properties Beyond the “:root” (by) · · css, custom-properties, semantics
- 5 Topics You Should Touch on During the Recruitment Process · · interviewing, career, processes
- It’s Time for the Tech Industry to Live Up to Its Ideals (via) · · career, visions
- Introducing npm Package Provenance (by+/via) · · introductions, github, npm, provenance, security, foss
- Why Is Scrum the Most Popular Agile Framework? (by/via) · · scrum, agile, processes
- Visually Accessible Data Visualization (by/via) · · accessibility, information-design
- Using HTML Elements as CSS Masks (by) · · css
- Release Notes for Safari Technology Preview 168 (by/via) · · release-notes, user-agents, apple, safari
- Productivity and Well-Being: A Summary of What Works · · productivity, career
- Intro to Runtime Performance in the Chrome DevTools Performance Panel (by/via) · · videos, introductions, performance, dev-tools, user-agents, google, chrome
- Generating Provenance Statements (by/via) · · npm, provenance, security
- 5 Code Refactoring Techniques to Improve Your Code (by/via) · · refactoring, maintenance, techniques
- 5 Must-Know Shopify Liquid Tips and Tricks for Customizing Your Store · · liquid, shopify, customization, tips-and-tricks
- Why CloudFront Invalidation Is Required After Every New Deployment and How to Implement It? (by) · · how-tos, aws, caching
- What’s New in ECMAScript 2023 (by) · · ecmascript, standards
- Signals: Fine-Grained Reactivity for JavaScript Frameworks (by/via) · · javascript, reactivity, signals, frameworks
- Node.js 20 Is Now Available! (via) · · nodejs, release-notes
- Kubernetes Quick Tutorial (by) · · tutorials, kubernetes
- How to Create an SEO Strategy (by/via) · · how-tos, seo, strategies
- DevTools: A Better Way to Visualize Your JavaScript (by) · · dev-tools, visualization, user-agents, performance, lighthouse, google, chrome, microsoft, edge
- Container Query Units and Fluid Typography (by) · · css, container-queries, typography
- Audio Accessibility in Miro: A Hackathon Story in 3 Acts (by/via) · · accessibility, multimedia, experiments
- 8 Best Tools for Cryptography and Encryption (via) · · link-lists, tooling, comparisons, security, cryptography, privacy
- You Are What You Measure (by) · · videos, metrics
- What Is Design Thinking? (via) · · design
- Using a Muted Color Palette in Web Design (via) · · design, colors, color-palettes
- It’s Very Likely That… (by) · · html, semantics, buttons, modals
- Firefox May Soon Reject Cookie Prompts Automatically (by/via) · · cookies, legal, user-experience, mozilla, firefox
- Deno vs. Node: No One Is Ready for the Move (by/via) · · deno, nodejs, dependencies, comparisons
- Business Impacts of UI Design and UX Design (by/via) · · design, economics
- Answering “What ARIA Can I Use?” (by/via) · · accessibility, aria, user-agents, assistive-tech, screen-readers, support
- All About the Semantic Web (via) · · semantic-web, concepts
- A List of Programming Playgrounds (by) · · programming, link-lists, testing
- How to Name Design Tokens in a Design System (by/via) · · how-tos, design-tokens, design-systems, naming
- The Acronyms of Rendering on the Web (by) · · rendering, server-side-rendering, client-side-rendering, terminology
- Speeding Up the JavaScript Ecosystem—Draft-js Emoji Plugin (by) · · javascript, performance, plugins
- Serving Less Data to Users With the “prefers-reduced-data” Media Query (by) · · css, media-queries, performance, sustainability
- My Favorite Courses to Learn Microservices in Depth (by) · · courses, training, microservices, link-lists