Skip to content

File Structure

The source files have the following setup. There will be additional components and pages that will vary depending on the theme.

  • src/assets/ - Images and other assets
  • src/components/ - Individual components used throughout the site
  • src/config/ - Configuration files for site data
  • src/content/ - Content collections
  • src/js/ - JS utility functions
  • src/layouts/ - Astro layouts, used for multiple pages
  • src/pages/ - Pages / routes of the site. If you see something like [slug].astro, that means it is a dynamic route, and likely pulled from content collections.
  • src/styles/ - Global styles

Code Tree

There is a code tree like this included in the README.md of each theme.

.
├── .tours/
│ └── code-intro.tour
├── .vscode/
│ └── extensions.json
├── public/
│ ├── favicons/
│ │ └── favicon.ico
│ └── robots.txt
├── src/
│ ├── assets/
│ │ └── images/
│ ├── components/
│ │ ├── Component/
│ │ │ ├── ComponentVariant1.astro
│ │ │ ├── ComponentVariant2.astro
│ ├── config/
│ │ └── navData.json.ts
│ ├── content/
│ │ ├── (content collections)
│ │ └── config.ts
│ ├── js/
│ │ └── (various JS utility functions)
│ ├── layouts/
│ │ ├── BaseHead.astro
│ │ └── BaseLayout.astro
│ ├── pages/
│ │ ├── (website pages)
│ │ ├── 404.astro
│ │ ├── index.astro
│ │ └── rss.xml.ts
│ └── styles/
│ └── global.scss
├── .gitignore
├── .prettierrc.mjs
├── astro.config.mjs
├── netlify.toml
├── package.json
├── package-lock.json
├── README.md
├── tailwind.config.cjs
└── tsconfig.json