Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Zero To Mastery

Advanced CSS & JavaScript Projects

via Zero To Mastery

Overview

Master CSS and JavaScript by building real-world projects like a quiz game, expense tracker, and podcast player. Learn responsive design, API integration, and deploying full-stack apps. Build your skills to create interactive web applications that get you hired!
  • How to create responsive websites using CSS and media queries
  • Dynamic content manipulation with JavaScript and DOM interactions
  • Design and style modern UI elements with CSS
  • Build interactive features like quizzes and expense trackers
  • Fetch and use live data with API integration
  • Store and retrieving data with local storage
  • Deploy full-stack applications with platforms like Vercel and Render
  • Visualize data with tools like Chart.js for dynamic charts

Syllabus

  •   Introduction
    • Advanced CSS & JavaScript Projects
    • Exercise: Meet Your Classmates and Instructor
    • Course Resources
    • ZTM Plugin + Understanding Your Video Player
    • Set Your Learning Streak Goal
  •   Developer Setup
    • Introduction
    • Mac / Linux Device Setup
    • Windows Device Setup
    • VSCode Setup & Template
    • VSCode Extensions
    • DevTools
    • GitHub
  •   Typing Test
    • Overview
    • Main UI
    • Shuffle & Generate Text JS
    • Keyboard Input JS (Part 1)
    • Keyboard Input JS (Part 2)
    • Timer & Calculate Score JS
    • Reset Test JS
    • Let's Have Some Fun (+ More Resources)
  •   Table Example
    • Overview
    • Page Elements UI
    • Color Variables UI
    • Table Styling UI
    • Pagination & Toggle UI
    • Table Mobile UI
    • Dark Mode JS
    • Fetch Users JS
    • Pagination JS
    • Sorting JS
    • Unlimited Updates
  •   Expense Tracker
    • Form Elements UI
    • Overview
    • Form Styling UI
    • Date & Expenses Setup JS
    • Submit & LocalStorage JS
    • Chart Functionality JS
  •   Quiz Game
    • Overview
    • Postman - Node
    • Trivia & Pantry API Overview
    • Pantry Proxy API (Part 1)
    • Pantry Proxy API (Part 2)
    • Pantry Proxy API (Part 3)
    • Vercel Deployment
    • Quiz Box UI
    • High Score UI
    • Populate Questions & Choices JS
    • Check Answer JS
    • Timer & Score JS
    • End Game JS (Part 1)
    • End Game JS (Part 2)
    • Course Check-In
  •   Podcast Player
    • Overview
    • Podcast Index API
    • Node Install - Github Repo
    • Install NPM - Run Express
    • Server.js API Call (Part 1)
    • Server.js API Call (Part 2)
    • Font, Background, Nav UI
    • Containers UI
    • Search Container UI
    • Loader UI
    • Cards Container UI
    • Player UI
    • Queue UI
    • Mobile Navigation UI
    • Mobile Player UI
    • Mobile Search UI
    • Blisk
    • Note on Blisk
    • Exercise: Imposter Syndrome
    • Search Container JS (Part 1)
    • Search Container JS (Part 2)
    • Search Results JS
    • Podcast Cards JS
    • Episodes API JS
    • Episode Cards JS
    • Lazy Load Images JS (Part 1)
    • Lazy Load Images JS (Part 2)
    • Player JS (Part 1)
    • Player JS (Part 2)
    • Player JS (Part 3)
    • Mobile Container UI
    • Queue JS (Part 1)
    • Queue JS (Part 2)
    • PWA Manifest
    • PWA Service Worker
    • Render Deployment
    • Note on Cron-Jobs
    • Implement a New Life System
  •   Where To Go From Here?
    • Thank You!
    • Review This Course!
    • Become An Alumni
    • Learning Guideline
    • ZTM Events Every Month
    • LinkedIn Endorsements

Taught by

Jacinto Wong

Reviews

Start your review of Advanced CSS & JavaScript Projects

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.