asystのブックマーク - はてなブックマーク

Vue.js + Nuxt.js + GraphCMSでHPリニューアルしました - ShoYamane.me
Vue.js + Nuxt.js + GraphCMSでHPリニューアルしました今年2回目となりますが、HPをリニューアルしました。以前は普通にWordPressで作ってたんですが、Nuxt.jsがV1のRCリリースされてたので本格的に触ってたら題材がないのでHP作り変えるかって感じですね。 Nuxt.jsはVue.jsで作ったSPAをSSR（サーバサイドレンダリング）してくれるやつで大変便利なのですが、サーバーサイドというかnode.jsでゴニョゴニョやってるところもあるみたいでそのへん意識してコード書かないといけないので最初は理解が大変でした。ググっても情報も少ないのでGithubで色んなひとのコードを貪るように読みました。せっかくなのでサーバーレスでいきたいのとCMSどうするかというところで色んなサービス触ったのでその辺の選定を書いてみたいと思います。Vue.js + Nuxt.
asyst 2017/09/08
リンク
WordPressでPWAの対応をしてみたけどやめた話 - ShoYamane.me
まず前置きとしてPWAを否定するものではございませんのでご了承のほどをお願い致します。総括するとまだ時期が早いと思ったので、実装の対応をやめる方向にしました。 WordPressでのPWAの対応方法 PWAの実装はAMP関係なしにできるのですが、AMPと連携させてより効果を発揮させる方法として以下の3つのアプローチがあります。 AMP as PWA = AMPページでPWAを提供する AMP to PWA = 検索経由でAMPページを表示して後、PWAを提供する AMP in PWA = PWAをAMPで実装する私の個人的な所感ですが、すでにある既存サイトをできるだけ工数をかけずにPWA対応するなら「AMP to PWA」が一番良いのかなと思いました。で、その実装方法は以下の記事を参考にしました。脱ネイティブ！Googleが推進する「PWA」にたった数時間で対応する方法上記の方法を
asyst 2017/06/11
リンク
Vue.js + Nuxt.js + Element + WP REST APIでHPを作ってみた
今回、Vue.js + Nuxt.jsの勉強ということで何か作りたいなと思っていたところ、HP作ってみるかと思ったので早速やってみました。どんな感じか早速見てもらったほうが早いと思うので以下のリンクをご覧下さい。（スマホ対応はしていません。） DEMO なぜVue.js + Nuxt.jsでHPを作るのか？ Vue.jsが流行りで勉強目的だったのですが、jQueryでごにょごにょやっていたところがとても楽にできます。コンタクトフォームのバリデーションやポップアップ、ツールチップ、ページ遷移アニメーションなどなどです。 Nuxt.jsを使うことによりある程度サーバーでレンダリングもやってくれますので、SEO対策にも良さそうです。またルーティングなども自動でやってくれますのでコンポーネントを作ることに注力できます。 Vue.js + Nuxt.jsでHPを作った感想メリット Element
asyst 2017/04/02
リンク
1