/docs/structure.md | fastro@v0.94.1

title: Application Structure description: flat modular architecture for improved readability. image: https://fastro.deno.dev/fastro.png previous: start next: hello

You can find more detailed instructions in the source code.

This is the application structure generated by tree -I 'node_modules' command.

In this initial setup, the application consists of two modules: index, user and markdown modules.

index is for SSR page module.
user is for API module that provide data.
markdown is for handling readme file.

You can modify or add new one as your need.

.
├── components
│   ├── footer.tsx
│   └── header.tsx
├── deno.json
├── main.ts
├── modules
│   ├── index
│   │   ├── index.handler.ts
│   │   ├── index.layout.tsx
│   │   ├── index.mod.ts
│   │   ├── index.page.tsx
│   │   └── index.service.ts
│   ├── markdown
│   │   ├── markdown.mod.ts
│   │   └── readme.layout.tsx
│   └── user
│       ├── user.handler.ts
│       ├── user.mod.ts
│       ├── user.service.ts
│       └── user.types.ts
├── readme.md
├── static
│   └── tailwind.css
├── tailwind.config.ts
└── utils
    └── db.ts

Files and Folders Descriptions

Folder / File	Description
deno.json	The deno configuration file. It defines how the application behave and the shortcut of deno task command. For example: `deno task start`
tailwind.config.ts	The tailwind configuration file. See: https://tailwindcss.com/docs/configuration
main.ts	The application entry point. Modify it to add a new module or application-level middleware.
utils/	The folder that contains all library needed. Put your custom helpers here.
utils/db.ts	The files that needed to load Deno.Kv
modules/	The application modules. It contains folders of modules.
modules/index/	The index modules. It contains page, layout, handler and SSR service.
modules/user/	The user modules. It contains user API endpoint and service that connected to Deno.Kv
modules/markdown/	The markdown modules. It contains markdown layout and middleware initiation.
*.mod.ts	The index file for a module. Modify it to add new endpoints (API), middlewares, or pages
*.handler.ts	The handler file for a module. It handles the request from endpoints.
*.service.ts	The service file for a module. It functions is to provide data consumed by the handler.
*.types.ts	The types file for a module. Place all types and interfaces here.
*.page.tsx	The page file for a module. Create your new page with this extension.
*.layout.tsx	The layout file for a module. Wrap your page with this layout.
components/	The folder that contains all components
components/header.tsx	The file for a Header component
components/footer.tsx	The file for a Footer component
static/	The folder that contains all static files needed by html files
static/tailwind.css	The CSS file that needed by tailwind css