Vous êtes sur la page 1sur 23

History

John: Pick Systems, Rev,Arev, MS Access, VB, Delphi, Asp.net, Silverlight

Matt: X
I used to avoid JS whenver My old stack was dated Web is ready for SPA

Its a new World NPM, Bower, Grunt, Jade, GIT , EJS, Yoman, Boostrap, Javascript, HTML5, Angular, Node, NoSql SPA, Jade, CSS3, Twitter Bootstrap

Why Node
The Web is Changing The Browser is getting smarter Thick Clients / SPA Node.js is an event-driven, server-side JavaScript environment.
Node runs JavaScript using the V8 engine developed by Google for use in their Chrome web browser. Leveraging V8 allows Node to provide a server-side runtime environment that compiles and executes JavaScript at lightning speeds. The major speed increase is due to the fact that V8 compiles JavaScript into native machine code, instead of interpreting it or executing it as bytecode. Node is open source, and cross-platform, running on Mac OSX, Windows, and Linux. ts a server-side JavaScript framework. That means the same type of code that powers awesome Ajax applications like Gmail will now power its servers, too. Code reuse FTW! Its driven by asynchronous design. That means that it doesnt have to wait for slow file I/O or database operations to continue processing, which makes it really damn fast (by that I mean faster than most other popular server languages / platforms). It also means that it can handle millions of concurrent connections at once.

. 1 Language Stack to rule them all


It makes real-time applications a walk in the park

Why Mongo
Easy to setup and Run Fast Aggregation Document Based Native (json) no metadata required Geospatial index and querying (No need to compute great circle distance Calc) Many cloud options (heroku,nodjitsu, rackspace:http://www.objectrocket.com mongolab,mongohq Highly scalable (Sharding)
Why Not No transactions, no joins

Why Angular
Simple Architecture Very Fast Easy to integrate with backend State in client MV Whatever 2 way data binding Annimations Large supportive community, growing every day
Why Not large initial page load SEO (there are solutions: see yearofmoo.com) No IE 7 support IE8 can be difficult

Why SailsJS sailsjs.org


New MEANS Stack mongo,express,angular,node,sails

Production Ready
Leverage javascript libraries like underscore, Q,Grunt,Express, SocketIO.
Apps are easy to build Very testable and easy to deploy To meet meet the ever increasing requirements of Live Interactive data with automatic refreshes and aninimations

It rests on top of Socket.io and the popular Express framework, and you have access to them in their entirety, natively.

Simple install
npm install -g sails

Convention Over Configuration (like Rails)

Code Generator and Scaffolding


>sails new testProject >sails generate user (will create model and controller for user entities)

Anchors Aweigh!
>sails lift (runs node server, makes use of grunt) RESTful endpoints Create user object to test server:
http://localhost:1337/user/create?username=John Tomaselli&email=gtz@gtz.com&password=123456&role=4&title=software programming http://localhost:1337/user

Backend Organization
{image of dir structure}

Data
Out-of-the-box: Mongodb, mysql, reddis You can create a custom adapter too!

config/adapters.js

config/adapters.js
module.exports.adapters = { // If you leave the adapter config unspecified

// in a model definition, 'default' will be used.


//'default': 'disk', 'default': 'mongo', // In-memory adapter for DEVELOPMENT ONLY memory: {

module: 'sails-memory'
}, // Persistent adapter for DEVELOPMENT ONLY // (data IS preserved when the server shuts down) disk: {

module: 'sails-disk'
},

config/adapters.js
// MySQL is the world's most popular relational database. mysql: {

module: 'sails-mysql',
host: 'YOUR_MYSQL_SERVER_HOSTNAME_OR_IP_ADDRESS', user: 'YOUR_MYSQL_USER', password: 'YOUR_MYSQL_PASSWORD', database: 'YOUR_MYSQL_DB'

,
mongo: { module host port } : 'sails-mongo', : 'localhost', : 27017,

database : crm
};

Controllers
sails generate controller comment create destroy tag like generates: // Comment controller with generated actions. var CommentController = { create: function(req, res) { }, destroy: function(req, res) { }, tag: function(req, res) { }, like: function(req, res) { } } module.exports = CommentController;

Controller Blueprints
After a controller has been defined, Sails will automatically map out routes to give you easy access. For the controller above, the routes would be the following:
http://localhost:1337/comment/create http://localhost:1337/comment/destroy http://localhost:1337/comment/tag http://localhost:1337/comment/like

Additionally, thanks to blueprints, you also get these methods by default:


get /:controller/:id?

post /:controller
put /:controller/:id delete /:controller/:id /:controller/find/:id? /:controller/create /:controller/update/:id

/:controller/destroy/:id

config/routes.js
# Conventions GET : GET : POST : POST : PUT : DELETE: /:controller => findAll() /:controller/read/:id => find(id) /:controller/create => create() /:controller/create/:id => create(id) /:controller/update/:id => update(id) /:controller/destroy/:id => destroy(id)

# You can also explicitly state the action GET : /:controller/find => findAll() GET : /:controller/find/:id => find(id) POST : /:controller/create => create(id) PUT : /:controller/update/:id => update(id) DELETE: /:controller/destroy/:id => destroy(id)

config/routes.js
'get /logout': { controller: 'AuthController', action: 'logout' } '/': { view: 'home/index' // } , '/partials/:file' : { controller : 'foo', action : 'partials'} , '/meetings/:lat/:lng/:radius': { controller: 'foo', action: 'test' } , view: 'partials/home' ,

'/partials/meetings/:lat/:lng/:radius': {
controller: 'foo', action: 'test2' }

ie:http://localhost:1337/vendor?State=NY

Models: Attributes
module.exports = { attributes : {

"VendorID" : "string",
"VendorNumber" : "string", "CompanyName" :"string", "Address" : "string", "City" : "string", "State" : "string", "ZipCode" : "string", "Country" : "string", "Type" : "integer", "CompanyAddition" : "string", "Terms" : "integer", "AccountID" : "integer", "VendorAccountId" :"integer", "contacts" : "array" },

Models: methods
Instance Methods

Lifecycle Callbacks

Angular Client
C:\Node\Apps\sails9\park-tower\assets\linker\js\app\controllers\controllersPO.js 'use strict' Application.Controllers.controller('PoEditCtrl', ['$rootScope', '$scope', '$location', '$http', '$routeParams', 'mongosailsHelper', '$q', 'lookupCache', 'lookupCachePO', 'lookupCacheAcct', '$timeout', 'PO', function ($rootScope, $scope, $location, $http, $routeParams, mongosailsHelper, $q, lookupCache, lookupCachePO, lookupCacheAcct, $timeout, PO) {

// PO comes from app {

.factory('PO', ['$resource', function ($resource)

var param = $routeParams.id;//POID; $scope.save = function () { //console.log('in sav ') if ($scope.mess === 'Create New PO') { PO.create(0, ( $scope.po1), function (success, error) { //console.log('create success ', success, error, success.data.POID); if (success.data.POID !== 0) {

Angular
} });

} else {
var id = $scope.po1.id; PO.update(({id: id}, $scope.po1)); // updates json without the id // console.log(' $scope.poOrig.newValue;:: ', $scope.poOrig.newValue) // place values back from poview $scope.po1.vendorName = $scope.currentVendor.CompanyName; $scope.po1.acctDesc = $scope.currentAccount.Desc; $scope.po1.newValue = 'test';// for test $location.path('/po'); } }; $scope.poOrig.newValue; // just

App.js

App.js
var Application = Application || {}; Application.Services = angular.module('application.services', []); Application.Controllers = angular.module('application.controllers', []); Application.Filters = angular.module('application.filters', []); Application.Directives = angular.module('application.directives', []); angular.module('application', ['application.filters', 'application.services', 'application.directives', 'application.controllers','ngResource','ngRoute','angular-table','ui.bootstrap','ngGrid','ngCookies']) .config(['$routeProvider', '$locationProvider', '$httpProvider', function ($routeProvider, $locationProvider, $httpProvider) { var access = routingConfig.accessLevels;

$routeProvider
// anon .when('/', {templateUrl: '/partials/login', controller: 'LoginCtrl', access: access.anon}) .when('/home', {templateUrl: '/partials/home', controller: 'HomeCtrl', access: access.anon}) .when('/login', {templateUrl: '/partials/login', controller: 'LoginCtrl', access: access.anon}) .when('/logout', {templateUrl: '/partials/login', controller: 'LogoutCtrl', access: access.user}) // .when('/view1', {templateUrl: '/partials/partial1', controller: 'MainCtrl',access: access.anon}) .when('/foodview', {templateUrl: '/partials/foodview', controller: 'FoodCtrl', access: access.anon}) .when('/vendor', {templateUrl: '/partials/vendorview', controller: 'VendorCtrl',access: access.user}) //using modal .when('/vendor/:VendorNumber', {templateUrl: '/partials/vendorviewedit', controller: 'VendorEditCtrl',access: access.user})

Vous aimerez peut-être aussi