Deno has released with all the latest features and improvements as compared to Node.js, which every programmer loved to use. There are several frameworks in Deno, as well as we have in Node.js. All the frameworks have their features. In this article, we are going to discuss Drash a deno rest microframework. According to the latest Github statistics, it stands on the thirds position with 462 stars among all the Deno frameworks.
Table of Contents
What is Drash?
Drash is a Deno rest microframework for HTTP server with zero dependencies. It is designed to assist you in building your projects rapidly. You can make a web page, an API, an SPA (Single Page Application), or even a static HTML page. It has everything which a programmer needs. So, it’s up to you how you use it.
Inspirations of Deno Drash A rEst MICROFRAMEWOK:
Drash took inspiration from four different frameworks and result in a single versatile framework.
Flask:
It is a framework for python. Drash adopts the feature of being micro and extensible. It means that it aims to keep it simple and doesn’t make any decision on its own. Instead, it is up to you that what you need for your project like which database.
Laravel:
It is a framework for PHP. Deno motivated by its middleware. Middleware provides a mechanism to filter HTTP requests which enter in your application. For example, including a middleware helps you to identify the users are authenticated or not.
Tonic:
Tonic is a RESTful web app PHP framework. Drash took the concept of resources from it.
RESTful principles:
Drash took the idea of content negotiation, HTTP verbs, URIs, etc.
How to create a Drash project:
import { Drash } from "https://deno.land/x/[email protected]/mod.ts";
class HomeResource extends Drash.Http.Resource {
static paths = ["/"];
public GET() {
this.response.body = "Hello! Welcome to the first Deno Drash Project";
return this.response;
}
}
const server = new Drash.Http.Server({
response_output: "text/html",
resources: [HomeResource]
});
server.run({
hostname: "localhost",
port: 8000
}); Unlike other frameworks, Drash uses resource classes to handle requests. You can create a resource by extending Drash.Http.Resource class. You can define all of your resource classes by continuing Drash.Http.Resource because it is the base class.
In the above example, HomeResource is the only class that is registered by the server, and the Drash server only registered those classes which are specified in the resources config.
While registering resources, Drash servers also register their paths as accessible URI. An accessible URI means those URI which a user can target. If a user tries to access a non-accessible URI, it generally results in a response other than the 200 OK. The default response in these cases is 404 Not Found.
You can also create other resources which should also extend from Drash.Http.Resource class. And then add those resources in the resources config.
You can also create these resources in separate files and then import them in your app.ts file. Don’t worry; you’ll learn this in our next example.
For running this code, you have to give network permission through the security flags.
How to serve static paths in Drash?
Here, you’ll learn how to create a simple HTML page that can serve a CSS file.
Structure of the project folder:
For building a page which could serve static paths, your folder structure should look close to this one.
Now, let’s write code.
First, let look towards the app.ts file.
import { Drash } from "https://deno.land/x/[email protected]/mod.ts";
import HomeResource from "./home_resource.ts";
const server = new Drash.Http.Server({
directory: "D:/Deno", //Path of your project
resources: [HomeResource],
response_output: "text/html",
static_paths: ["/public"]
});
server.run({
hostname: "localhost",
port: 8000
});
console.log("Server listening: http://localhost:8000"); The static_paths config tells your Drash server that on what path the static files are present, which can be served to clients. In the directory config, you have to write the path of your project, but remember one thing, it should use the forward-slash /. If you use the backslash \ then the server will be unable to resolve your path.
The resource has a separate file which imports in our app.ts file. Now, create the resource file
import { Drash } from "https://deno.land/x/[email protected]/mod.ts";
export default class HomeResource extends Drash.Http.Resource {
static paths = ["/"];
public GET() {
this.response.body = `
<!DOCTYPE html>
<html>
<head>
<title>Deno Drash</title>
<link href="/public/index.css" rel="stylesheet">
</head>
<body>
<h1 class="greeting">Hello! The text is in center with sky blue background</h1>
</body>
</html>`;
return this.response;
}
} This resource file will serve HTML, and this HTML is referencing the index.css file.
Now, create the index.css file in the static folder of the project.
* {
margin: 0;
}
.greeting {
text-align: center;
background-color: #b2ebf2;
} For running your application, you have to give a network and read permission as well. If you forget to add the security flag for reading, then the styling will not apply to your HTML document because the server will be unable to read that file.
Now, you should receive the following response.
How to create a skeleton of a Drash Application:
Drash provides a primary tool that helps you create a Drash frame so you can start building something great.
You don’t need to install any Drash script. You can create a skeleton of your choice (An API, a full web app, or an entire Web app with Vue) inside your working directory.
Open your command prompt, make sure you are in the directory you want to create your project.
mkdir my-drash-project
cd my-drash-project The first command will create a folder, and with the help of the second command, you’ll be in your newly created folder.
To make an API:
deno run --allow-run --allow-read --allow-write --allow-net https://deno.land/x/drash/create_app.ts --api To make a web app:
deno run --allow-run --allow-read --allow-write --allow-net https://deno.land/x/drash/create_app.ts --web-app To make a web app with Vue:
deno run --allow-run --allow-read --allow-write --allow-net https://deno.land/x/drash/create_app.ts --web-app --with-vue Conclusion:
Drash is one of the most versatile frameworks in Deno. It simplifies our work and helps us to build our application in an organized manner. In this article, we’ve learned that what Drash is, how you can start your first application with this framework, and how to serve static paths in Drash. I hope this helps you to understand about Deno Drash.
