NOVAS: Accelerating Svelte and Deno Application Generation.

Sylvia Liu
Nov 24 · 4 min read
image courtesy of NASA

💡 Introduction

Configuring applications from the ground up is likely to be one of the most time-consuming and cumbersome barriers in development — especially when wanting to try new technologies. What if you want to quickly hit the ground running to start programming in that new framework and runtime without needing to jump through hoops of set up? Perhaps you’ve heard about this more performant framework than React and Vue.js that you were interested in using. Maybe also that attractive Node.js runtime alternative with its default security and compatibility with TypeScript? Are these technologies even compatible with one another out-of-the-box?

hello, novas

👋 Meet NOVAS

NOVAS is a comprehensive build tool that enables developers of all experience levels to efficiently set up Svelte applications in a Deno runtime. Developers can create performant sites with one of the most loved and satisfying web frameworks with Svelte while leveraging the security and TypeScript support features of Deno. NOVAS eliminates the headache of initial file configuration setup, dependency importing, and boilerplating, allowing developers to focus on writing business logic.

Its lightweight and snappy Command Line Interface (CLI) gives developers a way to create, compile and bundle new Svelte single-file components in a fast development environment by using hot/live reloading for an excellent user experience.

NOVAS bridges the gap of implementing and integrating Svelte’s cybernetic framework into a modern Deno runtime so developers can create more with less work.

🎬 Getting Started

deno install --allow-net --allow-read --allow-write --unstable https://deno.land/x/novas/cli.ts

Simply install NOVAS from the command line with the specified permissions and follow the instructions on our Github to create your first NOVAS application.

  • To create a project, type:
 novas create [project name]
  • To compile, first change directories to the root of the project (cd [project name]), then type:
novas build
  • To start developing, type:
novas dev

🔧 How It Works

In sum, NOVAS offers a simple and intuitive CLI solution to overcoming Svelte and Deno incompatibilities. NOVAS utilizes only the standard Deno library, prioritizing a small bundle size and limited dependency approach.

Upon app creation, NOVAS initializes the default directory and file structure for your new project. Developers are provided with a standard build, public, and src folder.

When provided the path to the root App.svelte component, NOVAS identifies and modifies all the .svelte files to be browser compatible. After successfully building the application, the build folder will be populated with the corresponding .js files. Following server startup, the initial static site can be viewed on http://localhost:3000.

Complete instructions can be found on NOVAS readme.

🔎 Preview your code in real-time

As you modify your Svelte components during development, JavaScript is dynamically generated in real-time so you can see your changes on the browser immediately. This feature is made possible via NOVAS’s implementation of WebSockets that, under the hood, is listening for modified or deleted file changes in the src folder. Upon saving any changes, the Svelte code will be compiled again and the browser will reload to reflect the changes.

Since its production level release, Deno has been garnering the attention of the tech landscape as a notable alternative to Node.js. With it’s secure-by-default pedagogy, ability to ship as a single executable with no dependencies, Deno was clearly designed to improve upon its predecessor. Similarly, since Svelte’s introduction, more developers are becoming interested in its flexible styling, compilation at build approach, use of reactive declarations, etc.

We built NOVAS to help lower the barrier of entry for learning these fascinating technologies, guided by the philosophy of simplifying configuration and creating a fast, lightweight tool that can keep up with developers. We hope NOVAS serves you well in your coding endeavors!

💻 How To Contribute

We’re always looking to better improve NOVAS for the open-source community. Please stay tuned as we hope to incorporate more features soon!

If you’d like to make a contribution or have any comments, requested features or critiques, visit our Github product page to get in touch or novas.land / https://deno.land/x/novas for more information.

Connect with The NOVAS Team:

Christie Herring @ LinkedIn | Github

Garrett Hickman @ LinkedIn | Github

Sylvia Liu @ LinkedIn | Github

Tanner Peterson @ LinkedIn | Github

CodeX

Everything connected with Tech & Code. Follow to join our 500K+ monthly readers