Approach to Create Address Book using MEAN Stack

Backend:

• Set up a new node js project
• Set up the server using express with CORS as the middleware in file server.js
• Create the app instance using const app = express()
• Twilio a cloud communication platform used to send or receive text message which can help developers to implement the multi-factor authentication functionality.
• Set up a twilio account and get the configuration details
• Create controllers folder which will define the API methods
• Create models folder to create the database schema for user
• Create router folder and mention all the routes related to user login, register and verify for checking the code entered by user
• Set up local Mongo DB database.
• Set up the connection to local Mongo DB in server.js file
• Create collections within the database to store and retrieve the data from database
• One collection is created – user
• Create .env files for storing the environment variables for config details related to twilio account, database and port
• Implement the core logic of register, login and generation and verification of the code
• Test the API endpoints using postman

Frontend:

• Create a new angular project
• Create components folder and seperate components for seperate routes – user component for login and register functionality and verify component for verification code feature
• Create HTML, CSS and ts files for all the components
• Create service to establish communication between frontend and backend routes
• Create various routes in app.routes.ts folder for login, register and verify
• Test the frontend application in browser at https://localhost:3000

Multi-factor authentication is important and common in every website or app to securely login the user. In this article, we will see how we can implement Multi-factor authentication using MEAN Stack. MEAN Stack includes the use of Angular for frontend, Node JS and Express for backend, and MongoDB as the database.

Project Preview: