Tech Skills

Frontend Engineering

HTML, CSS, JavaScript, React, Next.js, performance and modern web development

24,046
lessons
Skills in this topic
View full skill map →
HTML & CSS
beginner
Build a responsive layout with CSS Grid and Flexbox
JavaScript Fundamentals
beginner
Write async code with Promises and async/await
React
intermediate
Build a data-fetching app with useEffect and useState
Frontend Performance
intermediate
Achieve a 90+ Lighthouse score
Modern Frontend Stack
advanced
Build a Next.js app with SSR and ISR
All Reads (15,972) Articles (4092)Blog Posts (10933)Tutorials (319)Research Papers (1)News (627)
How to add country icons to a React app
Dev.to · Rushan 🌐 Frontend Engineering ⚡ AI Lesson 6d ago
How to add country icons to a React app
Geography is a blind spot in most icon libraries. They give you arrows and carets, not the shape of...
How I Built a Compound Interest Calculator Without Any Backend
Dev.to · ggwork 🌐 Frontend Engineering ⚡ AI Lesson 1w ago
How I Built a Compound Interest Calculator Without Any Backend
While working on a side project recently, I needed a way to help users quickly understand how their...
PrimeVue v4 Stopped Active Dev: OpenVue Takes Over on MIT
Dev.to · Nikola Jevrić 🌐 Frontend Engineering ⚡ AI Lesson 1w ago
PrimeVue v4 Stopped Active Dev: OpenVue Takes Over on MIT
If your stack relies on PrimeVue v4, there's a recent change in the project's maintenance lifecycle...
A tabbed form that silently refused to submit — required fields hidden behind another tab
Dev.to · Susumu Takahashi 🌐 Frontend Engineering ⚡ AI Lesson 1w ago
A tabbed form that silently refused to submit — required fields hidden behind another tab
Background The site edit modal kept accumulating fields — site name, category, SSH...
Vanilla JavaScript — Why It Still Matters in the Age of React and Next.js
Dev.to · Osama Abu Motlaq 🌐 Frontend Engineering ⚡ AI Lesson 1w ago
Vanilla JavaScript — Why It Still Matters in the Age of React and Next.js
Vanilla JavaScript — Why It Still Matters in the Age of React and Next.js In modern web...
Angular Contact Form Without a Backend: Reactive Forms Guide
Dev.to · Hussain Fakhruddin 🌐 Frontend Engineering ⚡ AI Lesson 1w ago
Angular Contact Form Without a Backend: Reactive Forms Guide
Build an Angular contact form with Reactive Forms and HttpClient, accessible validation, spam controls, and production checks.
CSS Grid vs Flexbox: The Matrix of Layout Choices
Dev.to · Timevolt 🌐 Frontend Engineering ⚡ AI Lesson 1w ago
CSS Grid vs Flexbox: The Matrix of Layout Choices
The Quest Begins (The "Why") I still remember the first time I tried to build a dashboard...
4 Motion Design Bugs That Break Astro + GSAP + Lenis Sites in Production
Dev.to · Keymel Gaston 🌐 Frontend Engineering ⚡ AI Lesson 1w ago
4 Motion Design Bugs That Break Astro + GSAP + Lenis Sites in Production
I got tired of debugging the same four things every time I built a motion-design landing page with...
The CSS bug that taught me JS-injected styles always win
Dev.to · Nogan's Development 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
The CSS bug that taught me JS-injected styles always win
I spent way longer than I'd like to admit chasing a dark mode bug that made zero sense on paper. I'm...
How ProvChart Makes Your Pages Faster, Crawlable, and Still Dynamic
Dev.to · FSCSS tutorial 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
How ProvChart Makes Your Pages Faster, Crawlable, and Still Dynamic
Charts without the JavaScript tax. Most charting libraries force a trade-off: You get beautiful...
A CSS Hover-Reveal Pattern for Technical Specs
Dev.to · Richard Lemon 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
A CSS Hover-Reveal Pattern for Technical Specs
The problem on the Gate Seal page The Gate Seal product page for a maritime client needed to present...
A modern marketing site without a modern front-end stack
Dev.to · NessFlow 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
A modern marketing site without a modern front-end stack
Laravel 13, Blade, Tailwind 4, Vite 8. Astro, Hugo, Eleventy and Next are all good at building fast...
7,798 Components. Import One, Ship One.
Dev.to · James Coombs 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
7,798 Components. Import One, Ship One.
James Coombs is a design engineer who maintains the icon package a frontend org installs across...
State Management in Front-end Web Development: Mutators
Dev.to · Abbey Perini 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
State Management in Front-end Web Development: Mutators
Libraries like Valtio and Pinia for Vue use a mutator pattern instead of the actions, dispatch, and...
The one skill behind frontend interviews: matching the signal to the technique
Dev.to · Nachiket Salvi 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
The one skill behind frontend interviews: matching the signal to the technique
Most frontend interview prep is a list of questions. You grind the list, feel prepared, then freeze...
How to Build a CAD-Style Layout Editor on Top of Extracted HTML
Dev.to · Bonzai2Carn 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
How to Build a CAD-Style Layout Editor on Top of Extracted HTML
TLDR If you have extracted a PDF to HTML and want users to rearrange and edit the layout...
The HTML canvas quietly deletes your photo's metadata — and one day that bites you
Dev.to · BellSal 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
The HTML canvas quietly deletes your photo's metadata — and one day that bites you
I build browser-based image tools, and the single most confusing class of bug reports I get all trace...
Next.js 15 Dark Mode Without the Flash: From Hydration Error to Zero-Flicker
Dev.to · Mark 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Next.js 15 Dark Mode Without the Flash: From Hydration Error to Zero-Flicker
I built a 100+ tool website with Next.js 15 on Cloudflare Pages. I thought implementing dark mode...
How I Built a Browser-Only Bubble Text Generator with SVG and Canvas
Dev.to · hw lu 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
How I Built a Browser-Only Bubble Text Generator with SVG and Canvas
Visual text generators look simple from the outside: type a phrase, choose a style, and download an...
WordPress Block Themes vs Classic Themes: Should You Switch in 2026?
Dev.to · Muhammad Medhat 🌐 Frontend Engineering ⚡ AI Lesson 3w ago
WordPress Block Themes vs Classic Themes: Should You Switch in 2026?
If you've been developing WordPress websites for several years, there's a good chance you've spent a...
Designing HTML Page Caching Changed How I Think About Caching
Dev.to · Tohru Yaginuma 🌐 Frontend Engineering ⚡ AI Lesson 3w ago
Designing HTML Page Caching Changed How I Think About Caching
Long Story Short Designing HTML page caching in practice connected several concepts I had...
Gravy Theory: three chickens, one base
Dev.to · Yash Kumar Saini 🌐 Frontend Engineering ⚡ AI Lesson 3w ago
Gravy Theory: three chickens, one base
This is a submission for Frontend Challenge - Comfort Food Edition Perfect Landing. What I...
Eleven pages that read your own files in the browser. The hard part was what they refuse to say.
Dev.to · Artificial Wasteland 🌐 Frontend Engineering ⚡ AI Lesson 3w ago
Eleven pages that read your own files in the browser. The hard part was what they refuse to say.
Drop a JPEG onto this page and it will read the quantization and Huffman tables straight out of your...
☕ Hot Tea & Crispy Samosa – Interactive Comfort Food Experience
Dev.to · Bhavnish 🌐 Frontend Engineering 4w ago
☕ Hot Tea & Crispy Samosa – Interactive Comfort Food Experience
☕ Overview An interactive frontend web experience showcasing the ultimate Indian comfort...
Angular Dependency Injection vs React Context + Hooks — Who Does It Better?
Dev.to · Placide 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
Angular Dependency Injection vs React Context + Hooks — Who Does It Better?
Sharing logic and state across an application is one of the most fundamental challenges in frontend...
React Mastery Series – Day 33: React API Architecture – Axios, Fetch, Service Layers, Interceptors & Error Handling
Dev.to · Siva Samanthapudi 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
React Mastery Series – Day 33: React API Architecture – Axios, Fetch, Service Layers, Interceptors & Error Handling
Welcome back to the React Mastery Series! In Day 32, we explored State Management Architecture and...
Inside the V8 Engine: How JavaScript Really Works Under the Hood ⚙️
Dev.to · Rashmi Roy 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
Inside the V8 Engine: How JavaScript Really Works Under the Hood ⚙️
Have you ever wondered what actually happens when you run a JavaScript program? You...
Changed Nonenglishtext to English.
Dev.to · Weird Codes 🌐 Frontend Engineering 4w ago
Changed Nonenglishtext to English.
🎮 MOKSHA Devlog — Commit db000bac Author: pj90 (@weirdcodesofficial) Date: August 9, 2026 ...
📊 Glance-Charts — Ultra-Lightweight, Zero-Dependency Charting Library
Dev.to · akhilesh 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
📊 Glance-Charts — Ultra-Lightweight, Zero-Dependency Charting Library
When it comes to adding charts to a web project, we are often forced to choose between heavy,...
How to Convert Decimal Degrees to DMS in JavaScript
Dev.to · echoluoluo 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
How to Convert Decimal Degrees to DMS in JavaScript
Geographic coordinates are commonly represented using Decimal Degrees (DD). For...
I built 59 free browser-based dev tools in vanilla JS — here's what I learned
Dev.to · Yuva 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
I built 59 free browser-based dev tools in vanilla JS — here's what I learned
I've been quietly building Antigravity Tools — a collection of 59 free, browser-based developer...
How to Convert Files in the Browser Without Uploading Them
Dev.to · Harshavardhan Palegar 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
How to Convert Files in the Browser Without Uploading Them
Most file-conversion workflows start with a trade-off that is easy to miss: Choose a file from your...
Dev Log: 2026-08-08 — stubs that answer politely, and a CSS property that doesn't exist
Dev.to · Nasrul Hazim 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
Dev Log: 2026-08-08 — stubs that answer politely, and a CSS property that doesn't exist
Heavy day, mostly on one private deployment platform, plus a small but instructive fix in a PDF book...
Debugging Playwright LocalStorage Persistence: A 3-Hour Puzzle
Dev.to · BAOFUFAN 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
Debugging Playwright LocalStorage Persistence: A 3-Hour Puzzle
It was 2 a.m. when the CI alert fired. A front-end login test case had suddenly started failing — it...
From Raw Data to Smart Objects: A Cleaner Way to Use NgRx SignalStore
Dev.to · mehdi 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
From Raw Data to Smart Objects: A Cleaner Way to Use NgRx SignalStore
Building enterprise Angular applications often starts with the same pattern: fetching raw data...
How much to share in a monorepo when building common features for web and mobile
Dev.to · hiro@ 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
How much to share in a monorepo when building common features for web and mobile
This article is an English translation of the original Japanese article. When I added an Expo app to...
One Checkbox, Three Kinds of State in a Chrome MV3 Extension
Dev.to · Danila Pryadko 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
One Checkbox, Three Kinds of State in a Chrome MV3 Extension
I thought I had a settings bug. What I actually had was three different kinds of state pretending to...
Build Direct-to-Disk Web Editors with the New useFileSystem Hook
Dev.to · Saurav Pandey 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
Build Direct-to-Disk Web Editors with the New useFileSystem Hook
We have all built or used web-based text and configuration tools. The absolute worst part of the user...
How to Find and Fix Slow Components
Dev.to · Muneeb Ansari | BiteGlitz 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
How to Find and Fix Slow Components
A practical guide to measuring React rendering performance, identifying slow components,...
How I Built a 60 FPS 404 Page With Live Video Background Removal
Dev.to · Amirhossein Dehghanazar 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
How I Built a 60 FPS 404 Page With Live Video Background Removal
Most 404 pages are boring. You spend hours designing the actual website, animations, interactions,...
Twelve planted accessibility barriers. axe found two.
Dev.to · Thomas Sweet 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
Twelve planted accessibility barriers. axe found two.
A page kept deliberately broken carries twelve real WCAG barriers; CI runs axe against it and pins the result at exactly two violations, image-alt and color-con
Need for Suggestions to improve OneToolBox — free browser-based tools for developers
Dev.to · Hassan Ighil 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
Need for Suggestions to improve OneToolBox — free browser-based tools for developers
Hey devs👋 I've been building OneToolBox: https://onetoolbox.dev/ It's a collection of free web...
I Built a Crypto-Native Craigslist with Manual Escrow — Here's Why and How
Dev.to · crypto_b 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
I Built a Crypto-Native Craigslist with Manual Escrow — Here's Why and How
The Problem There are millions of people holding crypto who want to spend it on real...
I built a Korean fire-noodle stall in pure CSS — and you can eat it
Dev.to · Alex Kolovskiy 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
I built a Korean fire-noodle stall in pure CSS — and you can eat it
This is a submission for Frontend Challenge - Comfort Food Edition, CSS Art. ...
2026 Tips on How to Buy Old Gmail Accounts
Dev.to · Danny Jenkins 🌐 Frontend Engineering 4w ago
2026 Tips on How to Buy Old Gmail Accounts
Understanding the Growing Interest Around Old Gmail Accounts The demand for old Gmail accounts has...
CSS Foundations: Understanding the Box Model, Cascade and Specificity
Dev.to · Deepika Pusala 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
CSS Foundations: Understanding the Box Model, Cascade and Specificity
CSS looks simple at first, but understanding how the browser calculates sizes and decides which style...
The ₹1 That Costs ₹62,400: Modelling India's Tax Slabs Without Cliff-Edge Bugs
Dev.to · Monu Kumar 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
The ₹1 That Costs ₹62,400: Modelling India's Tax Slabs Without Cliff-Edge Bugs
Progressive tax is the textbook example of a reduce. Walk the slabs, tax each band at its rate, sum...
Compressing PDFs in the browser, and the bug that shipped empty files
Dev.to · swifttooly 🌐 Frontend Engineering ⚡ AI Lesson 4w ago
Compressing PDFs in the browser, and the bug that shipped empty files
Last time I wrote about compressing images in the browser with the Canvas API. I ended that post by...