You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
> Yeoman generator for creating MEAN/SEAN stack applications, using ES2017, MongoDB/SQL, Express, Angular, and Node - lets you quickly set up a project following best practices.
> Yeoman generator for creating MEAN/SEAN stack applications, using ES2017, MongoDB/SQL, Express, Angular, and Node - lets you quickly set up a project following best practices.
Install `yo`, `gulp-cli`, and `generator-angular-fullstack`:
21
-
```
16
+
17
+
```text
22
18
npm install -g yo gulp-cli generator-angular-fullstack
23
19
```
24
-
__Please note__: If you run into trouble compiling native add-ons during the installation, follow [`node-gyp`](https://github.com/nodejs/node-gyp)'s short guide on [required compilation tools](https://github.com/nodejs/node-gyp#installation).
25
20
26
-
Then, to run your app (make sure the MongoDB daemon is running if you selected Mongo), run the following to start your server:
27
-
```sh
21
+
**Please note**: If you run into trouble compiling native add-ons during the installation, follow [`node-gyp`](https://github.com/nodejs/node-gyp)'s short guide on [required compilation tools](https://github.com/nodejs/node-gyp#installation).
22
+
23
+
Then, to run your app \(make sure the MongoDB daemon is running if you selected Mongo\), run the following to start your server:
24
+
25
+
```bash
28
26
npm run start:server
29
27
```
28
+
30
29
and the following to start the Webpack dev server for the front-end:
31
-
```sh
30
+
31
+
```bash
32
32
npm run start:client
33
33
```
34
34
35
-
The Webpack server will tell you which port to access the app at (usually http://localhost:8080/).
36
-
37
-
---
35
+
The Webpack server will tell you which port to access the app at \(usually [http://localhost:8080/](http://localhost:8080/)\).
38
36
39
37
Run `yo angular-fullstack`
40
-
```
38
+
39
+
```text
41
40
yo angular-fullstack
42
41
```
43
42
44
-
**See the[Getting Started](https://angular-fullstack.github.io/get-started/) guide for more information.**
43
+
**See the**[**Getting Started**](https://angular-fullstack.github.io/get-started/)**guide for more information.**
45
44
46
45
## Prerequisites
47
46
48
47
* MongoDB - Download and Install [MongoDB](https://www.mongodb.com/download-center#community) - If you plan on scaffolding your project with mongoose, you'll need mongoDB to be installed and have the `mongod` process running.
49
48
* If you have [Docker](https://www.docker.com/) installed, you can easily run a test database with `docker run -p 27017:27017 --name afs-mongo -d mongo`
50
-
* The project's JavaScript is written in ECMAScript 2015. If you're unfamiliar with the latest changes to the specification for JavaScript, check out http://es6-features.org/
49
+
* The project's JavaScript is written in ECMAScript 2015. If you're unfamiliar with the latest changes to the specification for JavaScript, check out [http://es6-features.org/](http://es6-features.org/)
Copy file name to clipboardExpand all lines: developing/adding-a-route.md
+2-2
Original file line number
Diff line number
Diff line change
@@ -55,7 +55,7 @@ angular.element(document)
55
55
56
56
Now that we've imported our new Angular module and added it to the dependency list of our root Angular module, we should be able to navigate to `http://localhost:3000/foo` and see our new route:
57
57
58
-
58
+
59
59
60
60
It's not a very impressive page right now, but it works.
Copy file name to clipboardExpand all lines: developing/overview.md
+3-3
Original file line number
Diff line number
Diff line change
@@ -88,15 +88,15 @@ webpack: bundle is now VALID.
88
88
89
89
And then our default browser should open up to the app:
90
90
91
-
91
+
92
92
93
93
Fantastic! We're now up and running with our Full-Stack Angular web application! So what can it do?
94
94
95
95
## Homepage
96
96
97
97
Assuming you scaffolded with a back-end database, you should see some 'features'. If you scaffolded with WebSockets, you should see 'x' buttons next to each, and an input box. Try opening two browser windows to the same page side-by-side, and hitting the 'x' on one of the features. You should see the feature get removed on both web pages. Neat! This is because these database object changes are communicated to clients using WebSockets.
98
98
99
-
99
+
100
100
101
101
Neat. Let's see what else we can do.
102
102
@@ -117,7 +117,7 @@ You should see inputs for an email address and a password. When running your pro
117
117
118
118
Go ahead and log in with the admin account, so we can see the extra admin bits too. You should then get sent back to the home page, but should notice that the navbar looks a bit different:
119
119
120
-
120
+
121
121
122
122
First, at the top right, we see a greeting for our username, a cog icon \(for user settings\), and a logout button. Then, since we're an admin, we see a new 'Admin' state on the navbar. The admin section lists users and allows you to delete them. The user settings page allows you to change your password.
0 commit comments