コンテンツにスキップ

はじめに

Astroとは?

Astroは、コンテンツにフォーカスした高速なWebサイトを構築するためのオールインワンWebフレームワークです。

  • コンポーネントアイランド: 高速なウェブサイトを構築するための新しいウェブアーキテクチャー。
  • サーバーファーストのAPI設計: ユーザーのデバイスから高コストのハイドレーションをなくします。
  • デフォルトでゼロJS: サイトを遅くするJavaScriptランタイムオーバーヘッドはありません。
  • エッジ対応: DenoやCloudflareのようなグローバルなエッジを含め、どこでもデプロイできます。
  • カスタマイズ可能: Tailwind、MDX、その他100以上のインテグレーションから選択可能です。
  • 特定のUIに依存しない: React、Preact、Svelte、Vue、Solid、Litなどをサポートします。

Astroの特徴については、Astroを選ぶ理由の詳細な説明をご覧ください。✨

astro.newにアクセスし、さまざまなテンプレートから選んで始めましょう。ブラウザでAstroの完全版を使って遊んでみてください。

便利なcreate astroCLIウィザードを使って、新しいAstroプロジェクトをローカルに立ち上げて実行しましょう!

Terminal window
# npmで新しいプロジェクトを作成する
npm create astro@latest

インストールガイドには、CLIウィザードによるAstroのインストール、既存のAstro GitHubリポジトリからの新しいプロジェクトの作成、Astroの手動インストールについて、完全な手順が記載されています。

Astroサイトの主要なコンセプトとパターンの例をご覧ください。

📚 サイトに最初のページを追加する

📚 ディレクトリ構成についてもっと読む。

📚 Astroのファイルベースのルーティングについて詳しく学ぶ。

……完全なAPIドキュメントはリファレンスタブの下にあります。

🧰 新しいプロジェクトを既成のテーマを使って始める。

🧰 公式やコミュニティのプラグインとコンポーネントを使ってサイトをカスタマイズする。

🧰 サイトショーケースを見て、インスピレーションを得る。

……インテグレーションの使い方ガイドをご覧ください。

活発でフレンドリーなコミュニティ、Astro Discordにぜひ参加してください。コミュニティと情報共有したり、コミュニティから力を借りられます!

💬 #general チャンネルで挨拶する。

💬 サポートチームに #support チャンネルで質問する。

💬 #showcase チャンネルであなたの作ったものをシェアする。

Astroブログ

Astro更新履歴

このドキュメントの翻訳は、以下の素晴らしい方々によって提供されています。翻訳に参加しましょう!

このドキュメントは、多くの方々の協力によって提供されています。GitHubで参加しましょう!