Building a Blog with Flask

Introduction

Flask is a popular web framework in Python that is known for its simplicity, flexibility, and fine-grained control. In this tutorial, we will build a basic blog using Flask. We'll create a simple blog where users can register, log in, create posts, and view other users' posts.

Before we start, ensure you have Python and Flask installed on your system. If not, you can download Python from python.org and Flask can be installed via pip with the command pip install flask.

Setting up Your Project

First, create a new folder for your project. We'll call it 'flask_blog'. Inside this folder, create another folder named 'templates'. This is where Flask will look for HTML templates.

Now, let's create a new Python file in the 'flask_blog' folder and call it 'app.py'. This is where we'll write our application code.

Writing Your First Route

Open 'app.py' and write the following code:

from flask import Flask
app = Flask(__name__)

@app.route('/')
def home():
    return "Hello, Flask!"

Now, open your terminal, navigate to your project folder and type in python app.py. If everything is set up correctly, you should be able to navigate to 'localhost:5000' in your browser and see the message "Hello, Flask!".

Creating the Registration Page

Now let's create a registration page. First, create a new HTML file in the 'templates' folder and call it 'register.html'. For now, we'll just write a simple form:

<form method="POST">
    <label for="username">Username</label>
    <input type="text" id="username" name="username" required>
    <label for="password">Password</label>
    <input type="password" id="password" name="password" required>
    <button type="submit">Register</button>
</form>

Now, go back to 'app.py' and add a new route for our registration page:

from flask import render_template

@app.route('/register', methods=['GET', 'POST'])
def register():
    if request.method == 'POST':
        username = request.form.get('username')
        password = request.form.get('password')
        # Save the user to the database here
        return "Registration successful!"
    return render_template('register.html')

Now if you navigate to 'localhost:5000/register', you should see your registration form. If you fill out the form and submit it, you'll see the message "Registration successful!".

Creating the Login and Logout Functionality

Next, let's add a login and logout functionality. First, create a new HTML file in the 'templates' folder and call it 'login.html'. Write a simple form similar to the registration form.

<form method="POST">
    <label for="username">Username</label>
    <input type="text" id="username" name="username" required>
    <label for="password">Password</label>
    <input type="password" id="password" name="password" required>
    <button type="submit">Log In</button>
</form>

Then, go back to 'app.py' and add a new route for our login page:

@app.route('/login', methods=['GET', 'POST'])
def login():
    if request.method == 'POST':
        username = request.form.get('username')
        password = request.form.get('password')
        # Check if user is in the database and the password is correct
        return "Login successful!"
    return render_template('login.html')

For the logout, you can simply remove the user's data from the session:

@app.route('/logout')
def logout():
    # remove the username from the session if it's there
    session.pop('username', None)
    return redirect(url_for('home'))

Creating the Blog Posts Page

Finally, let's create a page where users can create and view posts. First, create a new HTML file in the 'templates' folder and call it 'posts.html'. Write a form for creating new posts and a section for displaying existing posts.

<form method="POST">
    <label for="content">New Post</label>
    <textarea id="content" name="content" required></textarea>
    <button type="submit">Post</button>
</form>

<section>
    <!-- Display existing posts here -->
</section>

Then, go back to 'app.py' and add a new route for our posts page:

@app.route('/posts', methods=['GET', 'POST'])
def posts():
    if request.method == 'POST':
        content = request.form.get('content')
        # Save the new post to the database here
        return "Post created!"
    # Get all existing posts from the database here
    posts = []
    return render_template('posts.html', posts=posts)

Now, you can navigate to 'localhost:5000/posts' to create and view posts.

And there you have it! You've built a simple blog with Flask. This tutorial is just the beginning. Flask is a powerful framework that can be used to build all sorts of web applications. Happy coding!