We will take advantage of the browsable API feature that we introduced in Chapter 5, Understanding and Customizing the Browsable API Feature, with our new web service. Let's start browsing our new RESTful Web Service. Open a web browser and enter http://localhost:8000. The browser will compose and send a GET request to / with text/html as the desired content type, and the returned HTML web page will be rendered.
The request will end up executing the GET method defined in the ApiRoot class within the views.py file. The following screenshot shows the rendered web page with the resource description Api Root:
The Api Root renders the following hyperlinks:
- http://localhost:8000/drone-categories/: The collection of drone categories
- http://localhost:8000/drones/: The collection of drones
- http://localhost:8000/pilots/: The collection of pilots
- http://localhost:8000/competitions/: The collection of competitions
We can easily access each resource collection by clicking or tapping on the appropriate hyperlink. Once we access each resource collection, we can perform operations on the different resources throughout the browsable API. Whenever we visit any of the resource collections, we can use the breadcrumb to go back to the Api Root that lists all the hyperlinks.
Click or tap on the URL at the right-hand side of drone-categories and the web browser will go to http://localhost:8000/drone-categories/. As a result, Django will render the web page for the Drone Category List. At the bottom of the web page, there are two tabs to make an HTTP POST request: Raw data and HTML form. By default, the HTML form tab is activated and displays an automatically generated form with a textbox to enter the value for the Name field to create a new drone category. We can use this form to easily compose and send an HTTP POST request without having to deal with the raw JSON data as we did when working with the browsable API and our previous web service. The following screenshot shows the HTML form to create a new drone category:
Enter the following value in the Name textbox: Octocopter. Then, click or tap POST to create a new drone category. The browsable API will compose and send an HTTP POST request to /drone-categories/ with the specified data. Then, we will see the results of this request in the web browser. The following screenshot shows the rendered web page with the results of the previous operation, with an HTTP status code of 201 Created in the response and the previously explained HTML form with the POST button that allows us to continue composing and sending HTTP POST requests to /drone-categories/:
Now, you can go back to the Api Root by clicking on the link on the breadcrumb and use the HTML forms to create drones, pilots, and finally, competitions. For example, go to the Api Root and click or tap on the URL at the right-hand side of drones and the web browser will go to http://localhost:8000/drones/. As a result, Django will render the web page for the Drone List. At the bottom of the web page, there are two tabs to make an HTTP POST request: Raw data and HTML form. By default, the HTML form tab is activated and displays an automatically generated form with the appropriate controls for the following fields:
- Name
- Drone category
- Manufacturing date
- Has it competed
The Drone category field provides a drop-down with all the existing drone categories so that we can select one of them for our new drone. The Has it competed field provides a checkbox because the underlying field is Boolean.
We can use this form to easily compose and send an HTTP POST request without having to deal with the raw JSON data as we did when working with the browsable API and our previous web service. The following screenshot shows the HTML form to create a new drone:
