Course Content
Module 1: HTML, CSS, Bootstrap
- HTML Basics:
- Introduction to HTML structure (tags, elements, attributes)
- Semantic HTML (header, footer, article, section)
- Forms and input elements (text, radio, checkbox, select, etc.)
- Media elements (images, videos, and audio)
- Tables and lists (unordered, ordered, and description lists)
- CSS Basics:
- CSS selectors, properties, and values
- Box model (margin, border, padding, content)
- Flexbox and Grid layout systems
- CSS animations and transitions
- Responsive design using media queries
- Bootstrap Framework:
- Setting up Bootstrap in projects
- Grid system and responsive design
- Common components (navbar, cards, modals, alerts)
- Forms with validation
- Customizing Bootstrap themes
- Mini Project: Build a responsive portfolio website.
Module 2: JavaScript and Advanced JavaScript
- JavaScript Basics:
- Execution context, compiler
- Library vs framework
- ECMAS
- Variables (var, let, const)
- Garbage collection & Memory allocation concepts during variable creation and code execution.
- Deep copy
- Data types and type conversions
- Loops (for, while, forEach)
- Functions (function expressions, arrow functions)
- Anonymous function, Closures
- DOM manipulation (selectors, events, creating/updating elements)
- Advanced JavaScript:
- Asynchronous JavaScript: Callback, Promises, async/await
- Fetch API and Axios for HTTP requests
- ES6+ Features: Destructuring, template literals, Modules (import/export), Spread/rest operators, Default and optional parameters
- Object-Oriented JavaScript: Classes and prototypes, Inheritance and encapsulation
- Error handling with try-catch
- Mini Project: Build a dynamic to-do list app with local storage.
Module 3: TypeScript
- Introduction to TypeScript
- Core TypeScript Features:
- Basic types: string, number, boolean, any, unknown
- Arrays, tuples, and enums
- Interfaces and type aliases
- Functions with types (parameters, return types, optional parameters)
- Classes and inheritance
- Advanced TypeScript:
- Generics and utility types
- Decorators
- Type assertions and guards
- Working with third-party TypeScript libraries
- Mini Project: Refactor the to-do list app using TypeScript.
Module 4: React Native Basics
- Introduction to React Native:
- Differences between React and React Native
- Setting up a React Native environment (Expo CLI or React Native CLI)
- Understanding JSX and components
- Understanding the architecture
- Run our first app
- Core Concepts:
- Components (functional, class)
- Props and state
- Data binding
- Event handling in React Native
- Styling in React Native
- Navigation using react-navigation
- Stack Navigator, Tab Navigator, Drawer Navigator
- Handling device permissions (camera, location, storage)
- Setting up app icon and splash screen (android and ios)
- Adding external fonts
- Advanced Concepts:
- Context API for global state management
- Using hooks in React Native (useState, useEffect, useContext)
- Animations using react-native-reanimated and react-native-animatable
- Local storage with AsyncStorage
- Push Notification using firebase FCM
- Mini Project: Make a todo app
Module 5: Node.js with MongoDB Backend
Introduction to Node.js
- Setting up a Node.js project
- Understanding package.json and npm/yarn
- Core modules: fs, path, http
- Setting up an Express server
- Handling routes (GET, POST, PUT, DELETE)
- Middleware and request-response cycle
Mongodb Basics
- Introduction to MongoDB (NoSQL vs SQL)
- Setting up MongoDB locally or using Atlas
- CRUD operations - Insert, find, update, delete (Using mongoose for schema validation)
Connecting Node.js with MongoDB
- Establishing a connection with Mongoose
- Defining models and schemas
- Querying and updating the database
Authentication
- Implementing JWT-based authentication
- Password hashing with bcrypt
Mini Project
- Create a RESTful API for employee add, update, delete, view with login and authentication
Module 6: Basic Project Setup, Execution, and Build
- Project Setup
- Frontend-Backend Integration
- Platform-Specific Features
- Build and Deployment