In a world the place all people brags about shorter construct instances, a brand new and Fre$h framework comes with zero construct steps.
If this isn’t sufficient to persuade you, possibly the “Island Structure” and first-class TypeScript utilization does.
It’s a Full-Stack Framework on SSR (Server Aspect Rendering).
You possibly can examine it to Ruby on Rails. The twist: you write your apps in TypeScript. That is attainable since Fre$h is constructed on prime of Deno.
Why Was Deno Created?
“Deno was created particularly to repair what Dahl perceived as the important thing weaknesses of Node.” — Supply
This setup permits you zero construct steps and TypeScript as supported language.
These islands are component-based and recommend an organized view of the web page. The entire view is mixed via static and dynamic islands.
The static components are pure HTML and don’t want “hydration.” The dynamic areas mix HTML and scripts which are opted in after rendering.
The frameworks Astro and Marko additionally use the Island Structure.
However a number of issues can get difficult: Authentification and Stateful Routing.
It makes it straightforward to construct quick, scalable, and dependable functions by making use of these rules:
- Scale back web page load instances to a minimal
- Decrease consumer workload.
- Make errors having a small blast radius.
Routes describe how a request for a given path must be dealt with.
Routes have two primary components; a route can have both one or each, however by no means neither.
- Handler — Referred to as for each request to a particular route.
- Element — Template for a web page that will get SSR’d.
Islands enable client-side interactivity in Fre$h.
Islands are remoted Preact elements. In comparison with different elements, they’re rendered on the consumer.
Islands are outlined by making a file within the
islands/ folder in a Fre$h venture.
Static belongings are positioned in a
static/ listing within the venture root. These belongings are served on the root of the webserver.
Middlewares will intercept any needed request.
You possibly can then carry out customized logic earlier than or after the route handler. Thus it permits you to modify or test requests and responses. Frequent operations needing interceptors are logging, authentication, and efficiency monitoring.
Fre$h permits you to customise default error pages.
For instance, customise the 404 web page by making a
_404.tsx file within the
Fre$h routes requests based mostly on their URL path.
Sometimes any route specifies which path they’re invoked for. Accomplished by utilizing the title of the file. Routes may also outline a customized URL sample to match in opposition to for extra superior use instances.
This file-based routing is already applied in Subsequent.js.
Asynchronous handler features are used for server-side information fetching.
Utilizing the handler features to name a render operate with the info to be rendered as an argument. Returning it to the consumer to retrieve the info as a rendered element.
To begin your first instance venture, open their Getting Began and dive proper into it 🚀
Extra of a reader? Learn their documentation first 📖