Skip to content

A MEAN Fullstack with Angular 2/Angular 4 built with scaleability and SEO first

License

Notifications You must be signed in to change notification settings

projectSHAI/GOATstack

Repository files navigation

Check out the Demo App!

build npm version Dependency Status Dev-Dependency Status

Main Banner

The GOATyeoman generator is located here

Quick Start

$ npm i -g yo generator-goatstack
$ mkdir [dirName] && cd [dirName]
$ yo goatstack [name?]
$ # Make sure to have the database runnning!!
$ npm start
$ # dev environment served to http://localhost:1701

What's New in v4.3?

WARNING: v4.0.x => v4.3.x brings BREAKING CHANGES CassMask was removed to make GOATstack less opinionated

  • CassMask is no longer be used, or supported. This will be a breaking change from past versions.
  • In place of CassMask we will use the Cassandra Node.js driver which is compatible with DataStax enterprise solutions.

Future updates in v4.4.x!

  • Sequelize will be worked on.
  • Server-side rendering with Angular Universal
    • Angular Universal will be integrated into @angular/core upon angular@4.x
    • we will begin refactoring on the GOATv4 branch once rc.1 publishes in the coming month

Beyond the Horizon. V5.x.x and Angular 5!

  • Angular 5 is in beta currently, and has a release target for mid October 2017. We plan on integrating Angular 5 and releasing it in Version 5.0.0 of the GOATstack in the 4th quarter.

Documentation Wiki

For more information about the stack click here


Why GOAT-stack?

Houston we have a problem

Problem

1. Initial page load speed

  • 40% of users leave a webpage that takes more than 3 seconds to load

2. Scaleable resources

  • If an App's resources cannot scale with real time user traffic it will crash during traffic spikes, and be wasteful when there is low user activity

3. Scaleable Architecture

  • If a program's dataflow is not structured conicously a once easily managed program made of 10,000 lines of code becomes a hinderance once it reaches 100,000 lines of code. Data flows become unruley and nested, and unintended dependencies occur in the application tree. This makes maintainability a mess, and refactoring a nightmare.

4. User to User real time interaction

  • User interaction is a key success factor in regards to having a community adopt, and grow with your projet. The more seamless user interaction is with your website, and with each other, the better chance the project has at success.

Solution

1. Initial page load speed

  • The GOAT stack capitilizes on Angular2's Ahead-of-Time server-side compilation. Having the server do the heavy lifting at build time allows us to serve pre-compiled views for the client to load. This dramatically decreases initial load time.

2. Scaleable resources

  • MongoDB fits the developer paradigm very well. with proper indexing and schema design database response times will be linear, or consant. Also, the capability of sharding removes the bottle-neck of datasize.

3. Scaleable Architecture

  • Immmutable makes app data predictable at any scale, and redux makes dataflow manageble by eliminating many-to-many relationships, this completely removes tangled nests of components, making them more modular. Redux places the entire app's state tree in one focal area which is the store.

4. User to User real time interaction

  • Angular2's two way data binding and Socket.io is an effective combination. Two way data binding allows real time interaction between website and client without the need to reload pages. Socket.io takes this one step further and automatically updates changes on every connected device in real time without the need to refresh the browser. This feature can be narrowed or widened.

Follow the GOAT

If you like our Fullstack make sure to stay informed and get involved!

Follow us on Facebook page to receive the latest news and updates!

Facebook Page

If you end up not liking the GOAT Stack, that's ok too! Please drop by our Reddit page and tell us why! We're always interested in new points of view, even the greatest can get better!

Reddit Page

Stack Types

  • CANE - Cassandra, Angular, NodeJS, Express
  • MEAN - MongoDB, Express, Angular, NodeJS
  • SEAN - SQL, Express, Angular, NodeJS

Required Technologies for your Development Environment

Installation

Windows

1) Install Git

  • Note: You may need to configure system PATH to appropriate git command

2) Install NodeJS

  • Note: You may need to configure system PATH to appropriate node command
  • Note: You may need to configure system PATH to appropriate each command

4) Install Python and C++ compiler

  • Note: Installing Visual Studios Community will be a sufficiant compiler
    • if you do not want the full blown Visual Studios IDE then you can also download a standalone version of Visual Studio's build tools here
    • Make sure to configure npm to use the correct c++ compiler using the following command npm config set msvs_version 2015 2015 is the version linked above, replace this number with your version if it differs. If you still have issues during npm install follow the install instructions here for node-gyp.

5) Clone and Run

$ npm i -g yo generator-goatstack
$ mkdir GOATstack && cd GOATstack
$ yo goatstack [name?]
$ # Make sure to have the database running!!
$ npm start
$ # dev environment served to http://localhost:1701

Linux

1) Install Git

$ sudo apt-get install git

2) Install NodeJS

$ curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -
$ sudo apt-get install -y nodejs

or 7.x

$ curl -sL https://deb.nodesource.com/setup_7.x | sudo -E bash -
$ sudo apt-get install -y nodejs

4) Clone and Run

$ sudo npm i -g yo generator-goatstack
$ mkdir GOATstack && cd GOATstack 
$ sudo yo goatstack [name?]
$ # Make sure to have the database running!!
$ sudo npm start
$ # dev environment served to http://localhost:1701

Note: npm needs to be elevated with sudo, otherwise child_process will throw errors and/or webpack-dev-server will not serve.

Deploying to Heroku (MongoDB)

Deployment Banner

Make sure you have Heroku Toolbelt installed.

1) Login with your Heroku credentials

$ heroku login

2) Run the gulp task

$ [sudo] npm deploy:heroku

Created By

About

A MEAN Fullstack with Angular 2/Angular 4 built with scaleability and SEO first

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published