Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/fastrodev/template
Initial template for fastro project
https://github.com/fastrodev/template
deno preact tailwind
Last synced: 3 months ago
JSON representation
Initial template for fastro project
- Host: GitHub
- URL: https://github.com/fastrodev/template
- Owner: fastrodev
- Created: 2024-01-24T12:43:55.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2024-08-13T07:28:21.000Z (4 months ago)
- Last Synced: 2024-09-26T18:44:48.816Z (3 months ago)
- Topics: deno, preact, tailwind
- Language: TypeScript
- Homepage: https://fastro.deno.dev
- Size: 60.5 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
---
title: "Getting started"
---
Before running the application, it is recommended that you use either Linux or
macOS. If you are a Windows user, please utilize the Windows Subsystem for Linux
(WSL) to run Linux.
It is also recommended that you use Microsoft Visual Studio Code to create and
update all files.
## How to run
```
deno task start
```
During the first run, the application will create the `.fastro`, `node_modules`,
and `static/js` folders. Do not modify these folders, as they are essential for
the application's modules to function correctly.
## Application Structure
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
│ ├── js
│ │ └── index.js
│ └── 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/js/index.js | The SSR JS bundled files generated by fastro framework |
| static/tailwind.css | The CSS file that needed by tailwind css |