324 文字
2 分
Astro入門①
Astro入門①静的サイトをつくろう
超簡単です 誰でも数分でできます
1. git, Node.js, pnpmをインストール
1-1. git
https://gitforwindows.org/
ここからDLしてインスコしてください
選択肢とかチェックは全部デフォでOK
1-2. Node.js
https://nodejs.org/en/
ここからDLしてインスコしてください
選択肢とかチェック(略)
1-3. pnpm(必須では ない)
ターミナル開いて下記コードをコピペしてEnter
npm install -g pnpm
2. Astroの構築
2-1. 一から作る
一から作る場合はnpm createでプロジェクトフォルダ作ればいいです
参考: https://docs.astro.build/ja/install-and-setup/
npm create astro@latest
2-2. テーマファイルを使う
テーマファイルを使うなら各テーマの指示に従ってください
基本はGitHubからcloneしてnpm iするだけじゃないかな
このサイトで使ってる『fuwari』ってテーマもそう
Waiting for api.github.com...
git clone https://github.com/saicaca/fuwari.git ./fuwari
cd ./fuwari
pnpm install
pnpm add sharp
3. ローカルで動作確認
cd プロジェクトフォルダのパス(ex: fuwari)
npm run dev
ローカルサーバー(おそらくデフォルトは”localhost:4321”)へアクセスして、サイトが表示されてればOK
4. 好きにサイトをいじる
好きにしてください
TIP
src/content/
に各ページをmdで書いてつくるよ
著者情報とかはsrc/config.ts
をいじればいいよ
5. ビルド
プロジェクトフォルダ/dist/以下にファイルが出力されます
npm run build
6. アップロード
FTPとかでレンタルサーバーとかに上げてください
以 上