moizkachwala/angular2-express-mongoose-gulp-node-typescript

AngularJS 2 (Updated to 4.2.0) Mean Stack application which uses Angular2, Gulp, Express, Node, MongoDB (Mongoose) with Repository Pattern Business Layer

[ Angular2 Updated to 4.2.0 ]

Angular2 MEAN - QuickStart application with ExpressJS, MongoDB, Gulp and Typescript (Repository Pattern)

##Introduction

Basic Angular seed application created with Quick start application (Tour of Heroes) given on angular website. It uses ExpressJS along with Mongo DB support (Mongoose) via a wrapper of Repository Pattern as Business layer. It also uses Gulp for running task and TsLint.The seed application is built over node and uses latest node packages.

https://angular2-express-mongoose.herokuapp.com/

Prerequisites

1. Latest version of Node to be installed.
2. Install MongoDB and make sure it is running on default port 27017 (if not then please configure constants.ts and change the connection for mongoDB).

Global packages

    npm install ts-node -g
    npm install typescript-node -g

Steps to Run

    npm install          <= install all the npm Dependencies
    npm run build        <= build and compile the dest folder
    npm run deploy       <= start the Nodemon and watch for changes.

Directory Structure

angular2-MEAN
    ├── node_modules
    ├── client
    │    ├── app
    │    │    ├── Components
    │    │    │    ├── dashboard
    │    │    │    │    ├── dashboard.component.css
    │    │    │    │    ├── dashboard.component.html
    │    │    │    │    ├── dashboard.component.ts
    │    │    │    ├── heroDetail
    │    │    │    │    ├── hero-detail.component.css
    │    │    │    │    ├── hero-detail.component.html
    │    │    │    │    ├── hero-detail.component.ts    
    │    │    │    ├── heroes
    │    │    │    │    ├── heroes.component.css
    │    │    │    │    ├── heroes.component.html
    │    │    │    │    ├── heroes.component.ts    
    │    │    ├── models
    │    │    │    ├── hero.ts
    │    │    ├── services
    │    │    │    ├── hero.service.ts            <= Hero Service for fetching api
    │    │    ├── app.component.css
    │    │    ├── app.component.ts
    │    │    ├── app.html
    │    │    ├── app.module.ts
    │    │    ├── app.routing.ts
    │    │    ├── main.ts
    │    ├── typings
    │    ├── index.html
    │    │    ├── systemjs.config.js
    │    ├── tsconfig.json
    │    ├── typings.json
    ├── server
    │    ├── src
    │    │    ├── app
    │    │    │    ├── business                    <= business logic for application
    │    │    │    │    ├── common
    │    │    │    │    │    ├── Read.ts           <= common Read method
    │    │    │    │    │    ├── Write.ts          <= common Write method
    │    │    │    │    ├── interfaces
    │    │    │    │    │    ├── HeroBusiness.ts
    │    │    │    │    ├── BaseBusiness.ts
    │    │    │    │    ├── HeroBusiness.ts
    │    │    │    ├── dataAccess
    │    │    │    │    ├── schemas
    │    │    │    │    │    ├── HeroSchema.ts    <= Hero Schema for MongoDB
    │    │    │    │    ├── DataAccess.ts         <= Connection with MongoDB
    │    │    │    ├── model
    │    │    │    │    ├── interfaces
    │    │    │    │    │    ├── HeroModel.ts
    │    │    │    │    ├── HeroModel.ts
    │    │    │    ├── repository
    │    │    │    │    ├── interfaces
    │    │    │    │    │    ├── Read.ts
    │    │    │    │    │    ├── Write.ts
    │    │    │    │    ├── BaseRepository.ts
    │    │    │    │    ├── HeroRepository.ts
    │    │    ├── config
    │    │    │    ├── constants
    │    │    │    │    ├── constants.ts         <= Constants - mongodb connection string.
    │    │    │    ├── routes
    │    │    │    │    ├── HeroRoutes.ts        <= Hero API Routes like get,post,put,delete
    │    │    │    │    ├── Routes.ts            <= fetching all appliction routes here
    │    │    ├── controller
    │    │    │    ├── interfaces
    │    │    │    │    ├── ReadController.ts
    │    │    │    │    ├── WriteController.ts
    │    │    │    ├── BaseController.ts         <= Base Repository controller
    │    │    │    ├── HeroController.ts
    │    │    ├── server.ts
    │    ├── typings
    │    ├── tsconfig.json
    │    ├── tsconfig.json
    ├── gulpfile.ts                              <= gulp tasks : clean, build, compile, run.
    ├── LICENSE
    ├── package.json
    ├── README.md
    ├── tsconfig.json
    ├── tslint.json
    

Features (Angular2, Express, Gulp, MongoDB, Node)

1. Angular 2 Quick Start application (Tours of Hero) from https://angular.io/docs/ts/latest/quickstart.html
2. Added support for Gulp so that js files are moved out of the app folder.
3. It will create a dist folder where it will place all the js files.
4. Gulp will monitor for the changes via help of watcher.
5. Created folder structure for easy access of components, services and models.
6. Applied tslint for avoiding any typos.
7. Implemented best practices recomended on the Angular 2 website.
8. Implemented Express Server to Host API's
9. Added MongoDB support to communicate our Heroes data to Database
10. Implemented Repository Pattern to communicate with Mongoose.

Api Document (from MongoDB)

1. getAll    http://localhost:3000/api/heroes             <= get all heroes
1. getById   http://localhost:3000/api/heroes/:id         <= get hero by Id
2. post      http://localhost:3000/api/heroes             <= create hero
2. put       http://localhost:3000/api/heroes/:id         <= update hero
2. delete    http://localhost:3000/api/heroes/:id         <= delete hero

Dependencies

1. Angular 2
2. TypeScript
3. Gulp
4. ExpressJS
5. NodeJS
6. Nodemon
7. TsLint
8. MongoDB

License

MIT

angular2-express-mongoose-gulp-node-typescript's Issues

Decrease request during loading.

Hi, you can see that it performs 80 requests during its load. Is it possible to reduce this number of requests? To increase the loading speed. Thank you!!

when I update the file, website doesn't work

when i run these commands first time, everything goes well.

npm install
npm run build
npm run deploy

but, when I change the file client/app/app.component.ts like this: set the value of title property to 'Hello world', and save it. There are errors happened.

To solve this issue, how should I do? Thank you.

---

the content of npm-debug.log is as follows:

0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/Cellar/node/7.4.0/bin/node',
1 verbose cli   '/usr/local/bin/npm',
1 verbose cli   'run',
1 verbose cli   'deploy' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'predeploy', 'deploy', 'postdeploy' ]
5 info lifecycle [email protected]~predeploy: [email protected]
6 silly lifecycle [email protected]~predeploy: no script for predeploy, continuing
7 info lifecycle [email protected]~deploy: [email protected]
8 verbose lifecycle [email protected]~deploy: unsafe-perm in lifecycle true
9 verbose lifecycle [email protected]~deploy: PATH: /usr/local/lib/node_modules/npm/bin/node-gyp-bin:/Users/anjia/GitHub/master0810/node_modules/.bin:/usr/local/bin:/usr/local/bin:/Library/Frameworks/Python.framework/Versions/3.5/bin:/usr/bin:/bin:/usr/sbin:/sbin:/usr/local/bin
10 verbose lifecycle [email protected]~deploy: CWD: /Users/anjia/GitHub/master0810
11 silly lifecycle [email protected]~deploy: Args: [ '-c',
11 silly lifecycle   'concurrently --kill-others "gulp watch" "node ./dist/server/bin/www"' ]
12 silly lifecycle [email protected]~deploy: Returned: code: 1  signal: null
13 info lifecycle [email protected]~deploy: Failed to exec deploy script
14 verbose stack Error: [email protected] deploy: `concurrently --kill-others "gulp watch" "node ./dist/server/bin/www"`
14 verbose stack Exit status 1
14 verbose stack     at EventEmitter. (/usr/local/lib/node_modules/npm/lib/utils/lifecycle.js:279:16)
14 verbose stack     at emitTwo (events.js:106:13)
14 verbose stack     at EventEmitter.emit (events.js:191:7)
14 verbose stack     at ChildProcess. (/usr/local/lib/node_modules/npm/lib/utils/spawn.js:40:14)
14 verbose stack     at emitTwo (events.js:106:13)
14 verbose stack     at ChildProcess.emit (events.js:191:7)
14 verbose stack     at maybeClose (internal/child_process.js:885:16)
14 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
15 verbose pkgid [email protected]
16 verbose cwd /Users/anjia/GitHub/master0810
17 error Darwin 15.6.0
18 error argv "/usr/local/Cellar/node/7.4.0/bin/node" "/usr/local/bin/npm" "run" "deploy"
19 error node v7.4.0
20 error npm  v4.1.1
21 error code ELIFECYCLE
22 error [email protected] deploy: `concurrently --kill-others "gulp watch" "node ./dist/server/bin/www"`
22 error Exit status 1
23 error Failed at the [email protected] deploy script 'concurrently --kill-others "gulp watch" "node ./dist/server/bin/www"'.
23 error Make sure you have the latest version of node.js and npm installed.
23 error If you do, this is most likely a problem with the angular2-express-mongo package,
23 error not with npm itself.
23 error Tell the author that this fails on your system:
23 error     concurrently --kill-others "gulp watch" "node ./dist/server/bin/www"
23 error You can get information on how to open an issue for this project with:
23 error     npm bugs angular2-express-mongo
23 error Or if that isn't available, you can get their info via:
23 error     npm owner ls angular2-express-mongo
23 error There is likely additional logging output above.
24 verbose exit [ 1, true ]

Error running: npm run build

After running npm install, when running "npm run build" the following error occurs:

I have on my computer:
Node 6.6.0
NPM 3.10.3

Thanks!

how to use scss

how can i use scss in project?

Build issue

I am getting build error.

I created dist folder even i am getting below error.

Error: Cannot find module 'D:\Angularjs2\Angular2-expressjs-mongoose-
-node-typescript\dist\server\server.js'
at Function.Module._resolveFilename (module.js:325:15)
at Function.Module._load (module.js:276:25)
at Function.Module.runMain (module.js:441:10)
at startup (node.js:139:18)
at node.js:968:3
[14:39:31] [nodemon] app crashed - waiting for file changes before starting

Fails to run

Hi

I followed you instructions to run the project and I get multiple "error TS2300: Duplicate identifier" errors when I run "npm run build".

Running "npm run deploy" gives me the following errors:
npm ERR! Darwin 15.5.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "deploy"
npm ERR! node v4.6.0
npm ERR! npm v3.10.7
npm ERR! code ELIFECYCLE
npm ERR! [email protected] deploy: concurrent --kill-others "gulp watch" "node ./dist/server/bin/www
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the [email protected] deploy script 'concurrent --kill-others "gulp watch" "node ./dist/server/bin/www'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the angular2-express-mongo package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! concurrent --kill-others "gulp watch" "node ./dist/server/bin/www
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs angular2-express-mongo
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls angular2-express-mongo
npm ERR! There is likely additional logging output above.

Screenshots attached.

Thanks for your help.

Cannot find module server.js

I get error when I try to run npm start. Did I miss a step some how?

c:\work\angular\pricecompare1>npm start

[email protected] start c:\work\angular\pricecompare1
concurrent --kill-others "gulp watch" "gulp start"

[1] [09:27:55]
[0] [09:27:55]
[1] Requiring external module ts-node/register
[0] Requiring external module ts-node/register
1 fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
0 fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
[1] [09:27:56]
[1] Using gulpfile c:\work\angular\pricecompare1\gulpfile.ts
[1] [09:27:56] Starting 'start'...
[1] [09:27:56]
[1] Finished 'start' after 1.82 ms
[1] [09:27:56] [nodemon] 1.10.0
[1] [09:27:56] [nodemon] to restart at any time, enter rs
[1] [09:27:56] [nodemon] watching: .
[1] [09:27:56] [nodemon] starting node dist/server/server.js
[0] [09:27:56]
[0] Using gulpfile c:\work\angular\pricecompare1\gulpfile.ts
[0] [09:27:56]
[0] Starting 'watch'...
[0] [09:27:56]
[0] Finished 'watch' after 34 ms
[1] module.js:442
[1] throw err;
[1] ^
[1]
[1] Error: Cannot find module 'c:\work\angular\pricecompare1\dist\server\server.js'
[1] at Function.Module._resolveFilename (module.js:440:15)
[1] at Function.Module._load (module.js:388:25)
[1] at Module.runMain (module.js:575:10)
[1] at run (bootstrap_node.js:352:7)
[1] at startup (bootstrap_node.js:144:9)
[1] at bootstrap_node.js:467:3
[1] [09:27:57] [nodemon] app crashed - waiting for file changes before starting...

Ts files updated automatically generates no js files in the directory server

When I create or modify a .ts in the "client" directory file automatically js in the dist/client directory files are updated, but when you edit or create a new ts file in the "server" directory, the files "js" in the dist/server directory they are not updated or generated automatically; only to run the "npm run build" command;
How I can solve this problem? thank you very much!

Error -> SyntaxError: Unexpected token <

Hello, I wanted to know if you could help me, every time I try to incorporate some external component or library, for example:

Throws an error, probe to implement it in another project and they work.

In the case of http://www.primefaces.org/primeng

The error is as follows:

zone.js:232 Error: (SystemJS) Unexpected token <
	SyntaxError: Unexpected token <
	Evaluating http://localhost:3000/primeng/primeng

In the case of https://github.com/JiriBalcar/angular2-datepicker

The error is as follows:

zone.js:232 Error: (SystemJS) Unexpected token <
	SyntaxError: Unexpected token <
	Evaluating http://localhost:3000/jb-input-datepicker

In the case of https://auth0.com/blog/creating-your-first-real-world-angular-2-app-from-authentication-to-calling-an-api-and-everything-in-betwee)n/)

The error is as follows:

localhost/:23 Error: (SystemJS) Unexpected token <
	SyntaxError: Unexpected token <
	Evaluating http://localhost:3000/angular2-jwt
	Error loading http://localhost:3000/app/main.js

And so with everything I probe, is there something I should do?

Thank you very much!

TS Errors for windows 10

On a plain vanilla install and running gulp default, I get 81 semantic errors -2300, 2320, 2420.. Then a failure with - EPERM: operation not permitted, mkdir.

Any advice?

can we replace type script code with regular javascript in server side?

very very good example.
But I am not able to find the main reason of using typescript in server side
Can we replace type script code with regular javascript in server module? if yes what changes we need to make?

Heroku won't build

Hi,

Took a clean clone and tried to build on heroku and got and error (root cause is postinstall getting sh: 1: gulp: not found), full log below:
remote: Compressing source files... done.
remote: Building source:
remote:
remote: -----> Node.js app detected
remote:
remote: -----> Creating runtime environment
remote:
remote: NPM_CONFIG_LOGLEVEL=error
remote: NPM_CONFIG_PRODUCTION=true
remote: NODE_ENV=production
remote: NODE_MODULES_CACHE=true
remote:
remote: -----> Installing binaries
remote: engines.node (package.json): unspecified
remote: engines.npm (package.json): unspecified (use default)
remote:
remote: Resolving node version (latest stable) via semver.io...
remote: Downloading and installing node 6.9.1...
remote: Using default npm version: 3.10.8
remote:
remote: -----> Restoring cache
remote: Skipping cache restore (new runtime signature)
remote:
remote: -----> Building dependencies
remote: Installing node modules (package.json)
remote:
remote: > [email protected] postinstall /tmp/build_56187b5af97a2c7f8c055e26751acb6a
remote: > gulp installTypings
remote:
remote: sh: 1: gulp: not found
remote:
remote: npm ERR! Linux 3.13.0-100-generic
remote: npm ERR! argv "/tmp/build_56187b5af97a2c7f8c055e26751acb6a/.heroku/node/bin/node" "/tmp/build_56187b5af97
a2c7f8c055e26751acb6a/.heroku/node/bin/npm" "install" "--unsafe-perm" "--userconfig" "/tmp/build_56187b5af97a2c7f8c055e2
6751acb6a/.npmrc"
remote: npm ERR! node v6.9.1
remote: npm ERR! npm v3.10.8
remote: npm ERR! file sh
remote: npm ERR! code ELIFECYCLE
remote: npm ERR! errno ENOENT
remote: npm ERR! syscall spawn
remote: npm ERR! [email protected] postinstall: gulp installTypings
remote: npm ERR! spawn ENOENT
remote: npm ERR!
remote: npm ERR! Failed at the [email protected] postinstall script 'gulp installTypings'.
remote: npm ERR! Make sure you have the latest version of node.js and npm installed.
remote: npm ERR! If you do, this is most likely a problem with the angular2-express-mongo package,
remote: npm ERR! not with npm itself.
remote: npm ERR! Tell the author that this fails on your system:
remote: npm ERR! gulp installTypings
remote: npm ERR! You can get information on how to open an issue for this project with:
remote: npm ERR! npm bugs angular2-express-mongo
remote: npm ERR! Or if that isn't available, you can get their info via:
remote: npm ERR! npm owner ls angular2-express-mongo
remote: npm ERR! There is likely additional logging output above.
remote:
remote: npm ERR! Please include the following file with any support request:
remote: npm ERR! /tmp/build_56187b5af97a2c7f8c055e26751acb6a/npm-debug.log
remote:
remote: -----> Build failed
remote:
remote: We're sorry this build is failing! You can troubleshoot common issues here:
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys
remote:
remote: Some possible problems:
remote:
remote: - Node version not specified in package.json
remote: https://devcenter.heroku.com/articles/nodejs-support#specifying-a-node-js-version
remote:
remote: - Gulp may not be tracked in package.json
remote: https://devcenter.heroku.com/articles/troubleshooting-node-deploys#ensure-you-aren-t-relying-on-untracked
-dependencies
remote:
remote: Love,
remote: Heroku
remote:
remote: ! Push rejected, failed to compile Node.js app.
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to kukutest.
remote:
To https://git.heroku.com/kukutest.git
! [remote rejected] master -> master (pre-receive hook declined)
error: failed to push some refs to 'https://git.heroku.com/kukutest.git'

Any help will be appreciated.

when i use "npm run build",error happend!

0 info it worked if it ends with ok
1 verbose cli [ 'C:\Program Files\nodejs\node.exe',
1 verbose cli 'C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js',
1 verbose cli 'run',
1 verbose cli 'deploy' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'predeploy', 'deploy', 'postdeploy' ]
5 info lifecycle [email protected]predeploy: [email protected]
6 silly lifecycle [email protected]predeploy: no script for predeploy, continuing
7 info lifecycle [email protected]deploy: [email protected]
8 verbose lifecycle [email protected]deploy: unsafe-perm in lifecycle true
9 verbose lifecycle [email protected]deploy: PATH: C:\Program Files\nodejs\node_modules\npm\bin\node-gyp-bin;C:\Users\jyj\Angular2-express-mongoose-gulp-node-typescript-master\node_modules.bin;C:\Program Files (x86)\Intel\iCLS Client;C:\Program Files\Intel\iCLS Client;C:\Windows\system32;C:\Windows;C:\Windows\System32\Wbem;C:\Windows\System32\WindowsPowerShell\v1.0;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\Intel\WiFi\bin;C:\Program Files\Common Files\Intel\WirelessCommon;C:\Program Files (x86)\Common Files\lenovo\easyplussdk\bin;C:\Program Files (x86)\Lenovo\Lenovo Home;C:\Program Files\nodejs;C:\Program Files\TortoiseSVN\bin;D:\JDK1.8\bin;D:\androidsdk\platform-tools;D:\androidsdk\tools;C:\Users\jyj\AppData\Roaming\npm;C:\Program Files (x86)\Microsoft VS Code\bin
10 verbose lifecycle [email protected]deploy: CWD: C:\Users\jyj\Angular2-express-mongoose-gulp-node-typescript-master
11 silly lifecycle [email protected]deploy: Args: [ '/d /s /c',
11 silly lifecycle 'concurrently --kill-others "gulp watch" "node ./dist/server/bin/www"' ]
12 silly lifecycle [email protected]deploy: Returned: code: 1 signal: null
13 info lifecycle [email protected]~deploy: Failed to exec deploy script
14 verbose stack Error: [email protected] deploy: concurrently --kill-others "gulp watch" "node ./dist/server/bin/www"
14 verbose stack Exit status 1
14 verbose stack at EventEmitter. (C:\Program Files\nodejs\node_modules\npm\lib\utils\lifecycle.js:255:16)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at EventEmitter.emit (events.js:191:7)
14 verbose stack at ChildProcess. (C:\Program Files\nodejs\node_modules\npm\lib\utils\spawn.js:40:14)
14 verbose stack at emitTwo (events.js:106:13)
14 verbose stack at ChildProcess.emit (events.js:191:7)
14 verbose stack at maybeClose (internal/child_process.js:877:16)
14 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
15 verbose pkgid [email protected]
16 verbose cwd C:\Users\jyj\Angular2-express-mongoose-gulp-node-typescript-master
17 error Windows_NT 6.1.7601
18 error argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "run" "deploy"
19 error node v6.9.1
20 error npm v3.10.8
21 error code ELIFECYCLE
22 error [email protected] deploy: concurrently --kill-others "gulp watch" "node ./dist/server/bin/www"
22 error Exit status 1
23 error Failed at the [email protected] deploy script 'concurrently --kill-others "gulp watch" "node ./dist/server/bin/www"'.
23 error Make sure you have the latest version of node.js and npm installed.
23 error If you do, this is most likely a problem with the angular2-express-mongo package,
23 error not with npm itself.
23 error Tell the author that this fails on your system:
23 error concurrently --kill-others "gulp watch" "node ./dist/server/bin/www"
23 error You can get information on how to open an issue for this project with:
23 error npm bugs angular2-express-mongo
23 error Or if that isn't available, you can get their info via:
23 error npm owner ls angular2-express-mongo
23 error There is likely additional logging output above.
24 verbose exit [ 1, true ]

Update to @types

Update typings to new @types/**

Infinite restart after saving a file

After saving file and compile, nodemon go wild, restarting app all over again

how do i remove the '#' in the url

I found that there must be the character '#' in the url.
eg.
i define the route like following:
{
path: 'home',
component: HomeComponent
}

but, when i click the nav 'home', the page's url showed in the url address likes this:
http://localhost:8366/#/home

If i want to remove the part '/#', and final url is 'http://localhost:8366/home'. how should i do?

looking forward your replay.

Property in Controller class can't used in the functions which are register in Routes

I want to add a property in the Controller class. Like in the HeroController, I add a 'test' property, and I want to use it in the create function. But when create is invoke by the route, it show [TypeError: Cannot read property 'test' of undefined].

I think it's because typescript is simulate class but Javascript didn't have a class until ES6. I have use c# before and use Javascript and Typescript recently but not full understand it.

class HeroController {

    test = "test";

    create(req: express.Request, res: express.Response): void {
        console.log(this.test);
    }
}

Remove .idea folder

I think the .idea folder should be removed from the project.

Production version and upload to server

Hi, thanks for making this excellent work available, I have a consultation; Always program in php and mysql; In this case, how do I put this application into operation on a server, and which hosting service should I use ?.

Thank you very much for helping this newbie!

How to use forever

I tried to use forever but my server doesn`t work.

root@app:/opt/dist/server/bin# sudo forever start www
warn: --minUptime not set. Defaulting to: 1000ms
warn: --spinSleepTime not set. Your script will exit if it does not stay up for at least 1000ms
info: Forever processing file: www

But server response is ERR_CONNECTION_REFUSED

Also if i do some changes in html clients file, i had this error in browser console

shim.min.js:1 Uncaught SyntaxError: Unexpected token <
zone.js:1 Uncaught SyntaxError: Unexpected token <
Reflect.js:1 Uncaught SyntaxError: Unexpected token <
system.src.js:1 Uncaught SyntaxError: Unexpected token <
systemjs.config.js:1 Uncaught SyntaxError: Unexpected token <
5879663…:21 Uncaught ReferenceError: System is not defined
at 5879663…:21
(anonymous) @ 5879663…:21

But i didn`t touch any .js files :(

Asking for modification

Hi! i wanted to write you a comment but i dont know how i can :S

https://github.com/moizKachwala/Angular2-expressjs-mongoose-gulp-node-typescript/blob/master/server/src/config/routes/HeroRoutes.ts

why dont you inject the controller? so u can delete that = new hero controller

npm run build error

22:36:45] Requiring external module ts-node/register
[22:36:47] Using gulpfile /opt/gulpfile.ts
[22:36:47] Starting 'build'...
[22:36:47] Starting 'clean'...
[22:36:47] Finished 'clean' after 33 ms
[22:36:47] Starting 'build:server'...
[22:36:50] Finished 'build:server' after 2.19 s
[22:36:50] Starting 'build:client'...
[22:36:53] Finished 'build:client' after 3.49 s
[22:36:53] Starting 'clientResources'...
[22:36:53] Finished 'clientResources' after 35 ms
[22:36:53] Starting 'serverResources'...
[22:36:53] Finished 'serverResources' after 5.37 ms
[22:36:53] Starting 'libs'...
Killed

npm ERR! Linux 4.4.0-57-generic
npm ERR! argv "/usr/bin/nodejs" "/usr/bin/npm" "run" "build"
npm ERR! node v6.9.4
npm ERR! npm v4.1.1
npm ERR! code ELIFECYCLE
npm ERR! [email protected] build: gulp build
npm ERR! Exit status 137
npm ERR!
npm ERR! Failed at the [email protected] build script 'gulp build'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the angular2-express-mongo package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! gulp build
npm ERR! You can get information on how to open an issue for this project with:
npm ERR! npm bugs angular2-express-mongo
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls angular2-express-mongo
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR! /opt/npm-debug.log

Can you help me ? :)

ZoneAwareError on adding npm package

I have clone this repo and when I tried to use angular2-flash-messages I am getting

ZoneAwareError {__zone_symbol__error: Error: Unexpected token <
  Evaluating http://localhost:3000/angular2-flash-messages
  Evaluating ...

This happens with all the packages.

Let me know what am I doing wrong?

Unable to add Angular Material

Followed https://material.angular.io/guide/getting-started and get Loading... Error reports are light
Console:
Error: (SystemJS) Unexpected token <
SyntaxError: Unexpected token <
at eval ()
at Object.eval (http://localhost:3000/app/app.module.js:13:18)
at eval (http://localhost:3000/app/app.module.js:50:4)
at eval (http://localhost:3000/app/app.module.js:51:3)
Evaluating http://localhost:3000/@angular/material
Evaluating http://localhost:3000/app/app.module.js
Evaluating http://localhost:3000/app/main.js
Error loading http://localhost:3000/app/main.js
at eval ()
at Object.eval (http://localhost:3000/app/app.module.js:13:18)
at eval (http://localhost:3000/app/app.module.js:50:4)
at eval (http://localhost:3000/app/app.module.js:51:3)
Evaluating http://localhost:3000/@angular/material
Evaluating http://localhost:3000/app/app.module.js
Evaluating http://localhost:3000/app/main.js
Error loading http://localhost:3000/app/main.js
(anonymous) @ (index):23
ZoneDelegate.invoke @ zone.js:391
Zone.run @ zone.js:141
(anonymous) @ zone.js:818
ZoneDelegate.invokeTask @ zone.js:424
Zone.runTask @ zone.js:191
drainMicroTaskQueue @ zone.js:584
ZoneTask.invoke @ zone.js:490

No Typescript compilation error for Server

Hello,

Thank you very much for this seed, I really like it.
I have an issue though with Typescript compilation.

TSLint is capable of identifying errors in the Client project.
But when creating an error in the Server project Typescript compiles fine and continues.

I will try to have a look into it but it would be great if you could.

Thanks and continue your good work.

Linvi

Failed to load external modules

Some errors when running:
[1] Failed to load external module ts-node/register
[1] [08:10:48] Failed to load external module typescript-node/register
[1] [08:10:48] Failed to load external module typescript-register
[1] [08:10:48] Failed to load external module typescript-require

The server side structure

@moizKachwala The server side code works nicely but I feel there can be some more improvements in the structure.
It can be broken down by feature.
For eg If I want to create/remove a api for villain it is much more difficult.
Common code can be separated and Heroes code can be in it's own folder.

How to check api is working or not

Hello,
I have an issue regarding checking the api whether the api is working ir not.How to call api for debugging

npm run deploy failed

Hi,
This is the first time that I'm creating a setup for an application on this scale and I am confused about some things.
I tried downloading this to make it run but there seems to be an issue. It says "failed at the [email protected] deploy script 'concurrent --kill-others "gulp watch" "gulp start".
I updated both npm and node.js to the latest versions.

I would really appreciate any help here. Thanks.

While gulp build:client, some errors show up.

/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3026,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3030,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3034,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3038,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3042,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3046,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3050,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3053,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3057,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3060,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3063,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3066,5): error TS2300: Duplicate identifier 'export='.
/Users/arfawong/Desktop/Project/yaucy/node_modules/@types/core-js/index.d.ts(3069,5): error TS2300: Duplicate identifier 'export='.

the app dont run

the app dont run, it just stuck on loading page please help

Did you use a generator for this project ?

Hello,

It's just for a technical question, I wonder if your example project uses a yeoman generator and if yes, which one ?

Thanks :)

Missing quote

Hi,

Thanks for sharing your project.

I found two minor issues:

In the package.json, a quote is missing:

At the line concurrent --kill-others "gulp watch" "node ./dist/server/bin/www

sh: 1: Syntax error: Unterminated quoted string

that is because:

"deploy": "concurrent --kill-others \"gulp watch\" \"node ./dist/server/bin/www",
should be
"deploy": "concurrent --kill-others \"gulp watch\" \"node ./dist/server/bin/www\"",

After that change, the command works but throws:

Warning: "concurrent" command is deprecated, use "concurrently" instead.

Changing the whole line to
"deploy": "concurrently --kill-others \"gulp watch\" \"node ./dist/server/bin/www\"",

looks like the best idea to me.

Also: Consider moving "Global Packages" above "Steps to Run", if both packages are really necessary in order to run it :-)

Which version of nodejs should be installed?

TKS!

Webpack or SystemJS

Hello, I'm new to angular 2, but would like to know how you feel about using webpack vs systemjs. Ive searched the web and found mixed results.
I love your approach, but wouldn't want to plunge into systemJS if everything is converting to webpack. Ive been trying for days now to convert your app to webpack without much success. Is it worth the effort?
Great work!!