... | ... | @@ -7,17 +7,18 @@ This template uses Webpack, Angular 2, Typescript, Sass. It includes several pre |
|
|
* [TypeScript](typescript)
|
|
|
* [Data Store](data-store)
|
|
|
* [SASS](sass)
|
|
|
* [list of commonly used libraries](useful-libraries)
|
|
|
* [toolbox](toolbox)
|
|
|
|
|
|
## Starting up
|
|
|
The ng2 branch repo [README](https://dev.izeni.net/izeni/izeni-angular-template/tree/ng2) has instructions for firing up a new project. Note that you will need Node and npm installed on your system. You will also need to install a few global npm packages: webpack, webpack-dev-server, typescript, typings
|
|
|
|
|
|
## Repo directory structure
|
|
|
* component structure (good? bad?)
|
|
|
* api config (in config folder?)
|
|
|
* index files (modules: https://nodejs.org/api/modules.html#modules_folders_as_modules)
|
|
|
* included services
|
|
|
The ng2 branch repo [README](https://dev.izeni.net/izeni/izeni-angular-template/tree/ng2) has instructions for firing up a new project. Note that you will need [Node](https://nodejs.org/en/download/package-manager/#debian-and-ubuntu-based-linux-distributions) and [npm](https://docs.npmjs.com/getting-started/installing-node) installed on your system. You will also need to install a few global npm packages: `npm install -g webpack webpack-dev-server typescript typings`
|
|
|
|
|
|
## Directory structure highlights
|
|
|
We're trying to follow the [official Angular 2 styleguide](https://angular.io/styleguide) as much as is sensible. Namely,
|
|
|
* src > main.ts; app > app.module.ts, app.component.ts
|
|
|
* flat directories structure: components, directives, data store models, pipes, services
|
|
|
* components directory: most of our apps are centered on routes, so those are the primary component directories in the parent components directory, accompanied by a shared components directory for things like nav, footer, card, dropdown, modal, etc
|
|
|
* module barrels: index.ts files used to group similar exports (This is the [Node](https://nodejs.org/api/modules.html#modules_folders_as_modules) way, and [recommended](https://angular.io/styleguide#!#04-10) by Angular. This makes imports cleaner, dryer, and more maintainable)
|
|
|
* api config: to change your backend api url, look for api.config.ts next to api.service.ts in the services directory
|
|
|
|
|
|
|
|
|
|
... | ... | @@ -25,7 +26,7 @@ The ng2 branch repo [README](https://dev.izeni.net/izeni/izeni-angular-template/ |
|
|
- add suggested styleguides? https://google.github.io/styleguide/javascriptguide.xml, https://github.com/airbnb/javascript, https://google.github.io/styleguide/htmlcssguide.xml, http://codeguide.co/
|
|
|
- js data error handling
|
|
|
- ng2-bootstrap (best we have, for now):
|
|
|
- modal service
|
|
|
- modal service (or shared component???)
|
|
|
- alerts -> toasts
|
|
|
- purpose of bootstrap level service injection
|
|
|
- check on status of production minification / uglification
|
... | ... | |