|
| 1 | +<p align="center"> |
| 2 | + <img src="http://riccardoandreatta.com/media/image/Logo_Riccardo_Andreatta_giallo_gradient_trasparente.png" width="250" alt="Riccardo logo" /> |
| 3 | +</p> |
| 4 | + |
| 5 | + |
| 6 | + |
| 7 | +# AngularJS exercise example |
| 8 | + |
| 9 | +This is an exercise taken as an example for the interviews showing how I work with AngularJS and its components, HTTP requests, services and directives. |
| 10 | + |
| 11 | + |
| 12 | + |
| 13 | +### Some notes on the web application: |
| 14 | + |
| 15 | +- It is responsive (mobile first) |
| 16 | +- Styles are built using SASS |
| 17 | +- The styles are using CSSwizardry as a grid |
| 18 | +- It is using AngularJS v1.6.9 |
| 19 | +- To compile the SASS and the JS it is using Gulp |
| 20 | +- It is coming with a simple Node.js server to run the application locally |
| 21 | + |
| 22 | + |
| 23 | + |
| 24 | +## Installation |
| 25 | + |
| 26 | +Clone the project into a new folder and make sure you have installed `Node.js` and `npm` (or another package manager like `yarn`): |
| 27 | + |
| 28 | +Go to the directory where the project has been cloned and install all the required node modules needed to have the project up and running correctly (i.e. the Gulp plugins and the node server): |
| 29 | +``` |
| 30 | +npm install |
| 31 | +``` |
| 32 | + |
| 33 | + |
| 34 | + |
| 35 | +### Running the application locally |
| 36 | + |
| 37 | +When the node modules are correctly installed, please run the node server: |
| 38 | +``` |
| 39 | +node server |
| 40 | +``` |
| 41 | + |
| 42 | +The app is served by default at `http://localhost:9050/` but you can change the port in the `server.js` file. |
| 43 | + |
| 44 | + |
| 45 | + |
| 46 | +### Compile the SASS and the JS |
| 47 | + |
| 48 | +In a new terminal window, run `gulp` to compile the source files. |
| 49 | + |
| 50 | +Automatically, it creates the `dist` folder where there are the compiled CSS and JavaScript. |
| 51 | + |
| 52 | +If you want to change the code and watch for the changes you are making immediately, just run `gulp watch`. |
| 53 | + |
| 54 | +With Gulp you can even concatenate 2 different Gulp's tasks at the same time: |
| 55 | +``` |
| 56 | +gulp && gulp watch |
| 57 | +``` |
| 58 | + |
| 59 | +**Note**: there is also another Gulp task that is compiling all the code and running a livereload server at the same time: |
| 60 | +``` |
| 61 | +gulp server |
| 62 | +``` |
| 63 | + |
| 64 | +With this solution you can handle all the project in just one terminal window. |
0 commit comments