Git Product home page Git Product logo

customermanager's Introduction

Customer Manager with AngularJS (with custom routing)

If you’re new to AngularJS check out my AngularJS in 60-ish Minutes video tutorial or download the free eBook. Also check out The AngularJS Magazine for up-to-date information on using AngularJS to build Single Page Applications (SPAs).

Customer Management App

This version of the application has support for custom routing. See this this post for more details. The standard version of the application with no custom routing can be found here.

This application demonstrates:

  • A complete application with read-only and editable data
  • Using AngularJS with $http in a factory to access a backend Web API service
  • Using BreezeJS in a factory to access a backend Web API Service
  • Techniques for showing multiple views of data (card view and list view)
  • A custom filter for filtering customer data
  • A custom routing mechanism that allows a controller & template to be downloaded dynamically "on the fly" and provides a standard convention for controller and view names (see this post for more details)
  • A custom directive to ensure unique values in a form for email
  • A custom directive that intercepts $http and jQuery XHR requests (in case either are used) and displays a loading dialog

The factories can be switched by changing the app/services/config useBreeze setting to true.

The AngularJS portion of the app is structured using the following folders:

Customer Management App Structure

Requirements:

###If you're using Visual Studio and .NET:

The following is required to support the backend services:

To get started, double-click the CustomerManager.sln file located at the root of the CustomerManager repository. Once the solution loads press F5 to run the project.

###If you're using Node.js/Express/MongoDB

If you don't already have Node.js on your machine install it from http://nodejs.org. You'll also need to install MongoDB from http://www.mongodb.org if you don't have it already and get it configured and running using the instructions on their site.

In the CustomerManager directory execute 'npm install' to install Express, MongoDB and Mongoose (package.json).

Load sample data into MongoDB by performing the following steps:

  • Execute 'mongod' to start the MongoDB daemon
  • Navigate to the CustomerManager directory (the one that has initMongoCustData.js in it) then execute 'mongo' to start the MongoDB shell
  • Enter the following in the mongo shell to load the seed files:
  • use custmgr
  • load("initMongoCustData.js")
  • load("initMongoSettingsData.js")
  • load("initMongoStateData.js")

Start the Node/Express server:

  • navigate to the CustomerManager/server directory then execute 'node app.js'

View the application at http://localhost:3000

Thanks to Tony Quinn for contributing the initial Node.js/MongoDB code!

customermanager's People

Contributors

danwahlin avatar

Watchers

 avatar

Forkers

sunjunlin

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.