Mean Stack Development

Course Detail
hop-mean-stack.jpeg-lahore

MEAN STACK WEB DEVELOPER

Course Outline

  • Introduction of MEAN Stack
    • What is MEAN?
    • What is a Single Page Application (SPA)?
    • How does the MEAN Stack Work?
    • Installing Node and the Angular CLI
    • Installing the IDE
  • The Angular Frontend – Understanding the Basics
    • Module Introduction
    • Understanding the Folder Structure
    • Understanding Angular Components
    • Adding our First Component
    • Listening to Events
    • Outputting Content
    • Getting User Input
    • Installing Angular Material
    • Adding a Toolbar
    • Outputting Posts
    • Diving into Structural Directives
    • Creating Posts with Property & Event Binding
    • Creating a Post Model
    • Adding Forms
    • Getting Posts from Post-Create to Post-List
    • Calling GET Post
  • Adding NodeJS
    • Module Introduction
    • Connecting Node and Angular
    • What is a Restful API?
    • Adding the Node Backend
    • Adding the Express Framework
    • Improving the server.js Code
    • Fetching Initial Posts
    • Using the Angular HTTP Client
    • Understanding CORS
    • Adding the POST Backend Point
    • Adding Angular
  • Working with MongoDB
    • Module Introduction
    • What is MongoDB?
    • Comparing SQL & NoSQL?
    • Connecting Angular to a Database
    • Setting up MongoDB
    • Adding Mongoose
    • Understanding Mongoose Schemas & Models
    • Creating a POST Instance
    • Connecting our Node Express App to MongoDB
    • Storing Data in a Database
    • Fetching Data from a Database
    • Transforming Response Data
    • Deleting Documents
    • Updating the Frontend after Deleting Posts
    • Adding Posts with an ID
  • Enhancing the App
    • Module Introduction
    • Adding Routing
    • Styling Links
    • Client-Side vs Server-Side Routing
    • Creating the “edit” Form
    • Finishing the Edit Feature
    • Updating Posts on the Server
    • Re-Organizing Backend Routes
    • Adding Loading Spinners
  • Adding Image Uploads
    • Module Introduction
    • Adding the File Input Button
    • Converting the Form from a Template Driven to a Reactive Approach
    • Adding Image Controls to Store the Image
    • Adding an Image Preview
    • Starting with the Mime-Type Validator
    • Finishing the Image Validator
    • Adding Server-Side Upload
    • Uploading Files
    • Working with the File URL
    • Fetching Images on the Frontend
    • Updating Posts with images
  • Adding Pagination
    • Module Introduction
    • Adding the Pagination Component
    • Working on the Pagination Backend
    • Connecting the Angular Paginator to the Backend
  • Adding User Authentication
    • Module Introduction
    • Adding the Login Input Fields
    • Handling User Input
    • Adding the Signup Screen
    • Creating the User Model
    • Creating a New User Upon Request
    • Connecting Angular to the Backend
    • Understanding SPA Authentication
    • Implementing SPA Authentication
    • Sending the Token to the Frontend
    • Adding Middleware to Protect Routes
    • Adding the Token to Authenticate Requests
    • Improving the UI Header to Reflect the Authentication Status
    • Improving the UI Messages to Reflect the Authentication Status
    • Connecting the Logout Button to the Authentication Status
    • Redirecting Users
    • Adding Route Guards
    • Reflecting the Token Expiration in the UI
    • Saving the Token in the Local Storage
  • Authorization
    • Module Introduction
    • Adding a Reference to the Model
    • Adding the User ID to Posts
    • Protecting Resources with Authorization
    • Passing the User ID to the Frontend
    • Using the User ID on the Frontend
  • Authorization
    • Module Introduction
    • Adding the Pagination Component
    • Working on the Pagination Backend
    • Connecting the Angular Paginator to the Backend
  • Handling Errors
    • Module Introduction
    • Testing Different Places to Handle Errors
    • The Error Interceptor
    • Displaying the Basic Error Dialog
    • Adding an Error Dialog
    • Returning Error Messages on the Server
  • Optimizations
    • Module Introduction
    • Using Controllers
    • Separating the Middleware
    • Creating an Angular Material Module
    • Splitting the App into Feature Modules
    • Fixing an Update Bug
    • Creating the Auth Module
    • Adding Lazy Loading
    • Using a Global Angular Config
    • Using Node Environment Variables
  • Deploying App

Day & Timing

  • Duration 3 Month, 5 Days a Week
    2 Hrs Daily

Fee

  • Rs. 10000