Create Models

In the cms/models.py file, include the necessary code to define your models.

Apply Migrations

Run migrations to generate the corresponding database tables:

python3 manage.py makemigrations

python3 manage.py migrate

Django Forms

One of Django's benefits is its provision of classes that simplify many tasks. For instance, the ModelForm class allows for straightforward form creation from models.

To create a form for data submission, add a forms.py file in the cms app and include the following code.

Here, we define a form that extends ModelForm and specifies which fields to include. Additionally, we adjust the properties of the textarea for content submission to be larger, i.e., 100 columns and 30 rows.

Form Rendering

Next, render the form in the view. Open views.py and add the corresponding code.

First, we instantiate the form and pass it to the templates.

As the template is currently nonexistent, we need to create it. Django looks for templates in a templates directory, so create base.html and stories.html as follows:

cms/

templates/

• base.html
• stories.html

Bulma CSS

Bulma is a CSS framework that aids in styling your HTML. To begin, utilize the starter template found here. Open base.html and incorporate the necessary code.

All templates will derive from this base template. Now, open stories.html and render the previously created form.

URLs

Add a urls.py file to the cms app and insert the following code to serve the view:

from django.urls import path

from .views import add_stories

urlpatterns = [

path('add', add_stories, name="add_story"),

]

After running the server, navigate to http://127.0.0.1:8000/add to view your page.

Retrieve Data from Form

Now, let's enhance the view to include the logic for obtaining data from the form and saving it to the database. Open views.py and modify the stories function accordingly.

Upon creating a new post, the user will be redirected to a page displaying all stories. We will create a view to retrieve and show the posts.

Next, add a new HTML file named story_list.html to display all posts. Update the URL accordingly.

The page now appears as follows:

The final step involves enabling post editing. Open views.py and insert the following code:

In this section, we utilize UpdateView, a class-based view that streamlines the updating process. It requires the following attributes:

• model
• fields
• template_name
• success_url

The form allows for updates on the specified fields. Next, create the necessary template to render the form.

Update the urls.py file to serve this view. Your urls.py should now resemble the following:

The page for updating a post will look like this:

Conclusion

This tutorial has covered essential concepts required to build a fully functional Django web application. The complete code is available here.

If you are interested in adding custom authentication features, refer to these articles.

• How to Add Social Authentication to a Django Application

  • Add Twitter sign-in to a Django application
  • python.plainenglish.io

• How to Create a Custom Authentication System in Django

  • The first step in developing dynamic sites
  • betterprogramming.pub

For more content, visit PlainEnglish.io. Sign up for our free weekly newsletter. Follow us on Twitter and LinkedIn. Check out our Community Discord and join our Talent Collective.