Frontend Development
Week 1-2: Introduction to Front-end Development and HTML Basics
- Introduction to Front-end Development: Role and Responsibilities
- Basics of HTML: Structure, Tags, Attributes
- Semantic HTML: Importance and Usage
- Creating a Simple Web Page using HTML
- Basics of HTML: Structure, Tags, Attributes
- Semantic HTML: Importance and Usage
- Creating a Simple Web Page using HTML
Week 3-4: Styling with CSS
- Introduction to CSS: Syntax, Selectors, Cascade, Specificity
- CSS Box Model: Margin, Border, Padding
- Layout Techniques: Floats, Flexbox, Grid
- Responsive Web Design Principles
- CSS Box Model: Margin, Border, Padding
- Layout Techniques: Floats, Flexbox, Grid
- Responsive Web Design Principles
Week 5-6: Advanced CSS and Preprocessors
- CSS3 Features: Transitions, Animations, Transformations
- Introduction to CSS Preprocessors (Sass/SCSS): Variables, Mixins, Nesting
- Managing CSS with Modular Approach: BEM, SMACSS
- Introduction to CSS Frameworks (Bootstrap, Foundation)
- Introduction to CSS Preprocessors (Sass/SCSS): Variables, Mixins, Nesting
- Managing CSS with Modular Approach: BEM, SMACSS
- Introduction to CSS Frameworks (Bootstrap, Foundation)
Week 7-8: Introduction to JavaScript
- Basics of JavaScript: Variables, Data Types, Operators
- Control Flow: Conditional Statements, Loops
- Functions and Scope
- Document Object Model (DOM) Manipulation
- Control Flow: Conditional Statements, Loops
- Functions and Scope
- Document Object Model (DOM) Manipulation
Week 9-10: JavaScript Events and Event Handling
- Introduction to JavaScript Events: Click, Hover, Submit, etc.
- Event Handling Techniques: Inline Events, Event Listeners
- Event Propagation: Bubbling and Capturing
- Form Validation and Submission with JavaScript
- Event Handling Techniques: Inline Events, Event Listeners
- Event Propagation: Bubbling and Capturing
- Form Validation and Submission with JavaScript
Week 11-12: Modern JavaScript (ES6+)
- Introduction to ES6+ Features: Arrow Functions, Template Literals, Destructuring
- Modules and Modular JavaScript
- Asynchronous JavaScript: Promises, Async/Await
- Fetch API and AJAX for Asynchronous Data Fetching
- Modules and Modular JavaScript
- Asynchronous JavaScript: Promises, Async/Await
- Fetch API and AJAX for Asynchronous Data Fetching
Week 13-14: Front-end Frameworks (Choose one: React, Vue, Angular)
- Introduction to Front-end Frameworks and Single Page Applications (SPAs)
- Setting Up and Configuring the Chosen Front-end Framework
- Components, Props, and State Management
- Routing and Navigation in SPAs
- Setting Up and Configuring the Chosen Front-end Framework
- Components, Props, and State Management
- Routing and Navigation in SPAs
Week 15-16: Advanced Topics and Capstone Project
- Advanced Topics: State Management Libraries (Redux, Vuex), Server-side Rendering (SSR)
- Capstone Project: Design and develop a real-world front-end application incorporating concepts learned throughout the course
- Project Presentation and Peer Review
- Career Guidance and Interview Preparation for Front-end Developers
- Capstone Project: Design and develop a real-world front-end application incorporating concepts learned throughout the course
- Project Presentation and Peer Review
- Career Guidance and Interview Preparation for Front-end Developers
