Apensia Devblog

Project Initialization

Frontend & Backend

Backend

API server for application

++

Create root folder

Create project root folder

mkdir [WHATEVER_NAME_YOU_WANT_FOR_YOUR_APPLICATION]

Downloading NPM packages

npm i express && npm i -D typescript ts-node @types/express nodemon
  1. nodemon: Restarting node application whenever files change.
  2. ts-node: Helps execute Typescript on Node.js without pre-compiling into Javascript.

Initialize server

Create init.ts file in the project root folder

import express, { Application } from "express";
const app: Application = express();
app.listen(4000, () =>
console.log("Server is running on http://localhost:4000")
);

Import alias

Import alias allows us to import external files in neat way. For example,

import someFile from "../../../../middlewares/someDirectory/someFile"; // 👉 Not this
import someFile from "@/middlewares/someDirectory/someFile"; // ✅ But this!

Install packages

npm i -D tsconfig-paths

Modify paths in tsconfig.json

We can designate import aliases by setting paths.

tsconfig.json
{
"compilerOptions": {
"baseUrl": ".",
+
"paths": [
+
"@/*": ["./*"]
]
}
}

Create nodemon.json configuration file

Create nodemon configuration file in the root folder.

nodemon.json
{
"ignore": ["**/*.test.ts", "**/*.spec.ts", ".git", "node_modules"],
"watch": ["src"],
"exec": "node -r tsconfig-paths/register -r ts-node/register ./src/init.ts",
"ext": "ts, js"
}
  1. ignore: Literally ignore changes of files that are specified.
  2. watch: Watch changes of files that are within the specified directories.
  3. exec: Specifying extensions of files.

Modify package.json

Modify the dev command as follows.

package.json
{
"scripts": {
-
"dev": "node -r ts-node/reigster ./src/init.ts"
+
"dev": "nodemon",
},
}

Configuring with MongoDB

Install pacakges

npm i mongoose && npm i -D @types/mongoose dotenv
  1. Mongoose provides a straight-forward, schema-based solution to model in our application data.
  2. dotenv is a zero-dependency module that loads environemtn variables from a .env file into process.env.

Configure dotenv on our init.ts file

Come back to our server initialization file (init.ts) and load dotenv/config.

init.ts
+
import "dotenv/config";
import express, { Application } from "express";
// ...

Add MongoDB URI in .env file

Create .env file in project root folder and put MongoDB URI you created. Usually MongoDB URI will start with mongodb+srv://

.env
MONGODB_URI="mongodb+srv://your_db:your_db_password@your_cluster_name..."

Add .env in .gitignore

Add .env file in .gitignore file for preventing being leaked to the public.

.gitignore
.env

Connect MongoDB URI with our server

Create separate file called db.ts and put code as below.

utils/db.ts
import "dotenv/config";
import mongoose from "mongoose";
const DB_URI =
process.env.NODE_ENV === "development"
? (process.env.DB_URI_DEVELOPMENT as string)
: (process.env.DB_URI_PRODUCTION as string);
const DB_NAME =
process.env.NODE_ENV === "development"
? (process.env.DB_NAME_DEVELOPMENT as string)
: (process.env.DB_NAME_PRODUCTION as string);
mongoose
.connect(DB_URI, { serverSelectionTimeoutMS: 10000, dbName: DB_NAME })
.catch((error: unknown) => console.log("DB connection error 🚨: ", error));
mongoose.connection.on("error", (error: unknown) =>
console.log("DB connection error 🚨: ", error)
);
mongoose.connection.once("open", () =>
console.log("DB connected successfully ✅")
);
  1. I created two different DBs: one for development, and the other one for production.
  2. Mongoose.prototype.connect() allows us to connect our MongoDB URI to our server application.

On this page