frontend-learning-kit

[!NOTE] Ace your Frontend UI coding interview rounds with Frontend Mini Challenges for free

Frontend resources/materials

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
• 📗  Web Dev Performance
• 📗  Google Dev - Performance
• 📗  Smashing Magezine - Performance
• 🎥  Web Performance Fundamentals

Web Security

• 🎥  Web Security

Accessibility

• 🎥  Accessibility in JavaScript Applications
• 🎥  Develop Accessible Web Apps with React

JS Design Patterns

• 📗  Modern Web App Design Patterns
• 📘  JS Design Patterns
• 📁  Design Patterns for Humans

JS Best practices

• 📘  Refactoring JavaScript
• 🎥  Writing Clean Code
• 🎥  JavaScript unit testing
• 📘  The art of unit testing
• 🎥  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
• 🚉  I Code This
• 🚉  Mister DA
• 🚉  React Challenges
• 🚉  Daily React Problems
• 🚉  Prepare Frontend

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

License

This repository is MIT licensed. Read more