Application Structure

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