Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
個人開発者は Jamstackでブログを書こう!〜WordPressもいいけどJamstackもね〜
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Shumpei O.
August 20, 2023
Programming
170
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
個人開発者は Jamstackでブログを書こう!〜WordPressもいいけどJamstackもね〜
LTイベント「ジャムスタックチョットデキル」にて登壇した資料です。
Shumpei O.
August 20, 2023
More Decks by Shumpei O.
See All by Shumpei O.
Next.js で始めるセキュリティ入門
shumpei0111
0
16
例外処理について考える
shumpei0111
0
230
Reactで汎用的なinputコンポーネントを考える
shumpei0111
0
180
複数人での 大規模サイト移植のテクニック
shumpei0111
1
990
Other Decks in Programming
See All in Programming
技術記事、 専門家としてのプログラマ、 言語化
mizchi
13
6.6k
ECSアプリログをFireLensでコスト削減しようとしたけど諦めた話 in Fargate×Node.js
akihisaikeda
2
4.2k
過去最大のMCPアップデート! 2026-07-28 RC版の謎に迫る
licux
6
410
決定論的オーケストレーションの設計と実装 / Design and Implementation of Deterministic Orchestration
nrslib
4
1.5k
Language Server 使ってる? 〜VSCode と Zed の場合〜 / Are you using a Language Server? ~For VS Code and Zed~
handlename
0
810
不変条件と整合性境界—ビジネスが決める設計判断と実現パターン / Invariants and Consistency Boundaries
nrslib
14
5.9k
Vue × Nuxt × Oxc どこまで使える?実運用の現在地
andpad
0
310
Creating Composable Callables in Contemporary C++
rollbear
0
170
1B+ /day規模のログを管理する技術
broadleaf
0
120
Skillsは効率化、Agentsは"自分の拡張"——Builder時代のエージェント編成(CC Night 2026)
wemra
1
170
TypeScript+Orvalで実現する型安全かつ堅牢でスケーラブルなマルチチャネル通知基盤 / TSKaigi Night talks ~after conference~
d0riven
0
370
ランチタイムLT会3周年!ランチタイムLT会を3年間続けられたお話
y0hgi
1
110
Featured
See All Featured
Testing 201, or: Great Expectations
jmmastey
46
8.2k
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
signer
PRO
0
3.6k
How to Talk to Developers About Accessibility
jct
2
260
Why Your Marketing Sucks and What You Can Do About It - Sophie Logan
marketingsoph
0
180
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
inesmontani
PRO
3
2.3k
A Soul's Torment
seathinner
6
3k
How to build an LLM SEO readiness audit: a practical framework
nmsamuel
1
790
Believing is Seeing
oripsolob
1
160
Mozcon NYC 2025: Stop Losing SEO Traffic
samtorres
1
260
ReactJS: Keep Simple. Everything can be a component!
pedronauck
666
130k
Building Experiences: Design Systems, User Experience, and Full Site Editing
marktimemedia
0
540
Building a Modern Day E-commerce SEO Strategy
aleyda
45
9.1k
Transcript
個人開発者は Jamstackでブログ を書こう! WordPressもいいけどJamstackもね
Shunpei ちょっと株式会社 フロントエンドエンジニア 個人でブログや好きな漫画のファンサイトを作ったりし ています。 過去、hexo / Nuxt.js / Next.js
で Jamstack サイトを 構築して運用していました。 先日入社エントリーを書きました! https://note.com/chot_inc/n/nb7b386a5d1b1 自己紹介
今回の話の対象者 • Jamstackが気になり始めた方 • 駆け出しフロントエンド方 • Reactで何かつくりたいけど思いつかない方
言いたいこと モダンフロントエンドを始めるなら Next.jsでブログ(CMS)を作ろう! そしてそれを使って外部発信しよう!
理由 • Next.jsはバージョンが13になり、日本語の記事も増えた • 書籍も何冊か出てきたので勉強を始めやすい モダンフロントエンド FW、とりあえずReact(Next.js)かVue(Nuxt.js)で 素振りとしてTODOアプリを作ってもいいけど、 「もう少しボリュームがあるものを」となったときに Jamstackでのブログ(CMS)開発がおすすめ
メリット • モダンフロントエンド FWでの基本的なサイトの作り方がわかる • ブログを更新することで名刺がわりになる (実際転職活動時は話がスムーズに進んだ体験がある) とりあえずやってみる。という気持ちが大事。 Next.jsやNuxt.jsはサイト制作・アプリ開発どちらも選択できる FWなので、これを機に始めてみよう!
メリット • モダンフロントエンド FWでの基本的なサイトの作り方がわかる • ブログを更新することで名刺がわりになる (実際転職活動時は話がスムーズに進んだ体験がある) とりあえずやってみる。という気持ちが大事。 Next.jsやNuxt.jsはサイト制作・アプリ開発どちらも選択できる FWなので、これを機に始めてみよう!
ただ、次のような落とし穴もあります ...
エンジニア、 何でも自分で作りたい問題
何でも自分で作りたい問題 そして、だいたい途中で頓挫しがち。
何でも自分で作りたい問題 • 自分でCMSを組みたい! そして、だいたい途中で頓挫しがち。
何でも自分で作りたい問題 • 自分でCMSを組みたい! • 組んだCMSでブログを書きたい! そして、だいたい途中で頓挫しがち。
何でも自分で作りたい問題 • 自分でCMSを組みたい! • 組んだCMSでブログを書きたい! そして、だいたい途中で頓挫しがち。 どっちもやりたい!
何でも自分で作りたい問題 • 自分でCMSを組みたい! • 組んだCMSでブログを書きたい! そして、だいたい途中で頓挫しがち。 一気に作りきれればよいが、開発期間が伸びると頓挫の確率があがる。 確率が高まりきった状態で、なにかの理由で詰まった瞬間、 このプロジェクトが終了する。ターンエンド。 どっちもやりたい!
そんなときの保険 あります。 Next.jsにはソースコード込みで、 たくさんのサンプル(ボイラープレート)が存在します。 なので、そのサンプルを横においておくなり、 改造するなりして自分で組み上げてみると ブレも少なくゴールしやすいです。 Vercel https://vercel.com/templates
まとめ 保険を用意するからダレにくい! 結果的にリリースできる! 運用してサイトを育てることができる! あとは煮るなり焼くなり、自分の実験場として使い倒せる