angular 2

Angular API Calls with Django, Part 2: Building the Micro-Blog App

This is the second part of a two-part series exploring the use of the Angular 6 HttpClient to make API calls against a Django back-end using Django Rest Framework. In the first part, we learned how to authenticate against Django using the Django Rest Framework JWT package. This post demonstrates how to set up the Django models and views for the micro-blogging app, as well as the Angular Service and templates.

Angular API Calls with Django: Authentication with JWT

Curious about how to make API calls with Angular 6 and the HttpClient service? This tutorial will show you some techniques for building a decoupled micro-blogging application using Angular 6 and the Django Rest Framework (DRF). Along the way, we will learn the following:

  • How to set up the back end of the app using Django and the Django Rest Framework API
  • Creating a simple Angular 6 single-page app which can query the API
  • Authenticating users with JSON Web Tokens (JWT)

Ready? Let's get started!

Angular 6: Upgrading API calls to RxJS 6

With the release of Angular 6.0 in May 2018, the framework has been updated to depend on version 6.0 of the RxJS library. RxJS 6.0 has some breaking changes compared to RxJS 5.5 and older, specifically in the handling of some of the methods of the Observable class. This will affect the way Angular developers write API calls and handle other asynchronous processing in the future.

This post outlines some of the changes and how to update your API calls to the new syntax.

URL Routing for a Decoupled App, with Angular 2 and Django

Lately, I have worked on a few projects where a single-page Angular app is contained within a site built on a server-side framework like Django. One of the challenges is to get their URLs to play nicely together.

Say you have a project with an Angular 2 front end and an API back end using the Django Rest Framework. Further, imagine that your Angular 2 page is also served from within the Django app. Your URL structure might look like this:

Angular 2: Using the HTTP Service to Write Data to an API

Update, November 27, 2017: This post explains the Http service used in Angular 2. This is now deprecated in favor of the newer HttpClient released in Angular 4.3. This post will remain here as long as Angular 4.x is in long term support. If you are using Angular 5, consider upgrading to the newer HttpClient. You can find a tutorial for the HttpClient service in my post Angular 5: Making API calls with the HttpClient service.

Ready for transformation?