MEAN Stack Development
MEAN stands for MongoDB, Express, Angular and Node, a combination of document database programs and JavaScript software that allows developers to build dynamic websites and applications. Being a MEAN stack developer allows you to use each of these four open-source programs to develop for both the back-end (server side) and front-end (client or user side). MEAN stack developers are sought-after as they have in-demand development and IT skills.
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
- What is MEAN
- What is Single Page Application (SAP)?
- How Does the MEAN Stack Work?
- Installing Node & the Angular CLI
- Installing our IDE
- Exploring the Project Structure
-
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 Mode
-
Adding Forms
-
Getting Posts from Post-Create to Post-Lis
-
Calling GET Post
-
More About Observables
- 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 Post
-
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
Module6: Adding Image uploads to App
- Module Introduction
- Adding the File Input Button
- Converting the Form from a Template Driven to a Reactive Approach13:41
- 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
- Wrap Up
Module7: Adding the Pagination
- Module Introduction
- Adding the Pagination Component
- Working on the Pagination Backend
- Connecting the Angular Paginator to the Backend
- Fetching Posts Correctly
- Finishing Touches
Module8: 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
- Module Introduction
- Adding a Reference to the Model
- Adding the User ID to Posts
- Changed Mongoose Syntax
- Protecting Resources with Authorization08:19
- 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
Who this course is for:
- This course is for everyone interested in putting existing Angular and NodeJS knowledge into action
- If you’re familiar with the basics of Angular and NodeJS, this course provides a detailed guide on how to connect both technologies
- Everyone interested in building a modern, full-stack application
- Students who want to exercise with their NodeJS and Angular skills will find a great opportunity to do so
Prerequisites:
- Basic NodeJS/Express and Angular Experience is strongly recommended
- You should be familiar with HTML, CSS and JavaScript basics, too
- MongoDB (+ Mongoose) knowledge is a plus as MongoDB will be used in this course but won’t be subject of in-depth explanations
- NO expert or advanced knowledge on any of these topics is required or assumed
International student Fee: 500 USD
Job Interview Preparation (Soft Skills Questions & Answers)
- Tough Open-Ended Job Interview Questions
- What to Wear for Best Job Interview Attire
- Job Interview Question- What are You Passionate About?
- How to Prepare for a Job Promotion Interview
🎥 Your FREE eLEARNING Courses (Click Here)
Internships, Freelance and Full-Time Work opportunities
Flexible Class Options
- Week End Classes For Professionals SAT | SUN
- Corporate Group Trainings Available
- Online Classes – Live Virtual Class (L.V.C), Online Training
Related Courses
Complete Web development Bootcamp with React JS