Diese Präsentation wurde erfolgreich gemeldet.
Wir verwenden Ihre LinkedIn Profilangaben und Informationen zu Ihren Aktivitäten, um Anzeigen zu personalisieren und Ihnen relevantere Inhalte anzuzeigen. Sie können Ihre Anzeigeneinstellungen jederzeit ändern.

Mobious(ES6 Isomorphic Flux/ReactJS Boilerplate)

323 Aufrufe

Veröffentlicht am

Mobious(ES6 Isomorphic Flux/ReactJS Boilerplate)

Veröffentlicht in: Technologie
  • Hi there! Get Your Professional Job-Winning Resume Here - Check our website! http://bit.ly/resumpro
       Antworten 
    Sind Sie sicher, dass Sie …  Ja  Nein
    Ihre Nachricht erscheint hier

Mobious(ES6 Isomorphic Flux/ReactJS Boilerplate)

  1. 1. Mobious ES6 Isomorphic Flux/ReactJS
  2. 2. About Me •Node.js •ASP.NET MVC FB: : Ch Rick Email:mr.sunboss@gmail.com 1
  3. 3. Agenda •Mobious ? •Front-End •Back-End •Example 2
  4. 4. Mobious ES6 Isomorphic Flux/ReactJS 3
  5. 5. Mobious •Front-End •ReactJs •alt •Webpack •Back-End •Koa •Sequelize •Mocha 4
  6. 6. Demo 5
  7. 7. Single-Page App(SPA) 6
  8. 8. SEO Crawler 7
  9. 9. SEO 8
  10. 10. https://developers.facebook.com/docs/sharing/webmasters/crawle Google Facebook https://support.google.com/webmasters/answer/80553 9
  11. 11. User Experience Performance 10
  12. 12. Performance 11
  13. 13. Performance 12
  14. 14. Isomorphic 13
  15. 15. Mobious •Front-End •ReactJs •alt •Webpack •Back-End •Koa •Sequelize •Mocha 14
  16. 16. •app •server •test •webpack 15
  17. 17. Client Server 16
  18. 18. Back-End •Koa •Sequelize •Mocha 17
  19. 19. Koa Web framework 18
  20. 20. Koa 19
  21. 21. Callback hell http://seajones.co.uk/content/images/2014/12/callback-hell.png20
  22. 22. Generator 21
  23. 23. Generator next(); 22
  24. 24. Koa-route 23
  25. 25. Sequelize PostgreSQL、MySQL、MariaDB、SQLite 、MSSQL 24
  26. 26. Sequelize - Define 25
  27. 27. Sequelize - Create 26
  28. 28. Sequelize - Read 27
  29. 29. Sequelize – Destroy 28
  30. 30. Sequelize – Update 29
  31. 31. Controller 30
  32. 32. Controller 31
  33. 33. Controller - koa-route 32
  34. 34. Mocha API Testing、TDD、BDD、Seeding 33
  35. 35. Seeding 34
  36. 36. Seeding - await 35
  37. 37. Mocha 36
  38. 38. Mocah 37
  39. 39. Back-End •Koa •Sequelize •Mocha 38
  40. 40. Example Friend 39
  41. 41. •git clone https://github.com/exma-square/mobious.git •cd mobious •git checkout develop •nvm ls-remote •nvm use 2.0.1 •npm install •npm run dev 40 Step-by-Step
  42. 42. •Back-End •Test Spec •Model •Controller •Route •npm run rest-test •Front-End •component •Action •Store •註冊(Action、Store) •回來component 寫 willMount 從 Action 取資料 41 Step-by-Step
  43. 43. https://github.com/exma-square/mobious GitHub GitBook http://bit.ly/1PEY0J0 42
  44. 44. QA 43
  45. 45. Thanks Mobious

×