Front-End Development Course Timetable
Week 1-2: HTML & CSS Basics
- HTML: Learn structure, tags, attributes, lists, tables, and forms.
- CSS: Learn selectors, box model, flexbox, layout, positioning, colors, typography, simple animations.
- Practice: Create basic web pages and a simple portfolio layout.
Week 3-4: Advanced CSS and Responsive Design
- CSS Grid and Flexbox for advanced layouts.
- Media Queries for responsive design.
- CSS Preprocessors (SCSS/SASS basics).
- Practice: Build a multi-page responsive website (e.g., portfolio or blog).
Week 5-6: JavaScript Basics
- JavaScript fundamentals: Variables, data types, operators, loops, functions, arrays.
- DOM Manipulation: Selecting, modifying, and interacting with HTML elements.
- Events and basic interactions: Handling user events.
- Practice: Build components like a modal, dropdown, or calculator.
Week 7-8: Advanced JavaScript
- ES6+ Features: Arrow functions, promises, async/await, destructuring, modules.
- APIs and Asynchronous JavaScript: Fetching JSON data from APIs.
- Basic Functional Programming: Using map, filter, reduce.
- Practice: Build a weather app or news app using APIs.
Week 9-10: Frameworks and Libraries (React Basics)
- Introduction to React: Components, props, and state.
- React Fundamentals: JSX, hooks, lifecycle methods.
- Practice Project: Build a to-do list or weather dashboard as a Single Page Application.
Week 11-12: Advanced React & Final Project
- React Router and State Management (Context API or Redux).
- Project Deployment: Use GitHub Pages, Netlify, or Vercel.
- Capstone Project: Build a full-fledged front-end app (e.g., e-commerce store, movie database).
Additional Tips
- Version Control with Git and GitHub.
- UI/UX Basics: Spacing, colors, typography.
- JavaScript Debugging with DevTools.
