正文

从零开始，手把手教你用Flask框架轻松搭建个人博客

/0 浏览量
0514

引言

搭建个人博客是许多开发者学习Web开发的一个很好的起点。Flask是一个轻量级的Web应用框架，非常适合初学者。在这篇文章中，我将带你从零开始，一步步搭建一个简单的个人博客。

环境准备

在开始之前，请确保你已经安装了Python环境。以下是搭建Flask博客所需的步骤：

  1. 安装Flask框架：在命令行中运行以下命令： 
    
pip install Flask
  2. 安装Flask-Migrate：用于数据库迁移，命令如下： 
    
pip install Flask-Migrate
  3. 安装数据库：这里我们使用SQLite数据库，它是Python自带的一个轻量级数据库。如果需要其他数据库，请自行安装。

创建项目结构

创建一个新文件夹作为项目根目录，然后按照以下结构创建项目：

blog/
|-- app.py
|-- templates/
|   |-- base.html
|   |-- index.html
|   |-- article.html
|-- static/
|   |-- css/
|   |-- js/
|-- migrations/
|   |-- __init__.py
|-- config.py

编写应用代码

1. 配置文件

在config.py中配置数据库连接和其他参数：

class Config:
    SQLALCHEMY_DATABASE_URI = 'sqlite:///blog.db'
    SECRET_KEY = 'your_secret_key'

2. 数据库模型

在app.py中定义数据库模型：

from flask import Flask
from flask_sqlalchemy import SQLAlchemy
from config import Config

app = Flask(__name__)
app.config.from_object(Config)
db = SQLAlchemy(app)

class Article(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    title = db.Column(db.String(100), nullable=False)
    content = db.Column(db.Text, nullable=False)

3. 路由和视图

在app.py中定义路由和视图：

from flask import render_template, request, redirect, url_for

@app.route('/')
def index():
    articles = Article.query.all()
    return render_template('index.html', articles=articles)

@app.route('/article/<int:article_id>')
def article(article_id):
    article = Article.query.get(article_id)
    return render_template('article.html', article=article)

@app.route('/add', methods=['GET', 'POST'])
def add():
    if request.method == 'POST':
        title = request.form.get('title')
        content = request.form.get('content')
        new_article = Article(title=title, content=content)
        db.session.add(new_article)
        db.session.commit()
        return redirect(url_for('index'))
    return render_template('add.html')

创建模板

1. 基础模板

在templates/base.html中创建基础模板：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>{% block title %}{% endblock %} - My Blog</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
</head>
<body>
    <header>
        <h1>My Blog</h1>
    </header>
    <main>
        {% block content %}{% endblock %}
    </main>
    <footer>
        <p>© 2021 My Blog</p>
    </footer>
</body>
</html>

2. 首页模板

在templates/index.html中创建首页模板：

{% extends "base.html" %}

{% block content %}
    <h2>Articles</h2>
    {% for article in articles %}
        <div>
            <h3>{{ article.title }}</h3>
            <p>{{ article.content }}</p>
            <a href="{{ url_for('article', article_id=article.id) }}">Read more</a>
        </div>
    {% endfor %}
{% endblock %}

3. 文章模板

在templates/article.html中创建文章模板：

{% extends "base.html" %}

{% block content %}
    <h2>{{ article.title }}</h2>
    <p>{{ article.content }}</p>
{% endblock %}

4. 添加文章模板

在templates/add.html中创建添加文章模板：

{% extends "base.html" %}

{% block content %}
    <h2>Add Article</h2>
    <form method="post">
        <label for="title">Title:</label>
        <input type="text" id="title" name="title" required>
        <label for="content">Content:</label>
        <textarea id="content" name="content" required></textarea>
        <button type="submit">Add</button>
    </form>
{% endblock %}

运行应用

在命令行中运行以下命令启动Flask应用：

python app.py

然后，在浏览器中访问http://127.0.0.1:5000/，你将看到一个简单的个人博客。

总结

通过本文，你学会了如何从零开始使用Flask框架搭建一个简单的个人博客。希望这个教程能帮助你入门Web开发。在实际开发中，你可以根据自己的需求添加更多功能，如用户认证、评论系统等。祝你学习愉快！

-- 展开阅读全文 --