redshoga.com
すべての投稿へ

Getting started

tutorial
目次

Install astro-micro

Clone the Astro Micro repository.

git clone https://github.com/trevortylerlee/astro-micro.git my-astro-micro
cd my-astro-micro
npm i
npm run build
npm run dev

Customize the website metadata

To change the website metadata, edit src/consts.ts.

// src/consts.ts

export const SITE: Site = {
  NAME: "Astro Micro",
  DESCRIPTION: "Astro Micro is an accessible theme for Astro.",
  EMAIL: "trevortylerlee@gmail.com",
  NUM_POSTS_ON_HOMEPAGE: 3,
  NUM_PROJECTS_ON_HOMEPAGE: 3,
};
FieldReqDescription
TITLEYesDisplayed in header and footer. Used in SEO and RSS.
DESCRIPTIONYesUsed in SEO and RSS.
EMAILYesDisplayed in contact section.
NUM_POSTSYesLimit number of posts on home page.
NUM_PROJECTSYesLimit number of projects on home page.

Customize metadata for individual pages

// src/consts.ts

export const ABOUT: Metadata = {
  TITLE: "About",
  DESCRIPTION: "Astro Micro is a fork of Astro Nano.",
};
FieldReqDescription
TITLEYesDisplayed in browser tab. Used in SEO and RSS.
DESCRIPTIONYesUsed in SEO and RSS.
// src/consts.ts

export const SOCIALS: Socials = [
  {
    NAME: "twitter-x",
    HREF: "https://twitter.com/boogerbuttcheeks",
  },
  {
    NAME: "github",
    HREF: "https://github.com/trevortylerlee",
  },
  {
    NAME: "linkedin",
    HREF: "https://www.linkedin.com/in/trevortylerlee",
  },
];
FieldReqDescription
NAMEYesDisplayed in contact section as a link.
HREFYesExternal url to social media profile.

Deploy the site

To set up RSS and Giscus, it’s easier if the site is deployed and has a URL for you to use. Instantly deploy to Vercel or Netlify by clicking the buttons below.

To deploy manually see Astro’s docs.

Everything new in Astro Micro
Chronological pagination example