Home > Web Front-end > JS Tutorial > Making your First Project with Deno

Making your First Project with Deno

DDD
Release: 2024-10-16 06:22:02
Original
1119 people have browsed it

Making your First Project with Deno

To introduce this topic, let's start by defining what deno is. Deno is a runtime environment for JavaScript, TypeScript and WebAssembly, developed by Ryan Dahl, the creator of Node.js. It uses Chrome's V8 engine and is written in Rust12.'

Advantages.

  1. Security by default: Deno has no access to files, networks or environments unless explicitly granted. This reduces the risk of security vulnerabilities.

  2. Native TypeScript support: Deno runs TypeScript natively without additional configuration, which simplifies development and improves productivity.

  3. Standard modules: Deno includes a set of reviewed and audited standard modules, which reduces dependency on external packages and improves code security and stability.

  4. Integrated tools: Comes with useful tools such as a dependency inspector, a code formatter and a linter, which facilitates code maintenance and quality.

  5. Dependency handling: Deno uses URLs to import modules, eliminating the need for a package.json file and a package manager like npm. This simplifies dependency management.

  6. WebAssembly support: Deno supports WebAssembly, allowing you to run high-performance code written in other languages.

Creating your first project

To start with a deno project, use the following command:

 deno init <project_name>
Copy after login

This will create a project that will have the following

- project_name/
  |- main.ts
  |- deno.json
  |- main_test.ts
Copy after login

And that's it, you have created your first deno project.

About modules and imports

When you used to create a project in astro, next.js and others, you installed the dependencies via npm, pnpm, bun, etc. Now this is no longer necessary.

Ways to import

With deno, there are two main ways to import packages. The first is to simply import from that package whether it's npm or another package you use.

In some Next.js, Vite or Astro file of yours for example, one would install the required package and then import it into the file. Now, with deno, instead of installing the package, you simply import it by naming your package manager before the package you require. For example if we wanted to use express, it would be done like this:

  import express from “npm:express”
Copy after login

This indicates that you want to import express, from the npm express package, so, repeating what has already been said, you don't need to install it, just import it!!!!

Or secondly, instead of having to import it with the nomenclature of “npm:”, what we do is edit the created deno.json file, where to this you add the following:

  “imports": {
  “express": ”npm:express”
}
Copy after login

With the code added to deno.json you can now import from wherever you want with just the word express like this:

  import express from “express”
Copy after login

Run your first deno project

Finally, to run the project you no longer need to use npm run, now you use the tasks as shown as follows in the deno.json:

 “tasks": {
    “dev": ‘deno run --watch main.ts’, //it comes by default
  }
Copy after login

This tells us that to run the project, we would simply have to do:

deno task dev
Copy after login

You will be running your deno project with typescript natively.

I hope this mini tutorial has helped you and that you enjoy this new way of making projects with a very promising native typescript runtime.

The above is the detailed content of Making your First Project with Deno. For more information, please follow other related articles on the PHP Chinese website!

source:dev.to
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template