/angular1_x_quickstart

Quickstart of local-development for AngularJS 1.x projects in CommonJS style which has live-development and AOT compilation by using Browserify, Watchify and BrowserSync

Primary LanguageJavaScript

Quickstart of local-development for AngularJS 1.x projects

build status

by using CommonJS style which has live-development and AOT compilation by using Browserify, Watchify and BrowserSync.

The Project structure use approachs below

  1. CommonJS-style, Modular Loader to be compatible with browserify, example below

file: app.js

require("./assets/style.css");

var angular = require("angular");

var app = angular.module("app", []);

app.controller("mainController", require("./app/main.component"));
  1. Angular style guide to follow file structure, naming convention etc,
  2. Compatible with Upgrading guideline (I hope :p) from Angular 1.x to Angular (2.x ++) with minimum efforts
  3. Ahead-of-time compilation (AOT) build process by using Browserify-Watchify

Remark:

This version is not optimized-yet for production.

Setting up a new project on your machine is quick and easy with the QuickStart seed, maintained on github repository.

First, make sure node installed on your machine.

Then, run following commands via command-line prompt

>git clone https://github.com/nitipan/angular1_x_quickstart.git quickstart
>cd quickstart
>npm install
>npm start

The live-development will be start at http://localhost:3000

What's inside quick start seed ?

Let's focus on src folder


|-- src
    |-- app.js
    |-- index.html
    |-- app
    |   |-- main.component.js
    |   |-- main.view.html
    |-- assets
        |-- style.css

Have fun !