Mean Stack Project from Scratch

In this tutorial, we will create a blog application using the MEAN stack – MongoDB, Express.js, Angular, and Node.js. This tutorial is for beginners who want to learn how to build a full-stack application.

Step 1: Setting Up the Environment

First, make sure you have Node.js and npm installed on your machine. You can check if you have them by running the following commands in your terminal:

node --version
npm --version

If you don’t have Node.js or npm installed, you can download and install them from the official Node.js website.

Step 2: Installing Angular and Express

In your project directory, run the following commands to install Angular and Express:

npm install -g @angular/cli
npm install express body-parser cors mongoose

Next, create an Angular project by running the following command:

ng new mean-blog

Step 3: Creating the Backend

Create a new folder called “server” in your project directory. In this folder, create a new file called “server.js” and add the following code:

const express = require('express');
const bodyParser = require('body-parser');
const cors = require('cors');
const mongoose = require('mongoose');

const app = express();
const PORT = 3000;

app.use(bodyParser.json());
app.use(cors());

app.listen(PORT, () => {
  console.log('Server is running on port ' + PORT);
});

Now, run the following command in your terminal to start the server:

node server/server.js

Step 4: Creating the Frontend

Open a new terminal window and navigate to your Angular project directory. Run the following command to start the Angular development server:

ng serve

Now, you can open your browser and navigate to “http://localhost:4200” to see your Angular application running.

Step 5: Connecting to MongoDB

In your server folder, add the following code to connect to MongoDB:

mongoose.connect('mongodb://localhost:27017/blog', {
  useNewUrlParser: true,
  useUnifiedTopology: true
});

Make sure you have MongoDB installed on your machine. You can download and install MongoDB from the official website.

Step 6: Adding Testycodeiz

Lastly, to add Testycodeiz for testing purposes, run the following command in your project directory:

npm install --save-dev testycodeiz

Now you can write tests for your application and run them using Testycodeiz.

Congratulations! You have successfully created a blog application using the MEAN stack. Happy coding!