Frontend Role Guide to know about different frontend roles and their criterion
Frontend Interview Guide to know about different frontend interview rounds
Frontend projects for Practice & interviews (beginners to intermediates)
FAQs to clarify common doubts
Become a better software engineer by working on projects that actually challenge you at CodeCrafters
Roadmaps
- ๐ย ย Road Map (Beginner Version)
- ๐ย ย Road Map (Advanced Version)
HTML
- ๐ย ย MDN HTML
- ๐ย ย W3 Schools
- ๐ย ย HTML Tutorial
- ๐ฅย ย Complete Guide to HTML
CSS
- ๐ย ย MDN CSS
- ๐ย ย Web Dev
- ๐ฅย ย CSS Complete Guide - Udemy
- ๐ย ย CSS for JS developers
Advanced CSS
- ๐ย ย Debugging CSS
- ๐ฅย ย CSS Demystified
- ๐ฅย ย Advanced CSS
JavaScript
- ๐ย ย Eloquent JavaScript
- ๐ย ย JavaScript Info
- ๐ย ย MDN JavaScript
- ๐ย ย JavaScript Tutorial
- ๐ย ย JavaScript for Impatient Programmers
- ๐ย ย Just Javascript
- ๐ฅย ย Complete JavaScript
- ๐ฅย ย Javascript Complete Guide
Advanced JavaScript
- ๐ย ย You don't know JS
- ๐ย ย Secrets of the JavaScript Ninja
- ๐ย ย Deep JavaScript
- ๐ย ย Professional JavaScript for Web developers
- ๐ฅย ย Deep JavaScript Foundations
- ๐ฅย ย JavaScript Hard Parts
- ๐ฅย ย JavaScript: Understanding the Weird Parts
TypeScript
- ๐ย ย TypeScript Deepdive
- ๐ย ย Tackling TypeScript
- ๐ย ย TypeScript Tutorial
- ๐ย ย TypeScript Handbook
- ๐ย ย Programming TypeScript
- ๐ฅย ย Understanding typescript
- ๐ฅย ย TypeScript Course by ui.dev
React
- ๐ย ย React Dev
- ๐ฅย ย React - The Complete Guide
- ๐ฅย ย Ultimate React
- ๐ฅย ย Joy of React
- ๐ฅย ย Scrimba - Learn React for free interactively
React Repos
- ๐ย ย React TypeScript Cheatsheet
- ๐ย ย Entire React code base explanation by visual block
- ๐ย ย Bulletproof React
Other frameworks
- ๐ฅย ย NextJS
- ๐ฅย ย Angular
- ๐ฅย ย Vue:Complete guide
- ๐ฅย ย Sveltejs: Complete Guide
GraphQL
- ๐ฅย ย Apollo GraphQL
- ๐ฅย ย GraphQL Course for Beginners
HTTP
- ๐ย ย MDN HTTP
- ๐ย ย HTTP2 in Action
Git
- ๐ย ย Become a git guru
- ๐ย ย Pro Git
- ๐ย ย Git Explorer
- ๐ย ย Practical Git Guide
Web Performance
- ๐ย ย MDN Performance
- ๐ย ย Core Web Vitals
- ๐ย ย Web Dev Performance
- ๐ย ย Google Dev - Performance
- ๐ย ย Smashing Magezine - Performance
- ๐ฅย ย Web Performance Fundamentals
Web Security
- ๐ฅย ย Web Security
- ๐ย ย Google Web Fundamentals: Security
- ๐ย ย MDN Web Docs: Security
Accessibility
- ๐ฅย ย Accessibility in JavaScript Applications
- ๐ฅย ย Develop Accessible Web Apps with React
- ๐ย ย Web Accessibility Guidelines (WCAG)
Frontend Testing
- ๐ย ย Vitest
- ๐ย ย Jest Docs
- ๐ย ย Cypress
- ๐ฅย ย JavaScript unit testing
- ๐ย ย The art of unit testing
Progressive Web Apps (PWAs)
- ๐ย ย MDN Guide to PWAs
- ๐ย ย Google Developers: PWAs
- ๐ฅย ย PWA - The Complete Guide
JS Design Patterns
- ๐ย ย Modern Web App Design Patterns
- ๐ย ย JS Design Patterns
- ๐ย ย Design Patterns for Humans
JS Best practices
- ๐ย ย Refactoring JavaScript
- ๐ฅย ย Writing Clean Code
- ๐ฅย ย MicroFrontends
Functional JavaScript
- ๐ย ย Mostly adequate Guide
- ๐ย ย Functional Light JavaScript
- ๐ฅย ย Functional JavaScript
Frontend youtube channels
- ๐ฅย ย Traversy Media
- ๐ฅย ย Clever Programmer
- ๐ฅย ย Net Ninja
- ๐ฅย ย Web Dev Simplified
- ๐ฅย ย Academind
- ๐ฅย ย Dev Ed
- ๐ฅย ย Kevin Powell
- ๐ฅย ย Codevolution
- ๐ฅย ย JavaScript Mastery
- ๐ฅย ย Code With Antonio
Frontend System Design
- ๐ย ย Awesome Frontend System Design
- ๐ย ย Frontend System Design
- ๐ฅย ย Front-End Engineer
- ๐ฅย ย Designing Scalable Frontend Systems
- ๐ฅย ย Namaste System Design
- ๐ฅย ย Chakde System Design
- ๐ฅย ย Frontend System Design Course
- ๐ย ย Frontend Geek
Interview Prep Resources
- ๐ย ย Front End Interview Handbook
- ๐ย ย JavaScript Interview Questions
- ๐ย ย JavaScript Code Challenges
- ๐ย ย React Interview Questions
- ๐ย ย Tech Interview Handbook
- ๐ย ย JavaScript Questions MCQ
- ๐ย ย Frontend Mini Challenges
- ๐ย ย FreeCodeCamp Interview Prep
- ๐ย ย Interview Ant
- ๐ย ย The DOM Challenge
Interview Prep channels
- ๐ฅย ย Namaste JavaScript
- ๐ฅย ย Devtools Tech Frontend Interview Series
- ๐ฅย ย RoadsideCoder
- ๐ฅย ย JS Cafe
- ๐ฅย ย Uncommon Geeks
Coding challenges
- ๐ย ย Big Frontend Dev
- ๐ย ย Great Frontend Dev
- ๐ย ย Leetcode
- ๐ย ย Frontend Expert
- ๐ย ย JS Challenger
- ๐ย ย Codedamn
- ๐ย ย Devtools Tech
- ๐ย ย Frontend Mentor
- ๐ย ย Exercism
- ๐ย ย Learners Bucket
- ๐ย ย FrontendPro
- ๐ย ย Frontend Lead
- ๐ย ย CSS Battle
- ๐ย ย Frontend Hire
- ๐ย ย Clientside Dev
- ๐ย ย Frontend Churn
- ๐ย ย Reacterry
- ๐ย ย Edabit
- ๐ย ย Dev Challenges
- ๐ย ย Codewell
- ๐ย ย ICodeThis
- ๐ย ย Mister DA
- ๐ย ย React Challenges
- ๐ย ย Daily React Problems
- ๐ย ย Prepare Frontend
Frontend Deployment Platforms
- ๐ย ย Netlify
- ๐ย ย Vercel
- ๐ย ย Firebase Hosting
- ๐ย ย AWS Amplify
- ๐ย ย GitHub Pages
Browser DevTools
- ๐ย ย Chrome DevTools
- ๐ย ย Firefox Developer Tools
- ๐ฅย ย DevTools Crash Course
DSA resources
- ๐ย ย Grokking Algorithms
- ๐ย ย The Algorithm Design Manual
- ๐ย ย Cracking Coding Interview
- ๐ย ย Javascript Algo
- ๐ย ย DSA Interview Challenges
- ๐ฅย ย Practical Algorithms
- ๐ฅย ย JavaScript Algorithms fundamentals
- ๐ฅย ย JS algorithms and data structures masterclass
DSA youtube
- ๐ฅย ย Adbul Bari
- ๐ฅย ย Take U Forward
- ๐ฅย ย JavaScript Algorithms and Data Structures
- ๐ฅย ย Jenny's Lectures
- ๐ฅย ย Gaurav Sen
- ๐ฅย ย Tushar Roy - Coding Made Simple
Coding platforms
- ๐ย ย Leetcode
- ๐ย ย Hackerrank
- ๐ย ย Interviewbit
Additional Resources
-
๐ย ย JS Party podcast
-
๐ย ย JavaScript 30
-
๐ย ย React Basics
-
๐ย ย FreeCodeCamp React Challange
-
๐ย ย React Coding Challange
-
๐ย ย React by Example
-
๐ย ย React Cheatsheet
-
๐ย ย React Patterns
-
๐ย ย Tao Of React
-
๐ย ย MDN - Front-end Web Dev pathway
-
๐ย ย The React Handbook
-
๐ย ย Vue CheatSheet
This repository is MIT-licensed. Read more