42
Introduction to Sails.js yungshin

yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

  • Upload
    others

  • View
    1

  • Download
    0

Embed Size (px)

Citation preview

Page 1: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Introduction to Sails.jsyungshin

Page 2: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

About Me

• yungshin

• 大學化學系念不下去,碩班跳坑念資工

• III IDEAS

• 上班爬網站,下班寫網站

• 喜愛鑽研前端技術

Page 3: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

投資新技術有賺有賠,使用前請先詳閱公開說明書(官方文件)

Page 4: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline
Page 5: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Sails.js• Web MVC Framework for Node.js

• Auto Routing

• Express based

• Scaffolding

Page 6: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Sails.js• Socket.io support

• Restful blueprint

• Model module, ORM, use Waterline

Page 7: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

MVC• M - Model

• V - View

• C - Controller

Page 8: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

MVC• User see the views

• User use controllers

• Controllers manipulate models

• Models update views

Page 9: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Get Started

Page 10: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Get Started• Install Command-line tools

sudo npm install -g sails

Page 11: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Get Started• Create a new app:

!

• Now lift the server:

!

• See the default home page:

sails new testProject

cd testProject sails lift

http://localhost:1337/

Page 12: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Sails.js Command Line• Generate Model and Controller

• sails generate [Name]

• Generate Controller

• sails generate controller [Name] [Action]…

• Ex: sails generate controller post create find update destroy

• Path: api/controller

Page 13: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Sails.js Command Line• Generate Model

• sails generate model [Name] [Attribute:Type]…

• Ex: sails generate model person firstName:string lastName:string age:integer birthDate:date

• Path: api/model

Page 14: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Controller

Page 15: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Controller• http://sailsjs.org/#!documentation/controllers

• Think of controllers as being the middleman between your model and your views.

sails generate controller comment create destroy tag like

Page 16: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Controller

Page 17: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Controller• generate routes would be the following: (Action blueprints)

• /comment/create

• /comment/destroy

• /comment/tag

• /comment/like

Page 18: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Controller• REST blueprints

• You can disable it in “config/controller.js”

• find(id) -> GET /:controller/:id

• create() -> POST /:controller

• update(id) -> PUT /:controller/:id

• destroy(id) -> DELETE /:controller/:id

Page 19: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Request and Response• If you need to dive deeper, check out the express guide.

Page 20: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Request and Response• req.param()

• /:controller/:action/:foo

• var foo = req.param(“foo”);

• req.body.val

• form data, query string

Page 21: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Request and Response• res.view([view, options[, fn]])

• res.send(body|status[, headers|status[, status]])

• res.json(obj[, headers|status[, status]])

• res.redirect(url[, status])

Page 22: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Routes

Page 23: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Routes• http://sailsjs.org/#!documentation/routes

• routes urls to controllers/actions

• Path: “config/routes.js”

Page 24: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Routes• static routes

!

!

!

• controller name

• controller action (function)

/post: { controller: ‘PostController', action: 'findAll' }

Page 25: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Routes• route point to a view

!

!

!

• the followings point to the “view/home/index.ejs”

‘/': { view: ‘home/index’ }

Page 26: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Routes• set routes for particular http verbs

'POST /signup': { controller: controller_name, action: controller_action }

Page 27: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Model

Page 28: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Model• http://sailsjs.org/#!documentation/models

• Path: api/models

• ORM -> Waterline

• multiple adapters for databases

Page 29: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Model

module.exports = { attributes: { firstName: ‘STRING', lastName: ‘STRING', age: { type: ‘INTEGER', max: 150, required: true } } };

Page 30: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Model

module.exports = { attributes: { firstName: ‘STRING', lastName: ‘STRING', age: { type: ‘INTEGER', max: 150, required: true } } };

attribute name

Page 31: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Model

module.exports = { attributes: { firstName: ‘STRING', lastName: ‘STRING', age: { type: ‘INTEGER', max: 150, required: true } } };

attribute name

attribute type

Page 32: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Model

module.exports = { attributes: { firstName: ‘STRING', lastName: ‘STRING', age: { type: ‘INTEGER', max: 150, required: true } } };

attribute name

attribute type

validation

Page 33: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Model

Person.create({ firstName: ‘foo', lastName: ‘bar', age: 18 }).done(function(err, post) { if(err) { /* ... */ } ! /* ... */ });

Page 34: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

View

Page 35: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

View• http://sailsjs.org/#!documentation/views

• render pages

• Path: views/…

• Supports:

• ejs (default) (http://embeddedjs.com/)

• jade (http://jade-lang.com/)

• ...

Page 36: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

View• render views in controller

• response.view()

return res.view("home/index", { title: "Foo", posts: post });

Page 37: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Asset Management

Page 38: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Asset Management• Path: assets/…

• css, js, images

• Grunt.js

• less, coffeescript

• concat, cssmin, uglify, …

Page 39: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Pros & Cons• Pros

• Use command line to generate controllers and models

• Developing routes / Restful API is fast

• other good things: policy…

• Cons

• Documentation (especially waterline)

• No support for associations

• Devs have not been very responsive lately

Page 40: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Conclusion• Sails.js is good mvc framework for Node.js

• Building routes / Restful API is fast

Page 41: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

?

Page 42: yungshin - csie.iotechccu.csie.io/2014/slides/Session2-Introduction_to... · 2017-12-01 · Sails.js • Socket.io support • Restful blueprint • Model module, ORM, use Waterline

Thank you!E-mail: [email protected] twitter: @yungshin_chien