Step by step guide to becoming a modern frontend developer course.
- [✔] The Basics
- [✔ ] Customizing Visual Studio Code
- [✔ ] Write Code 10x Faster Using Advance Shortcuts
- [✔ ] Emmet's In Visual Studio Code
- [✔] VSC Top Extensions
- [✔] What is Git/GitHub & Why do we need it? | Git Tutorials #1
- [✔] Installing Git + Initial Setup? | Git Tutorials #2
- [✔] Git: Three Stage Architecture | Git Tutorials #3
- [✔] Tracking Our first Git Project | Git Tutorials #4
- [✔] Cloning a Remote Git Repository from GitHub | Git Tutorials #5
- [✔] Git: File Status Lifecycle | Git Tutorials #6
- [✔] .gitignore: Ignoring Files in Git | Git Tutorials #7
- [✔] Git Diff: Showing Changes Between Commits/Staging Area & Working Directory | Git Tutorials #8
- [✔] Git: Skipping The Staging Area | Git Tutorials #9
- [✔] Moving and Renaming Files In Git | Git Tutorials #10
- [✔] Git Log: Viewing & Changing Commits In Git | Git Tutorials #11
- [✔] Unstaging & Unmodifying Files In Git | Git Tutorials #12
- [✔] GitHub: Working with Remote Repositories | Git Tutorials #13
- [✔] Setting Alias In Git | Git Tutorials #14
- [✔] Git: Creating & Switching Branches In Git | Git Tutorials #15
- [✔] Branching & Merging a Production Grade Project | Git Tutorials #16
- [✔] Resolving Merge Conflicts (With Example) | Git Tutorials #17
- [✔] Git Branching Workflow in Production | Git Tutorials #18
- [✔] Pushing Git Branches To Remote Repositories | Git Tutorials #19
- [✔] Welcome and First Steps
- [✔] HTML Fundamentals
- [✔] CSS Fundamentals
- [✔] Layouts: Floats, Flexbox, and CSS Grid Fundamentals
- [✔] Web Design Rules and Framework
- [✔] Components and Layout Patterns
- [✔] Omnifood Project – Setup and Desktop Version
- [✔] Omnifood Project – Responsive Web Design
- [✔] Omnifood Project – Effects, Optimizations and Deployment
- [✔] The End!
- Introduction
- Tailwind Fundamentals - Part 1
- Tailwind Fundamentals - Part 2
- A Better Development Environment
- Tailwind CSS Mini-Projects
- Project 1 - Clipboard Website
- Project 2 - Loopstudios Website
- Project 3 - Shortly Website
- Project 4 - Testimonial Grid Project
- Project 5 - Fylo Website With Color Picker
- [✔] Welcome, Welcome, Welcome!
- [✔] JavaScript Fundamentals – Part 1
- [✔] JavaScript Fundamentals – Part 2
- [✔] How to Navigate This Course
- [✔] Developer Skills & Editor Setup
- [OPTIONAL] HTML & CSS Crash Course
- [✔] JavaScript in the Browser: DOM and Events Fundamentals
- [✔] How JavaScript Works Behind the Scenes
- [✔] Data Structures, Modern Operators and Strings
- [✔] A Closer Look at Functions
- [✔] Working With Arrays
- [✔] Numbers, Dates, Intl and Timers
- [✔] Advanced DOM and Events
- [✔] Object-Oriented Programming (OOP) With JavaScript
- [✔] Mapty App: OOP, Geolocation, External Libraries, and More!
- [✔] Asynchronous JavaScript: Promises, Async/Await, and AJAX
- [✔] Modern JavaScript Development: Modules, Tooling, and Functional
- [✔] Forkify App: Building a Modern Application
- [✔] Setting Up Git and Deployment
- [✔] The End!
- [✔] Getting Started
- [✔] JavaScript Refresher
- [✔] React Basics & Working With Components
- [✔] Time to Practice: Component Basics
- [✔] React State & Working with Events
- [✔] Rendering Lists & Conditional Content
- Styling React Components
- [✔] Debugging React Apps
- [✔] Time to Practice: A Complete Practice Project
- [✔] Diving Deeper: Working with Fragments, Portals & "Refs"
- [✔] Advanced: Handling Side Effects, Using Reducers & Using the Context API
- Practice Project: Building a Food Order App
- [✔] A Look Behind The Scenes Of React & Optimization Techniques
- An Alternative Way Of Building Components: Class-based Components
- [✔] Sending Http Requests (e.g. Connecting to a Database)
- [✔] Building Custom React Hooks
- [✔] Working with Forms & User Input
- [✔] Practice Project: Adding Http & Forms To The Food Order App
- [✔] Diving into Redux (An Alternative To The Context API)
- [✔] Advanced Redux
- [✔] Building a Multi-Page SPA with React Router
- [✔] Adding Authentication To React Apps
- [✔] Deploying React Apps
- Optional: A (Pretty Deep Dive) Introduction to Next.js
- Animating React Apps
- Replacing Redux with React Hooks
- Testing React Apps (Unit Tests)
- Optional: React + TypeScript
- Optional: React Hooks Introduction & Summary
- Optional: React Summary & Core Feature Walkthrough
- [✔] Introduction
- [✔] Setting Up Environment
- [✔] Diving into Material UI Components One By One
- [✔] Form Handling
- [✔] Header Navigation Bar Components
- [✔] Advance Components
- [✔] Advanced Validations With React Hook Form
- [✔] Data Grid
- [✔] Advanced Data Grid With Project
- [✔] Theming and Styling
- [✔] Advance Styling with styled function
- [✔] Dark Mode / Light Mode
- [✔] Icons
- [✔] Grid System
- [✔] Advanced - Responsive Styles
- [✔] GRID Project - Build Responsive Navigation Bar With Material UI
- [✔] (Material UI Official) Responsive Navigation bar With Flexbox
- [✔] Login / Signup Page With Material UI
- [✔] Major Project (Design Modern UI UX Homepage of a Software Application)
- Material UI With Typescript
- A Major Full Stack Project ( Travel Blog Posting Application )
- [✔] Getting Started
- Optional: React Refresher
- NextJS Essentials (App Router)
- Routing & Page Rendering - Deep Dive
- Data Fetching - Deep Dive
- Mutating Data - Deep Dive
- Understanding & Configuring Caching
- NextJS App Optimizations
- User Authentication
- Roundup & Next Steps
- Pages & File-based Routing
- Project Time: Working with File-based Routing
- Page Pre-Rendering & Data Fetching
- Project Time: Page Pre-rendering & Data Fetching
- Optimizing NextJS Apps
- Adding Backend Code with API Routes (Fullstack React)
- Project Time: API Routes
- Working with App-wide State (React Context)
- Complete App Example: Build a Full Blog A to Z
- Deploying NextJS Apps
- Adding Authentication
- Optional: NextJS Summary
- Course Roundup