Building websites with Node.ACS

5,174 views

Published on



A quick guide for setting up Appcelerator's Node.ACS and examples on how to build three different types of websites/APIs. Code can be found at:

https://github.com/ricardoalcocer/acs_key_value_store
https://github.com/ricardoalcocer/nodeacs_sample_website

Published in: Technology, Business
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
5,174
On SlideShare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
21
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Building websites with Node.ACS

  1. 1. Building Websites using Node.ACS Ricardo Alcocer Lead Developer Evangelist @ Appcelerator
  2. 2. About me 1. Have been using Titanium since late 2009 2. Former Titanium trainer in the Caribbean and Latin America 3. Currently work as Lead Developer Evangelist 4. Obsessed with cross-platform mobile develoment 5. Love Javascript hacking and technology startups 6. I'm a hacker in constant training
  3. 3. What is Node.ACS 1. Develop and publish node.js apps to the cloud 2. Simple CLI interface and built-in webserver 3. Built-in ACS support 4. Integrated with Titanium Studio 5. It's Javascript but for the server!
  4. 4. Install Node.ACS Node.ACS runs on top of node.js Studio installs Node and NPM by default If you don't, install it from http://nodejs.org/ Run node -v to make sure you have it and then install ACS node -v sudo npm install -g acs
  5. 5. Login to Node.ACS acs login
  6. 6. Create a new Node.ACS acs new -my_app_name-
  7. 7. Starting your first Node.ACS acs run
  8. 8. Viewing on the browser
  9. 9. Publishing first app acs publish acs publish --force
  10. 10. First app published
  11. 11. MVC Framework
  12. 12. Config.json { "routes": [ { "path": "/", "callback": "application#index" } ], "filters": [ { "path": "/", "callback": "" } ], "websockets": [ { "event": "", "callback": ""} ] } Callbacks are in filename#functionname format Default HTTP Method is GET. For post we need to add "method":"post" Web Sockets are a whole different talk. More info at http://socket.io/
  13. 13. A simple Web Site
  14. 14. A simple Web Site (config.json) { "routes": [ { "path": "/", "callback": "application#index" }, { "path": "/home", "callback": "application#home" }, { "path": "/login", "method":"post", "callback": "application#login" }, { "path": "/logoff", "callback": "application#logoff" } ], "filters": [ { "path": "/home", "callback": "session_filter#validateSession" } ], "websockets": [ { "event": "", "callback": ""} ] }
  15. 15. Configure your app to track sessions (app.js) // initialize app function start(app, express) { //set favicon app.use(express.favicon(__dirname + '/public/images/favicon.ico')); //instantiate session management app.use(express.session({secret: '1234567890QWERTY'})); } // release resources function stop() { } There's more to sessions. See http://expressjs.com
  16. 16. A simple Web Site (application.js) function index(req, res) { res.render('index', { title: 'Welcome to Node.ACS!' }); } function login(req, res) { var uid=req.body.uid; var pwd=req.body.pwd; var name=req.body.name; if (uid==='appc' && pwd=='nodeacs'){ req.session.uid=uid; req.session.pwd=pwd; req.session.name=name; res.redirect('/home'); }else{ res.send(500, { error: 'something blew up' }); } } function logoff(req, res) { req.session.uid=null; req.session.pwd=null; req.session.name=null; res.redirect('/'); } function home(req, res) { res.render('home', { title: req.session.name }); }
  17. 17. The Index View (index.ejs) <!DOCTYPE html> <html> <head> <title>Index</title> <link rel='stylesheet' href='/css/style.css' /> </head> <body> <h2>Node.ACS</h2> <form action="/login" method="post"> <div>Name<input type="text" name="name"/></div> <div>UID<input type="text" name="uid"/></div> <div>PWD<input type="password" name="pwd"/></div> <div><input type="submit" value="Go"></div> </form> </body> </html>
  18. 18. The Home View (home.ejs) <!DOCTYPE html> <html> <head> <title><%= title %></title> <link rel='stylesheet' href='/css/style.css' /> </head> <body> <h2>Node.ACS</h2> <p>Welcome Home, <%= title %>!</p> <div><a href="/logoff">Log off</a></div> </body> </html>
  19. 19. Validating sessions (session_filter.js) function validateSession(req, res, next) { if(req.session.uid === null) { res.redirect('/'); } else { next(); } }
  20. 20. Walk-thru : ACS front-end https://github.com/ricardoalcocer/nodeacs_sample_website
  21. 21. Walk-thru : SaveJSON https://github.com/ricardoalcocer/acs_key_value_store
  22. 22. Creating a "catch-all" route app.get('/get/*',function(req,res){ urlParam=req.path.replace(//$/, "").split('/').pop(); // do what you want with your url parameter });
  23. 23. Some useful tools http://www.jsontest.com/ http://www.jsoneditoronline.org/ http://posttestserver.com/ http://code.google.com/p/cocoa-rest-client/
  24. 24. Thank you! Questions? Follow me on Twitter: @ricardoalcocer Github: /ricardoalcocer

×