In this third Opine article we will be looking at how you blast through your website project setup by using the Opine CLI.
Prerequisites: Opine Tutorial Part 2: Creating A Website In Deno
Objective: Start your own new website projects using the Opine CLI.
Overview
This article will cover how you can create a basic template for a website using the Opine CLI for Deno.
In fact, the template created will be remarkably similar to what we covered in the previous article in this series! We recommend checking that out if you want experience building a project from scratch.
Because we have already covered project structure, and explained concepts such as views, we will focus primarily here on just how to bootstrap your project and the different options available.
Using the Opine CLI
You can install the Opine CLI using Deno's script installer commandlet:
deno install -f -q --allow-read --allow-write --allow-net --unstable https://deno.land/x/opinecli@1.0.2/opine-cli.ts
This install command creates a small executable shell script wrapper which runs Deno using the specified CLI flags and main module. The generated script is then placed into the installation root's bin directory. The exact root directory used is determined by:
- The
--rootflag, if provided; - The
DENO_INSTALL_ROOTenvironment variable, if set; -
$HOME/.deno.
Note you will need to add the installation directory to your path in order to invoke the CLI with providing a full directory path.
For example, add
export PATH="$HOME/.deno/bin:$PATH"to your$HOME/.bashrc. Remember you will need to source this file or restart your shell / terminal for it to take effect!
You should now be able to execute the Opine CLI from any shell! 🎉 🎉
The Opine CLI has several options, the easiest way to view them all is using the --help or -h flag:
> opine-cli --help
Usage: opine-cli [option] [dir]
Version: v1.0.2
Description:
Opine's application generator.
Options:
-h, --help - Show this help.
-V, --version - Show the version number for this program.
-v, --view <engine:string> - add view <engine> support (ejs|eta)
-g, --git - add .gitignore
-f, --force - force on non-empty directory
You can set up an Opine project in the current directory you are in without any view engine, just plain old CSS, HTML and JS, by simply running the CLI without any options or flags:
> opine-cli
create : public/
create : public/js/
create : public/images/
create : public/css/
create : routes/
create : public/index.html
create : public/css/style.css
create : routes/index.ts
create : mod.ts
create : routes/users.ts
create : app.ts
create : deps.ts
run the app:
$ deno run --allow-net --allow-read --allow-env mod.ts
The CLI will list all of the files and directories that it creates, and at the end of the output explains how you can run the application.
You can also specify a directory to use by providing it to the CLI as an argument (it will be created if it does not exist):
> opine-cli hello-opine
create : hello-opine/
create : hello-opine/public/
create : hello-opine/public/js/
create : hello-opine/public/images/
create : hello-opine/public/css/
create : hello-opine/routes/
create : hello-opine/public/index.html
create : hello-opine/public/css/style.css
create : hello-opine/routes/index.ts
create : hello-opine/mod.ts
create : hello-opine/routes/users.ts
create : hello-opine/app.ts
create : hello-opine/deps.ts
change directory:
$ cd hello-opine
run the app:
$ deno run --allow-net --allow-read --allow-env mod.ts
The Opine CLI also offers the ability to set up a view / template engine within your project. To add view logic, simply provide a --view or -v flag followed by a supported view engine.
For example, we can opt to use the eta view engine in our Opine web project by running:
> opine-cli opine-eta-example --view eta
create : opine-eta-example/
create : opine-eta-example/public/
create : opine-eta-example/public/js/
create : opine-eta-example/public/images/
create : opine-eta-example/public/css/
create : opine-eta-example/routes/
create : opine-eta-example/views/
create : opine-eta-example/routes/users.ts
create : opine-eta-example/public/css/style.css
create : opine-eta-example/mod.ts
create : opine-eta-example/routes/index.ts
create : opine-eta-example/views/error.eta
create : opine-eta-example/app.ts
create : opine-eta-example/views/index.eta
create : opine-eta-example/deps.ts
change directory:
$ cd opine-eta-example
run the app:
$ deno run --allow-net --allow-read --allow-env --unstable mod.ts
Notice how by adding the --view flag the CLI has now introduced a views directory with our templates, and the app.ts is automatically set up to use the provided engine.
Running the application
Let's use the CLI to build an Opine web application that uses ejs view templates via the dejs Deno module, and put in a new ./opine-ejs-example directory:
> opine-cli opine-ejs-example --view ejs
create : opine-ejs-example/
create : opine-ejs-example/public/
create : opine-ejs-example/public/js/
create : opine-ejs-example/public/images/
create : opine-ejs-example/public/css/
create : opine-ejs-example/public/css/style.css
create : opine-ejs-example/routes/
create : opine-ejs-example/routes/index.ts
create : opine-ejs-example/routes/users.ts
create : opine-ejs-example/views/
create : opine-ejs-example/views/error.ejs
create : opine-ejs-example/views/index.ejs
create : opine-ejs-example/mod.ts
create : opine-ejs-example/app.ts
create : opine-ejs-example/deps.ts
change directory:
$ cd opine-ejs-example
run the app:
$ deno run --allow-net --allow-read --allow-env mod.ts
Then we navigate to the new project directory:
> cd opine-ejs-example
And now we can run our Opine web application using the provided command:
> deno run --allow-net --allow-read --allow-env mod.ts
Let's load http://localhost:3000/ in your browser to check out the app. You should see something like:
Amazing! 🎉 🎉 You now have a working and running Opine application. Great Job!
Inspiration: This article draws some pointers from the Express web framework series.
Top comments (1)
Great job! Thanks for this template engine. I'm enjoying playing with it right now ;)
Could you please change opine version in the installation command in this post?
Seems like it needs to be the latest opinecli@1.3.0 to run smoothly.