DEV Community

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

Posted on

Starting a Basic Express App with Mongoose & TypeScript

#express #typescript #mongoose

✅ 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

Top comments (0)