Frontend Beginner
The Fundamentals
HTML, CSS
HTML and CSS are the two fundamental basic blocks of web (other two being JS, and the recenrlt developed WebAssembly).
A simple tutorial should be good enough to get you going. Dont' spend more than an hour on each of these.
Exercise - HTML, CSS
- Exercise 1 (HTML/CSS) - Build a Hostel-Admission Form
- Exercise 2 (HTML/CSS) - Build an Ecommerce Product Card
- Exercise 3 (HTML/CSS) - Fun with Flags
JS - Language
Learn the basics and fundamentals of JavaScript langugage
Learn about Functions, Objects and Arrays
JS - DOM
Learn how JavaScript is used to add various functionality in the web-page, effectively making it what's called a Web-App now a days.
Exercise - JS Language, DOM
- Exercise 4 (JS Language, DOM) - BMI Calculator
- Exercise 5 (JS Language, DOM) - Build TicTacToe Game
JS - WebAPIs, Fetch
JS - Routing
Exercise - WebAPIs, Fetch, Routing
- Exercise 6 (JS WebAPIs, Fetch, Routing) - Build a Music Player
JS - Debugging and Developer's Tools
Advance
Routing wihtout loading new doc
State Management
Frameworks - VueJS
Projects
Instructions -
TODO - Reminder to self to create a full-stack project template
Use continous integration and deployment, and hosting tools
Project 1 - Pokemon Fandom World
Project 2 - Video-Streaming-Site
Project 3 - Dictionary
Implement Dictionary in a web-app. Project statement here