このサイトについて
私はエンジニアとして仕事をする際にNotionに大量のメモを取っています。
また、人にコードを教えるときもNotionで記事を書いて配っています。
そうしていると、
・自分用のメモを自分だけで見るのはもったいない。何か他の人の役に立つものがあるかも知れない。
・Notionで大量に書いた記事そのままでは、他の人は何がどこに書いてあるか分かりづらい。
こういったことを考えるようになり、このサイトを作り始めました。
まだまだ作り始めたばかりなので、試行錯誤中ですが、参考程度に読んでいただけたらと思います。
Thanks:このサイトの技術スタック
素晴らしいものを世の中に出してくれてありがとうございます。
私はあなた達の仕事を尊敬します。(願わくば私もそのような人でありたい)
Next.js
Reactのフレームワークです。app routerを採用しました。
Vercel
Next.jsで作ったサイトをdeployしています。とても楽。
GSAP
画面にアニメーションを付けるのに利用しました。
microCMS
ヘッドレスCMS。無料ではモデルが3つしか作れないので、後述のNewtと併用。
有料になると一気に料金上がる。。。
Newt
ヘッドレスCMS。
こちらも使いやすい。ただ、記事の上限が2MBだったので、画像を多用する記事作成で制限に引っかかってしまった。画像だけ他で管理するのも面倒なので、どうしよう。NotionかKurocoを検討中。
Kuroco
ヘッドレスCMS。
使いやすい。従量課金性なので運用しながら様子を見てみる。
Firebase
Googleログイン機能を試しに入れてみました。
まだ何も機能はないですが、お気に入り機能とか付けていきたいと思っています。
Next.js+ヘッドレスCMSではじめる! かんたんモダンWebサイト制作入門
書籍:このサイトを構築するのに大変参考にさせてもらいました。
HubSpot
CRM・SFA・MA・CMSで使われるサービスですね。
Formで使っています。reCaptchaを入れたら、スパムが止まりました。
フォルダ構成
良い構成を模索中
.
├── README.md
├── app
│ ├── _actions
│ ├── _components
│ ├── _constants
│ ├── _libs
│ ├── _styles
│ ├── api
│ ├── contact
│ ├── favicon.ico
│ ├── globals.css
│ ├── input
│ ├── layout.tsx
│ ├── linux
│ ├── lp
│ ├── news
│ ├── not-found.module.css
│ ├── not-found.tsx
│ ├── page.module.css
│ ├── page.tsx
│ ├── portfolio
│ ├── robots.txt
│ ├── sitemap.ts
│ ├── system
│ └── web
├── database-debug.log
├── dataconnect
├── dataconnect-debug.log
├── doc
├── firebase.json
├── firestore-debug.log
├── firestore.indexes.json
├── firestore.rules
├── functions
├── generated
├── img-mv.jpg
├── next-env.d.ts
├── next.config.mjs
├── no-image.webp
├── node_modules
├── package-lock.json
├── package.json
├── public
├── storage.rules
├── tsconfig.json
└── ui-debug.log
Thanks Design
素晴らしい素材をありがとう。
時短だ
フリーペンシル