Skip to content

Commit

Permalink
docs(gettingStarted): fill-out Getting Started section more
Browse files Browse the repository at this point in the history
  • Loading branch information
Awk34 committed Sep 1, 2016
1 parent 5bb43be commit 23d3738
Show file tree
Hide file tree
Showing 5 changed files with 150 additions and 9 deletions.
9 changes: 0 additions & 9 deletions docs/01_Getting_Started/01_Prerequisites.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,12 +21,3 @@ Make a new directory, and `cd` into it:
```bash
mkdir myapp && cd $_
```

Run `yo angular-fullstack`, optionally passing an app name:
```bash
yo angular-fullstack
```

You'll then be asked a series of questions regarding options for the generated app. Such things include using JavaScript or TypeScript,
HTML or Pug, Bootstrap, SQL, and so on. If you don't know what to answer for a question, just hitting `ENTER` will use the default options
for that question, and move on to the next one.
14 changes: 14 additions & 0 deletions docs/01_Getting_Started/02_Installation.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
## Installation

Run `yo angular-fullstack` (optionally passing an app name):
```bash
yo angular-fullstack
```

You'll then be asked a series of questions regarding options for the generated app. Such things include using JavaScript or TypeScript,
HTML or Pug, Bootstrap, SQL, and so on. If you don't know what to answer for a question, or just want to use our preferred options,
hitting `ENTER` will use the default options for that question, and move on to the next one.

Once you've answered all the questions, a project will be scaffolded for you according to the options you entered. Then, npm dependencies
will automatically be installed. Once that's all complete, you're ready to get started with your app!

10 changes: 10 additions & 0 deletions docs/01_Getting_Started/03_Running_Your_New_App.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
## Running Your New App

You can start your new app by running `gulp serve`. This will do some preliminary things like clean out temporary
files, lint your scripts, inject any new CSS files into your main one, apply environment variables, and download
any new TypeScript definitions. It will then start up a new development server, which will kick off a Webpack build.
it uses Browser Sync to facilitate front-end development. Your files will also be watched for changes. Any front-end
changes will kick off another webpack build. Any back-end changes will restart the back-end server, cleaning the
development database and re-seeding it as well.

Once the `serve` tasks are complete, a browser tab should be opened to your new app server.
Empty file.
126 changes: 126 additions & 0 deletions docs/01_Getting_Started/04_Project_Overview.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,126 @@
## Project Overview

What follows is an overfiew of the files/folders in your newly generated project.

### Project Root

* .babelrc - configuration for [Babel], a JavaScript transpiler
* .editorconfig - config file used to keep conistent file editing across text editors
* .eslintrc - all of the rules applying to the ESLint JavaScript linter
* .travis.yml - a sample configuration file for Travis CI
* .yo-rc.json - a configuration file for the Angular Full-Stack Generator
* gulpfile.babel.js - Gulp task runner file
* karma.conf.js - Karma browser testing configuration
* mocha.conf.js - Mocha test framework configuration
* mocha.global.js - teardown file for Mocha
* package.json - npm manifest, contains information for all project dependencies
* protractor.conf.js - configuration for Protractor e2e test framework
* README.md - a readme file generator based on your options, for your scaffolded project
* spec.js - test file for Webpack used by Karma
* webpack.make.js - main file for Webpack configuration
* The following export the config from `webpack.make.js` for their respective build targets:
* webpack.dev.js
* webpack.test.js
* webpack.build.js

### `client/`

```
│ .eslintrc // eslint config for client files
│ polyfills.js // imports of polyfills
│ _index.html // template for the root HTML file of your app
├───app
│ │ app.config.js // contains app-wide configuration code
│ │ app.constants.js // gets injected with constants from `server/config/environment/shared.js`
│ │ app.{js,ts} // root JavaScript file of your app
│ │ app.{css,scss,stylus,less} // root CSS file of your app
│ │
│ ├───account // pages related to login / signup / user settings
│ │ │ account.routes.js // route information
│ │ │ index.js // account module root
│ │ │
│ │ ├───login
│ │ ├───settings
│ │ └───signup
│ │
│ ├───admin // site admin page
│ │
│ └───main // main component, homepage
├───assets // where static assets are stored
└───components
├───auth
│ auth.module.js // module containing auth components
│ auth.service.js // authentication service
│ interceptor.service.js // intercepts requests and adds tokens if needed. Also redirects 401s to the login page.
│ router.decorator.js // facilitates auth-based routing configuration
│ user.service.js // user resource service
├───footer
├───modal
├───navbar
├───oauth-buttons // buttons for oauth login on signup / login pages
├───socket
│ socket.mock.js // mock service for unit testing
│ socket.service.js // service for Socket IO integration
├───ui-router
│ ui-router.mock.js // mock service for unit testing
└───util // general utility service
```

### `server/`

```
│ .eslintrc // server-specific ESLint config, imports rules from root file
│ app.js // root server module
│ index.js // imports `app.js`. Enables Babel require hook when in development mode.
│ routes.js // imports / config for server endpoints
├───api
│ ├───thing
│ │ index.js // root module
│ │ index.spec.js // root module tests
│ │ thing.controller.js // endpoint logic
│ │ thing.events.js // endpoint events (save, delete, etc) logic
│ │ thing.integration.js // integration tests
│ │ thing.model.js // Mongoose / Sequelize data model
│ │ thing.socket.js // Socket IO logic / config
│ │
│ └───user // API for Users
├───auth
│ │ auth.service.js
│ │ index.js // imports local/oauth auth modules
│ │
│ ├───local // regular auth, signed up directly via your site
│ ├───google // Google OAuth
│ └───<etc...>
└───config
│ express.js // Express server setup
│ local.env.js // ignored by Git
│ local.env.sample.js // sensitive environment variables are stored here, and added at server start. Copy to `local.env.js`.
│ seed.js // re-seeds database with fresh data
│ socketio.js // Socket IO configuration / imports
└───environment
development.js
index.js
production.js
shared.js // config constants shared with the client code
test.js
```

### `e2e/`

End-To-End testing files (use by [Protractor](https://github.com/angular/protractor) with [Mocha](https://github.com/mochajs/mocha))

[Babel]: https://babeljs.io/

0 comments on commit 23d3738

Please sign in to comment.