[B! Gatsby] shunmatsuのブックマーク

ブログサイトを作りながら学ぶGatsby入門

昨今のフロントエンドのトレンドとしては「React」や「Vue」などのSPAを構築できるライブラリが挙げられるかと思います。 React製のフレームワークであるGatsbyは手軽に高速なwebサイトを作れると注目されています。本書ではGatsbyの基礎的知識はもちろん、実際にブログを作り公開するまでの実践的な使い方を学べる内容となっています。作るブログサイトのDEMOが見れるURL https://musing-banach-f3a228.netlify.app/

shunmatsu 2021/01/11

リンク

Next.js と Gatsby の比較

最近 React ベースのフレームワークである Next.js と Gatsby を使っています。ある程度客観的に比較できるだけの知識がたまったと思うので、 Next.js と Gatsby の比較情報をまとめてみました。これからどちらを使うか・学ぶか迷っている方のご参考になれば幸いです。あくまで私が知る範囲での説明であり 100% の正確さを保証するものではないのでその点にご留意ください。尚、本記事は Next.js と Gatsby が以下のバージョンが最新のときに書いています。 Next.js 9.4.1 Gatsby 2.22.3 いずれも活発に開発が行われており、バージョンが進むとあてはまらなくなる記述も出てくるものと思います。「そもそもスタティックサイトジェネレーターって何？」「 Jamstack って何？」という方には、別ブログですが次の記事がご参考になると思います

shunmatsu 2020/12/31

リンク

Reactの最強フレームワークGatsby.jsの良さを伝えたい！！ - Qiita

Gatsby.jsって？この記事はGatsby.js Advent Calendar 2019 1日目の記事です。 2日目の記事は@aimofさんのJSの文法すら怪しいフロント初心者がblog用のgatsby starter（っぽいもの）を自作・公開してみたです!! Gatsby.jsはReactで作られた静的サイトジェネレーターです。内部的にGraphQLを用いてデータを取得し、markdownからHTMLを生成、などの処理を簡単に行うことができます。静的サイトジェネレーターが何かと言うと、何かしらの言語で書かれたソースから、静的なHTML/CSS & JavaScriptを生成するツールのことを言います。今現在どの静的サイトジェネレーターが人気かというのを一覧で見れるStaticGenサイトもあります。 Starの数を見るとあのnuxtよりも多いんですよね、日本で使っている方をあ

shunmatsu 2020/12/31

リンク

microCMS + Gatsby + GitHub Actions + S3 でJamStackのチュートリアル | DevelopersIO

What is Jamstack? ここ数年でよく聞くようになったワード。 Jamstackとはウェブサイトを構築および運用するための、技術の組み合わせです。 JavaScript・API・事前にレンダリングされたMarkupの組み合わせでJamStackとのこと。 (以前はJAMStackといってたけど、最近はJamstackだったりする) Jamstackは、「ウェブをより速く・より安全に・より簡単に拡張できるように設計されたアーキテクチャ」であり、生産性を最大化するツールやフレームワーク、ライブラリやワークフローなどを組み合わせて構築されるもの、とのことです。 ※jamstack.orgより従来のCMSではアクセスがあったとき動的にページを生成しますが、 Jamstackではデプロイ以前に必要なページを生成します。具体的には、下記。 Webサイトのフロントエンド全体(HTM