When and Why Would I Need a JS Framework for Django?

Angular, Vue.js, React - when and why would you need them? When using Django, you already have everything you need to write great web applications. So, what makes people choose to use a JS framework? What’s a good time to introduce a frontend framework to your Django project?

If you have done some research, visited some of the official frontend sites and still don’t quite see

  • why a JS frontend framework is a good idea
  • how it could help with your Django project

this list is for you.

Let’s look at good reasons to use a frontend framework with Django!

You want to have batteries-included

For similar reasons which make you choose Django.

You wouldn’t choose to write your own web framework in Python for a new project. Instead, you go with Django and get sane conventions, best practices, existing boilerplate, reusable resources and tooling out of the box.

It’s the same with JavaScript. When you’re building something more complex than one-liners, you can save yourself a lot of work. No need to choose a templating language, or build your own reactivity logic. Those already work if you are using a good frontend framework.

You are annoyed by frequent page reloads

Why deal with dynamic frontends at all? The best reason, is to make sure that your users have the best user experience possible! Frontend frameworks are great tools to create smooth user interfaces.

If you want to make your pages more dynamic, reduce loading times or make your application interactive - you’ll need to use JavaScript.

Do you want to do AJAX calls, and only reload parts of your page? You could use jQuery, but…

Manipulating the DOM “by hand” is tedious

You wouldn’t try to compose html pages only fiddling with strings on the backend - you’d much rather have a templating language so templates can be separated from code. You describe all the building blocks and what goes where, instead of doing things step by step.

It’s the same of the frontend - having a way to do templating and using similarly convenient tools are almost a must from a certain point.

When starting out to transition a site to be more dynamic, most people start out manipulating the DOM manipulations with jQuery or plain JS. This works well for small things in the beginning, but gets messy with time.

Frontend framework provide more structure than ad-hoc JS or jQuery code snippets, and will help you work on a higher level of abstraction than DOM element manipulation.

Reusing building blocks of your frontend

Creating reusable components for your frontend is WAY easier when using a frontend framework.

Yes, you can create reusable code with plain JS and jQuery, but you would have an easier time if you just went with a complete JS frontend framework like Vue.js and saved yourself some complexity and boilerplate code.

You want to decouple your Django backend from the frontend part

If you want to separate your project into a Django backend, and a frontend SPA, which only consumes data via a REST API, you’d be very well advised to use a frontend framework.

When you’re thinking about decoupling, you should be sure that it’s well motivated. You might not want to build a SPA and you don’t need to build one to use a frontend framework.

You don’t NEED to use them. They are popular, and a lot of people want to build a SPA. You can get started with a single template, without setting up any additional plumbing. Take a look at this post for an example with Vue.js

You’re just curious to try something new

If you want to add one more tool to your repertoire.

If you want to keep the learning curve low, you could start with plain jQuery to add more dynamic elements to your project. I’d suggest you try Vue.js however - the learning curve is not much steeper than with jQuery, and it’s just as easy to get started.

In conclusion

Above, we looked at a few reasons how a frontend framework can help you when you’re working with Django. If those seem relevant to you, then it might be a good time to give a frontend framework a try, and see what it can do for you.

I’m a big fan of Vue.js! It’s easy to get started with it, and the framework is exceptionally well documented. You can get started in minutes, and integrate it into your Django templates without having to use Webpack and without having to create new views.

Just pick a single view (which you would like to make more dynamic) in your current Django project and give Vue.js a try!