Week 1 – 3
Advanced HTML, CSS, Javascript, Git Advanced, Command-Line, Bootstrap and jQuery
Week 7 – 9
NPM Introduction to NodeJS, Webpack, Babel, React, Redux, Advance Data Structures and Algorithms I
Week 13 – 15
Express.js, Node, MongoDB, Testing – Jasmine/Jest
Week 4 – 6
SASS & LESS, Advanced Javascript, ES6, and Basic Data Structures
Week 10 – 12
React Hooks, Materialize, React Native, React Testing, Jest and Advance Data Structures and Algorithms II
Week 16 – 18
Heroku, Netlify, Coding Challenges, Technical Interview Workshop, Salary Negotiation Workshop, Live Projects, Hiring Day
Duration: 80 hours
Cost: $750/course
(excluding any certification cost)
Curriculum
Node JS
- Process Model
- Modules
- Rest APIs
- CLI application
- Web sockets
- File system
- NPM framework
- Important Node libraries
Express JS
- Rest APIs
- Routing
- Cookies
- Session
- Authentication and authorization
- Error routing
- JWT
- Mongoose – MongoDB ORM
- Sequlilize – SQL ORM
MongoDB
- Installation & setup
- Mongo queries and CRUD
- Replication & Sharding
Introduction to React
- What is React?
- Why React?
- React version history
- React 16 vs React 15
- Using create-react-app
- Anatomy of react project
Templating using JSX
- Expressions
- Using logical operators
- Specifying attributes
- Specifying children
- Fragments
Components
- Significance of component architecture
- Functional components
- Class based components
- Pure components
- Component Composition
Working with state and props
- What is state and it significance
- Read state and set state
- Passing data to component using props
- Validating props using prop Types
- Supplying default values to props using default Props
Rendering lists, Event handling, Life cycle methods
- Using react key prop
- Using map function to iterate on arrays to generate elements
- Understanding React event system
- Understanding Synthetic event
- Passing arguments to event handlers
- Understand the lifecycle methods
Working with forms and context
- Controlled components
- Uncontrolled components
- Understand the significance to default Value prop
- Using react ref prop to get access to DOM element
- What is context
- When to use context
- Create Context
- Context.Provider
- Context.Consumer
- Reading context in class
Code-Splitting
- What is code splitting
- Why do you need code splitting
- React.lazy
- Suspense
- Route-based code splitting
Working with hooks
- What are hooks
- Why do you need hooks
- Different types of hooks
- Using state and effect hooks
- Rules of hooks
React routing
- Setting up react router
- Understand routing in single page applications
- Working with Browser Router and Hash Router components
- Configuring route with Route component
- Using Switch component to define routing rules
- Making routes dynamic using route params
- Working with nested routes
- Navigating to pages using Link and Nav Link component
- Redirect routes using Redirect Component
- Using Prompt component to get consent of user for navigation
- Path less Route to handle failed matches
Flux, Redux, Sagas and Promises
- Unidirectional data flow using flux
- What is React Redux
- Why React Redux
- Install and setup
- Presentational vs Container components
- Understand high order component
- Understanding mapStateToProps and mapDispatchtToProps usage
- Why redux middleware
- Available redux middleware choices
- What is redux saga
- Install and setup redux saga
- Working with Saga helpers
- Sagas vs promises
Introduction to Unit testing
- Understand the significance of unit testing
- Unit testing react components with Jest
- Unit testing react components with enzyme Introduction to Server side rendering
- What is server-side rendering (SSR)?
- Why SSR?
- Develop express JS app to serve SSR powered react app
Other topics
- Introduction to animations using react
- Build and deploy process
JS concepts
- Variables – Primitive and Non-primitives
- Arrays, Objects and Functions
- Logic and Control Structures
- Bind, Call and Apply
- Function Execution, Variable Scope, Closures, Hoisting
- Callbacks
- Bugs and Error Handling
- DOM handling
- Array, String, Math, Date functions
- Ajax
- ES6, ES7 changes
Getting Started with Angular
- What is Angular
- CLI Deep Dive
- Project Setup and First App
- The course Structure
- What is TypeScript
- A basic setup of Bootstrap for Styling
The Basics of Angular
- How an Angular App gets loaded and started
- Components
- Creating new Component
- Understanding Component Templates
- Understanding the role of AppModule and Component Declaration
- Understanding Component Styles
- Understanding Component Selector
Databinding & Directive Concepts
- What is Databinding
- String Interpolation
- Property Binding
- Property Binding vs String Interpolation Event Binding
- Bindable Properties and Events
- Passing and Using Data using Event Binding Two-Way Binding
- Forms Module and Two Way Binding
- Understanding Directives
- Using ngIf and Else Conditions
- Using ngStyle for Styling Angular App
- Applying css Class dynamically with ngClass Displaying Lists using ngFor
Advanced Component and Databinding
- Dividing the App into multiple components
- Property and Event Binding deep dive
- Binding to custom properties
- Binding to custom events
- View Encapsulation
- Understanding Local Reference inside Templates Getting Access to the templates using @ViewChild. Exploring Component Life Cycle
- Life cycle hooks deep dive
Advance Directive Concepts
- Creating a basic custom attribute directive
- Understanding HostListener and HostBinding Binding to Directive’s Properties
- Building Structural Directives Exploring ngSwitch Understanding Services and Implementing Dependency Injection
- Why Services are required
- Creating a Service
- Injecting the service into components
- Understanding Dependency Hierarchical Injector Injecting a Service into other services
Routing in Angular
- Understanding the need of a Router Setting Up and implementing Routes Navigating to Router Links
- Understanding Router Paths
- Styling Active Router Links
- Understanding Navigation Paths
- Styling Router Links
- Navigating Dynamically
- Using Relative Paths
- Passing Parameters to Routes and fetching route parameters Fetching route parameters in a Reactive Way
- Passing query parameters and fragments
- Understanding Nested Routes
- Redirecting and Wildcard routes
- Redirection Path Matching
- Outsourcing the Route Configuration Introduction to Guards
- Understanding can activate
- Understanding can Activate Child
- Understanding can deactivate
- Passing Static Data to a Route
- Understanding Resolve Guard
- Exploring Location Strategies
- Preloading, Lazy loading
Observables in Angular
- Understanding built-in Angular Observable Creating Observables
- Using a Custom observable
- Unsubscribe
- Using Subjects to pass and Listen to Data Understanding Observable Operators Forms in Angular
Forms in Angular
- Need of Angular’s help
- Template Driven vs Reactive Approach Template Driven Approach
- Reactive Form Approach Reactive: Creating a Form in Code Reactive: Submitting the form Reactive: Adding Validation Reactive: Getting Access to Controls Reactive: Grouping Controls
- Reactive: FormArray
- Reactive: Custom Validators Reactive: Exploring Error Codes Reactive: Custom Async Validator
Exploring Pipes in Angular
- Using Pipes
- Parameterizing Pipes
- Chaining Multiple Pipes
- Creating a custom Pipe
- Pure & Impure Pipes
- Understanding the Async Pipe
Making HTTP Requests in Angular
- Introduction & how HTTP request works in SPAs Sending POST Request
- Adjusting request headers
- Sending GET requests
- Sending PUT Requests
- Response with observable operators
- Catching HTTP errors
- Using the async pipe with HTTP Requests
- Custom Event binding using components and directives
- Angular animations
- Augury introduction
- Unit tests introduction
- Building End to end app using angular frontend and Node backend