Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Single Page Apps FTW!

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for Ciro Nunes Ciro Nunes
November 30, 2013
Programming
2
170

Single Page Apps FTW!

Avatar for Ciro Nunes

Ciro Nunes

November 30, 2013
Tweet

More Decks by Ciro Nunes

See All by Ciro Nunes
Rust Front-end with Yew
Avatar for Ciro Nunes cironunes
0
59
Type safe CSS with Reason
Avatar for Ciro Nunes cironunes
0
130
What I've learned building automated docs for Ansarada's design system
Avatar for Ciro Nunes cironunes
0
80
Beyond ng new
Avatar for Ciro Nunes cironunes
2
210
Animate your Angular apps
Avatar for Ciro Nunes cironunes
0
440
Sweet Angular, good forms never felt so good
Avatar for Ciro Nunes cironunes
0
86
Sweet Angular, good forms never felt so good
Avatar for Ciro Nunes cironunes
0
300
Progressive Angular apps
Avatar for Ciro Nunes cironunes
3
910
Angular: Um framework. Mobile & desktop.
Avatar for Ciro Nunes cironunes
1
590

Other Decks in Programming

See All in Programming
生成AIを活用したソフトウェア開発ライフサイクル変革の現在値
Avatar for Hiroyuki Mori hiroyukimori
PRO
0
100
ノイジーネイバー問題を解決する 公平なキューイング
Avatar for Shoichi Ochi occhi
0
110
AIによるイベントストーミング図からのコード生成 / AI-powered code generation from Event Storming diagrams
Avatar for nrs nrslib
2
1.9k
The Past, Present, and Future of Enterprise Java
Avatar for ivargrimstad ivargrimstad
0
620
QAフローを最適化し、品質水準を満たしながらリリースまでの期間を最短化する #RSGT2026
Avatar for shibayu36 shibayu36
2
4.4k
Unicodeどうしてる？ PHPから見たUnicode対応と他言語での対応についてのお伺い
Avatar for てきめん tekimen youkidearitai
PRO
1
2.6k
なるべく楽してバックエンドに型をつけたい！(楽とは言ってない)
Avatar for HIBIKI CUBE hibiki_cube
0
140
Gemini for developers
Avatar for Mete Atamel meteatamel
0
100
OCaml 5でモダンな並列プログラミングを Enjoyしよう!
Avatar for Haochen Kotoi-Xie haochenx
0
140
AI巻き込み型コードレビューのススメ
Avatar for Nealle nealle
2
1.4k
Package Management Learnings from Homebrew
Avatar for Mike McQuaid mikemcquaid
0
230
Best-Practices-for-Cortex-Analyst-and-AI-Agent
Avatar for ryotaro.ikeda@finatext.com ryotaroikeda
1
110

Featured

See All Featured
Efficient Content Optimization with Google Search Console & Apps Script
Avatar for Katarina Dahlin katarinadahlin
PRO
1
330
Building the Perfect Custom Keyboard
Avatar for Naoto Takai takai
2
690
sira's awesome portfolio website redesign presentation
Avatar for ElsiraPls elsirapls
0
150
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
8.1k
Un-Boring Meetings
Avatar for Sebastian Deterding codingconduct
0
200
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
77
5.3k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
Avatar for Irina Nazarova irinanazarova
9
1.2k
Ethics towards AI in product and experience design
Avatar for Skipper Chong Warson skipperchong
2
200
Building Better People: How to give real-time feedback that sticks.
Avatar for Will Jessup wjessup
370
20k
The Director’s Chair: Orchestrating AI for Truly Effective Learning
Avatar for Mike Taylor tmiket
1
99
Build The Right Thing And Hit Your Dates
Avatar for Maggie C. maggiecrowley
39
3k
A Soul's Torment
Avatar for Nat Ma seathinner
5
2.3k

Transcript

  1. SINGLE PAGE APPS Ciro Nunes FOR THE WIN!

  2. CIRO NUNES Front End Developer cironunes @cironunesdev cironunes.github.io

  3. None
  4. None
  5. None

  6. http://www.meetup.com/AngularJS-Sao-Paulo/

  7. SINGLE PAGE APPS Ciro Nunes FOR THE WIN!

  8. None
  9. None
  10. None
  11. None
  12. None

  13. SINGLE PAGE APPS UX nativa no browser!

  14. pro tips como começar arquitetura

  15. arquitetura

  16. client totalmente desacoplado do server

  17. server client <html><body> <h1>data2</h1> <p>data2</p> </body></html> GET / 200 OK

    display the returned HTML NORMAL WEBSITES

  18. server client JSON: { data1, data2 } <h1>data1</h1> <p>data2</p> GET

    /items 200 OK SINGLE PAGE APPS

  19. SERVER RESTful API

  20. CLIENT routing, data-binding, components, MVC

  21. server fornece os recursos, client manipula a interface

  22. como começar

  23. SERVER RESTful API

  24. Method URL Action GET /items Retorna todos os items GET

    /item/:id Retorna o item com o id especificado POST /items Adiciona um novo item PUT /item/:id Atualiza o item com o id especificado DELETE /item/:id Deleta o item com o id especificado

  25. http://mcavage.me/node-restify/

  26. DEMO

  27. https://github.com/intridea/grape

  28. http://flask-restful.readthedocs.org/en/latest/

  29. CLIENT routing, data-binding, components, MVC

  30. http://angularjs.org/

  31. DEMO

  32. TESTES mais confiança e documentação

  33. http://visionmedia.github.io/mocha/

  34. http://pivotal.github.io/jasmine/

  35. pro tips

  36. CORS cross-origin resource sharing

  37. htttp://w3.org/TR/cors/

  38. 8+ suporte

  39. DEMO

  40. http://www.html5rocks.com/en/tutorials/cors/

  41. SEO seja encontrado :)

  42. https://developers.google.com/webmasters/ajax-crawling/

  43. htttp://prerender.io/

  44. WORKFLOW teste em vários dispositivos no ctrl+s

  45. http://karma-runner.github.io/

  46. http://yeoman.io/

  47. DEMO

  48. use e contribua com os melhores projetos!

  49. None

  50. OBRIGADO! cironunes @cironunesdev cironunes.github.io