Course Information
Course Overview
Build 20 mini frontend projects from scratch with HTML5, CSS & JavaScript (No frameworks or libraries)
This is a fun, practical & project based course for all skill levels. The projects in this course are designed to get you building things using HTML5, CSS & JavaScript with no frameworks or libraries. Every project is built from scratch and has some kind of dynamic functionality from small games to an expense tracker to a breathing relax app.
Although this is a project based course, I will still be explaining everything as I go. These are mini-projects designed for you to complete in a few hours.
You should have some basic knowledge of HTML/CSS/JS. If you are brand new, I would suggest my Modern HTML/CSS From The Beginning and/or my Modern JS From The Beginning courses on Udemy. This course is a mix of both.
Some Things You Will Learn In These Projects:
Create Layouts & UI's With HTML/CSS ( No CSS Frameworks )
CSS Animations (Transitions, Keyframes, etc With JS Triggers)
JavaScript Fundamentals
DOM Selection & Manipulation
JavaScript Events (Forms, buttons, scrolling, etc)
Fetch API & JSON
HTML5 Canvas
The Audio & Video API
Drag & Drop
Web Speech API (Syth & Recognition)
Working with Local Storage
High Order Array Methods - forEach, map, filter, reduce, sort
setTimout, setInterval
Arrow Functions
and More!!
Course Content
- 10 section(s)
- 121 lecture(s)
- Section 1 Introduction
- Section 2 1: Form Validator | Intro Project
- Section 3 2: Movie Seat Booking | DOM & Local Storage
- Section 4 3: Custom Video Player | HTML5 Video API
- Section 5 4: Exchange Rate Calculator | Fetch & JSON Intro
- Section 6 5: DOM Array Methods | forEach, map, filter, sort, reduce
- Section 7 6: Menu Slider & Modal | DOM & CSS
- Section 8 7: Hangman Game | DOM, SVG, Events
- Section 9 8: Meal Finder | Fetch & MealDB API
- Section 10 9: Expense Tracker | Array Methods & Local Storage
What You’ll Learn
- Build 20 Frontend Projects From Scratch
- No JS or CSS Frameworks
- Modern JavaScript (ES6+) - Arrows, Fetch, Promises, etc
- DOM Manipulation & Events
- Animations With CSS & JavaScript
- Fetch & JSON With 3rd Party API's
- HTML5 Canvas, Speech API, Audio & Video
- Beginner Friendly
Reviews
-
HHenry Tan
I follow the course and type along. My programming skill has improved. Quite an enriching course.
-
KKishan Patel
Thanks
-
LLawin Paul
dear: sir Brad mouth speak is so clear, easy understand, and he explained all details so structural, but should be make time to practic ,,,,,overall ,it is a good course at all. Thank you ,Udemy academy and Brad,,,. Your: Lawin lawin42600@gmail.com
-
MMahmoud Ahmed
Nice, but the project's idea is not related to the world 100%, I prefer to be 2-3 real-world projects rather than 20 mini.