DEV Community

Johan PIQUET
Johan PIQUET

Posted on

Jopi Rewrite + Docker = so easy!

#docker #node #bunjs

Why Docker?

Docker is a system of lightweight virtual environments (containers / VMs) that work together with the operating
system to create secure separations of resources. Docker has three very useful advantages:

  • Enables resource isolation, which improves security.
  • Makes it easy to deploy an application without worrying much about the host OS characteristics (as long as it's a Linux host).
  • These virtual environments are highly portable because they have low coupling to the host system, which reduces server resource fragmentation.

These attractive aspects are why many companies choose to use Docker exclusively to deploy their applications in production,
while developers often use Docker during application development to easily install components like MySQL and to ensure every team
member works on an identical environment — the same environment that will be used in production.

What is Jopi Rewrite

Jopi Rewrite is a server framework for Node.js and Bun.js that includes many useful, pre-configured features while focusing on
ease of use through an "intent-based" API that acts like menus and submenus, showing only what is relevant in the current context.

Some features of Jopi Rewrite:

  • Advanced server-side React.js support with automatic hydration in the browser (similar to Next.js).
  • Ability to import CSS and images on the server side (compatible with Vite.js).
  • Automatic browser refresh during development to simplify UI/design debugging.
  • Built-in Tailwind CSS support — no configuration required.
  • Middleware system similar to Express.js.
  • Built-in protection against DDoS-style attacks such as brute force and Slowloris.
  • Built-in JWT (JSON Web Token) support for authentication.
  • Built-in Let's Encrypt certificate support with automatic renewal (no restart required).
  • Simple yet powerful page caching features.
  • Built-in load balancing capabilities.
  • An integrated crawler that can turn the site into a static site with a single line of code.

Jopi Rewrite and Docker

To make starting projects with Jopi Rewrite easier, a tool called jopi can install a project template — either a minimal
one or a template that already includes a set of features (login screen, user management, roles and permissions, etc.).

Among those templates, the ones we care about here are the two Docker project templates. One creates a Docker project
using Node.js and the other uses Bun.js — the recommended choice for production because of its impressive speed!
(Jopi Rewrite is optimized for Bun.js because that runtime provides some very interesting mechanisms).

Creating a project with Docker

Here we'll create a Docker machine that hosts a Jopi Rewrite application. The prerequisites are having Node.js installed and
a recent version of Docker.

If you have those, run the following in a terminal:

 npx jopi create docker-bunjs --dir ./dockerBun
 cd ./dockerBun
 docker compose up
Enter fullscreen mode Exit fullscreen mode

After a few seconds (the first start is longer because Docker downloads everything it needs), open
http://127.0.0.1:3000 to confirm everything is working.

Project anatomy

The jopi tool (invoked here with Node's launcher npx) created the following files for us. The most important ones to know are:

|- docker-compose.yml       <- the Docker script
|- app/                     <- contains our application
|-  package.json            <- the Node.js / Bun.js project
|-  start.sh                <- executed when the Docker VM starts
Enter fullscreen mode Exit fullscreen mode

The docker-compose.yml file contains the rules for Docker Compose, a tool that lets you run a virtual machine while
specifying options and assemble multiple machines into a virtual network. In that file we define important rules, such as:

  • Which base image to use for our custom VM.
  • Mount the app folder as a shared folder in the VM.
  • Map the VM's port 443 (HTTPS) to the host's port 443, so traffic on port 443 is shared.
  • Likewise for ports 80 (HTTP) and 3000.

The start.sh file's role is to start our application. Its contents are:

bun install
bun run start
Enter fullscreen mode Exit fullscreen mode

Enable development mode

If you modify the application now you may notice no changes are reflected in the browser: the old version keeps running. To see
changes applied you must restart the VM.

To avoid that, you can enable development mode which watches source changes and automatically restarts the JavaScript runtime
so updates are picked up instantly.

To enable this mode, edit the start.sh file and then restart the VM so the change is applied.

New contents for start.sh

bun install
bun run start-dev
Enter fullscreen mode Exit fullscreen mode

End of the tutorial

That's the end of this short tutorial, which aimed to give you an overview of how to use Docker with Jopi Rewrite.

Useful links:

Top comments (0)