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

Single Page Apps FTW!

Avatar for Ciro Nunes Ciro Nunes
November 30, 2013
Programming
2
160

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
50
Type safe CSS with Reason
Avatar for Ciro Nunes cironunes
0
110
What I've learned building automated docs for Ansarada's design system
Avatar for Ciro Nunes cironunes
0
67
Beyond ng new
Avatar for Ciro Nunes cironunes
2
200
Animate your Angular apps
Avatar for Ciro Nunes cironunes
0
420
Sweet Angular, good forms never felt so good
Avatar for Ciro Nunes cironunes
0
66
Sweet Angular, good forms never felt so good
Avatar for Ciro Nunes cironunes
0
290
Progressive Angular apps
Avatar for Ciro Nunes cironunes
3
890
Angular: Um framework. Mobile & desktop.
Avatar for Ciro Nunes cironunes
1
590

Other Decks in Programming

See All in Programming
Zendeskのチケットを Amazon Bedrockで 解析した
Avatar for ryokosuge ryokosuge
2
150
私の後悔をAWS DMSで解決した話
Avatar for 平目 hiramax
4
170
エンジニアのための”最低限いい感じ”デザイン入門
Avatar for しゅん🌙 shunshobon
0
130
tool ディレクティブを導入してみた感想
Avatar for Sugar Sato sgash708
1
150
Vue・React マルチプロダクト開発を支える Vite
Avatar for ANDPAD inc andpad
0
110
KessokuでDIでもgoroutineを活用する / Go Connect #6
Avatar for mazrean mazrean
0
120
Flutter로 Gemini와 MCP를 활용한 Agentic App 만들기 - 박제창 2025 I/O Extended Seoul
Avatar for JaiChangPark itsmedreamwalker
0
160
Scale out your Claude Code ~⁨⁩自社専用Agentで10xする開発プロセス~
Avatar for Yuku Kotani yukukotani
9
2.7k
あのころの iPod を どうにか再生させたい
Avatar for orumin orumin
2
2.5k
🔨 小さなビルドシステムを作る
Avatar for Mutsuha Asada momeemt
2
610
TDD 実践ミニトーク
Avatar for Daisuke Garaike contour_gara
1
250
AI OCR API on Lambdaを Datadogで可視化してみた
Avatar for Nealle nealle
0
210

Featured

See All Featured
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
77
5.9k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
Avatar for Joe Casabona jcasabona
33
2.4k
Git: the NoSQL Database
Avatar for Brandon Keepers bkeepers
PRO
431
65k
The Art of Programming - Codeland 2020
Avatar for Erika Heidi erikaheidi
55
13k
Helping Users Find Their Own Way: Creating Modern Search Experiences
Avatar for Dan Newman danielanewman
29
2.8k
How to Think Like a Performance Engineer
Avatar for Harry Roberts csswizardry
26
1.8k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
31
2.2k
Side Projects
Avatar for Sacha Greif sachag
455
43k
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.2k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
7
830
Mobile First: as difficult as doing things right
Avatar for Swwweet swwweet
224
9.9k
Agile that works and the tools we love
Avatar for Rasmus Luckow-Nielsen rasmusluckow
330
21k

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