Code Monkey home page Code Monkey logo

angular-fundamentals's Introduction

Angular Fundamentals

Acknowledgements

This is a LEANSTACKS solution.

LEANSTACKS offers several technology instruction video series, publications, and starter projects. For more information go to LeanStacks.com.

Repository

This repository is a companion for the LEANSTACKS YouTube channel playlist entitled Angular Fundamentals.

Repository Organization

Each episode of the Angular Fundamentals video series has a corresponding branch in this repository. For example, all of the source code illustrated in the episode entitled Creating an AngularJS Reusable Project Structure - Part 1 may be found on the repository branch named project-1.

Branches

project-1

The branch named project-1 contains the source code illustrated in the episode Creating an AngularJS Reusable Project Structure - Part One.

project-2

The branch named project-2 contains the source code illustrated in the episode Creating an AngularJS Reusable Project Structure - Part Two.

ng-include

The branch named ng-include contains the source code illustrated in the episode Using HTML Templates with the AngularJS ngInclude Directive.

ng-repeat

The branch named ng-repeat contains the source code illustrated in the episode Using the AngularJS ngRepeat Directive with Filtering and Sorting.

http-service

The branch named http-service contains the source code illustrated in the episode AngularJS Dependency Injection and Using the $http Service to GET Data.

ng-resource

The branch named ng-resource contains the source code illustrated in the episode Creating Custom AngularJS Services and Using the ngResource Module.

bootstrap-css

The branch named bootstrap-css contains the source code illustrated in the episode Using the Bootstrap and Font Awesome Frameworks with AngularJS.

ng-route

The branch named ng-route contains the source code illustrated in the episode Creating Parameterized Routes with the AngularJS ngRoute Module.

angularstrap

The branch named angularstrap contains the source code illustrated in the episode Using AngularStrap with Bootstrap, Angular Animate, and AngularJS.

Languages

This project is authored in CoffeeScript.

Installation

Fork the Repository

Fork the Angular Fundamentals repository on GitHub. Clone the project to your host machine.

Dependencies

The project requires the following dependencies be installed on the host machine:

  • Node.js (node)
  • Node Package Manager (npm)
  • Gulp Command Line Interface (gulp)
  • Karma Command Line Interface (karma)

After installing the dependencies, initialize the project. Open a terminal window, navigate to the project base directory, and issue this command:

npm install

The node package manager, a.k.a. npm retrieves all project dependencies, installing them into the /node_modules sub-directory.

Running

The project uses Gulp for build, package, and test workflow automation. The following Gulp tasks are defined.

Default

The default Gulp task performs the following workflow steps:

  • cleans the distribution directory
  • performs lint checks on the CoffeeScript
  • compiles and uglifies the CoffeeScript
  • minifies the CSS
  • copies the HTML to the distribution directory
  • copies the images to the distribution directory
  • copies the data to the distribution directory
  • copies the third-party libraries to the distribution directory

The default Gulp task performs basic project validation and the means to check CoffeeScript for syntax errors without starting a local web server.

To execute the default Gulp task, type the following command at a terminal prompt in the project base directory.

gulp

Run

The run Gulp task performs all of the same workflow steps as the default task and also:

  • watches source directories for changes
  • republishes source files to the distribution directory when changes occur
  • starts a HTTP server on the local host
  • reloads the index HTML page when changed source files are republished

The run Gulp task is designed to allow engineers the means to rapidly make application changes on their local machines. This task is not intended for use in a server environment.

To execute the run Gulp task, type the following command at a terminal prompt in the project base directory.

gulp run

Open a browser and go to http://localhost:9000/index.html to use the application.

To stop the HTTP server press ctrl-C in the terminal window.

Test

The test Gulp task performs all of the same workflow steps as the default task and also:

  • executes the unit test suites

The test Gulp task is designed to allow engineers the means to run the unit test suites against the main source code. This task may also be used on continuous integration servers such as Jenkins, etc.

To execute the test Gulp task, type the following command at a terminal prompt in the project base directory.

gulp test

Dist

The dist Gulp task performs all of the same workflow steps as the default task and also:

  • creates a single, compressed distribution file suitable for server deployment

The dist Gulp task is designed to allow development operations, a.k.a. DevOps, staff the means to produce an application artifact prepared for server deployment.

To execute the dist Gulp task, type the following command at a terminal prompt in the project base directory.

gulp dist

angular-fundamentals's People

Contributors

mwarman avatar

Watchers

James Cloos avatar Ryan Ar-rofiq avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.