Learn web development as an absolute beginner
Key Takeaways
Learns web development basics with HTML, CSS, and JS
Original Description
If you're trying to learn how to code, follow this roadmap to learn all the skills that you'll need.
🟢 Learn how to build a website with HTML, CSS, & JS with my course -- https://coder-coder.com/responsive
RECOMMENDED RESOURCES:
🔷 Frontend Mentor Pro -- Practice building real-world projects (20% off 1-yr of Pro with code JESSCHAN20) -- https://www.frontendmentor.io/?via=jesschan
🔷 Boot.dev -- Learn back-end development (25% off) -- https://www.boot.dev/?promo=CODERCODER
🔷 Zero to Mastery -- Learn web dev, AI, DevOps and more with 100+ courses -- https://academy.zerotomastery.io/a/aff_s3xc407h/external?affcode=441520_ti97uk6b
OTHER STUFF:
🟢 Coder Coder Dark -- My VS Code theme -- https://marketplace.visualstudio.com/items?itemName=CoderCoder.codercoder-dark-theme
🟢 Coder Coder Merch -- get my hoodie, coffee cup, and more! -- https://coder-coder.com/merch
_______________________
Want to learn to code? This video will cover a roadmap for beginners, with all the basic web development skills you will need to know.
00:00 Intro
00:50 What is Web Development
01:05 How Websites Work
01:37 Front-End And Back-End
02:43 Code Editor
03:27 Basic Front-End
03:39 HTML
04:13 CSS
04:43 JavaScript
05:02 Tools
05:12 Package Manager
05:51 Build Tools
06:34 Version Control
07:13 Additional Front-End
07:31 Sass
07:56 Responsive Design
08:33 JavaScript Frameworks
10:00 Basic Back-End
10:11 Server
11:08 Programming Language
11:33 Database
_____________________________________
🔽 FOLLOW ME
Twitter -- https://twitter.com/thecodercoder
Instagram -- https://www.instagram.com/thecodercoder
#css #javascript #html
Watch on YouTube ↗
(saves to browser)
Sign in to unlock AI tutor explanation · ⚡30
Playlist
Uploads from Coder Coder · Coder Coder · 12 of 60
1
2
3
4
5
6
7
8
9
10
11
▶
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
How to Make a Super Simple HTML Website [Tutorial]
Coder Coder
How to make an animated sticky header with CSS and JavaScript!
Coder Coder
How to get coding help by researching online
Coder Coder
IG Live - Advice for beginner web developers
Coder Coder
Quick Start Guide to Parcel JS
Coder Coder
Build a responsive website with HTML & CSS - Part 1 [Live Coding]
Coder Coder
Build a custom Linktree page for Instagram with HTML & CSS
Coder Coder
Gulp 4 Crash Course for Beginners
Coder Coder
How to use CSS position to layout a website
Coder Coder
CSS: 4 Reasons Your Z-Index Isn't Working
Coder Coder
Coding a landing page website with HTML & CSS
Coder Coder
Learn web development as an absolute beginner
Coder Coder
How to write media queries in CSS
Coder Coder
How to build a 2-column layout using flexbox | HTML/CSS
Coder Coder
How to build a simple responsive layout with CSS grid
Coder Coder
Write code faster in VS Code with Emmet shortcuts
Coder Coder
How I setup VS Code for a beginners front-end workflow
Coder Coder
How to make a background-image transparent in CSS
Coder Coder
Build a responsive website from scratch with HTML & CSS | Part 1: Navigation bar
Coder Coder
Animated Hamburger Menu in CSS/JS | Build a responsive website from scratch (Part 2)
Coder Coder
Animated mobile menu with CSS/JS | Build a responsive website from scratch (Part 3)
Coder Coder
How to stay motivated when learning to code?
Coder Coder
Responsive hero | Build a responsive website from scratch (Part 4)
Coder Coder
Responsive 4-column layout with flexbox | Build a responsive website from scratch (Part 5)
Coder Coder
Responsive 4-column layout with CSS Grid | Build a responsive website from scratch (Part 6)
Coder Coder
Building a footer using CSS Grid | Build a responsive website from scratch (Part 7)
Coder Coder
Browsersync + Sass + Gulp in 15 minutes
Coder Coder
Responsive card UI with flexbox and hover effects | HTML/CSS
Coder Coder
CSS grid cards with animated hover effect | HTML/CSS
Coder Coder
How I learned to code and landed a job (no CS degree!)
Coder Coder
Building the website for my course (coding timelapse)
Coder Coder
How to debug your code faster 🔥
Coder Coder
Full timelapse + walkthrough of building my website
Coder Coder
Your questions answered!! ✨100K Q&A✨
Coder Coder
Building a pricing block with HTML & PuRe CSS
Coder Coder
Use the Google Maps API to build a custom map with markers
Coder Coder
Building an accordion with HTML, CSS & JS (Part 1)
Coder Coder
How to make your own VS Code theme!
Coder Coder
How to build an accordion with HTML, CSS, and JavaScript (Part 2)
Coder Coder
Life/channel update
Coder Coder
Building a Light/Dark Dashboard, Part 1
Coder Coder
What is NPM, and why do we need it? | Tutorial for beginners
Coder Coder
Building a Node.js app (as a JavaScript noob) | 🔴 LIVE CODING
Coder Coder
Free website project ideas for your portfolio #shorts
Coder Coder
How to add quickly emojis on Windows #shorts
Coder Coder
Building a Light/Dark Dashboard, Part 2
Coder Coder
Learn to code with these 4 free resources! #shorts
Coder Coder
Learn flexbox with these 4 resources! #shorts
Coder Coder
[Typing sound] Comparing mechanical vs regular keyboard
Coder Coder
Building a Light/Dark Dashboard, Part 3
Coder Coder
what making web development tutorials is really like 😅 #shorts
Coder Coder
Generate website starter files with just one command!
Coder Coder
emojis in code
Coder Coder
Stay motivated when coding: don't compare yourself with others #shorts
Coder Coder
Building a Light/Dark Dashboard, Part 4
Coder Coder
Coding motivation: slow and steady wins the race 🐢🏁
Coder Coder
Sass @import is being replaced with @use and @forward
Coder Coder
Coding motivation tip: keep your goal in mind
Coder Coder
How do websites work?
Coder Coder
Building a Light/Dark Dashboard, Part 5
Coder Coder
More on: HTML & CSS
View skill →Related Reads
Chapters (21)
Intro
0:50
What is Web Development
1:05
How Websites Work
1:37
Front-End And Back-End
2:43
Code Editor
3:27
Basic Front-End
3:39
HTML
4:13
CSS
4:43
JavaScript
5:02
Tools
5:12
Package Manager
5:51
Build Tools
6:34
Version Control
7:13
Additional Front-End
7:31
Sass
7:56
Responsive Design
8:33
JavaScript Frameworks
10:00
Basic Back-End
10:11
Server
11:08
Programming Language
11:33
Database
🎓
Tutor Explanation
DeepCamp AI