These docs are a work-in-progress and are currently undergoing a major rewrite!

JavaScript

Forge doesn't come with any strong opinions on JavaScript (Tailwind is not actually installed with npm). But our preference is to keep it as simple as possible. The Django templates and views are a powerful tool, and we strongly recommend that you use them for your front end instead of building a complete "single page application" in React or something.

Use what you're comfortable with, but our preferred places to start are:

But you can obviously use Vue, React, or any other framework you want.

Adding JavaScript to your deploy steps

In your package.json, add a build script then add the heroku/node buildpack to your app.

Adding JavaScript process to forge work

In your package.json, add watch script!

Passing JavaScript data to the front end

Occasionally you'll need to pass some data to the front end and do something with it in JavaScript.

The json_script filter is the recommended way to do this in Django:

{{ value|json_script:"hello-data" }}
<script>
    var value = JSON.parse(document.getElementById('hello-data').textContent);
    console.log(value);
</script>

Import maps

To use a framework like React without npm-installing it, consider import maps:

https://github.com/dropseed/django-importmap