Astro、TypeScript、Tailwind CSS を使用して作成された私の個人ブログ。 Vercel がホストする goulven-clech.dev でライブします。
ソース コードは 0BSD ライセンスに基づいて提供されており、帰属は歓迎されますが、必須ではありません。ブログのテキスト コンテンツは CC BY 4.0 証書に基づいて提供されており、帰属が必要です。ただし、両方とも、商用または個人を問わず、いかなる目的でも自由に使用、コピー、変更、配布することができます。
一部のエントリでは、外部ソースからのテキスト、画像、またはリソースを引用する場合があります。元のライセンスが適用され、作者がわかっている場合はその作者を示します。
このプロジェクトの核心は、Astro で作成された他のブログと似ています。まず、私のエントリ「Astro でブログを立ち上げる」を読んでください。ただし、少しずつ、皆さんの興味を引くかもしれない独自の機能をいくつか追加しました。主な機能は次のとおりです。
検索バー: Astro および Web コンポーネントのみで作成され、ユーザーの入力に基づいてブログ エントリをフィルターします。
目次: Astro と MDX を使用して、見出しに基づいて目次を生成します。ネストされたリストを使用します。
Open Library & Google Maps ブロック: API 結果をブログ エントリに適切に表示します。
ダーク モード: ライト、ダーク、システム カラー スキームを切り替えます。ローカル ストレージを使用して、ユーザーの選択を保持します。
カスタム イメージ サービス: Erika のブログから取得され、パフォーマンスが向上し、イメージの読み込み中にプレースホルダーが表示されます。
/
├── src/
│ ├── content/ -> Sub repository
│ ├── assets/
│ │ └── base.css
│ ├── components/
│ │ └── Card.astro
│ ├── layouts/
│ │ └── Layout.astro
│ ├── pages/
│ │ └── index.astro
│ ├── env.d.ts
│ └── [...utils].ts
├── public/
│ └── Iosevka-Regular.woff2
├── [... config files]
├── README.md
└── package.json
pages/
このブログのすべてのページが.astro
ファイルとして含まれています。
layouts/
とcomponents/
すべてのWebコンポーネントが`.astro`ファイルとして含まれています。
指示 | アクション |
---|---|
pnpm install | 依存関係をインストールします |
pnpm run dev | localhost:3000 でローカル開発サーバーを起動します |
pnpm run build | 運用サイトを./dist/ に構築します。 |
pnpm run preview | デプロイする前にビルドをローカルでプレビューする |
pnpm run astro ... | astro add 、 astro check などの CLI コマンドを実行します。 |
pnpm run astro --help | Astro CLI を使用してヘルプを表示する |
すべてのコマンドは、プロジェクトのルートまたはターミナルから実行する必要があります。 PNPM の代わりに、NPM または Yarn を使用することもできます。