Learn how to develop, add detail, and refine web applications using Django.

Become a Django Developer

The focus of this module is to learn Django web development by example. We will be developing a web application step-by-step by setting up URLs, views, and templates of different web pages. The module walks us through various useful concepts to give our app a real look. For example, we’ll learn to create and manage user accounts, implement search filters, upload images, use Bootstrap styling, and apply cloud deployment using AWS (Amazon Web Services) and Heroku.

Every concept is presented with an executable environment so we can get hands-on experience. By the end of the module, we will have a real web application using Django.

Django Takeoff: Developing Modern Applications

After creating the filter, add it to the *Listings* page. To do this, we need to update the *Listings* view and template.

## Adding a filter in Listings view

We add the filter in the `all_listings` view in ***views<span>.py***.

#!/usr/bin/env python
"""Django's command-line utility for administrative tasks."""
import os
import sys


def main():
    os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'example.settings')
    try:
        from django.core.management import execute_from_command_line
    except ImportError as exc:
        raise ImportError(
            "Couldn't import Django. Are you sure it's installed and "
            "available on your PYTHONPATH environment variable? Did you "
            "forget to activate a virtual environment?"
        ) from exc
    execute_from_command_line(sys.argv)


if __name__ == '__main__':
    main()


import React from 'react';
import { shallow, configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';

configure({ adapter: new Adapter() });

import HelloWorld from './app';

var TestResult = function() {
    this.succeeded = false;
    this.reason = "";
    this.input = "";
    this.expected_output = "";
    this.actual_output = "";
}

export const executeTests = function() {

  var results = [];

  result = new TestResult();
  result.input = 'HelloWorld Component';
  result.expected_output = "span containing text 'Hello World'"

  let wrapper = shallow(<HelloWorld />);

  // Call your Challenge function here.

  let type = wrapper.type();
  let testSuccessful = true;
  let failureReason;

  if (type !== 'span') {
    testSuccessful = false;
    failureReason = "You need to render exactly one span HTML element";
  } else if (wrapper.props().children != "Hello World") {
     testSuccessful = false;
     failureReason = "You have rendered wrong message in your span element";
  }

  result.actual_output = wrapper.html();

  if (testSuccessful) {
    result.succeeded = true;
    result.reason = "Succeeded"
  } else {
    result.succeeded = false;
    result.reason = failureReason;
  }

  results.push(result);

  return results;
}


ch13-lsn2-to-aws

React

Dart

GoJS React

Typescript React

Vue.js

In **line 12**, we make a `GET` request to search for a particular field in our `Listings` model which is stored in the `all_listings` variable. We use `ListingFilter()` to pass the `GET` request and also the `queryset` variable that holds the data that we want to search.

To access the filtered objects, we use `.qs`. For example, we used `my_Filter.qs` in **line 13**.

After creating the filter, add it to the *Listings* page. To do this, we need to update the *Listings* view and template.

# Adding a filter in Listings view

We add the filter in the `all_listings` view in ***views<span>.py***.

Learn how to add a filter in the Listings view and template.

Django Web App Setup

Django Basics

Homepage

Listings Page

New Listing Page

Navbar

Detail Listing Page

My Listings Page

Edit Listing Page

Delete Listing Page

Users App

Register Page

Foreign Key

Images

Django Filters

Styling the Django Web App

Using Amazon Web Services (AWS)

Heroku Deployment

Django 3...2...1...Takeoff! - Assessment

Appendix

Conclusion

Add Filter in the Listings Page

Adding a filter in Listings view