Tech Skills

Frontend Engineering

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

923
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 (169) Articles (50)Blog Posts (88)Tutorials (31)
How I Added Pre-Rendering to a Vite Multi-Page App Without SSR
Dev.to · Bright Agbomado 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
How I Added Pre-Rendering to a Vite Multi-Page App Without SSR
I run RelahConvert, an online file conversion site with 50+ tools across 25 languages. Last week I...
TIL canvas.captureStream() is video-only — here's how I mixed voiceover + music into a MediaRecorder export" published: true
Dev.to · Robert Corn 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
TIL canvas.captureStream() is video-only — here's how I mixed voiceover + music into a MediaRecorder export" published: true
TL;DR — canvas.captureStream() only carries video tracks. To get audio into your MediaRecorder export...
@supports Lies: When CSS Says 'Yes' but Browsers Say 'LOL No'
Dev.to · Alvaro Montoro 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
@supports Lies: When CSS Says 'Yes' but Browsers Say 'LOL No'
CSS treats @supports as context-blind, and that leads to surprising (and misleading) behavior in real browsers.
React Form Handling: Debounced Validation, Auto-Save Drafts, and Controlled Inputs
Dev.to · reactuse.com 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
React Form Handling: Debounced Validation, Auto-Save Drafts, and Controlled Inputs
React Form Handling: Debounced Validation, Auto-Save Drafts, and Controlled Inputs Forms...
The Ultimate Showdown the security of React Server Components and Remix 3: What Matters
Dev.to · ANKUSH CHOUDHARY JOHAL 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
The Ultimate Showdown the security of React Server Components and Remix 3: What Matters
The Ultimate Showdown: React Server Components vs Remix 3 Security – What Matters Modern...
To Do List Project Using Html,Css and Javascript
Dev.to · Deva I 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
To Do List Project Using Html,Css and Javascript
HTML CODE : . JAVASCRIPT : CSS : OUTPUT :
JS fetch()
Dev.to · Nanthini Ammu 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
JS fetch()
What is fetch(): fetch() is a built-in function used to make network/HTTP requests. It...
✨ One HTML file. No backend. No sign-up. Your data never leaves your browser.
Dev.to · Balaji K 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
✨ One HTML file. No backend. No sign-up. Your data never leaves your browser.
But here's what makes it different from the 50 other trackers out there: → Real-time broker sync for...
Rendering Is a Browser Decision, Not a JavaScript One
Dev.to · Marsha Teo 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Rendering Is a Browser Decision, Not a JavaScript One
This is the fifth article in a series on how JavaScript actually runs. You can read the full series...
Why Most React Infinite Scroll Hooks Fail in Production (and the One That Fixed It for Me)
Dev.to · Shubhra Pokhariya 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Why Most React Infinite Scroll Hooks Fail in Production (and the One That Fixed It for Me)
I used to believe infinite scroll was one of the simplest features to implement. Fetch data → append...
Micro-Frontends: The Complete Architecture Guide for 2026
Dev.to · Mahdi BEN RHOUMA 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Micro-Frontends: The Complete Architecture Guide for 2026
Master micro-frontend architecture with Module Federation, single-spa, and modern deployment strategies. Real-world examples and best practices included.
ReactJs Performance ~ Tree Shaking and Bundle Analysis ~
Dev.to · Ogasawara Kakeru 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
ReactJs Performance ~ Tree Shaking and Bundle Analysis ~
Reduce Your Bundle Size with Effective Tree Shaking Modern JavaScript bundlers are...
We Ditched TypeScript 5.5 for ReScript 11.0 and Cut Our Frontend Bugs 40%
Dev.to · ANKUSH CHOUDHARY JOHAL 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
We Ditched TypeScript 5.5 for ReScript 11.0 and Cut Our Frontend Bugs 40%
In Q3 2024, our 12-person frontend team at a Series C fintech startup tracked 142 critical production...
HTML5 Audio Tag for Beginners: 5 Simple Hacks
Dev.to · Drive Coding 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
HTML5 Audio Tag for Beginners: 5 Simple Hacks
TL;DR The HTML5 audio tag lets you add sound to any webpage without installing a single...
War Story: How a React 19 Open Source Contribution Got Me Headhunted by Meta in Q1 2026
Dev.to · ANKUSH CHOUDHARY JOHAL 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
War Story: How a React 19 Open Source Contribution Got Me Headhunted by Meta in Q1 2026
In Q1 2026, I merged a 142-line patch to React 19’s concurrent rendering scheduler that eliminated...
How to Build a Drag-and-Drop File Dropzone in React & Next.js (With Tailwind CSS) — Line by Line
Dev.to · Muhammad Hamid Raza 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
How to Build a Drag-and-Drop File Dropzone in React & Next.js (With Tailwind CSS) — Line by Line
Ever tried to upload a file on a website and the experience felt like dragging a suitcase up a broken...
How I Built Expiring Links With Zero Backend (React + TypeScript Only)
Dev.to · Umair Shakoor 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
How I Built Expiring Links With Zero Backend (React + TypeScript Only)
Most "expiring link" tools work the same way: generate a link, store the destination and expiry in a...
Vue vs. React: Which JavaScript UI framework is best?
Dev.to · Hugo Naili 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Vue vs. React: Which JavaScript UI framework is best?
Choosing the right UI framework can make a big difference to your project's success. Vue and React...
You Might Not Need a Framework: Building Modern Web Apps with Vanilla JavaScript
Dev.to · Abanoub Kerols 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
You Might Not Need a Framework: Building Modern Web Apps with Vanilla JavaScript
In today's frontend world, it's easy to reach for React, Vue, or Svelte the moment a project needs...
Learn React 2026 Roadmap: Skills, Projects, Stack
Dev.to · Juan Diego Isaza A. 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Learn React 2026 Roadmap: Skills, Projects, Stack
Learn React 2026 roadmap: fundamentals, TypeScript, Next.js, testing, and portfolio projects. A practical 12-week plan for online learners.
Why TSRX Gives Me PHP Flashbacks
Dev.to · Alex Saft 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Why TSRX Gives Me PHP Flashbacks
For the past few days, the frontend community has been buzzing about a potential successor to JSX:...
Frontend vs Backend: What Should You Learn First?
Dev.to · Pixel Mosaic 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Frontend vs Backend: What Should You Learn First?
If you’re trying to decide between frontend and backend development, “what to learn first” doesn’t...
I built a game where every word you type blooms into a flower 🌸 (Vanilla JS, no frameworks)
Dev.to · DAVID MPANGALA 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
I built a game where every word you type blooms into a flower 🌸 (Vanilla JS, no frameworks)
🌸 I built something I've never seen before — and I think you'll love it. Introducing MindBloom — a...
I Built 25+ Free Tools for Developers (No Signup Required) 🚀
Dev.to · Ashish | Devpalettes 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
I Built 25+ Free Tools for Developers (No Signup Required) 🚀
I Built 25+ Free Tools for Developers (No Signup Required) 🚀 As a developer, I kept...
Mastering Your Frontend Build with Bazel: Consolidating Tests
Dev.to · Matti Bar-Zeev 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Mastering Your Frontend Build with Bazel: Consolidating Tests
In my previous post I consolidated the lint setup across all 7 packages in the Pedalboard monorepo....
Why I spent years trying to make CSS states predictable
Dev.to · Andrey Yamanov 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Why I spent years trying to make CSS states predictable
Have you ever changed the order of two CSS rules and broken a component without changing the...
Day 63: Elevating the Frontend - From Prototype to FinTech Analytics Dashboard
Dev.to · Eric Rodríguez 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Day 63: Elevating the Frontend - From Prototype to FinTech Analytics Dashboard
After wrestling with distributed locks in DynamoDB and restrictive IAM policies, today it was time to...
is-kit vs Zod: A Practical Comparison from 3 Perspectives
Dev.to · nyaomaru 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
is-kit vs Zod: A Practical Comparison from 3 Perspectives
Hi everyone! I’m a frontend engineer who sometimes wonders: “Am I using AI… or is AI using...
Facebook scrambles author names with Flexbox order — here's the 5-line diagnostic that proves it isn't custom fonts
Dev.to · Leon 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Facebook scrambles author names with Flexbox order — here's the 5-line diagnostic that proves it isn't custom fonts
A potential client posted on Reddit asking for a Facebook keyword-post scraper. Their budget: $500....
The Frontend World Just Changed: 5 Shifts for 2026
Dev.to · Syed Ahmed Mohi Uddin Hasan 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
The Frontend World Just Changed: 5 Shifts for 2026
The React Compiler Killed Manual Optimisation. Handwriting. useMemo or useCallback is now like...
Tailwind CSS v4 — What Actually Changed (And What It Means for Your Next.js Project)
Dev.to · Malahim Haseeb 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Tailwind CSS v4 — What Actually Changed (And What It Means for Your Next.js Project)
No config file. No PostCSS dependency. oklch colors. ~5× faster builds. I ran v4 in a real Next.js project — here's what changed in practice.
Can Claude Code migrate VanillaJS/HTML/CSS to Preact/Tailwind?
Dev.to · Jonathan Tuzman 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Can Claude Code migrate VanillaJS/HTML/CSS to Preact/Tailwind?
In my last post, I introduced LinkedIn Secret Weapon, the Chrome Extension I built with Claude Code...
Next.js 15 vs. Next.js 16: What's the Difference?
Dev.to · Mrunank Pawar 🌐 Frontend Engineering ⚡ AI Lesson 1mo ago
Next.js 15 vs. Next.js 16: What's the Difference?
This blog was originally published on Descope. Next.js 16 marks a significant shift for the...
TanStack and Next.js: The De Facto Frontend Logic Layer for 2026
Dev.to · Meriç Cintosun 🌐 Frontend Engineering ⚡ AI Lesson 2mo ago
TanStack and Next.js: The De Facto Frontend Logic Layer for 2026
The Shift Toward Unified Data and Routing Logic The frontend architecture of production...
HTMX vs KEML: The Loading State Example That Shows the Difference
Dev.to · Eugene Kuzmenko 🌐 Frontend Engineering ⚡ AI Lesson 2mo ago
HTMX vs KEML: The Loading State Example That Shows the Difference
A while ago, I wrote about KEML. It didn’t land the way I wanted it to. Not because the idea was...
Your CSS Animations Are Doing Too Much Manual Labor — Fix It With FSCSS
Dev.to · Muhammad Sheraz 🌐 Frontend Engineering ⚡ AI Lesson 2mo ago
Your CSS Animations Are Doing Too Much Manual Labor — Fix It With FSCSS
Tired of hand-writing hundreds of keyframes? FSCSS is a lightweight CSS pre-processor that brings arrays and loops to your animations. Here's how it works.
Frontend Framework Bundle Size Benchmark: React/Vue/Angular vs Fine-Grained Runtimes
Dev.to · qingkuai 🌐 Frontend Engineering ⚡ AI Lesson 2mo ago
Frontend Framework Bundle Size Benchmark: React/Vue/Angular vs Fine-Grained Runtimes
A cross-framework TodoMVC benchmark comparing raw, minified, and min+gzip bundle size growth as component count increases.
Top 5 Mistakes Beginner React Developers Make (And How to Avoid Them)
Dev.to · Adimchi Igwenagu 🌐 Frontend Engineering ⚡ AI Lesson 2mo ago
Top 5 Mistakes Beginner React Developers Make (And How to Avoid Them)
When I started learning React, I made a lot of mistakes. Not because React is hard — but because I...
Nuxt.js ile Hızlı Web Uygulamaları Geliştirmek İçin İpuçları
Dev.to · FORUM WEB 🌐 Frontend Engineering ⚡ AI Lesson 2mo ago
Nuxt.js ile Hızlı Web Uygulamaları Geliştirmek İçin İpuçları
Nuxt.js Nedir? Tarihçesi ve Gelişimi Nuxt.js, Vue.js tabanlı bir framework olarak, 2016 yılında...
Nuxt.js ile Kullanıcı Geri Bildirimlerini Yönetme Yöntemleri
Dev.to · FORUM WEB 🌐 Frontend Engineering ⚡ AI Lesson 2mo ago
Nuxt.js ile Kullanıcı Geri Bildirimlerini Yönetme Yöntemleri
Nuxt.js: Tarihçesi ve Gelişimi Nuxt.js, Vue.js tabanlı bir framework olarak 2016 yılında ortaya...