astro inkダウンロード - astro inkソースコードのダウンロード

astro ink

その他のカテゴリー

2.0.0 (2023-12-18)

ダウンロード

Astro Ink は、最小限のマークダウンベースのブログのニーズに応えるために作成された最小限のテーマです。これには、軽量でパフォーマンスの高い個人ブログを作成する際に必要になる可能性のある基本的な Astro コンポーネントがほぼすべて同梱されており、デフォルトで Javascript の配布量を減らすことに重点を置いています。

アストロバナー

Hugo's Ink テーマに大きな影響を受けており、美しく最小限のブログの基礎を提供しながら、軽さを保つよう努めています。

特徴

Minimal、Crisp、Markdown-Blog Ready は内部で常に Astro の最新 (現在2.xリリース) に更新されます。
Svelte Ready - 軽量でパフォーマンスが高く、Astro の POV からより親しみやすいものを維持するために、Svelte はテーマスイッチャーなどのインタラクティブコンポーネントに使用されます。
モジュラー- 構造は高度にモジュール化されており、コンポーネントは 1 つのジョブだけを実行し、1 つのジョブを適切に実行します。
Astro 2.0 コンテンツコレクション + 動的ページ- 動的ページと同様に Next.js を使用して、ページ分割された結果を含むタグベースの分類システムをサポートする準備ができており、すべて構成可能です
ダークモードとカラーコード- ダークモードと、 tailwind.config.js使用して選択された6 つ以上のカラーモードをサポートします。 dev build /コマンドでTHEME_KEY渡すことができます (例: THEME_KEY=purpleheart astro build/dev 。使用されているカラーテーマを変更できます。利用可能なテーマはすべて、tailwind.theme.config.js にあります。ブログセクションをカスタマイズするには、ここで参照されている Tailwind Typography のprose-{color}クラスのいずれかを追加します。
Netlify CMS - Netlify 資格情報を使用してyour-site.netlify.com/admin例: astro-ink.netlify.app/admin にアクセスし、 /blogディレクトリ内のすべての投稿を追加/編集/更新します。 Netlify Identity(https://app.netlify.com/sites/your-site/settings/identity#registration) と Git Gateway(https://app.netlify.com/sites/your-site/settings/identity) が必要です。 #サービス) が有効になりました。
将来の投稿(Github Actions を使用) - YYYY-MM-DD形式で将来のdateを指定して/src/draftsディレクトリに投稿を作成し、特別に作成された Github Action によって指定した日付に自動公開されます。チェック間隔はGithub Actionで設定できます。
クライアント側検索- クライアント側検索機能を使用して、ユーザーがブログ投稿にすばやくアクセスできるようにします。 Lunr.js
カウンターfeat.を見るRedis/Upstash Redis - Redis ホストを構成し、その接続 URL をホスティングプロバイダーのコンソール (Vercel、Netlify など) または.envファイル (ローカル開発) に配置し、ここで接続コードのコメントを解除してデプロイします。あなたのサイトにはダイナミックビューカウンターが搭載されています。構成する必要があるさまざまな環境値を理解するには、.env.example を参照してください。
YT チャンネルをサポートするメディアページ- 設定ファイルのytChannelId定数にチャンネル ID を入れるだけで、メディアページに YT チャンネルコンテンツを簡単に表示できます。必要に応じて、 USE_MEDIA_THUMBNAIL falseに設定して、YT チャンネルの動画リストから画像のサムネイルを無効にします。
著者カード- 構成ファイル内でUSE_AUTHOR_CARD trueに設定することで、投稿ベースまたはサイト全体の著者カードを簡単に追加できます。これには Twitter フォローボタンが含まれます。
テーマ画像オーバーレイ- 必要に応じてオーバーレイを有効にすることができます。設定ファイル内でUSE_POST_IMG_OVERLAY trueに設定することで、投稿画像の上に素敵なテーマのグラデーションを追加できます。

どうやって始めればいいですか？

このテンプレートを複製し、その複製から作業を開始するだけです。 dev 、 buildなどの一般的な NPM コマンドはすべて自由に使用できます。使用可能なすべてのコマンドのリストについては、 package.json を参照してください。

注: git履歴をまったく使用せずにテンプレートをクローンするには、 npx degit one-aalam/astro-ink使用します。

注: このテンプレートは、デフォルトでserver (SSR 対応) 出力を生成します。 staticビルドが必要な場合

astro.config.js でoutput serverからのstaticに変更します
adapter: vercel()
ビューカウンター API を削除する
config.ts 内でUSE_VIEW_STATSをfalseに設定します。

注: npm run dev 。

mv .env.example .envを実行して.envファイルを作成します (Linux ディストリビューションまたは Mac を使用している場合)
SITE_URI変数をSITE_URI=http://localhost:4321として設定します ( 4321 はプロジェクトが実行されているポートです)。