Web Development with HTML & CSS – Full Course for Beginners

Channel:
United States freeCodeCamp.org
Subscribers:
10,700,000
Published on ● Video Link: https://www.youtube.com/watch?v=dX8396ZmSPk


Duration: 19:42:12
61,583 views
2,706

This course is an in-depth introduction to web development with HTML and CSS for complete beginners.

We'll start with HTML and CSS basics, dive into some advanced concepts, and learn about Git, GitHub, and cloud deployment using Vercel. We'll also explore mobile-first responsive design, the Bootstrap CSS framework, and the Express web application framework.

You'll solve coding assignments on building a web page from a mockup, creating a responsive mobile-first website, and crafting a scientific calculator. For the final project, you will build your personal portfolio website and deploy it to the cloud!

✏️ This course is designed and taught by Aakash N S, CEO and co-founder of Jovian. Check out their YouTube channel here: https://youtube.com/@jovianhq

⭐️ Contents & Code ⭐️
⌨️ (00:00:00) Introduction
⌨️ (00:00:34) Lesson 1 - HTML and CSS Basics
https://jovian.com/sydney/html-and-css-basics
⌨️ (02:14:15) Lesson 2 - Advanced HTML and CSS
https://jovian.com/aakashns/advanced-html-and-css
⌨️ (04:42:24) Assignment 1 - Design Mockup to Web Page
https://jovian.com/aakashns/design-mockup-to-web-page
⌨️ (06:47:59) Lesson 3 - Version Control and Cloud Deployment
https://jovian.com/sydney/version-control-and-cloud-deployment
⌨️ (08:59:42) Lesson 4 - Responsive Design and CSS Flexbox
https://jovian.com/aakashns/responsive-design-and-css-frameworks
⌨️ (11:32:24) Assignment 2 - Mobile-First Responsive Web Design
https://jovian.com/aakashns/mobile-first-responsive-design
⌨️ (12:31:43) Lesson 5 - Bootstrap CSS Framework
https://jovian.com/aakashns/bootstrap-css-framework
⌨️ (14:56:51) Assignment 3 - Build a Scientific Calculator
https://jovian.com/aakashns/build-a-scientific-calculator
⌨️ (16:34:34) Lesson 6 - Express Web Application Framework
https://jovian.com/sydney/express-web-application-framework
⌨️ (18:30:21) Project - Build Your Personal Website
https://jovian.com/aakashns/build-your-personal-website
⌨️ (19:00:35) Course Recap

🎉 Thanks to our Champion and Sponsor supporters:
👾 davthecoder
👾 jedi-or-sith
👾 南宮千影
👾 Agustín Kussrow
👾 Nattira Maneerat
👾 Heather Wcislo
👾 Serhiy Kalinets
👾 Justin Hual
👾 Otis Morgan
👾 Oscar Rahnama

--

Learn to code for free and get a developer job: https://www.freecodecamp.org

Read hundreds of articles on programming: https://freecodecamp.org/news



Other Videos By freeCodeCamp.org


2023-11-20Go Programming Tutorial – 3 Beginner Projects
2023-11-20Learn LangChain.js - Build LLM apps with JavaScript and OpenAI
2023-11-16Master Technical Interviews – Full Course
2023-11-14PaLM 2 API Course – Build Generative AI Apps
2023-11-14Become a Great Engineering Manager – Course
2023-11-10Azure Solutions Architect Expert Certification Course (AZ 305) – Pass the Exam!
2023-11-07Arduino Course for Everybody
2023-11-07Create a Store with WordPress and AI Tutorial – Real AI-Generated Products
2023-11-06Next.js Authentication - AuthJS / NextAuth for Role-Based Security
2023-11-03Java Web App with Quarkus and JPAStreamer – Tutorial
2023-11-02Web Development with HTML & CSS – Full Course for Beginners
2023-11-01Create and Deploy Websites and IaC by Chatting with AI
2023-10-30Kotlin & Android Development Course: Build a Quiz Application
2023-10-26Algorithmic Trading – Machine Learning & Quant Strategies Course with Python
2023-10-25MySQL Course for Beginners
2023-10-24Harvard CS50 (2023) – Full Computer Science University Course
2023-10-23Pytest Tutorial – How to Test Python Code
2023-10-20Next.js, Tailwind CSS, and MongoDB Project Tutorial – Ticketing App
2023-10-19Front End Developer Roadmap 2024
2023-10-18AI SaaS Chat Bot using MERN Stack – Tutorial
2023-10-16Godot Tutorial for Unity Developers (and other beginners)