JavaScript ES6 Tutorial for Django Developers
In this post we will give you information about JavaScript ES6 Tutorial for Django Developers. Hear we will give you detail about JavaScript ES6 Tutorial for Django DevelopersAnd how to use it also give you demo for it if it is necessary.
This JavaScript (ES6) tutorial is a part to a series of tutorials to teach Django developers front-end web development for creating modern full-stack applications.
Before starting the tutorial for the new JavaScript/ES6 features, we will first learn how to include JavaScript in a Django project.
There are two methods of integrating JavaScript with Django.
- Separate Django (back-end) and JavaScript(front-end) apps which is convenient for building JavaScript-heavy apps with a Django RESTful back-end
- Using JavaScript with Django built-in templates which is convenient for apps that don’t need a complex JavaScript front-end
We’ve previously covered how to use the first approach with React, Vue and Angular examples. In this tutorial, we’ll focus on the second approach.
We assume, you already have created a project. Check this tutorial if you need help!
Let’s start by creating a Django HTML base template for your application (base.html):
<!DOCTYPE html><htmllang="en"><head> {% block title %}<title>Django JavaScript ES6 Tutorial</title>{% endblock %} <metacharset="utf-8"><metaname="viewport"content="width=device-width, initial-scale=1"></head><body>{% block body %} {% endblock %}</body></html>Adding JavaScript to Our Django Template
We can add JavaScript to our template using an inline <script> tag or an external JavaScript file. Let’s create a app.js file, put it in a js folder that you need to create in the static folder of your application.
Next in the <head> tag of the template add:
{% load static %} <linkrel="stylesheet"href="{% static 'js/app.js' %}">We use the static template tag to specify the relative URL to the JS file.
Check Managing static files (e.g. images, JavaScript, CSS) for more information about static files in Django.
Hope this code and post will helped you for implement JavaScript ES6 Tutorial for Django Developers. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs