Modern Web Architecture<br>based on JS, API and Markup
•
2 j'aime•1,368 vues
jsDevMeetup about JAMStack - Hugo, Gatsby.js
Recommandé
Contenu connexe
Similaire à Modern Web Architecture<br>based on JS, API and Markup
Similaire à Modern Web Architecture<br>based on JS, API and Markup (20)
Plus de Ladislav Prskavec
Plus de Ladislav Prskavec (20)
Dernier
Dernier (20)
Modern Web Architecture<br>based on JS, API and Markup
- 1. Modern Web Architecture based on JS, API and Markup Ladislav Prskavec jsDevMeetup Ladislav Prskavec - jsDevMeetup, 10.4. 2018 1
- 2. About me 4 Site Reliability Engineer (SRE) 4 https://keybase.io/abtris 4 https://blog.prskavec.net 4 @abtris Ladislav Prskavec - jsDevMeetup, 10.4. 2018 2
- 3. J A M Ladislav Prskavec - jsDevMeetup, 10.4. 2018 3
- 4. Javascript A M Ladislav Prskavec - jsDevMeetup, 10.4. 2018 4
- 5. Javascript API M Ladislav Prskavec - jsDevMeetup, 10.4. 2018 5
- 6. Javascript API Markup Ladislav Prskavec - jsDevMeetup, 10.4. 2018 6
- 7. 7
- 8. Static Site Generators 4 Jekyll (Ruby) 4 Middleman (Ruby, Rails based) 4 Hugo (Golang) 4 Spike (JS, Webpack based) 4 Gatsby.js (JS, React.JS based) 4 https://www.staticgen.com/ Ladislav Prskavec - jsDevMeetup, 10.4. 2018 8
- 9. Themes for static generators 4 templating depends on technology 4 200 themes in https://themes.gohugo.io/ 4 commercial in https://themeforest.net/.../jekyll 4 Sites build with Gatsby.js Ladislav Prskavec - jsDevMeetup, 10.4. 2018 9
- 10. ShowCase Ladislav Prskavec - jsDevMeetup, 10.4. 2018 10
- 11. 4 https://support.1password.com/ Ladislav Prskavec - jsDevMeetup, 10.4. 2018 11
- 12. 4 https://letsencrypt.org/, source: https://github.com/letsencrypt/website Ladislav Prskavec - jsDevMeetup, 10.4. 2018 12
- 13. 4 https://www.smashingmagazine.com/, source: smashing-magazine-just-got-10x-faster Ladislav Prskavec - jsDevMeetup, 10.4. 2018 13
- 14. 4 https://reactjs.org/ Ladislav Prskavec - jsDevMeetup, 10.4. 2018 14
- 15. 4 https://mozilladevelopers.github.io/playground/ Ladislav Prskavec - jsDevMeetup, 10.4. 2018 15
- 16. APIs 4 Smashingmagazine - post about that 4 Comments - GoTell, Disqus, IntenseDebate, isso 4 Search - Algolia 4 Payments - GoJoin, Stripe 4 Auth - GoTrue, Auth0 4 E-commerce - GoCommerce, Snipcart 4 Images - Cloudinary 4 Lambda, GraphQL, Webtask.io - for yours serverless backends Ladislav Prskavec - jsDevMeetup, 10.4. 2018 16
- 17. Headless CMS 4 Contentful - API based, hosted 4 NetlifyCMS - Git based, hosted 4 strapi - API based, self-hosted 4 Forestry 4 https://headlesscms.org/ Ladislav Prskavec - jsDevMeetup, 10.4. 2018 17
- 18. NetlifyCMS 4 Content management in a single-page app 4 Built in React.js with extensible components 4 Integrate with any build tool 4 Plug in to any static site generator 4 www.netlifycms.org 4 Test it! Ladislav Prskavec - jsDevMeetup, 10.4. 2018 18
- 19. When is your site not built with the JAMstack? Ladislav Prskavec - jsDevMeetup, 10.4. 2018 19
- 20. Why the JAMstack? Ladislav Prskavec - jsDevMeetup, 10.4. 2018 20
- 21. Why the JAMstack? 4 Better Performance Ladislav Prskavec - jsDevMeetup, 10.4. 2018 21
- 22. Why the JAMstack? 4 Better Performance 4 Cheaper, Easier Scaling Ladislav Prskavec - jsDevMeetup, 10.4. 2018 22
- 23. Why the JAMstack? 4 Better Performance 4 Cheaper, Easier Scaling 4 Higher Security Ladislav Prskavec - jsDevMeetup, 10.4. 2018 23
- 24. Why the JAMstack? 4 Better Performance 4 Cheaper, Easier Scaling 4 Higher Security 4 Better Developer Experience (DX) Ladislav Prskavec - jsDevMeetup, 10.4. 2018 24
- 25. JAMstack 4 https://jamstack.org/ Podcast - Jamstack Radio 4 https://www.heavybit.com/library/podcasts/ jamstack-radio/ Ladislav Prskavec - jsDevMeetup, 10.4. 2018 25
- 26. Gatsby.js Ladislav Prskavec - jsDevMeetup, 10.4. 2018 26
- 27. Ladislav Prskavec - jsDevMeetup, 10.4. 2018 27
- 28. Install (Node.js >8) $ npm install --global gatsby-cli gatsby-generator Ladislav Prskavec - jsDevMeetup, 10.4. 2018 28
- 29. Select starter project $ gatsby-generator Ladislav Prskavec - jsDevMeetup, 10.4. 2018 29
- 30. Develop $ gatsby develop 4 you get local preview with hot reload 4 you get graphql playground for queries Ladislav Prskavec - jsDevMeetup, 10.4. 2018 30
- 31. Big CMS as API Ladislav Prskavec - jsDevMeetup, 10.4. 2018 31
- 32. Using Wordpress API 4 https://www.gatsby js.org/packages/gatsby-source- wordpress/ 4 https://developer.wordpress.org/rest-api/reference/ 4 https://using-wordpress.gatsby js.org/ 4 https://github.com/gatsby js/gatsby/tree/master/ examples/using-wordpress Ladislav Prskavec - jsDevMeetup, 10.4. 2018 32
- 33. Using Drupal API A back end for your front end: a content repository. Powered by Drupal 8, JSON API and OAuth2. - https://github.com/acquia/reservoir 4 https://www.drupal.org/project/jsonapi 4 https://www.gatsby js.org/packages/gatsby-source-drupal/ 4 https://using-drupal.gatsby js.org/ 4 https://github.com/gatsby js/gatsby/tree/master/examples/using- drupal Ladislav Prskavec - jsDevMeetup, 10.4. 2018 33
- 34. Plugins 4 https://www.gatsby js.org/plugins/#official-plugins Ladislav Prskavec - jsDevMeetup, 10.4. 2018 34
- 35. DEMO https://jamstack.166.cz/ https://gatsby.166.cz/ Ladislav Prskavec - jsDevMeetup, 10.4. 2018 35
- 36. Thanks Questions? Ladislav Prskavec - jsDevMeetup, 10.4. 2018 36
- 37. References 4 https://www.gatsby js.org/ 4 https://github.com/prayasht/awesome-gatsby 4 https://github.com/bntzio/gatsby-generator Ladislav Prskavec - jsDevMeetup, 10.4. 2018 37