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.

My portfolio

384 views

Published on

アカツキ社ではなしたことについてです。

Published in: Engineering
  • Be the first to comment

  • Be the first to like this

My portfolio

  1. 1. Gridsome で ポートフォリオを作った話
  2. 2. 自己紹介 岡 恭平 (おかきょー) 同志社大学 理工学部 機械システム学科 Python, JavaScript, TypeScript を利用して Webアプリ開発全般をしています
  3. 3. ポートフォリオ Twitter はコチラ 詳しくはコチラを参照してください。
  4. 4. では本題
  5. 5. 作ろうと思ったきっかけ ポートフォリオ+ ブログのサイトを持ちたい
  6. 6. このようなブログサイト
  7. 7. 技術選定
  8. 8. フロントエンド・フレームワーク
  9. 9. フロントエンド・フレームワーク
  10. 10. フロントエンド・フレームワーク
  11. 11. フロントエンド・フレームワーク
  12. 12. イメージ図
  13. 13. 選ばれたのは
  14. 14. 選ばれたのは でした。
  15. 15. 立ちはだかる壁 Docker を利用しての環境構築 DB, API の設計を1 から組む XSS などのセキュリティを書く サーバーを維持するとなった時の維持費 … etc...
  16. 16. 2ヶ月後たっても 完成せず
  17. 17. JAMStack を知る JavaScript ✖️ APIs ✖️ MarkUp
  18. 18. JAMStack としての利点 より高速かつ優れたパフォーマンス 低コストで拡張が簡単 セキュリティの強化 Git 内で管理できる ... etc
  19. 19. Gridsomeを使うことに
  20. 20. 利点 GraphQL が デフォルトで利用できる
  21. 21. 利点 CMS と連携させて、マークダウンや画像を無料で管理できる Netlify CMS を利用すれば、 サーバーを無料で借りれるだけでなく、 独自の管理サイトで記事の変更を行える
  22. 22. 課題点
  23. 23. 課題点 新しすぎて情報が全くない !
  24. 24. 課題点 ・公式ドキュメントがそこまで親切ではない ・GraphQL を読み込むために、<page-query>, <static-query> という 特殊なタグを使わないといけない(エディター非対応) ・マークダウンが使えるようにするための設定を自身で行う必要がある
  25. 25. サイト完成
  26. 26. 最後に ● Gridsomeは、まだ発展途上の技術 (初リリース:2018 年 9月〜) ● Vue.js で簡単にブログを簡単に公開したい人にはおすすめ ● 開発には、ちゃぶ台返しも重要 ( それまで作ってきたものが無駄にはならない )
  27. 27. ご清聴ありがとうございます

×