/estagio_angular

Primary LanguageJavaScriptMIT LicenseMIT

estagio-angular

This project is an application skeleton for a typical AngularJS web app. You can use it to quickly bootstrap your angular webapp projects and dev environment for these projects.

The seed contains a sample AngularJS application and is preconfigured to install the Angular framework and a bunch of development and testing tools for instant web development gratification.

The seed app doesn't do much, just shows how to wire two controllers and views together.

Getting Started

To get you started you can simply clone the estagio-angular repository and install the dependencies:

Prerequisites

You need git to clone the estagio-angular repository.

We also use a number of Node.js tools to initialize and test estagio-angular. You must have Node.js and its package manager (npm) installed. You can get them from here.

Clone estagio-angular

Clone the estagio-angular repository using git:

git clone https://github.com/ZaguDev/estagio-angular
cd estagio-angular

Install Dependencies

We have two kinds of dependencies in this project: tools and Angular framework code. The tools help us manage and test the application.

We have preconfigured npm to automatically run bower so we can simply do:

npm install

Behind the scenes this will also call bower install. After that, you should find out that you have two new folders in your project.

  • node_modules - contains the npm packages for the tools we need
  • app/bower_components - contains the Angular framework files

Note that the bower_components folder would normally be installed in the root folder but ZaguAngularEstagio changes this location through the .bowerrc file. Putting it in the app folder makes it easier to serve the files by a web server.

Run the Application

We have preconfigured the project with a simple development web server. The simplest way to start this server is:

npm start

Now browse to the app at localhost:8000/index.html.

Directory Layout

app/                    --> all of the source files for the application
  app.css               --> default stylesheet
  components/           --> all app specific modules
  view1/                --> the view1 view template and logic
    view1.html            --> the partial template
    view1.js              --> the controller logic
  view2/                --> the view2 view template and logic
    view2.html            --> the partial template
    view2.js              --> the controller logic
  app.js                --> main application module
  index.html            --> app layout file (the main html template file of the app)

Contact

For more information on AngularJS please check out angularjs.org.

estagio-angular