Astro PR

Astroでページを作成する方法【JSフレームワーク】

記事内に商品プロモーションを含む場合があります

JSフレームワークの「Astro」でページを新規作成する方法を紹介します。
※ここでは、Astro環境を用意されている前提で進めます。

Astroでページを作成する方法

Astroに新規ページを追加する

Astroでページを追加する際は、下記にファイルもしくはフォルダを用意しページを追加する必要があります。

「プロジェクトフォルダ(npmで作成する際に設定したフォルダ名)/src/pages/」

この中に新しくファイルを作っていきます。
Astroでは、Astroの専用ファイル「.astro」と「.html」「.md」が使用可能です。

「xxx.com/sample.html」のような形でページを作成したい場合

「プロジェクトフォルダ(npmで作成する際に設定したフォルダ名)/src/pages/」直下に直接ファイルを作成します。

「xxx.com/sample/」のような形でページを作成したい場合

「プロジェクトフォルダ(npmで作成する際に設定したフォルダ名)/src/pages/sample/index.astro」の用にフォルダを作成し、中にファイルを追加します。
どちらもHTMLで作るのと同じなので、非常に簡単に新規ページを作成できます。

ABOUT ME
シラツキ
Web制作会社で働くフロントエンドエンジニア(コーダー)。 ココナラでもお仕事募集しております。 HTML,CSS,JS,WordPress,EC-CUBE,Next.jsなど制作に役立つ情報を発信していきます。 webサイトの運営、修正、制作などお仕事も募集中! お気軽にご相談ください。