CourseFlix

Advanced CSS & JavaScript Projects

15h 24m 29s
English
Paid

Master CSS and JavaScript by creating real projects! Enhance your skills by developing practical applications such as a quiz, an expense tracker, and a podcast player. Through this course, you will learn to create responsive designs, integrate APIs, and deploy fully functional applications. Acquire the essential skills to build interactive web applications that will capture the attention of employers and elevate your career prospects!

Course Overview

This course focuses on hands-on learning by engaging you in the development of real-world projects. By the end, you will have a comprehensive portfolio showcasing your ability to tackle various web development challenges.

What You Will Learn

Responsive Design

Understand the principles of responsive web design to ensure your applications look great on any device.

API Integration

Learn how to connect your applications with external APIs, allowing them to fetch and display real-time data.

Application Deployment

Gain the ability to deploy fully functional applications so they are accessible to users and potential employers.

Projects You'll Build

  • Quiz Application: Create an interactive quiz application that dynamically updates and provides instant feedback.
  • Expense Tracker: Build a tool to help users monitor their spending, complete with category filters and history tracking.
  • Podcast Player: Develop a feature-rich podcast player that fetches and streams episodes from various channels.

Benefits of the Course

  • Practical Experience: Engage directly with code and projects, enhancing your real-world understanding.
  • Interactive Learning: Benefit from interactive exercises that reinforce theoretical knowledge.
  • Portfolio Development: Leave with a unique portfolio that highlights your skills and ability to prospective employers.

Get Started Today!

Join the Advanced CSS & JavaScript Projects course now, and embark on a journey to advance your web development skills. Create stunning, interactive, and efficient applications that meet industry standards.

Additional

https://github.com/JacintoDesign

About the Author: Zero To Mastery

Zero To Mastery thumbnail

Zero To Mastery (ZTM) is a Toronto-based online coding academy founded by Andrei Neagoie, originally a senior developer at large Canadian tech firms before turning to teaching full-time. The academy's signature is the cohort-based bootcamp track combined with a deep self-paced course library, all aimed at career-changers and self-taught developers preparing to land software-engineering roles at top companies.

The instructor roster has grown well beyond Andrei to include other senior practitioners: Daniel Bourke (machine learning), Aleksa Tešić (DevOps), Jacinto Wong, and others. Courses cover the full software-engineering career path: web development with React and Next.js, Python, machine learning and deep learning, DevOps and cloud, system design, mobile, and the algorithm / data-structure interview prep that gates engineering jobs.

The CourseFlix listing under this source carries over 120 ZTM courses spanning that full range. Material is paid; ZTM itself runs on a monthly / annual membership model. The teaching style favours long-form, project-based courses where students build complete portfolio-quality applications rather than disconnected feature tutorials.

Watch Online 81 lessons

This is a demo lesson (10:00 remaining)

You can watch up to 10 minutes for free. Subscribe to unlock all 81 lessons in this course and access 10,000+ hours of premium content across all courses.

View Pricing
0:00
/
#1: Course Introduction
All Course Lessons (81)
#Lesson TitleDurationAccess
1
Course Introduction Demo
02:24
2
Introduction
05:02
3
Mac / Linux Device Setup
05:35
4
Windows Device Setup
06:58
5
VSCode Setup & Template
19:27
6
VSCode Extensions
09:11
7
DevTools
13:57
8
GitHub
14:34
9
Overview
02:09
10
Main UI
10:40
11
Shuffle & Generate Text JS
10:47
12
Keyboard Input JS (Part 1)
14:50
13
Keyboard Input JS (Part 2)
06:36
14
Timer & Calculate Score JS
13:44
15
Reset Test JS
10:50
16
Overview
02:41
17
Page Elements UI
13:36
18
Color Variables UI
12:24
19
Table Styling UI
08:56
20
Pagination & Toggle UI
08:16
21
Table Mobile UI
10:03
22
Dark Mode JS
09:00
23
Fetch Users JS
16:46
24
Pagination JS
09:15
25
Sorting JS
18:59
26
Overview
03:22
27
Form Elements UI
09:07
28
Form Styling UI
13:42
29
Date & Expenses Setup JS
10:56
30
Submit & LocalStorage JS
15:15
31
Chart Functionality JS
16:42
32
Overview
04:02
33
Postman - Node
06:35
34
Trivia & Pantry API Overview
13:05
35
Pantry Proxy API (Part 1)
06:17
36
Pantry Proxy API (Part 2)
13:58
37
Pantry Proxy API (Part 3)
13:00
38
Vercel Deployment
08:40
39
Quiz Box UI
17:11
40
High Score UI
12:57
41
Populate Questions & Choices JS
17:01
42
Check Answer JS
11:05
43
Timer & Score JS
17:20
44
End Game JS (Part 1)
13:01
45
End Game JS (Part 2)
06:38
46
Overview
06:42
47
Podcast Index API
13:18
48
Node Install - Github Repo
08:41
49
Install NPM - Run Express
12:21
50
Server.js API Call (Part 1)
10:45
51
Server.js API Call (Part 2)
12:51
52
Font, Background, Nav UI
11:46
53
Containers UI
15:12
54
Search Container UI
14:47
55
Loader UI
06:45
56
Cards Container UI
16:29
57
Player UI
17:29
58
Queue UI
14:32
59
Mobile Navigation UI
19:59
60
Mobile Player UI
10:16
61
Mobile Search UI
15:48
62
Blisk
13:24
63
Exercise: Imposter Syndrome
02:57
64
Search Container JS (Part 1)
10:09
65
Search Container JS (Part 2)
16:13
66
Search Results JS
12:09
67
Podcast Cards JS
15:45
68
Episodes API JS
11:38
69
Episode Cards JS
17:40
70
Lazy Load Images JS (Part 1)
12:14
71
Lazy Load Images JS (Part 2)
10:07
72
Player JS (Part 1)
12:33
73
Player JS (Part 2)
11:38
74
Player JS (Part 3)
16:28
75
Mobile Container UI
04:02
76
Queue JS (Part 1)
08:39
77
Queue JS (Part 2)
12:12
78
PWA Manifest
11:20
79
PWA Service Worker
18:26
80
Render Deployment
11:22
81
Thank You!
01:18
Unlock unlimited learning

Get instant access to all 80 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.

Learn more about subscription

Course content

81 lessons · 15h 24m 29s
Show all 81 lessons
  1. 1 Course Introduction 02:24
  2. 2 Introduction 05:02
  3. 3 Mac / Linux Device Setup 05:35
  4. 4 Windows Device Setup 06:58
  5. 5 VSCode Setup & Template 19:27
  6. 6 VSCode Extensions 09:11
  7. 7 DevTools 13:57
  8. 8 GitHub 14:34
  9. 9 Overview 02:09
  10. 10 Main UI 10:40
  11. 11 Shuffle & Generate Text JS 10:47
  12. 12 Keyboard Input JS (Part 1) 14:50
  13. 13 Keyboard Input JS (Part 2) 06:36
  14. 14 Timer & Calculate Score JS 13:44
  15. 15 Reset Test JS 10:50
  16. 16 Overview 02:41
  17. 17 Page Elements UI 13:36
  18. 18 Color Variables UI 12:24
  19. 19 Table Styling UI 08:56
  20. 20 Pagination & Toggle UI 08:16
  21. 21 Table Mobile UI 10:03
  22. 22 Dark Mode JS 09:00
  23. 23 Fetch Users JS 16:46
  24. 24 Pagination JS 09:15
  25. 25 Sorting JS 18:59
  26. 26 Overview 03:22
  27. 27 Form Elements UI 09:07
  28. 28 Form Styling UI 13:42
  29. 29 Date & Expenses Setup JS 10:56
  30. 30 Submit & LocalStorage JS 15:15
  31. 31 Chart Functionality JS 16:42
  32. 32 Overview 04:02
  33. 33 Postman - Node 06:35
  34. 34 Trivia & Pantry API Overview 13:05
  35. 35 Pantry Proxy API (Part 1) 06:17
  36. 36 Pantry Proxy API (Part 2) 13:58
  37. 37 Pantry Proxy API (Part 3) 13:00
  38. 38 Vercel Deployment 08:40
  39. 39 Quiz Box UI 17:11
  40. 40 High Score UI 12:57
  41. 41 Populate Questions & Choices JS 17:01
  42. 42 Check Answer JS 11:05
  43. 43 Timer & Score JS 17:20
  44. 44 End Game JS (Part 1) 13:01
  45. 45 End Game JS (Part 2) 06:38
  46. 46 Overview 06:42
  47. 47 Podcast Index API 13:18
  48. 48 Node Install - Github Repo 08:41
  49. 49 Install NPM - Run Express 12:21
  50. 50 Server.js API Call (Part 1) 10:45
  51. 51 Server.js API Call (Part 2) 12:51
  52. 52 Font, Background, Nav UI 11:46
  53. 53 Containers UI 15:12
  54. 54 Search Container UI 14:47
  55. 55 Loader UI 06:45
  56. 56 Cards Container UI 16:29
  57. 57 Player UI 17:29
  58. 58 Queue UI 14:32
  59. 59 Mobile Navigation UI 19:59
  60. 60 Mobile Player UI 10:16
  61. 61 Mobile Search UI 15:48
  62. 62 Blisk 13:24
  63. 63 Exercise: Imposter Syndrome 02:57
  64. 64 Search Container JS (Part 1) 10:09
  65. 65 Search Container JS (Part 2) 16:13
  66. 66 Search Results JS 12:09
  67. 67 Podcast Cards JS 15:45
  68. 68 Episodes API JS 11:38
  69. 69 Episode Cards JS 17:40
  70. 70 Lazy Load Images JS (Part 1) 12:14
  71. 71 Lazy Load Images JS (Part 2) 10:07
  72. 72 Player JS (Part 1) 12:33
  73. 73 Player JS (Part 2) 11:38
  74. 74 Player JS (Part 3) 16:28
  75. 75 Mobile Container UI 04:02
  76. 76 Queue JS (Part 1) 08:39
  77. 77 Queue JS (Part 2) 12:12
  78. 78 PWA Manifest 11:20
  79. 79 PWA Service Worker 18:26
  80. 80 Render Deployment 11:22
  81. 81 Thank You! 01:18

Related courses

  • Zero to Full Stack Hero thumbnail

    Zero to Full Stack Hero

    Sources: PAPA React (Sonny Sangha)
    PAPA React presents.. Zero to Full Stack Hero. It's NOT just another COURSE. It's the world's BEST COMMUNITY.
    101 hours 29 minutes 59 seconds 5 / 5
  • JavaScript Error Handling thumbnail

    JavaScript Error Handling

    Sources: Vue School
    Master the art of creating reliable and maintainable JavaScript applications with our comprehensive course on error handling. You will learn professional...
    54 minutes 59 seconds
  • CSS Animations & Transitions thumbnail

    CSS Animations & Transitions

    Sources: Level Up Tutorials (Scott Tolinski)
    Welcome to the CSS Transitions course. In this course, you will not only learn the basic techniques, but also dive deeply into creating animations and transitio
    2 hours 9 minutes 35 seconds 5 / 5

Frequently asked questions

What is Advanced CSS & JavaScript Projects about?
Master CSS and JavaScript by creating real projects! Enhance your skills by developing practical applications such as a quiz, an expense tracker, and a podcast player. Through this course, you will learn to create responsive designs…
Who teaches Advanced CSS & JavaScript Projects?
Advanced CSS & JavaScript Projects is taught by Zero To Mastery. You can find more courses by this instructor on the corresponding source page.
How long is Advanced CSS & JavaScript Projects?
Advanced CSS & JavaScript Projects contains 81 lessons with a total runtime of 15 hours 24 minutes. All lessons are available to watch online at your own pace.
Is Advanced CSS & JavaScript Projects free to watch?
Advanced CSS & JavaScript Projects is part of CourseFlix's premium catalog. A CourseFlix subscription unlocks the full video player; the course description, table of contents, and preview information are available to everyone.
Where can I watch Advanced CSS & JavaScript Projects online?
Advanced CSS & JavaScript Projects is available to watch online on CourseFlix at https://courseflix.net/course/advanced-css-javascript-projects. The page hosts every lesson with the integrated video player; no download is required.