Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

PWA night vol.11 20191218

PWA Night vol.11 で Craft CMS と PWA っぽい話をしてきた

  • Login to see the comments

PWA night vol.11 20191218

  1. 1. 

  2. 2. CMS
  3. 3. https://trends.builtwith.com/cms/Craft
  4. 4. 
 
 
 

  5. 5.
  6. 6. $ vue create postcraftvue $ vue add vuetify $ vue add apollo // apollo GraphQL
  7. 7. import gql from 'graphql-tag' // export const ALL_CUSTOMERS = gql` query{ customers: entries( section:[news], type:[News]) { id title slug postDate ...on News{ c_textarea01 } } } `
  8. 8. <script> import {ALL_CUSTOMERS} from "../constants/test"; export default { name: "CustomerTable", data: () => ({ customers: [], headers: [ {text: 'ID', value: 'id'}, {text: ' ', value: 'title'}, ], }), apollo: { customers: ALL_CUSTOMERS } } </script>
  9. 9. <template> <v-app> <CustomerTable/> </v-app> </template> <script> import CustomerTable from './components/test' export default { name: 'App', components: { CustomerTable }, } </script>
  10. 10. import gql from 'graphql-tag' export const CREATE_CUSTOMER = gql` mutation createNewEntry($title:String, $c_textarea01:String) { upsertNews( title:$title, c_textarea01:$c_textarea01, ){ id title slug postDate ...on News{ c_textarea01 } } } `
  11. 11. // git $ git init $ git add . $ git commit -m "init for heroku" // $ heroku create hogehoge // heroku deploy $ git push heroku master // $ heroku open
  12. 12. $ yarn add @vue/cli-plugin-pwa —dev $ git add . $ git commit -m "add @vue/cli-plugin-pwa" $ vue add pwa $ git push heroku master
  13. 13. Vue.js, GraphQL Craft CMS https://note.mersy418.com/article/vuejs-graphql-pwa-craftcms
  14. 14. https://craft.cloud/
  15. 15. + $59/year Pro $299 Solo Free admin + $39/year ECCommerce $199- Dev Free Pro 
 ※ Lite Pro craftcms.docker test-foo.example.jp
  16. 16. CMS::Lover::bitpart Update bit part, everyday!!

×