Tech Skills

Frontend Engineering

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

11,237
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 (3,455) Articles (424)Blog Posts (2809)Tutorials (103)Research Papers (1)News (118)
I Built Memory Match in Vanilla JS (With a CSS 3D Flip)
Dev.to · Devanshu Biswas 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
I Built Memory Match in Vanilla JS (With a CSS 3D Flip)
Memory Match (Concentration) is a great first "state machine" game: flip two cards, match or flip...
How to add a contact form to a Next.js app without a backend
Dev.to · Eduardo Villão 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
How to add a contact form to a Next.js app without a backend
If you've ever built a Next.js app and needed a contact form, you've probably hit the same wall: you...
The React Compiler Automated the Easy Half of Performance. The Hard Half Just Got Harder to Hide.
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
The React Compiler Automated the Easy Half of Performance. The Hard Half Just Got Harder to Hide.
React Compiler is stable in React 20 and Next.js 16. Manual memoization is mostly gone. The part of the job that’s left was always the… Continue reading on Medi
If the Virtual DOM is So Great, Why is Everyone Trying to Kill It?
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
If the Virtual DOM is So Great, Why is Everyone Trying to Kill It?
For ten years, the Virtual DOM has been the most popular tool in frontend web development. It was the magic trick that made React very… Continue reading on Medi
React lost the mass and Vercel is wearing its skin
Dev.to · Aditya Agarwal 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
React lost the mass and Vercel is wearing its skin
There used to be a sense that the React community had ownership of the project. Nowadays, it feels...
React useState Explained: Batching, Functional Updates, Render Phase & More
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
React useState Explained: Batching, Functional Updates, Render Phase & More
If you’ve been learning React, you’ve probably used the useState hook countless times. Continue reading on Medium »
React vs Next.js: Which One Should You Learn First? My Honest Experience
Dev.to · Abhavya Gupta 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
React vs Next.js: Which One Should You Learn First? My Honest Experience
A few months ago, I was exactly where most beginners are today. I had finally learned HTML, CSS, and...
The Hidden Cost of useEffect: How React’s Most-Used Hook Quietly Destroys Performance
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
The Hidden Cost of useEffect: How React’s Most-Used Hook Quietly Destroys Performance
I’ve reviewed hundreds of React components over the past four years. In that time, one pattern has caused more performance regressions… Continue reading on Java
Reddit r/learnprogramming 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
made a simple college ROI calculator
Hey, I’m a high school student learning web development and I just built a small project called EduVest. It’s a college finance tool that helps compare costs, s
Zero-Dependency Favicon Generation with Canvas API — Build Your Own in 50 Lines
Dev.to · swift king 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Zero-Dependency Favicon Generation with Canvas API — Build Your Own in 50 Lines
Every React project I've worked on eventually adds a favicon generation dependency. favicons alone...
View Transitions are finally production safe
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
View Transitions are finally production safe
I was on a flight last week, scrolling through a real estate app on my phone, and the navigation between the listings page and the detail… Continue reading on M
What frontend architecture actually costs when it’s left out of the room
Medium · SEO 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
What frontend architecture actually costs when it’s left out of the room
Most organisations have a version of the same model. Design defines the experience. Backend builds the data layer. Frontend connects the… Continue reading on Me
How We Upgraded to Astro v7 in 5 Minutes (With Zero Breaking Changes)
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
How We Upgraded to Astro v7 in 5 Minutes (With Zero Breaking Changes)
If you’re a frontend developer, you likely know the feeling of dread when a major framework version drops. You block off your entire… Continue reading on Medium
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
How I forced my React game to get 100/100 Lighthouse score (without Next.js)
Hello everyone! I am a frontend developer from China, and also a big football fan. Recently, I made two web games because I want people to… Continue reading on
Medium · SEO 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
How I forced my React game to get 100/100 Lighthouse score (without Next.js)
Hello everyone! I am a frontend developer from China, and also a big football fan. Recently, I made two web games because I want people to… Continue reading on
I built a collection of 160+ client-side utility calculators using Next.js and Tailwind CSS
Dev.to · ludy.dev 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
I built a collection of 160+ client-side utility calculators using Next.js and Tailwind CSS
As web developers, we often build complex SaaS products, but sometimes the most satisfying projects...
Reddit r/webdev 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Frontend recommendations 🙏
Hey guys, looking for some web devs wisdom here. A friend asked me (a backend .net dev) for help prototyping a web he has in mind. I’ve been reading up on this
React's real problem isn't React. It's Vercel.
Dev.to · Aditya Agarwal 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
React's real problem isn't React. It's Vercel.
Developers are frustrated with React. The posts about it are all over the place. "Does anybody...
Setting Up a Controlled Component
Dev.to · ShaynaProductions 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Setting Up a Controlled Component
Prologue A while ago, I decided to develop a fully accessible main navigation component in React and...
6 HTML5 Features That Instantly Made My Websites Feel Premium
Medium · Programming 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
6 HTML5 Features That Instantly Made My Websites Feel Premium
Small changes, massive UX upgrades no extra libraries required Continue reading on CodeToDeploy »
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
350+ Registrations and Counting: DemonDie Frontend Quiz Arena 2026 is Growing Fast
When we started planning the DemonDie Frontend Quiz Arena 2026, our goal was simple — create something exciting for students and… Continue reading on Medium »
Why Your Cursor Rules Don't Work in Agent Mode (And How to Fix It)
Dev.to · Muhammad Irsyad Aulia 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Why Your Cursor Rules Don't Work in Agent Mode (And How to Fix It)
You added a .cursorrules file to your Next.js project. You wrote detailed instructions about your...
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
From Angular.js to Fine-Grained Reactivity: Compiling Templates at Build-Time
We are in 2026, but in some corners of the enterprise world, it still feels like 2014. One of those places is the frontend stack of my… Continue reading on Medi
From Angular.js to Fine-Grained Reactivity: Compiling Templates at Build-Time
Dev.to · Carlo Straccialini 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
From Angular.js to Fine-Grained Reactivity: Compiling Templates at Build-Time
We are in 2026, but in some corners of the enterprise world, it still feels like 2014. One of those...
The Coordination Tax — The Cost of Frontend State Without a Source of Truth
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
The Coordination Tax — The Cost of Frontend State Without a Source of Truth
Why the same frontend bugs keep coming back Continue reading on Medium »
22 Things You Didn’t Know the Browser Could Do Natively
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
22 Things You Didn’t Know the Browser Could Do Natively
Hidden browser features that can simplify your next project Continue reading on Stackademic »
gradient-shimmer: Animated Text for React and Next.js
Dev.to · jQueryScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
gradient-shimmer: Animated Text for React and Next.js
gradient-shimmer adds animated multi-stop gradient text to React and Next.js...
Is Frontend Dead in 2026? No, It Just Evolved
Medium · AI 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Is Frontend Dead in 2026? No, It Just Evolved
Last week, I caught up with an old friend who’s been a frontend engineer for about eight years. We got talking about how fast things are… Continue reading on Me
Is Frontend Dead in 2026? No, It Just Evolved
Medium · Programming 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Is Frontend Dead in 2026? No, It Just Evolved
Last week, I caught up with an old friend who’s been a frontend engineer for about eight years. We got talking about how fast things are… Continue reading on Me
We Upgraded to Astro v7 in 5 Minutes (Zero Breaking Changes) 🚀
Dev.to · Karthikeyan K R 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
We Upgraded to Astro v7 in 5 Minutes (Zero Breaking Changes) 🚀
If you're a frontend developer, you know the feeling of dread when a major framework version drops....
_action: Declarative Event Handlers in an Attribute
Dev.to · Jon Nyman 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
_action: Declarative Event Handlers in an Attribute
Introducing _action, a tiny event-delegation layer, and comparing it with HTML Traits and web components.
Zero-Dependency Favicon Generation with Canvas API — Build Your Own in 50 Lines
Dev.to · swift king 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Zero-Dependency Favicon Generation with Canvas API — Build Your Own in 50 Lines
Every React project I've worked on eventually adds a favicon generation dependency. favicons alone...
React Learning Journey — Day 3: Understanding JSX, Components, Props, Bundlers, and What Happens…
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
React Learning Journey — Day 3: Understanding JSX, Components, Props, Bundlers, and What Happens…
Three days ago, React felt like something only experienced developers  Missed Day 2? I covered how React updates the UI… Continue reading on Medium »
"I am a 13-year-old student learning JavaScript, HTML, and CSS. I want to create a web game, share it across the US for player feedback, and learn more about the game development industry."
Dev.to · revathi 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
"I am a 13-year-old student learning JavaScript, HTML, and CSS. I want to create a web game, share it across the US for player feedback, and learn more about the game development industry."
A post by revathi
Core Web Vitals: The Missing Beginner’s Intro — Frontend Master
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Core Web Vitals: The Missing Beginner’s Intro — Frontend Master
Everyone tells you to “improve your Core Web Vitals.” Almost nobody explains what they actually measure, or why Google decided to grade… Continue reading on Med
Stokado: A Zero-Dependency Proxy Wrapper That Makes Browser Storage Feel Like a Plain Object
Dev.to · KID-joker 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Stokado: A Zero-Dependency Proxy Wrapper That Makes Browser Storage Feel Like a Plain Object
If you've shipped anything to the browser, you've used localStorage. And if you've used it for more...
innerHTML vs textContent: The Difference That Could Get Your Users Hacked
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
innerHTML vs textContent: The Difference That Could Get Your Users Hacked
You have probably used both without thinking twice. You needed to put something on the page, you picked one, it worked, you moved on. Most… Continue reading on
React’s useState Hook Is Lying to You — and Here’s Why
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
React’s useState Hook Is Lying to You — and Here’s Why
A journey into the dark magic of state persistence, closure tricks, and why React judges you by the order of your hooks. Continue reading on Medium »
Animating the <dialog> element using the View Transition API
Reddit r/webdev 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Animating the <dialog> element using the View Transition API
element using the View Transition API" title="Animating the element using the View Transition API" /> submitted by <a href="https://www.reddit.
Nobody Tells Junior React Developers This — What Actually Gets You to Senior Level in 2026
Medium · Programming 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Nobody Tells Junior React Developers This — What Actually Gets You to Senior Level in 2026
“It’s not about DSA problems or switching stacks. After 5years of real projects, here’s what actually moves the needle. Continue reading on Towards AI »
10 Cool CodePen Demos — May 2026
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
10 Cool CodePen Demos — May 2026
A collection of 10 cool and exciting front-end demos shared on CodePen during May 2026 Continue reading on Medium »
10 Cool CodePen Demos — May 2026
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
10 Cool CodePen Demos — May 2026
A collection of 10 cool and exciting front-end demos shared on CodePen during May 2026 Continue reading on Level Up Coding »
Reddit r/learnprogramming 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
HOW TO front end development
i joined a student activity they teach us FED and i kinda sucks now we started with js but i feel so behind and low i keep forgetting codes or just stupid and s
Next.js vs Custom Engine: Analisis Routing, Modularitas, dan Strategi Pengiriman Data Modern
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Next.js vs Custom Engine: Analisis Routing, Modularitas, dan Strategi Pengiriman Data Modern
Membahas perbandingan antara framework Next.js dan custom engine dalam membangun aplikasi frontend modern, terutama dari sisi routing… Continue reading on Mediu
useState vs TanStack Query: Perbedaan, Kelebihan, dan Kekurangannya
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
useState vs TanStack Query: Perbedaan, Kelebihan, dan Kekurangannya
Ketika aplikasi React mulai berkembang dan butuh mengambil data dari server, banyak developer dihadapkan pada pertanyaan klasik: cukup… Continue reading on Medi
Stop Using HttpClient.get(): The Angular 22 resource() API Changes Everything
Medium · JavaScript 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Stop Using HttpClient.get(): The Angular 22 resource() API Changes Everything
You are writing too much code just to fetch a JSON file. Here is how the native resource() API replaces RxJS pipelines with reactive… Continue reading on JavaSc
Eu achava que sabia front-end… até usar Next.js
Medium · Programming 🌐 Frontend Engineering ⚡ AI Lesson 2w ago
Eu achava que sabia front-end… até usar Next.js
Uma breve reflexão sobre os desafios e aprendizados de desenvolver uma aplicação moderna pela primeira vez. Continue reading on Medium »
Styling the Vertical - Achieving Parity
Dev.to · ShaynaProductions 🌐 Frontend Engineering 2w ago
Styling the Vertical - Achieving Parity
Note: This article is one of a series demonstrating building a React navigational component from...