1.
Gridsome で
ポートフォリオを作った話

2.
自己紹介
岡 恭平 (おかきょー)
同志社大学 理工学部 機械システム学科
Python, JavaScript, TypeScript を利用して
Webアプリ開発全般をしています

3.
ポートフォリオ Twitter はコチラ
詳しくはコチラを参照してください。

4.
では本題

5.
作ろうと思ったきっかけ
ポートフォリオ+ ブログのサイトを持ちたい

6.
このようなブログサイト

7.
技術選定

8.
フロントエンド・フレームワーク

9.
フロントエンド・フレームワーク

10.
フロントエンド・フレームワーク

11.
フロントエンド・フレームワーク

12.
イメージ図

13.
選ばれたのは

14.
選ばれたのは
でした。

15.
立ちはだかる壁
Docker を利用しての環境構築
DB, API の設計を1 から組む
XSS などのセキュリティを書く
サーバーを維持するとなった時の維持費 … etc...

16.
2ヶ月後たっても
完成せず

17.
JAMStack を知る
JavaScript ✖️ APIs ✖️ MarkUp

18.
JAMStack としての利点
より高速かつ優れたパフォーマンス
低コストで拡張が簡単
セキュリティの強化
Git 内で管理できる ... etc

19.
Gridsomeを使うことに

20.
利点
GraphQL が デフォルトで利用できる

21.
利点
CMS と連携させて、マークダウンや画像を無料で管理できる
Netlify CMS を利用すれば、
サーバーを無料で借りれるだけでなく、
独自の管理サイトで記事の変更を行える

22.
課題点

23.
課題点
新しすぎて情報が全くない !

24.
課題点
・公式ドキュメントがそこまで親切ではない
・GraphQL を読み込むために、<page-query>, <static-query> という
特殊なタグを使わないといけない（エディター非対応）
・マークダウンが使えるようにするための設定を自身で行う必要がある

25.
サイト完成

26.
最後に
● Gridsomeは、まだ発展途上の技術 (初リリース：2018 年 9月〜)
● Vue.js で簡単にブログを簡単に公開したい人にはおすすめ
● 開発には、ちゃぶ台返しも重要
( それまで作ってきたものが無駄にはならない )

27.
ご清聴ありがとうございます