Citric
Citricā¢, the āblazing fastā š and ābleeding edgeā š¤” Fresh fork that you donāt need, unless you want:
- Islands on any directory, only suffix the component with
.island.{tsx|ts|jsx|js}
. - File-system routing Ć la
Next.jsSvelteKit, including nested layouts (WIP). - More premade plugins, like SPA client navigation.
- And more unnecesary and forced stuff on this refreshing frankenstein.
ā Why?
The real question is: why not?
š Documentation
The documentation is the same as Fresh docs, but with some differences:
- Routes now are folder based, and page components need to be placed on
+page.{tsx|ts|jsx|js}
files, same for special page components like_{app|404|500}.{tsx|ts|jsx|js}
->+{app|404|500}.{tsx|ts|jsx|js}
or/foo/_middleware.ts
->/foo/+middleware.ts
, for example. Now is possible to have layouts and nested layouts like SvelteKit with files like/+layout.{tsx|ts|jsx|js}
.
š Getting started
Install Deno CLI version 1.25.0 or higher.
You can scaffold a new project by running the Fresh init script. To scaffold a
project in the deno-citric-demo
folder, run the following:
deno run -A -r https://citric.deno.dev deno-citric-demo
Then navigate to the newly created project folder:
cd deno-citric-demo
From within your project folder, start the development server using the
deno task
command:
deno task start
Now open http://localhost:8000 in your browser to view the page. You make changes to the project source code and see them reflected in your browser.
To deploy the project to the live internet, you can use Deno Deploy:
- Push your project to GitHub.
- Create a Deno Deploy project.
- Link the Deno Deploy
project to the
main.ts
file in the root of the created repository. - The project will be deployed to a public $project.deno.dev subdomain.
For a more in-depth getting started guide, visit the Getting Started page in the Fresh docs.