Django CRUD Application with VueJs as front-end | VueJs + Django Rest Framework + MySQL example – Part 2: Django Server


This tutorial is part 2 of Django-Vue-MySQL series. Today, we will create Django server to do CRUD with MySQL (including finder method).

>> Part 1: Overview
>> Part 3: VueJs Client

Related Post:
Django RestApis example – GET/POST/PUT/DELETE requests MySQL database with Django REST Framework


[coming soon…]

Django RestApi server Overview


Our Django Server can work with MySQL Database and provides APIs:

  • GET /customers/: get all customers
  • GET /customers/[id]: get a customer by id
  • GET /customers/age/[age]: find all customers by age
  • POST /customers/: save a customer
  • PUT /customers/[id]: update a customer by id
  • DELETE /customers/[id]: delete a customer by id
  • DELETE /customers/: delete all customers
Project structure

There are several folders and files in our Django project:


customers/ declares CustomersConfig class (subclass of the django.apps.AppConfig) that represents our Django app and its configuration.
gkzRestApi/ configures settings for the Django project, including INSTALLED_APPS list with Django REST framework and Customers Application.
customers/ defines Customer data model class (subclass of the django.db.models.Model).
migrations/ is generated by makemigrations command, includes the code to create the Customer model, will be run by migrate to generate MySQL database table for Customer model.
customers/ declares CustomerSerializer class (subclass of rest_framework.serializers.ModelSerializer) for Customer instances to manage serialization to JSON and deserialization from JSON.
customers/ contains methods to process HTTP requests and produce HTTP responses (using CustomerSerializer).
customers/ defines urlpatterns to be matched with request functions in the
gkzRestApi/ defines root URL configurations that includes the URL patterns declared in customers/

Setup Django RestApi project

Install Django REST framework

Django REST framework works on top of Django and helps us to build RESTful Web Services flexibly. To install this package, run command:
pip install djangorestframework

Create RestApi project

Create Django project named gkzRestApi with command:
django-admin startproject gkzRestApi

Install & Import Python MySQL Client

We have to install Python MySQL Client to work with MySQL database.
In this tutorial, we use pymysql: pip install pymysql.

Once the installation is successful, import this module in gkzRestApi/

Setup MySQL Database engine

Open gkzRestApi/ and change declaration of DATABASES:

Create Customers App

Run following commands to create new Django App named customers:
cd gkzRestApi
python startapp customers


Open customers/, we can see CustomersConfig class (subclass of the django.apps.AppConfig) that represents our Django app and its configuration:

Add Django Rest framework & RestApi App to Django project

Open gkzRestApi/, find INSTALLED_APPS, then add:

Add CORS Configurations

Inside gkzRestApi/, add:

Implement Django RestApi App

Data Model
Create Data Model


Run initial migration for data model

Run following Python script:
python makemigrations customers

We can see output text:

It indicates that the customers/migrations/ file includes code to create Customer data model:

The generated code defines a subclass of the django.db.migrations.Migration. It has an operation for creating Customer model table. Call to migrations.CreateModel() method will create a table that allows the underlying database to persist the model.

Run the following Python script to apply the generated migration:
python migrate customers

The output text:

Check MySQL Database, now we can see that a table for Customer model was generated and it’s named customers_customer:

Create Serializer class

We need a Serializer class for Customer instances to manage serialization to JSON and deserialization from JSON.

– This CustomerSerializer will inherit from rest_framework.serializers.ModelSerializer superclass.
ModelSerializer class automatically populates a set of default fields and default validators, we only need to specify the model class.

Now, under customers package, create file:

Meta inner class declares 2 attributes:
model: specifies the model related to the serializer
fields: specifies a tuple of field names that we want to include in the serialization

Create API Views

Open customers/ file and declare two functions:
customer_list(): get list of customers, save a new customer, delete all customers
customer_detail(): get/update/delete customer by ‘id’
customer_list_age(): find all customers by ‘age’

Route Urls to Views functions

Create in customers folder, now we will define urlpatterns to be matched with request functions in the

Now we must include above URL patterns in root URL configurations.
Open gkzRestApi/, replace the code:

Source Code


By grokonez | March 2, 2019.

Related Posts

Got Something To Say:

Your email address will not be published. Required fields are marked *