News and Tools for Frontend Development (9)
(Stay up-to-date on all topics by RSS feed or on Mastodon.)
- How to Improve Performance of Your Database by Indexing Large Tables · · how-tos, performance, databases, optimization
- Progressively Enhanced Form Validation: HTML and CSS · · forms, validation, progressive-enhancement, html, css
- JSX Without React · · jsx, react
- A Guide to Single-Page Application Performance · · guides, spas, developer-experience, performance, monitoring
- A Compilation of Outstanding Testing Articles (With JavaScript) · · link-lists, testing, javascript
- Scrolljacking 101 · · scrolling, user-experience
- Optimizing Speed on ebay.com · · performance, optimization, web-vitals, case-studies
- Beautify Your Git Log With a Single Command · · git, command-line
- Assistive Technology Shouldn’t Be a Mystery Box · · user-agents, assistive-tech, accessibility, web-platform, open-source, support
- Things You Forgot (or Never Knew) Because of React · · react, frameworks, learning
- Designing Accessible Text over Images: Best Practices, Techniques, and Resources · · accessibility, content, images, best-practices, techniques
- Finding My Blogging Path: Lessons from My Journey · · lessons, blogging, writing, career, community
- Insertion Sort: A Deep Dive · · algorithms, sorting
- Implementing Design Tokens: Colors · · design-tokens, colors
- How Google Measures Developer Productivity · · interviews, google, productivity, developer-experience, metrics
- The Easy Intro to the APCA Contrast Method · · introductions, accessibility, colors, contrast, apca
- Route-Based Code Splitting With React · · code-splitting, routing, react
- The Next Generation of Web Layouts · · web-platform, design, layout
- How We Optimized Performance to Serve a Global Audience · · case-studies, performance, optimization
- Prepare to Spy on a Method Added Dynamically · · videos, javascript, cypress, testing, debugging
- A Blog Post With Every HTML Element · · html, semantics
- New DOJ Web Accessibility Regulation Is a Disaster · · accessibility, legal
- Contextual Form Errors and ARIA · · accessibility, forms, html, aria
- An Overview of CSS Sizing Units · · overviews, css, units
- How Does Reflowing Content Affect People With Screen Magnification? · · accessibility, reflow, assistive-tech, screen-magnification
- No Exit — Every Feed Is a Traffic Jam · · social-media, scrolling, user-experience
- How to Use the CSS Grid “repeat()” Function · · how-tos, css, functions, layout
- CSS and Accessibility: Inclusion Through User Choice · · css, accessibility, inclusion, user-experience
- What’s New in Svelte: August 2023 · · release-notes, svelte, sveltekit
- Understanding React Server Components · · react, components
- Evading JavaScript Anti-Debugging Techniques · · javascript, debugging
- Mixing Colors to Create Variants in CSS · · colors, css
- Creating Custom Easing Effects in CSS Animations Using the “linear()” Function · · css, functions, animations
- Why Isn’t “z-index” Working? · · videos, css
- Accessibility of the Button: Should We Fix It or the Root Cause Problem? · · accessibility, buttons, processes
- Contrast Checker Bookmarklet · · bookmarklets, accessibility, colors, contrast
- The Virtual Keyboard API · · apis
- Why I No Longer Believe in Content Design · · content, design, writing
- Randomness in CSS Using Trigonometry · · css, randomness
- Start by Writing Messy Code · · processes, learning
- Accessibility Represents Maturity · · accessibility, culture
- What Happens When Developers Are Liable for Accessibility? · · accessibility, legal
- Front End Practice: Top 25+ JavaScript Code Best Practices for Development · · javascript, best-practices
- New to the Web Platform in July · · release-notes, web-platform, user-agents, google, chrome, mozilla, firefox, apple, safari
- The Curious Case of “iff” and Overriding Screenreader Pronunciations · · user-agents, assistive-tech, screen-readers, accessibility, pronunciation
- How to Earn High-Authority Links That Drive Rankings · · how-tos, seo, links
- Tuesday, August 8, 2023 Security Releases · · release-notes, nodejs, security
- Resume and Pause Animations in CSS · · css, animations
- A Future of Themes With CSS Container Style Queries · · css, container-queries, theming
- Should New Developers Use AI Coding Tools? · · ai, productivity, tooling, career, learning
- Do We Need WCAG 3 (Now)? · · accessibility, wcag, standards
- Toggles Suck! · · design, usability, user-experience
- Mastering Git Shortcuts: A Guide to Git Aliases · · guides, git, productivity
- How “position: absolute” Works in CSS Grid · · videos, css, layout
- How to Define an Array of Colors With CSS · · how-tos, css, arrays, colors
- Design Systems Management from Bottom–Up · · design-systems, processes
- Run JavaScript/WASM in Python: High-Level SpiderMonkey Bindings to Python With PythonMonkey · · javascript, webassembly, python
- If Web Components Are So Great, Why Am I Not Using Them? · · web-components
- You Probably Don’t Need “http-equiv” Meta Tags · · html, metadata, http, performance
- What Is Platform Engineering (and What Is It Not)? · · platform-engineering
- How to Make Your Captions and Audio Descriptions WCAG-Compliant · · how-tos, multimedia, captions, compliance, wcag, accessibility
- The Future of Design Systems Is Semantic · · design-systems, design-tokens, processes
- Speeding Up V8 Heap Snapshots · · user-agents, engines, v8, performance, memory
- Adapting Typography to User Preferences With CSS · · typography, css, customization
- Release Notes for Safari Technology Preview 175 · · release-notes, user-agents, apple, safari
- The Web Development Glossary 3K · · books, learning, training, concepts, terminology
- Help Design the Inaugural State of HTML Survey · · html, community
- CrBug Release Indicator · · user-agents, chromium, tooling
- Tailwind, and the Death of Web Craftsmanship · · tailwind, craft, quality
- The Joy of Simplicity in Web Development · · simplicity, processes
- Testing a Component’s Accessibility · · videos, accessibility, testing, components
- How to Use CSS “aspect-ratio” · · how-tos, css
- How I Name and Arrange My Color Variables in Figma · · colors, figma, conventions
- Publishing With npm Provenance from Private Source Repositories Is No Longer Supported · · github, npm, provenance, security, open-source
- Is Jamstack Officially Finished? · · tech-stacks, jamstack, community
- What to Do When Your Developers Don’t Collaborate · · processes, collaboration
- Vision for W3C · · visions, web, web-platform, w3c
- Social Engineering Campaign Targeting Tech Employees Spreading Through npm Malware · · security, npm
- Blockquotes in Screen Readers · · accessibility, user-agents, assistive-tech, screen-readers, support, html
- Microservices vs. Micro Frontends: What’s the Difference? · · microservices, micro-frontends, comparisons
- Solving the Accessibility Palette Riddle · · accessibility, colors, color-palettes
- Web Accessibility in High-Risk Segments · · accessibility, compliance, legal
- Application State Management With Angular Signals · · state-management, angular, signals
- Promises Training · · javascript, promises, training, courses
- Fetching Data from an HTTP API With Python · · data-fetching, apis, python
- Combining Data With Multiple Fetch Requests · · javascript, arrays, data-fetching
- The Rise of Minimalism in Web Design: Less Is More · · minimalism, design
- 6 Ways ChatGPT Can Improve Your SEO · · ai, seo, metadata, code-generation
- Understanding the WCAG 3 Working Draft Update · · accessibility, wcag
- Benefits of Integrating UX into Your Overall Business Strategy · · user-experience, strategies
- SVG Gradients: Solving Curved Challenges · · svg, gradients
- Core Web Vitals for Search Engine Optimisation: What Do We Need to Know? · · performance, web-vitals, seo
- Securing the Web Forward: Addressing Developer Concerns in Web Security · · security, web, surveys
- The Problem With Auto-Generated Alternative Texts for Images · · accessibility, ai, writing
- I Blame the W3C’s HTML Standard for Ordered Lists · · html, semantics
- The New “X” Button Doesn’t Close the Website · · user-experience, community, social-media
- 10 Simple CSS and JavaScript Micro-Interactions for Buttons · · css, javascript, buttons, effects
- WebKit Features in Safari 16.6 · · release-notes, user-agents, apple, safari, webkit
- Getting Started With Pico CSS · · introductions, pico
- Effective Code Reviews · · code-reviews, processes, learning, career
- Using Imagery in Visual Design · · design, images, content
- Good Code Is— · · quality, terminology
- How SEOs and UX Designers Can Work Better Together · · seo, user-experience, design, collaboration
- The Art of Looking Back: A Critical Reflection for Individual Contributors · · processes, career, productivity
- Enable Hover Conditionally in CSS · · css
- CSP Testing Using Cypress · · csp, testing, cypress
- Why Learning to Program Is Easier Now, but Also Way Harder Than Before · · programming, learning, productivity, developer-experience
- Accessible Animated GIF Alternatives · · accessibility, animations, gif, multimedia, comparisons
- Good Code Is Like a Love Letter to the Next Developer Who Will Maintain It · · programming, quality, maintainability, communication
- What’s New in DevTools: Network, Console, Wasm (Chrome 113–115) · · videos, dev-tools, user-agents, google, chrome, network, webassembly
- DX in the Frontend Developer Ecosystem · · videos, developer-experience
- We Deleted More Than 5,000 Pages from Our College Website—Here’s Why · · accessibility, quality, maintenance
- A Guide to Perfecting Pull Requests · · git, code-reviews, collaboration, open-source
- From Mid to Senior: Time Management and Prioritization · · career, productivity
- How to Use CSS “object-fit” and “object-position” · · how-tos, css, images
- Design Systems: Avoiding Common Pitfalls · · design-systems
- Web Content Accessibility Guidelines (WCAG) 2.2 · · accessibility, guidelines, wcag, standards
- Ember JS Essentials: A Beginner’s Guide · · guides, emberjs
- CSS Cascade Layers · · videos, css, cascade
- SvelteKit in 100 Seconds · · videos, introductions, sveltekit
- What Is the Bento UI Trend, and How Can You Get Started? · · design, trends
- How Platform Teams Get Stuff Done · · productivity, processes, platform-engineering
- How to Build and Deploy a Modern Day Next.js Application · · how-tos, nextjs, building, deploying
- Encoding: A Brief History and Its Role in Cybersecurity · · encoding, unicode, security, history
- Visually Hidden Links With 0 Dimensions · · accessibility, links, focus, apple, safari
- Getting Started With CSS Nesting · · videos, introductions, css, nesting
- Figma Now Supports “rem” Units: Understanding the Use and Benefits · · figma, css, units, support
- Getting Instant Return from Your Accessibility Testing · · accessibility, testing
- Signals Make Angular Much Easier · · angular, signals
- An Introduction to Langchain, Python, and OpenAI · · introductions, langchain, python, ai
- Anyone Else Notice That [Hacker News] Isn’t Full of JavaScript Frameworks Lately? · · discussions, javascript, frameworks
- The 10 Commitments of an Agile Leader · · agile, processes, collaboration, leadership
- Advanced Positioning in CSS Grid · · videos, css, layout
- 5 Inconvenient Truths About TypeScript · · typescript, javascript, complexity
- Upgrading an Ancient React Application · · react, maintenance
- The Power of Git: A Guide to Collaborative Version Control · · guides, git, collaboration
- Node.js Security Progress Report—17 Reports Closed · · nodejs, security
- O “dialog” Focus, Where Art Thou? · · accessibility, modals, html, focus
- Using Emoji on the Web · · emoji, fonts, support, unicode
- Stick to Boring Architecture for as Long as Possible · · architecture
- How I Structured My Design System Using Figma’s New Variables · · design-systems, figma
- Lightweight JavaScript Framework Review (for Django Developers) · · javascript, frameworks, comparisons, link-lists, django
- Writing CSS in 2023: Is It Any Different Than a Few Years Ago? · · css
- Scroll Progress Animations in CSS · · css, scrolling, animations
- WordPress 6.3 to Introduce a Development Mode · · wordpress
- Interoperability With Specific Assistive Technologies or: “Does the Website Work on JAWS?” · · accessibility, interoperability, user-agents, assistive-tech, screen-readers, jaws
- Figma Typography Secrets—Seven Pro Tips Revealed · · typography, figma
- React-ing to Accessibility: Building Accessible Forms That Everyone Can Use · · accessibility, forms, react, testing
- A Comprehensive Beginner’s Guide to npm: Simplifying Package Management · · guides, npm, dependencies
- Down-and-Across Highlighting · · code-pens, css, tables, effects
- 15 Advanced TypeScript Tips for Development · · typescript, tips-and-tricks
- Mock JSON API Endpoints for Testing · · json, apis, testing
- Better Roadmaps · · processes
- CSS Findings from the Threads App · · css, case-studies
- Why Design Systems Fail · · design-systems, lessons
- Useful Functions for [an] HTTP Server · · deno, servers, http, functions
- A Roadmap to Leadership Inclusion: 15 Keys to Unlocking a Diverse and Empowered Workplace II · · leadership, inclusion, accessibility
- How AI Is Making Web Design More Efficient · · ai, design, efficiency
- Developer’s Research Process · · research, processes
- 3 Common Types of Test Automation · · testing, automation
- The alt-text.org Project Is Moving Forward · · accessibility, writing
- A Case Study on Scroll-Driven Animations Performance · · animations, scrolling, performance, css, javascript
- Recent Design · · websites, design, link-lists
- The Magic of Empty Git Commit · · git, command-line
- Preload vs. Early Hints vs. Fetch Priority · · videos, performance, html, http, hints, comparisons
- How to Use Your Intuition in Your Product Design Process · · how-tos, design, product-management, processes
- JPEG XL: How It Started, How It’s Going · · images, compression, jpeg
- Top 20 Must-Know Tips for Web Accessibility · · accessibility, tips-and-tricks
- Release Notes for Safari Technology Preview 174 · · release-notes, user-agents, apple, safari
- Permission · · web, seo, google
- Loading and Progress Indicators · · performance, user-experience
- TypeScript and the Dawn of Gradual Types · · typescript
- Sass Features in CSS · · css, sass, preprocessors
- My Journey to Learning CSS · · videos, css, learning
- Introduction to CSS Grid: A Comprehensive Guide · · guides, css, layout
- A Guide to Variables in Figma · · guides, figma
- Tailwind CSS Tips and Tricks Worth Knowing · · tailwind, tips-and-tricks
- Mockups Explained · · design, processes
- Data-Driven Design: The Rise of Big Data in UX · · design, metrics, user-experience
- Developing Inclusivity Features · · design, accessibility, inclusion
- Find Memory Leaks by Comparing Heap Snapshots · · memory, dev-tools, user-agents, google, chrome, microsoft, edge
- Getting Started—Understanding the History of Web Accessibility · · videos, introductions, accessibility, history
- Getting Started With Vector Databases in Node.js · · introductions, nodejs, databases
- Invisible Details of Interaction Design · · interaction-design, design, user-experience
- Making Numbers in Web Content Accessible · · accessibility
- How to Prevent Unnecessary React Component Re-Rendering · · how-tos, react, client-side-rendering, performance
- ARIA Can Hurt or Help Web Accessibility: How to Review Your Website’s ARIA · · how-tos, accessibility, aria, auditing
- JavaScript Debounce, Easiest Explanation (With Code) · · debouncing, javascript
- Tree Shaking in JavaScript · · javascript, tree-shaking
- The Anatomy of a Perfect Landing Page That Converts · · landing-pages, user-conversion
- All the Places Where You Can Use “prefers-color-scheme” Media Query · · css, media-queries, javascript, html, dark-mode
- How to Improve the Release Frequency of Your Team? · · how-tos, releasing, processes, agile, scrum
- React Design Patterns · · react, software-design-patterns
- Deploying a Fastify and Vue 3 Static Site to Heroku · · deploying, vuejs
- New Viewport Units · · css, units, responsive-design
- The Decline in Design (Thinking) · · design, user-experience
- Awesome List of Free CSS [Generators] · · css, code-generation, tooling, link-lists
- Shines, Perspective, and Rotations: Fancy CSS 3D Effects for Images · · css, effects, images
- Strategic UX Research Is the Next Big Thing · · user-experience, research, strategies
- htmx in 100 Seconds · · videos, introductions, htmx
- Testing the Dark Scenarios of Your Node.js Application · · nodejs, testing
- The New “@ font-face” Syntax · · css, fonts
- Four Lenses of Productivity · · research, productivity
- From Hacks to Elegance: Transforming a Card Component With Modern CSS Wizardry · · components, css, refactoring, maintenance
- An Introduction to Native CSS Nesting · · introductions, css, nesting
- Is Lighthouse a Misleading Performance Tool? · · performance, lighthouse, web-vitals, tooling
- There’s No Such Thing as a “Normal” User · · accessibility
- The Case Against Self-Closing Tags in HTML · · html
- Just Normal Web Things · · web, user-experience
- URL Explained: The Fundamentals · · terminology
- Offset Parent and Stacking Context: Positioning Elements in All Three Dimensions · · css, layout
- A Roadmap to Leadership Inclusion: 15 Keys to Unlocking a Diverse and Empowered Workplace · · leadership, inclusion, accessibility
- Creating SVG Animations Using Tailwind CSS · · svg, animations, tailwind
- CSS Only Floating Labels · · css, forms
- When User Testing Sessions Bring Up Trauma · · user-experience, testing
- Understanding JWTs: A Simple Guide for Beginners · · guides, json-web-tokens
- Redundancy Is Great · · information-design
- How to Validate HTML On-Line at W3C · · how-tos, html, conformance, tooling
- Introduction to the Kanban Framework: A Beginner’s Guide to Agile Project Management · · introductions, guides, kanban, agile
- Can We Query the Root Container? · · css, container-queries
- Resources for Procurement of Accessible Digital Products and VPAT · · accessibility, vpat-acr, conformance, tooling, link-lists
- Multithreading With Worker Threads in Node.js · · nodejs, multithreading, worker-threads
- See What’s New in Firefox [115.0] · · release-notes, user-agents, mozilla, firefox
- Are We There Yet? · · css, colors, history
- The Trick to Smoothly Animating Shadows in CSS · · videos, css, animations, shadows
- Design for the Web Without Figma · · design, tooling
- The “article” Element and Screen Readers · · html, user-agents, assistive-tech, screen-readers, accessibility, support
- Build a Simple Beginner App With Node, Bootstrap, and MongoDB · · web-apps, nodejs, bootstrap, mongodb
- Introduction to MongoDB and NoSQL Databases · · introductions, databases, mongodb
- What Is Page Bloat? And How Is It Hurting Your Business, Your Search Rank, and Your Users? · · performance, user-experience, user-conversion, metrics, economics
- 90s Websites—Key Characteristics and Examples · · design, history, trends, navigation, colors, typography
- The Fake Aura of Care in UX · · user-experience
- Understanding SVG Paths · · svg
- Your Browser May Be Having a Secret Relationship With a Screen Reader · · accessibility, user-agents, assistive-tech, screen-readers
- How I Am Blogging the IndieWeb Way · · blogging, indieweb, automation
- AI and the Automation of Work · · ai, automation, processes
- 4 Design Principles I Use Every Day to Avoid Bad UX and Create Products That Work for Everyone · · design, principles, user-experience, inclusion
- And 4 More HTML Concepts You Didn’t Know · · html, concepts, web-components
- How to Use Node.js to SSH into Remote Servers: A Comprehensive Guide · · how-tos, guides, nodejs, command-line, servers, ssh
- Identify Unused npm Packages in Your Project · · npm, dependencies, maintenance
- Setting Expectations for the Node.js Test Runner · · nodejs, testing, tooling
- In Defence of “DOMContentLoaded” · · javascript, dom, performance
- The Big Problem With Variables in Figma · · figma
- How to Measure the Impact of a Design System? · · how-tos, design-systems, metrics
- Observing Node.js Processes With eBPF · · monitoring, nodejs
- How to Tackle Docker and Kubernetes for Frontend · · how-tos, docker, kubernetes
- Angular Is Getting New Template Syntax · · angular
- Designers Who Code, What Is It Good For? · · design, career
- CommonJS Is Hurting JavaScript · · javascript
- New to the Web Platform in June · · release-notes, web-platform, user-agents, mozilla, firefox, google, chrome, apple, safari