Mean Stack
Home Courses Offering Mean Stack
- Introduction about the MEAN Stack
- What is MEAN?
- What is Single Page Application?
- How does the MEAN Stack works?
- Installing Node & Angular CLI
- Installing Visual Studio Code
- Exploring the Project Structure
- 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
- More About Observables
- Working on our Form
- Section Resources
- Module Introduction
- Connecting Node & Angular - Theory
- 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
- Module Introduction
- What is MongoDB?
- Comparing SQL & NoSQL
- Connecting Angular to a Database
- Setting Up MongoDB
- Using MongoDB Atlas & IP Whitelist
- 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
- Module Introduction
- Adding Routing
- Styling Links
- Client Side vs Server Side Routing
- Possible Error
- Creating the "edit" Form
- Finishing the Edit Feature
- Updating Posts on the Server
- Re-Organizing Backend Routes
- Adding Loading Spinners
- 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
- Beware of the Spread (...) Operator
- Fetching Images on the Frontend
- Updating Posts with Images
- Module Introduction
- Adding the Pagination Component
- Working on the Pagination Backend
- Connecting the Angular Paginator to the Backend
- Fetching Posts Correctly
- Finishing Touches
- 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
- 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
- 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
- Finishing Touches
- 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
- Fixing the AuthGuard
- Using a Global Angular Config
- Using Node Environment Variables
- Module Introduction
- Deployment Options
- Deploying the REST API
- Deploying the REST Api
- Deploying Angular
- Angular Deployment - Finishing the Two App Setup
- Using the Integrated Approach
What you'll learn
- Build real Angular + NodeJS applications
- Understand how Angular works and how it interacts with Backends
- Connect any Angular Frontend with a NodeJS Backend
- Use MongoDB with Mongoose to interact with Data on the Backend
- Use ExpressJS as a NodeJS Framework
- Provide a great user experience by using Optimistic Updating on the Frontend
- Improve any Angular (+ NodeJS) application by adding Error Handling
