arrow_back
Welcome, course introduction
Welcome to the courses
Course items
Learning items - Next JS
Download the guides
Get your certificate
HTML, CSS intro and mastery
html1- Introduction to HTML, CSS, Web dev
html2- All about HTML - tags, sections, important info
html3- HTML forms, tables, and more
html4- Metatags in HTML
html5- Templates and projects to make
css-1 - Introduction to CSS mastery
css-2 - Important tags in CSS
css-3 - Master flexbox
css-4 - Master images CSS
Javascript intro and mastery
js1-Intro to JS
js2-Variables, loops, functions
js3-Basic weather app in JS and AI tools
js4-Async, await example 2
js5-Understanding closures and other JS topics
js6-Learning debouncing
js7-Error handling and checking Claude for JS
js7-Mastering V0 and AI tools for Javascript
js8-conditional-rendering
JS in detail
3 . Comments
4. Variables
5 . Implicit Type Conversion
7 . Arithmetic Operator
8 . Incr _ Dec
9 . Comparison Operator
10 . == vs ===
11. Logical Operator
12 . Conditional _ if , if else , nested if
13. else if
14 . Switch
15 . Loop _ for , while , do while
16 . Functions
17. Array
18 . map function
20 . push , unshift
21 . splice
22 . slice
23 . For in For OF
24 . Multidimensional Array
25 . copy
26 . Destruct
27 . objects
28 . Objects Inside Array
React JS intro and mastery
react1 - Introduction to React JS
react2 - Structure, installation, overview
react3 - Build lots of landing pages
react4 - JSX mastery
react5 - Different components and reusing
react6 - Props - Children and parent
react7 - Hooks intro
react8 - Hooks mastery and interview prep
react9 - Conditional rendering and making projects
State management
state-management-2-examples
State-management-1-intro
state-management-3-example
state-manaegent-4-ecommerce
[Essentials] HTML, CSS, JS, React One Shot
Master HTML Essentials Crash Course for Quick Learning
Master CSS Essentials Crash Course for Quick Learning
Master JS Beginners Essentials Crash Course for Quick Learning
Mastering React JS Essentials_ Secrets Revealed __ Crash Course for Quick Learning
HTML MASTERY
0 something important
1 overview
2 what is html
3 editor
4 First Program
5 tags in capital or small
6 easy way to make structure
7 heading
8 elements
9 paragraph
10 line break
11 hr tag
12 pre
13 bold
14 strong
15 italics
16 emprasized
17 underline
18 small
19 mark
20delete
21 insert
22 subscript
23 superscript
24 blockquote cite
25 quotations
26 abbriviation
27 address
28 cite
29 bdo
30 comments
31 links
31 links attribute
32 parent , tp
33 absolute vs relative
34 link with title
35 image
36 src
37 alternate
38 favicon
39 what is table
40 table tag
41 explanation
42 not so important
43 vertical tables
44 colspan
45 rowspan
46 ol and ul
47 dl
48 ordered type
49 block
50 inline
51 div
52 span
53 iFrame
54 File Path
55 head and meta
56 code
57 keyboard
58 sample
59 pre
60 var
61 section
62 article
63 header
64 footer
65 nav
66 aside
67 symbol
68 video
69 video attribute
70 audio
71 youtube
72 Forms
73 selects
74 select size
75 textarea
76 button
77 fieldset
78 more on inputs
CSS Mastery
0 Overview
1 what and why css
2 css folder
3 external , internal , inline
4 comments
5 selectors
6 universal selector
7 grouped selector
8 color
9 rgba
10 hex
11 hex short
11 hex short 2
12 hsl
13 hsla
14 backgrounds
15 borders
16 box model
17 margin padding
18 outline
19 text
20 vertical align
21 text decoration
22 tranform
23 more on text
24 text shadow
25 fonts
26 Links
27 lists
28 more on list
29 tables
30 block inline
31 none,hide
32 . Display
33 . FlexBox
34 . Media Query
35 . Grid
36 . Transform
37 . Box Sizing
Next JS - introduction
1 - Introduction to Next JS
2 - Building real landing pages with AI
3 - Use templates and build fast
4 - Using AI, V0, and docs to learn
5 - Structure and layouts
6 - Mastering layouts through docs
7 - Data fetching and streaming
8 - Fullstack apps with Firebase, Supabase
9 - Fullstack apps with Next JS and mongo db
10 - Full stack apps with Next JS and Vercel DB
[Bonus projects] React JS projects
[React project 1] - BMI Calculator
[React project 2] - Calculator App
[React project 3] - Expense Tracker
[React project 4] - Shopping Cart
[React project 5] - To Do App
[React project 6] - Weather App
Frontend Development with NEXT JS
Check the new project added
Next JS part 1 - Project Structure , App Routing and Routing
Next JS part 2 - Client vs Server side Rendering
Next JS part 3 - Fetching Data with 2 Examples
Next JS part 4 - Dynamic Router, Dynamic Fetching
Next JS part 5 - CSR vs SSR vs SSG vs ISR - Next JS 13.5+
Next JS backend in detail
1 _ Express JS vs Next JS
2 _ Creating Next App
3 _ Api Route and Route Handler
4 _ Nested routes
5 _ Dynamic Route, Static Data, Postman
6 _ Advanced routing Url params
7 _ CRUD operation
8 _ Restful API with fetch
9 _ Redirect using Middleware
10 _ Nextjs and MongoDB with Contact From
Next JS backend quick run through
Next JS part 6- Next vs Express, Api route and Route Handle
Next JS part 7 - Multiple Route, Dynamic Routes, Working with Static Data
Next JS part 8 - Query params, Crud Operation
[#1 Next JS project] - Authentication with Next JS
Learn Authentication with Next Auth
nextauth-main
[#2 Next JS project] - Build a Next JS 14 Dashboard : Frontend + Backend + Next Auth + Server Action
Next JS dashboard part 1 - Project Overview, Setup, Sidebar
Next JS dashboard part 2 - Complete UI Navbar (use client, Link, usepathname)
Next JS dashboard part 3 - Build a transactions page
Next JS dashboard part 4 - Create users and products in UI
Next JS dashboard part 5 - Add users and add products in DB
Next JS dashboard part 6 - View users and view products (dynamic route)
Next JS dashboard part 7 - Connect to MongoDB (fetching from DB)
Next JS dashboard part 8 - Create a Login form (UI only)
Next JS dashboard part 9 - Dynamic routing using MongoDB
Next JS dashboard part 10 - Server Actions explained (Add users and products)
Next JS dashboard part 11 - Delete and update features - UI and DB
Next JS dashboard part 12 - Implement authentication - Login and logout
[Zip code file] next14-dashboard-main
[#3 Next JS project] - Build a LinkedIn clone in Next JS
Full stack LinkedIn clone in Next JS (complete pdf guide)
LinkedIn app part 1 - Introduction and Project setup
LinkedIn app part 2 - UI setup
LinkedIn app part 3 - Authentication and Responsiveness
LinkedIn app part 4 - Sidebar and Feed pages
LinkedIn app part 5 - Database and Models
LinkedIn app part 6 - Creating and displaying posts
LinkedIn app part 7 - Advanced features and caching
LinkedIn app part 8 - Interactions and Deployment
linkedin-clone-main
[Quick projects] - Build AI full stack apps with Next JS
AI projects bundle (complete pdf guides)
[Full stack AI project] Build an AI news app with RSS feeds, Next JS, and Chat GPT API
[Full stack AI project] Build an animated video generator with AI, Next JS, Chat GPT, Replicate
[Full stack AI project] Build an AI content app with Next JS, Tailwind CSS, and Chat GPT API
[Full stack AI project] Build AI music generator with Leap AI, Next JS, Vercel
[Full stack AI project] Build an AI app with Leap AI
[Full stack AI project] Make a tweet generator with AI_ Next JS and Replicate
[Full stack AI project] Build a project with Youtube + Open AI API
[Full stack AI project] Build a poem generator with AI - Next JS, Facebook AI, Llama
[Full stack AI project] Build an AI app with Leap AI
[Full stack AI project] Build a project with Youtube + Open AI API
[Quick projects] - Use Free Next JS Templates
Next JS template - Introduction
Next JS template - Boilerplate
Next JS template - Linktree clone
Next JS template - AI photo app
Next JS template - Stripe supabase subscription
Next JS template - App router
Next JS template - Liveblocks apps
Next JS template - Enterprise code
Next JS template - Video course apps
[Project guide] - Build a Trello clone with Next JS
Part 1 - How to build Trello clone using Next JS (Beginner) - pdf guide
Part 2 - How to build Trello clone using Next JS (Intermediate)
Trello-clone-master [zip code file]
Videos coming soon!
[Project guide] - Build a Job portal using Next JS
Build an Job portal using Next JS & Typescript with admin dashboard (complete pdf guide)
Code zip file
Videos coming soon!
[Project guide] - Build an AI traveling app
Build a Traveling AI application with HTML, CSS, JS, React, Chat GPT API, and more!
Traveling app - zip code file
Code snippet
[Project guide] - Build a link in bio (linktree) app with Next JS
How to create link in bio for developers in Next JS - guide
Complete PDF guide (download)
Link in bio app [zip code file]
Videos coming soon!
[Project guide] - Build a code to image converting app like carbon
Live demo of the project
How to Build Code to Image Converter in Next JS
Source code
Videos coming soon!
[Project guide] - Build a DSA problem solving platform
How to create DSA Solving platform in Next JS
Daily DSA questions