Giters

cmrajan / parse-angular-demo

An opinionated, battle-tested boilerplate for building large, powerful, serverless apps with AngularJS, Backbone and Parse

Home Page:http://brandid.github.io/parse-angular-demo

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

A Quickstart Boilerplate for Big AngularJS x Parse apps

An opinionated, battle-tested boilerplate for building large, powerful, serverless apps with AngularJS and Parse.

Built by guys who would rather be coding than shopping

Live Demo and Documentation

http://brandid.github.io/parse-angular-demo

Who is this for?

Maybe you're already using Parse for mobile and you need a web presence now too.

Maybe you’re an AngularJS beginner and you want to learn how big AngularJS apps are built.

Maybe you're already familiar with AngularJS or Backbone and you need a solid architecture that will scale nicely as your app scales.

Maybe you're at a hackathon, and you need to quickly launch a dynamic web app that requires user sessions and data storage.

Why we made this

Thanks to Mahmoud from Balanced for the inspiration to be more open.

We love Parse and AngularJS. We hate servers. Whilst building BRANDiD we developed some best practices around this stack, so we decided to open source it here. We even talked about it on the Parse Blog.

This boilerplate is a quickstart for large, maintainable, database enabled AngularJS apps. Let us know what we can improve via twitter @spacenick and @arush!

Features

  • AngularJS wrapper for the Parse JS SDK
  • AngularJS wrapper for Cloud Code
  • AngularJS wrapper for the Facebook API
  • Bootstrap 2.3.2 + HTML5BP
  • Enhanced Parse.Object and Parse.Collection with load(), saveParse(), destroyParse()
  • State Manager using ui-router
  • Resolve Parse Data Before State Changes for awesome UX e.g. return collection.load()
  • Easy Animations on State Change
  • Enhanced Load Performance of the Parse and Facebook SDKs
  • Data Modules for Parse Models and Collections
  • Genesis-Skeleton node / grunt setup for local development
  • …and lots more

Read about all the features here

Installation Instructions

  1. Install node - http://nodejs.org/
  2. Install grunt v0.4.x - http://gruntjs.com/getting-started
  3. Install bower npm install -g bower
  4. Clone this repo git clone git@github.com:brandid/parse-angular-demo.git
  5. Switch out your Parse keys in ParseServices.js (see below)
  6. Switch out your Facebook App ID in ParseServices.js
  7. Remove our GoSquared tracking snippet from index.html
  8. cd parse-angular-demo
  9. npm install
  10. bower install
  11. grunt server - builds and fires up the local node server on localhost:3000
  12. Visit http://localhost.com:3000 to develop your site
  13. grunt build to build a deployable version in the parse-angular-demo/build folder

Wire up your own Parse backend in seconds

client/app/scripts/services/ParseServices.js
// pro-tip: swap these keys out for PROD keys automatically on deploy using grunt-replace

...
Parse.initialize("***APP ID***", "***JAVASCRIPT KEY***");
...

Performance

BRANDiD regularly gets over 100 concurrent connections, and this architecture handles it with ease.

Credits

ericlemmons/genesis-skeleton - server boilerplate

daneden/animate.css - animations

Bootstrap CDN - Bootstrap hosting

Contribute

  • Angular Backbone bindings for easier forms with Parse SDK (60% complete - @spacenick)
  • Better documentation/video on how to customise queries like ParseQueryTableViewController
  • Convert to grunt-takana instead of grunt-contrib-compass (too slow)
  • Tests (help!)
  • Upgrade to Bootstrap 3.0.x
  • Docs and examples on User session handling
  • Docs and examples on ACL to protect against this Parse API design decision. For those who need to retrospectively protect their database, read this thread
  • Open source the BRANDiD Customer.io Cloud Code module to securely trigger transactional emails with unlimited custom data (You cannot send large payloads with the Customer.io JS SDK)
  • Include AngularFirebasePatch for real-time support, which is our simple alternative to AngularFire

License

parse-angular-demo is licensed under the ☺ license. (http://licence.visualidiot.com/)

If you found this useful

BRANDiD

Next time you think of clothes, think BRANDiD - Shop. Like a Man.

  • A dedicated expert shopper searches the ends of the earth just for you
  • Try clothes from any ecommerce store in the world before you buy them, no commitment
  • We ship and collect returns for free even if the retailer doesn't

Watch our TechCrunch Disrupt Battlefield Video here

About

An opinionated, battle-tested boilerplate for building large, powerful, serverless apps with AngularJS, Backbone and Parse

http://brandid.github.io/parse-angular-demo

License:MIT License