Python and Flask: Building a Blogging Platform

Introduction
Prerequisites
Setting Up Flask
Creating the Blog Structure
Building the Home Page
Creating New Blog Posts
Displaying Blog Posts
Adding Styling with Bootstrap
Conclusion

Introduction

In this tutorial, we will learn how to build a simple blogging platform using Python and Flask. By the end of this tutorial, you will be able to create a fully functional blog where users can create new posts and view existing ones. We will use Flask, a popular web framework for Python, along with some additional libraries and tools to streamline the development process.

Prerequisites

Before we begin, make sure you have the following prerequisites in place:

Basic knowledge of Python programming language
Familiarity with HTML and CSS
Python installed on your machine
Flask library installed (use pip install flask to install Flask)

Setting Up Flask

Let’s start by setting up a new Flask project for our blogging platform. Follow these steps:

Create a new directory for your project: mkdir blogging-platform
Navigate to the project directory: cd blogging-platform
Create a virtual environment: python -m venv venv
Activate the virtual environment:
- On Windows: venv\Scripts\activate
- On macOS/Linux: source venv/bin/activate
Install Flask: pip install flask

With Flask installed, we can now proceed to create the structure for our blogging platform.

Creating the Blog Structure

Inside the blogging-platform directory, create a new file app.py to store our Flask application code.
In app.py, import Flask and create an instance of the Flask application:
```
 from flask import Flask
	
 app = Flask(__name__)
```
Add a route to the root URL (/) that returns a simple “Hello, World!” message:
```
 @app.route('/')
 def home():
     return "Hello, World!"
```
Finally, add code to run the Flask application:
```
 if __name__ == '__main__':
     app.run(debug=True)
```
We now have a minimal Flask application set up. Let’s test it by running python app.py in the terminal and opening http://localhost:5000 in a web browser. You should see the “Hello, World!” message.

Building the Home Page

The next step is to create a home page for our blogging platform. Follow these steps:

Add the following HTML code to the home function in app.py:

 def home():
     return """
     <h1>Welcome to our Blogging Platform</h1>
     <p>Start exploring our latest blog posts:</p>
     <ul>
         <li><a href="/post/1">Post 1</a></li>
         <li><a href="/post/2">Post 2</a></li>
         <li><a href="/post/3">Post 3</a></li>
     </ul>
     """

Update the root URL route to use the home function:

 @app.route('/')
 def home():
     return """
     ...
     """

Run the Flask application and refresh the browser. You should now see the home page with the list of blog posts.

Creating New Blog Posts

Let’s now add the ability for users to create new blog posts. Follow these steps:

Add a new route to handle the creation of new posts:

 @app.route('/new', methods=['GET', 'POST'])
 def new_post():
     if request.method == 'POST':
         title = request.form.get('title')
         content = request.form.get('content')
	        
         # Save the new post to the database or file system
	        
         return redirect('/')
	    
     return """
     <form method="POST">
         <label for="title">Title:</label>
         <input type="text" name="title" id="title" required>
         <br>
         <label for="content">Content:</label>
         <textarea name="content" id="content" required></textarea>
         <br>
         <input type="submit" value="Create Post">
     </form>
     """

Update the home page to include a link to the new post creation page:

 def home():
     return """
     ...
     <a href="/new">Create New Post</a>
     """

Run the Flask application, click on the “Create New Post” link, and you should see a form to create a new post.

Displaying Blog Posts

Next, let’s implement the functionality to display individual blog posts. Follow these steps:

Add a new route to handle the display of individual posts:

 @app.route('/post/<int:post_id>')
 def show_post(post_id):
     # Fetch the post from the database or file system based on the post_id
	    
     return """
     <h2>Post {post_id}</h2>
     <p>Post content goes here...</p>
     """

Update the home page to link to individual posts dynamically:

 def home():
     return """
     ...
     <ul>
         <li><a href="/post/1">Post 1</a></li>
         <li><a href="/post/2">Post 2</a></li>
         <li><a href="/post/3">Post 3</a></li>
     </ul>
     """

Run the Flask application, click on a post link, and you should see the corresponding post displayed.

Adding Styling with Bootstrap

To make our blogging platform look more appealing, let’s add some styling using the Bootstrap library. Follow these steps:

Create a new directory called static inside the blogging-platform directory.
Inside the static directory, create another directory called css.
Download the bootstrap.min.css file from the Bootstrap website and save it inside the css directory.
Inside the app.py file, add the following code to tell Flask to serve static files:
```
 app = Flask(__name__, static_folder='static')
```

Update the head section of the HTML code in the home function to link the Bootstrap CSS file:

 def home():
     return """
     <!DOCTYPE html>
     <html>
     <head>
         <link rel="stylesheet" href="/static/css/bootstrap.min.css">
     </head>
     ...
     </html>
     """

Apply Bootstrap classes to the elements in the HTML code to add styling.

With Bootstrap added, your blogging platform should now have a more professional look.

Conclusion

In this tutorial, we learned how to build a simple blogging platform using Python and Flask. We covered the basic steps of setting up Flask, creating the blog structure, building the home page, allowing users to create new blog posts, displaying individual posts, and adding styling using Bootstrap.

You can further enhance your blogging platform by adding features such as user authentication, categories, and comments. Flask provides extensive documentation and a wide range of plugins, making it easy to extend your application.

Feel free to experiment and customize your blogging platform according to your specific requirements. Happy coding!

Published: 3 February 2021