edison0xyz/generator-angular-api

RESTful fullstack generator with Angular CLI, Express.js and Mongoose.

generator-angular-api

RESTful fullstack generator with Angular CLI, Express.js and Mongoose. It has three options of design components Bulma, Bootstrap and Angular Material, each one with a basic template to start developing.

Generator Installation

First, install Yeoman and generator-angular-api using npm (we assume you have pre-installed node.js).

npm install -g yo
npm install -g generator-angular-api

Then generate your new project:

yo angular-api

Getting started

npm run dev

Run npm run dev for a dev server. Navigate to http://localhost:3000/. Wait until the app is built. At any change, the app will automatically rebuild and sync the browser.

.env example (place it on root directory)

PORT=3000
NODE_ENV=dev
APP_URL=http://localhost:3000/
MONGO_DB_URI=http://localhost:27017/angular-api

Code scaffolding

Run ng generate component component-name to generate a new component. You can also use ng generate directive|pipe|service|class|guard|interface|enum|module.

Build

Run ng build to build the project. The build artifacts will be stored in the client/dist/ directory. Use the -prod flag for a production build.

Running unit tests

Run ng test to execute the unit tests via Karma.

Running end-to-end tests

Run ng e2e to execute the end-to-end tests via Protractor.

Further help

To get more help on the Angular CLI use ng help or go check out the Angular CLI README.

Packages

Front-end

This front-end was generated based on Angular CLI version 1.6.5.

Modules

Angular modules already added.

Name	Version	Docs	Description
Routes			Routes is an array of route configurations.
RouterModule			Adds router directives and providers.
HttpClientModule			NgModule which provides the HttpClient and associated services.
FormsModule			The ng module for forms.

Design components

The generator has three design options.

Name	Version	Docs
Bulma
Bootstrap
Angular Material

Icons

Name	Version	Docs
Font Awesome
Feather

Back-end

The back-end api was generated based on generator-api project which uses NodeJS, Express and Mongoose.

To run locally, requires MongoDB installed and running (Install MongoDB).

Packages

Name	Version	Docs	Description
express.js			Minimalist web framework for Node.js
mongoose			Elegant MongoDB object modeling for Node.js
body-parser			Node.js body parsing middleware
morgan			HTTP request logger middleware for node.js
bluebird			Bluebird is a fully featured promise library with focus on innovative features and performance
dotenv			Dotenv is a zero-dependency module that loads environment variables from a .env file into process.env.

File tree

├── client
│   ├── app
│   │   ├── app.component.css
│   │   ├── app.component.html
│   │   ├── app.component.spec.ts
│   │   ├── app.component.ts
│   │   ├── app.module.ts
│   │   ├── pages
│   │   │   ├── home
│   │   │   │   ├── home.component.css
│   │   │   │   ├── home.component.html
│   │   │   │   ├── home.component.spec.ts
│   │   │   │   └── home.component.ts
│   │   │   └── not-found
│   │   │       ├── not-found.component.css
│   │   │       ├── not-found.component.html
│   │   │       ├── not-found.component.spec.ts
│   │   │       └── not-found.component.ts
│   │   └── services
│   │       ├── app.service.spec.ts
│   │       └── app.service.ts
│   ├── assets
│   ├── environments
│   │   ├── environment.prod.ts
│   │   └── environment.ts
│   ├── favicon.ico
│   ├── index.html
│   ├── main.ts
│   ├── polyfills.ts
│   ├── styles.css
│   ├── test.ts
│   ├── tsconfig.app.json
│   ├── tsconfig.spec.json
│   └── typings.d.ts
├── e2e
│   ├── app.e2e-spec.ts
│   ├── app.po.ts
│   └── tsconfig.e2e.json
├── .gitignore
├── .angular-cli.json
├── .editorconfig
├── gulpfile.js
├── karma.conf.js
├── package.json
├── protractor.conf.js
├── README.md
├── server
│   ├── config.js
│   ├── index.js
│   ├── lib
│   │   ├── controller.js
│   │   └── facade.js
│   ├── model
│   │   ├── food
│   │   │   ├── controller.js
│   │   │   ├── facade.js
│   │   │   ├── router.js
│   │   │   └── schema.js
│   │   └── user
│   │       ├── controller.js
│   │       ├── facade.js
│   │       ├── router.js
│   │       └── schema.js
│   └── routes.js
├── tsconfig.json
└── tslint.json

Getting To Know Yeoman

• Yeoman has a heart of gold.
• Yeoman is a person with feelings and opinions, but is very easy to work with.
• Yeoman can be too opinionated at times but is easily convinced not to be.
• Feel free to learn more about Yeoman.

License

This project is licensed under the MIT License - see the LICENSE.md file for details.