Approach to Create Summarizer Website 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()
• Create controllers folder which will define the methods required for servicing various routes
• Create models folder to create the database schema for summarized-text and user
• Create router folder and mention all the routes related to user login, register, getting and adding summarized text and deleting the summarized text
• 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
• Two collections are created – summarized-text, user
• Implement the core logic of creating the summary, getting the summarized text and user authentication
• Test the API endpoints using postman

Frontend:

• Create a new angular project
• Create components folder and seperate components for seperate routes
• 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
• Test the frontend application in browser at https://localhost:3000

This article aims to develop a project using MEAN stack which will work as a summarizer website. MEAN stack technologies include MongoDB, AngularJS, NodeJS, and Express. It will give you a thorough understanding of how to create a MEAN stack application end to end from backend to frontend including the user authentication feature.

Output Preview: Let us have a look at how the final output will look like.