Skip to content

Astro

Astro is the core of DARST, therefore we leverage the full potential of it. Astro has been configured for support for:

  • Actions - Run server-side calls without relying on API;
  • Markdown & MDX - Layouts have been optimized to support Markdown & MDX flawlessly;
  • Various dev tools - Little utilities such as Tailwind breakpoints preview, meta tags, page insights;
  • Others coming soon…

File structure

The file structure is important for organization. It has been optimized to be simple. You are free to tweak your file structure just the way you want.

  • Directorypublic/ Static assets meant to be used externally
  • Directorysrc/
    • Directoryactions/ Server actions
    • Directoryassets/ Static assets that are used by the app
    • Directorycomponents/ All components
      • Directorydemo/ Demo components, to be deleted
      • Directoryui/ Primitive components
    • Directorycontent/ Content Collections
    • Directorylayouts/ All layouts
    • Directorylib/ Code that contains logic
      • Directoryhooks/ React hooks
    • Directorypages/ Pages
    • Directorystyles/ All stylesheets

Please see Astro docs for more information.

Prefetching

You can optimize page loads by enabling prefetching.

@/config.ts
import type { AppConfig } from "./types/app-config";
export const config: AppConfig = {
name: "DARST",
description: "A starter kit for efficient people",
url: "https://darst.notangelmario.dev",
author: "Savin Angel-Mario",
authorHandle: "@notangelmario",
authorUrl: "https://notangelmario.dev",
prefetch: true,
...
};

This will enable prefetching upon hover on all a tags. A script will load the page which the tag points to, and optimize page loading times upon navigation.