News and Tools for Frontend Development (6)
(Stay up-to-date on all topics by RSS feed or on Mastodon.)
- Vue and Vite Status Update · · videos, vuejs, vite
- The Elevator Pitch for Web Components · · web-components, html, dom
- Shadow DOM Is for Hiding Your Shame · · shadow-dom, dom, web-components, html
- Psychology of Speed: A Guide to Perceived Performance · · guides, performance, user-experience
- URL Parser Performance · · urls, parsing, performance
- Why We Don’t Like TDD: A Developer’s Perspective · · testing, processes
- An Interactive Guide to CSS Grid · · guides, css, layout
- The Unbearable Weight of Massive JavaScript · · videos, javascript, frameworks, performance
- Demystifying Web Push Notifications · · notifications, javascript
- Easy Introduction to Variables and Data Types in Programming for Beginners · · introductions, data-types, programming
- The Tension and Future of Jamstack · · tech-stacks, jamstack
- Conducting a Content Audit to Improve Your Content · · content, auditing, quality, optimization
- Navigating the Intersection of Brand Strategy and User Experience · · branding, strategies, user-experience
- CSS4 Is Coming (Not a Clickbait) · · videos, css
- The 9 HTML Elements That Have an Attribute of the Same Name, or: The 9 Attributes That Have an Element of the Same Name · · html
- Announcing TypeScript 5.3 · · release-notes, typescript
- Width and Height in CSS · · css
- How to Avoid Breaking Web Pages for Keyboard Users · · how-tos, accessibility, keyboard-navigation
- What Are Webhooks and How to Use Them · · webhooks
- Inspecting WCAG 2.2: Target Size · · videos, accessibility, wcag, standards
- Jimdo’s Engineering Guidelines · · guidelines, processes, collaboration, onboarding, case-studies
- CSS Nesting · · css, nesting
- CSS Nesting UX in DevTools · · css, nesting, user-experience, developer-experience, user-agents, dev-tools
- An Attempted Taxonomy of Web Components · · web-components, html
- Skip PHPUnit Tests Conditionally in PHP · · php, testing
- How Independent Publishing Has Changed from the 1990s Until Today · · history, writing, web
- The CSS Property You Didn’t Know You Needed · · css
- 10 Great Websites to Learn Web Development · · link-lists, learning
- 26 Frontend Certifications for Web Developers · · training, career, link-lists
- Comparison of Accessibility of E-Government Websites in Europe · · accessibility, case-studies, comparisons
- HTML Web Components Are Just JavaScript? · · web-components, javascript, html
- Why You Should Curate, Not Create, a Design System · · design-systems, processes
- 5 Formatting Techniques for Long-Form Content · · usability, content, writing, formatting, techniques
- Integrating MongoDB With Node.js · · mongodb, nodejs
- 10 Tips for Driving Design System Adoption · · design-systems, tips-and-tricks
- “NODE_ENV=production” Is a Lie · · videos, nodejs, environments, optimization
- Exclusive Accordions Exclude · · accessibility, html
- Getting Started With CSS Container Queries · · introductions, css, container-queries
- Vite 5.0 Is Out · · release-notes, vite
- How to Use Node.js With Docker · · how-tos, nodejs, docker
- Until the Right Design Emerges… · · design
- Using Chrome’s Accessibility Tree for Manual Testing of HTML and ARIA · · videos, user-agents, google, chrome, dev-tools, accessibility, testing, html, aria
- Evolution of Visible Focus · · videos, accessibility, focus
- 4 Web Devs, 1 App Idea · · videos, web-apps, case-studies
- The Best CSS Background Patterns for Your Next Project · · css, backgrounds
- The Developer Job Market Is Insane—5 Tips on How to Survive · · career, interviewing, tips-and-tricks
- Is It Worth Keeping Your CSS DRY—Pros and Cons · · css, maintainability, principles
- Introducing N|Solid Copilot: Your AI-Powered Node.js Navigator · · nodejs, ai, tooling
- Why Doesn’t AI Work for Producing Accessible Code? · · accessibility, code-generation, ai
- Modular CSS and Different Ways to Structure Your Stylesheets · · css, modules
- We Need to Have a Chat? I Think We Should Refactor · · design-systems, maintenance, refactoring
- Shattering the Design System: Unleashing the Creative Revolution · · design-systems, creativity, processes
- Introduction to LangChain · · introductions, langchain
- A Tip for Properly Handling Loading States in Web Apps · · tips-and-tricks, state-management, web-apps
- Optimizing Frontend Performance: Mastering Memoization, Throttling, and Debouncing · · performance, optimization, memoization, throttling, debouncing
- Release Notes for Safari Technology Preview 183 · · release-notes, user-agents, apple, safari
- About Subgrid and Colored Grid Lines · · css, layout
- Using Selectlist in React · · react, forms
- Browsing the Eastern Side of the Personal Web · · web, community
- How to Optimize MongoDB Performance for Node.js · · how-tos, mongodb, optimization, nodejs
- Letter and Spirit of Web Development · · community, processes
- Exploring V8’s Strings: Implementation and Optimizations · · javascript, engines, v8, optimization
- How I Test a Website for Accessibility · · accessibility, testing
- Designing for Accessibility Beyond Compliance · · design, accessibility, compliance
- Node.js Monthly Downloads · · websites, nodejs, metrics
- Elevate Your CSS Debugging Skills With These Chrome DevTools Tricks in 2024 · · css, debugging, user-agents, google, chrome, dev-tools
- Accessibility Testing With Chrome DevTools · · accessibility, testing, user-agents, google, chrome, dev-tools
- Simplifying the E2E Selectors Hassle · · angular, typescript, testing
- Cracking a “Developer Tools Killer” Script… · · user-agents, dev-tools, debugging
- Designing Web Design Documentation · · documentation, design, design-systems
- Prettier 3.1: New Experimental Ternaries Formatting and Angular Control Flow Syntax · · release-notes, prettier
- Monitoring Your Python App With AppSignal · · python, monitoring, tooling
- The Top WordPress Plugins Are… a Little Sad? · · wordpress, plugins
- Your Website’s URLs Can and Should Be Beautiful · · urls, usability
- Introducing the Website Carbon Rating System · · introductions, sustainability
- Growing Design by Letting Teams Experience It · · design
- HTML Web Components · · html, web-components
- A Coder Considers the Waning Days of the Craft · · craft, retrospectives, web
- Cascade Layers, CSS Functions, and More CSS With Miriam Suzanne · · podcasts, interviews, css, cascade, functions
- Text With Media Background: Practical Solutions · · images, microcontent, readability, accessibility
- The Nature of Digital Is Environmentally Destructive · · sustainability
- HTML First · · websites, html, principles
- Accessibility Training Can Sometimes Harm Accessibility · · accessibility, training
- Explaining Kubernetes to My Uber Driver · · architecture, kubernetes
- Do You Really Need to Validate Your HTML Code? · · discussions, html, conformance
- Stop Using AI-Generated Images · · ai, images
- AI Is the New UI · · ai, design
- Lost in Translation: Tips for Multilingual Web Accessibility · · tips-and-tricks, accessibility, internationalization, localization
- Mastering Cryptography Fundamentals With Node’s “crypto” Module · · security, cryptography, nodejs
- Creating Accessible UI Animations · · accessibility, animations
- CSS Nesting Is Here · · css, nesting
- Cookie Permissions 101 · · cookies, legal, user-experience
- A Faster Web in 2024 · · performance, web-vitals, metrics, web
- Never Use “Scroll” Value for Overflow · · css, scrolling
- Effective Engineering Teams · · collaboration, career, leadership
- Modern Frontend Testing With Vitest, Storybook, and Playwright · · testing, storybook, playwright
- HTML Web Components · · web-components, html, web-platform
- How Long Until Your Website Is Accessible? · · accessibility, processes
- Can Bun Eat Node.js’s Lunch? Testing the Trendy Toolkit · · bun, nodejs, comparisons
- ES6 Features You Didn’t Know You Needed: A JavaScript Guide for Beginners · · guides, javascript
- Front End Devs Really Don’t Understand Accessibility · · accessibility, craft
- NaN or Not a Number? · · javascript
- CSS Nesting Relaxed Syntax Update · · css, nesting, user-agents, google, chrome, support
- Understanding HTML Landmarks and How to Apply Them · · html, semantics, accessibility, aria
- CSS Positioning Crash Course · · videos, css, layout
- Handling Null, Undefined, and Zero Values in JavaScript · · javascript
- Introducing Angular v17 · · release-notes, angular
- Using CSS “content-visibility” to Boost Your Rendering Performance · · css, rendering, performance
- Web Developers: Remarkably Untalented and Careless? · · quality, career, training
- Secure Code Review Tips to Defend Against Vulnerable Node.js Code · · nodejs, security, code-reviews
- “@ scope” · · css, scope
- Everything About SEO Is Obnoxious · · seo, quality, ethics
- Monolith to Microservices: 5 Strategies, Challenges, and Solutions · · monoliths, microservices, architecture, migration, strategies
- How to Use Timeouts in Node.js · · how-tos, nodejs, javascript
- (Don’t) Mind the Gap · · css, layout
- Addressing Accessibility Concerns With Using Fluid Type · · accessibility, responsive-design, css
- Writing Components That Work in Any Frontend Framework · · web-components, frameworks
- Why We Need a “Green” Perf Metric · · videos, sustainability, performance, metrics
- React Router v6: A Beginner’s Guide · · guides, react, routing
- 13 HTML Attributes You Should Know About · · html
- Accessibility Training Will Not Save You · · accessibility, training, career, quality
- How Core Web Vitals Saved Users 10,000 Years of Waiting for Web Pages to Load · · google, performance, user-experience, metrics
- Surprising Facts About New CSS Selectors · · css, selectors
- Headless Component: A Pattern for Composing React UIs · · components, react, headless
- Deploying a Vue Application With Netlify and GitHub · · deploying, vuejs, netlify, github
- Creating Accessible Content in Drupal 10 · · videos, drupal, accessibility
- Truly Semantic · · design-tokens, semantics, naming
- The Role of Prototyping in UX Design: From Wireframes to Interactive Mockups · · user-experience, design, prototyping
- “git rebase”: What Can Go Wrong? · · git
- Removing List Styles Without Affecting Semantics · · html, css, semantics, accessibility
- How to Use npm Packages Outside of Node · · how-tos, npm, dependencies, javascript
- Default Layouts in 11ty · · eleventy
- How to Build a Server-Side React App Using Vite and Express · · how-tos, react, vite, express, server-side-rendering
- To Hell With the Business Case · · accessibility, economics, legal
- Understanding React Error Boundary · · react
- image-dimensions · · packages, npm, images
- How Creating Content as a Developer Changed My Life · · career, learning
- WCAG 2.2 Will Be a Part of EN 301 549 and With That a Part of WAD and EAA · · accessibility, wcag, standards, legal
- Understanding CORS · · security, cors
- Messing About With CSS Gradients · · css, gradients
- An Accessibility Bookmarklet for Testing 200% Text Size · · accessibility, testing, bookmarklets
- Workarounds for Buggy Gradients · · css, gradients, colors
- Totally Remdom, or How Browsers Zoom Text · · accessibility, css, units, responsive-design
- How to Do a TypeScript Conversion · · how-tos, javascript, typescript, migration, conversion, refactoring
- GitHub Copilot Now Generates AI Commit Messages · · github, ai, writing
- Use the CSS “:disabled” Pseudo-Class Instead of the “[disabled]” Attribute Selector to Match Disabled Form Controls · · css, selectors, forms
- Don’t Turn a Table into an ARIA Grid Just for a Clickable Row · · html, tables, aria, accessibility
- Why You Should Use “px” Units for Margin, Padding, and Other Spacing Techniques · · css, units, spacing, responsive-design
- Answers to Common (Web) Accessibility Questions · · accessibility
- In Quest to Defeat Euro Red-Tape, Apple Said It Had Three Safari Browsers—Not One · · user-agents, apple, safari, web, legal
- Information vs. Experience: How to Build Mature Design Systems · · how-tos, comparisons, design-systems
- “:fullscreen” Demo Without JavaScript · · css, selectors
- Can AI Help Boost Accessibility? These Researchers Tested It for Themselves · · accessibility, ai, research
- How to Write Good Alt Text for Screen Readers · · how-tos, accessibility, writing, alt-text, assistive-tech, screen-readers
- How to Use the Fetch API in Node.js, Deno, and Bun · · how-tos, data-fetching, apis, nodejs, deno, bun, comparisons
- 10 Best Web Development Stacks · · tooling, tech-stacks
- Speeding Up the JavaScript Ecosystem—Tailwind CSS · · performance, javascript, tailwind
- 0 KB Social Media Embeds · · embed-code, quality
- The People Who Ruined the Internet · · web, google, seo
- Learn Performance · · courses, performance
- One HTML Tag, Thirty+ CSS Drawings—My Divtober 2023 Collection · · css, art
- Breaking Down a Design · · design
- Confusing Git Terminology · · git, terminology
- The “prefers-reduced-transparency” Media Feature · · css, media-queries, accessibility
- The Dangers of Doomscrolling for Designers and How to Break Free · · career
- Dark Visitors · · websites, ai, scraping, robotstxt
- A Comprehensive Guide to Data Engineering · · guides, data-engineering
- Response Code Cheat Sheet for Laravel HTTP Client · · cheat-sheets, laravel, http
- Release Notes for Safari Technology Preview 182 · · release-notes, user-agents, apple, safari
- Blinded by the Light DOM · · web-components, dom, shadow-dom, javascript
- How Bear Does Analytics With CSS · · analytics, metrics, css, case-studies
- Getting Started With NVDA · · videos, introductions, assistive-tech, screen-readers, nvda, accessibility
- Personal-Scale Web Scraping for Fun and Profit · · scraping, javascript, functionality, optimization
- 2023: 0 of the Global Top 100 Websites Use Valid HTML · · html, css, conformance, quality
- Remix ❤️ Vite · · remix, vite, support
- Answering Common Questions About Interpreting Page Speed Reports · · performance, optimization
- Accessibility by Degrees · · accessibility, processes
- Mobile-First Indexing Has Landed—Thanks for All Your Support · · mobile-first, seo, google
- Better Dynamic Themes in Tailwind With OKLCH Color Magic · · theming, tailwind, oklch, colors
- Why Signals Are Better Than React Hooks · · videos, javascript, signals, react, hooks, comparisons
- A Complete Guide to LangChain in JavaScript · · guides, langchain, javascript, frameworks
- Effective Strategies for Optimizing Performance · · strategies, performance, optimization
- What Exactly Is “Modern” CSS? · · css
- Interop 2023 October Update · · interoperability, web-platform, user-agents, support
- Don’t Disable Buttons · · buttons, accessibility, javascript
- 20 Effective Tips to Speed Up Your Drupal Website · · drupal, tips-and-tricks, performance, optimization
- A Guide to Using MSSQL With Node.js · · guides, nodejs, databases, sql
- Unit-Testing: The Unsung Hero of Code Quality · · testing, quality
- Is Express Still “De Facto” for Building Node Backends? · · discussions, express
- The New CSS Math: “rem()” and “mod()” · · css, functions, math
- Let’s Reinvent the Wheel · · html, css, user-experience, accessibility, web-platform
- An Introduction to Working With SVGs in React · · introductions, svg, react
- Why Is node_modules Heavier Than the Universe? · · nodejs
- View Transitions and Stacking Context: Why Does My CSS View Transition Ignore “z-index”? · · css, animations, transitions
- State of React 2023 · · surveys, react
- You’re Gonna Need a Bigger Browser · · user-agents, web-platform, user-experience, visions
- AI as a UX Assistant · · user-experience, ai
- How to Find a Developer Job in 2023 (With Little or No Experience) · · how-tos, career
- Some Sensible Defaults for Your “img” Elements · · images, css
- So You’ve Been Publicly Accessibility-Shamed · · accessibility, quality, communication
- HTML vs. DOM? Let’s Debug Them · · videos, html, dom, debugging, comparisons
- What the !#@% Is a Passkey? · · passwords, security
- Why I Won’t Use Next.js · · frameworks, nextjs
- Testing and Code Quality in Node.js · · testing, quality, nodejs
- Next.js 14 · · release-notes, nextjs
- Secret Scanning Scans Public npm Packages · · github, npm, dependencies, security
- 20 Simple Ways to Style the HTML “details” Element · · html, css
- Deprecation of Formatting Rules · · eslint, linting, tooling, formatting, release-notes
- Introduction to htmx · · introductions, htmx
- Introduction to Real-Time Communication in PHP Laravel · · introductions, laravel
- Astro 3.4: Page Partials · · release-notes, astro
- Performance Optimization With Worker Threads Node.js · · performance, optimization, nodejs, worker-threads
- Understanding SC 2.4.11 “Focus Not Obscured (Minimum)” · · accessibility, wcag, focus
- Vue.js (Vue v3) for Beginners · · videos, courses, vuejs
- Web Components Will Outlive Your JavaScript Framework · · web-components, javascript, frameworks
- What Does the “A” Mean in “DEAI”? · · inclusion, accessibility
- CSS “prefers-reduced-transparency” · · css, media-queries, support
- Data Engineering Essentials #1: Your First Pipeline · · data-engineering
- WebKit Features in Safari 17.1 · · release-notes, user-agents, apple, safari, webkit
- Sheet, Dialog, or Snackbar—What Should a Designer Go For? · · design, design-patterns, modals
- It’s 2023, Here Is Why Your Web Design Sucks · · web, design, career
- Goodbye, Node.js Buffer · · nodejs
- My Problem With Using TypeScript in 2023 · · videos, typescript
- A Comprehensive Guide to Django Caching · · guides, django, caching
- Complex MPA View Transitions · · mpas, transitions, css
- Give Your Site Some Focus! Tips for Designing Useful and Usable Focus Indicators · · accessibility, forms, focus, user-experience, tips-and-tricks
- What Removing Object Properties Tells Us About JavaScript · · javascript, objects
- Igalia Chats: Web History Part VI · · podcasts, transcripts, web, history
- Release: Yarn 4.0 · · yarn, release-notes
- JavaScript Anti-Pattern: Self-Documenting Code · · javascript, anti-patterns, documentation
- Stop Waiting · · quality, testing
- JavaScript Is Enabled by Default in Web Browsers · · javascript, web-platform, permissions
- In Defense of Learning on Company Time · · learning, career
- Splitting Within Selects · · accessibility, html, forms, user-agents, support
- JavaScript Decorators: An In-Depth Guide · · guides, javascript
- Solved by CSS Scroll-Driven Animations: Style an Element Based on the Active Scroll Direction and Scroll Speed · · css, scrolling, animations
- Changing Colors in an SVG Element Using CSS and JavaScript · · svg, colors, css, javascript
- Unlocking JavaScript Design Patterns: Mastering Singleton for Ultimate Code Efficiency · · javascript, software-design-patterns, efficiency
- CSS “text-wrap: pretty” · · css, typography, user-agents, google, chrome, support
- Color Contrast Accessibility Tools With Examples · · accessibility, tooling, link-lists, colors, contrast, examples
- Svelte by Example · · websites, svelte, examples
- Navigating the Ethical Complexities of Personalized User Experiences: Balancing Innovation With Privacy and Consent · · user-experience, personalization, ethics, privacy, consent-management
- Tailwind vs. Semantic CSS · · tailwind, css, html, semantics, comparisons, performance
- HTML Meta Tags · · html, metadata
- Select Element: Now With Horizontal Rules · · html, forms, semantics, user-agents, google, chrome, apple, safari, support
- Accessibility Improvements for User-Agents · · accessibility, user-agents
- Strikethrough Accessibility · · accessibility, html, user-agents, assistive-tech, screen-readers, support
- Finding the Primary Branch of a Git Repository · · git
- How Do You Even Web Dev Without Node? A Quick Introduction to Test-Driven Web Development Using Just the Browser · · introductions, testing
- Is CAPTCHA Accessible? · · accessibility, captcha