Django REST framework (DRF) and Angular 2+ tutorial (Part 2)
This is part 2 of these tutorial series to learn how to use Python Django framework with Angular 2+ (When writing this second tutorial part It's already Angular 4 ) to create Restful or Rest based web apps.
There are many frameworks or packages to build Rest APIs with Django .In this tutorial we are going to use Django Rest Framework or DRF which makes the process of building restful APIs dead easy .
In the first tutorial part we have seen an introduction to both Django and DRF ,installed Django and DRF then created a new project .
In the second part we are going to first see an introduction to Angular 2+ framework ,next we are going to install the Angular CLI utility and then use it to generate our Angular 2+ project,or precisely Angular 4 project when writing this tutorial.
What is Angular 2 ?
Getting started with Angular 2+
Lets start by installing the Angular CLI so go ahead and open your terminal or command propmt then enter :
npm install -g @angular/cli
Make sure you have NodeJS and NPM installed on your machine .
After successfully installing the Angular CLI lets generate a new Angular 2+ project .
First navigate inside your Django project folder then execute :
ng new client
A new Angular 2+ will be created for you !
You can serve it using ng serve
cd client ng serve
Now you can visit your app by pointing your browser to http:localhost:4000
In the second part of these tutorial series to learn how to use Django Rest Framework or DRF for building a Rest API consumed with an Angular 2+ app ,we have introduced Angular and created the Angular project which makes the client part of our Django project .
RELATED TUTORIALSDjango 2 Ajax CRUD with Python 3.7 and jQuery
Django 2 CRUD Tutorial: Generic Class-Based Views
Angular 6|7 Tutorial — CRUD & Python REST API
Django Authentication — Login, Logout and Password Change/Reset
Python Django JWT — djangorestframework-jwt Example
Django Form Example—Bootstrap 4 UI via django-crispy-forms
Django TemplateView GET|POST Example — URLs, as_view and get_context_data