Starting a Basic Express App with Mongoose & TypeScript
Alifa Ara Heya

Alifa Ara Heya @alifa_ara_heya

About: I document what I learn—mostly to help myself remember. But also, to help others avoid the same mistakes. 😅 Learning Full Stack development.

Joined:
Sep 4, 2024

Starting a Basic Express App with Mongoose & TypeScript

Publish Date: Jul 1
0 0

✅ 1. Initialize Project

Write these commands in your powershell.

mkdir my-app
cd my-app
npm init -y
Enter fullscreen mode Exit fullscreen mode

✅ 2. Install Dependencies

Runtime Dependencies

npm install express mongoose
Enter fullscreen mode Exit fullscreen mode

Development Dependencies

npm i --save-dev @types/express
Enter fullscreen mode Exit fullscreen mode

✅ 3. Create tsconfig.json

Generate the config:

npx tsc --init
Enter fullscreen mode Exit fullscreen mode

Edit tsconfig.json:

{
  "compilerOptions": {
    "rootDir": "./src",
    "outDir": "./dist"
  }
}
Enter fullscreen mode Exit fullscreen mode

✅ 4. Setup Project Structure

my-app/
├── src/
│   ├── app.ts
│   ├── server.ts
│   └── app/        
├── package.json
├── tsconfig.json
└── .gitignore
Enter fullscreen mode Exit fullscreen mode

✅ 5. Add Scripts to package.json

To automatically restart the server whenever you make changes, you can use either ts-node-dev or tsx. This improves your development experience by saving time and effort.

🔧 Option 1: Using ts-node-dev;
Install it as a dev dependency:

npm install --save-dev ts-node-dev
Enter fullscreen mode Exit fullscreen mode

Then, update your package.json scripts:

"scripts": {
  "dev": "ts-node-dev --respawn --transpile-only src/server.ts",
  "test": "echo \"Error: no test specified\" && exit 1"
}
Enter fullscreen mode Exit fullscreen mode

🔧 Option 2: Using tsx;
Install it (either globally or locally as a dev dependency):

tsx- (https://www.npmjs.com/package/tsx)

npm install --save-dev tsx
Enter fullscreen mode Exit fullscreen mode

Then, update your package.json:

"scripts": {
  "dev": "tsx watch --clear-screen=false src/server.ts",
  "test": "echo \"Error: no test specified\" && exit 1"
}
Enter fullscreen mode Exit fullscreen mode

✅ 6. Create .gitignore

node_modules/
dist/
Enter fullscreen mode Exit fullscreen mode

✅ 7. Example Code

src/app.ts

import express, { Application, Request, Response } from 'express';

const app: Application = express();
app.use(express.json())

app.get('/', (req: Request, res: Response) => {
  res.send('Welcome from Note App!');
});

export default app;
Enter fullscreen mode Exit fullscreen mode

src/server.ts

import mongoose from 'mongoose';
import { Server } from 'http';
import app from './app';

let server: Server;
const port = 5000;

async function main() {
  try {
    await mongoose.connect("mongodb+srv://<db_username>:<db_password>@cluster.mongodb.net/todoDB?retryWrites=true&w=majority&appName=Cluster0");
    console.log('✅ Connected to MongoDB using Mongoose');

    server = app.listen(port, () => {
      console.log(`🚀 Server is listening on port ${port}`);
    });
  } catch (error) {
    console.error('❌ Error connecting to MongoDB:', error);
  }
}

main();
Enter fullscreen mode Exit fullscreen mode

✅ 8. Run in Development Mode

npm run dev
Enter fullscreen mode Exit fullscreen mode

Comments 0 total

    Add comment