A template of a MEAN stack web app written in TypeScript.
Run Mongo DB. Express app connects to mean-ts-dev
database by default.
If you use Docker, you can run the following container:
docker run --detach --publish 27017:27017 --name mongo-ts-dev mongo
Express app listens on port 3000
.
npm install
npm start
Angular app is served on port 4200
and its calls to localhost:4200/api
are proxied to localhost:3000/api
.
cd ng
npm install
npm start
Head to http://localhost:4200 to see the app.
Express app is written in TypeScript and transpiled files are placed in dist/
. The entry point of the app is www.js
module. It runs the transpiled JS files in dist/
.
# Watch TS files in "src/", transpile and copy them to "dist/"
npm run build:watch
# Watch JS files in "dist/"
npm run nodemon
If you use Visual Studio Code, there are configurations to help you with debugging the app.
- Open app in VS Code
- Press
Ctrl + Shift + B
(Run Default Build Task) to watch TS files in "src/" and transpile them in background - Press F5 to debug TS files
If you use Visual Studio Code, there are configurations to help you with debugging the app.
- Open directory
ng/
in VS Code - Install Debugger for Chrome extension
- Press
Ctrl + Shift + B
(Run Default Build Task) to runng serve
in background - Press F5 to debug
Mongo Db connection string could be set in config files or as APP_MONGO
environment variable.
If an app configuration is available both in a file and as environment variable, environment variable wins.
The build.js
script is used to build the app for production.
Script builds Express app and places files in dist/
. It then builds Angular app and places the files in dist/public/
. Express serves them as static files.
# build both apps. output files to dist/
node build.js
# run production build
node bin/www.js
App is ready to be deployed on Heroku. Add the following environment variables in application settings:
NPM_CONFIG_PRODUCTION
:false
APP_MONGO
:mongodb://<dbuser>:<dbpassword>@abc.mlab.com:51799/foo-db