Python配合Flask搭建简单的个人博客案例demo

news/2024/11/8 10:30:13 标签: python, flask, 开发语言

开发一个简单的博客网站使用 Python,通常可以选择一些流行的 web 框架,如 FlaskDjango。下面我将以 Flask 为例,带你开发一个简单的博客网站。


环境准备:

Flask 非常适合构建轻量级的博客网站,如果想要更多功能,可以考虑学习 Django,它提供了更丰富的功能和更大的灵活性。

  1. 安装 Python(如果还没有安装的话): Python官网
  2. 安装 Flask:
  3. pip install flask
    

    3.安装数据库支持(这里我们用 SQLite):

  4. pip install flask_sqlalchemy
    

    项目结构

    /my_blog
      /templates
        - index.html
        - post.html
      /static
        - /css
          - style.css
      app.py
    

    步骤 1:创建 app.py 文件

  5. from flask import Flask, render_template, request, redirect, url_for
    from flask_sqlalchemy import SQLAlchemy
    
    app = Flask(__name__)
    app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///posts.db'
    app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = False
    db = SQLAlchemy(app)
    
    # 数据库模型
    class Post(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)
    
        def __repr__(self):
            return f'<Post {self.title}>'
    
    # 首页:显示所有文章
    @app.route('/')
    def index():
        posts = Post.query.all()
        return render_template('index.html', posts=posts)
    
    # 文章页面:显示单篇文章
    @app.route('/post/<int:post_id>')
    def post(post_id):
        post = Post.query.get_or_404(post_id)
        return render_template('post.html', post=post)
    
    # 创建文章
    @app.route('/create', methods=['GET', 'POST'])
    def create():
        if request.method == 'POST':
            title = request.form['title']
            content = request.form['content']
            new_post = Post(title=title, content=content)
            db.session.add(new_post)
            db.session.commit()
            return redirect(url_for('index'))
        return render_template('create.html')
    
    # 启动应用
    if __name__ == "__main__":
        db.create_all()  # 创建数据库
        app.run(debug=True)
    

    步骤 2:创建 HTML 模板

    templates 目录中,创建以下 HTML 文件。

    index.html
  6. <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>我的博客</title>
    </head>
    <body>
        <h1>欢迎来到我的博客</h1>
        <a href="{{ url_for('create') }}">创建新文章</a>
        <ul>
            {% for post in posts %}
                <li>
                    <a href="{{ url_for('post', post_id=post.id) }}">{{ post.title }}</a>
                </li>
            {% endfor %}
        </ul>
    </body>
    </html>
    

    post.html

  7. <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>{{ post.title }}</title>
    </head>
    <body>
        <h1>{{ post.title }}</h1>
        <p>{{ post.content }}</p>
        <a href="{{ url_for('index') }}">返回首页</a>
    </body>
    </html>
    

    create.html

  8. <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>创建文章</title>
    </head>
    <body>
        <h1>创建新文章</h1>
        <form action="{{ url_for('create') }}" method="POST">
            <label for="title">标题:</label>
            <input type="text" name="title" required><br>
            <label for="content">内容:</label><br>
            <textarea name="content" rows="4" required></textarea><br>
            <button type="submit">提交</button>
        </form>
    </body>
    </html>
    

    步骤 3:运行项目

  9. 在项目根目录下,运行 app.py 文件:
  10. python app.py
    

  11. 打开浏览器访问 http://127.0.0.1:5000/,你会看到博客的首页,可以创建新文章并查看。
  12. 可扩展功能

  13. 用户认证:可以添加用户注册、登录功能。
  14. 文章编辑与删除:增加编辑和删除文章的功能。
  15. 分页功能:当文章较多时,可以增加分页显示文章。

http://www.niftyadmin.cn/n/5743758.html

相关文章

【vue2.0入门】认识vue工程

目录 引言一、工程目录介绍1. package.json文件2. src\App.vue3. src\components 文件夹4. src\assets 文件夹5. node_modules 文件夹6. 其他 二、安装 vuejs devtools 插件1. 下载插件2. 配置插件3. 使用插件 三、总结 引言 本系列教程旨在帮助一些零基础的玩家快速上手前端开…

Linux(ubuntu) 安装显卡驱动

注:本次环境在云服务ubuntu环境下进行,大家浏览时注意版本信息 注:能看此文章的应该都有些基础,个别命令我就不加以说明了 此命令用于 清理现有的 NVIDIA 驱动程序和相关库 sudo apt-get --purge remove "*nvidia*" "libxnvctrl*" 1、安装ubuntu-drivers-c…

20241108 “postinstall“: “electron-builder install-app-deps“ 導致無法正常下載依賴

在 package.json 中&#xff0c;"postinstall": "electron-builder install-app-deps" 的作用是&#xff1a; 作用说明 依赖安装&#xff1a;electron-builder install-app-deps 是 electron-builder 的一个命令&#xff0c;主要用于在安装依赖后自动安装…

【数据集】【YOLO】【目标检测】火情、烟雾、火灾检测数据集 9848 张,YOLO火灾检测算法实战训练教程!

数据集介绍 【数据集】火情、烟火、火灾检测数据集 9848 张&#xff0c;目标检测&#xff0c;包含YOLO/VOC格式标注。 数据集中包含2种分类&#xff1a;{0: Fire, 1: Smoke}&#xff0c;分别是‘火焰’和‘烟雾’。 数据集来自国内外图片网站和视频截图&#xff1b; 可用于…

C#实战:使用腾讯云识别服务轻松提取火车票信息

目录 一、腾讯票据单据识别 Invoice OCR服务介绍 二、开发完整流程 2.1 开通文字识别服务 2.2 创建开发者密钥 2.3 创建项目编写代码集成 三、总结 公司内部涉及到车票报销的时候一个个输入火车票信息非常麻烦&#xff0c;尤其是出差比较多的企业&#xff0c;这对于财务人…

前言2、VS(Visual Studio)-2022使用

早前用VS-2010编译平台&#xff0c;进行C语言编程学习。 现如今&#xff0c;为了适应未来发展趋势以及日新月异的新功能&#xff0c;就此转到VS-2022编译平台&#xff1b; 由于都是VS编译平台&#xff0c;大多数基础功能都类似&#xff0c;关于一些基础操作可参考前言1&#…

Apache DolphinScheduler + OceanBase,搭建分布式大数据调度平台的实践

本文整理自白鲸开源联合创始人&#xff0c;Apache DolphinScheduler PMC Chair&#xff0c;Apache Foundation Member 代立冬的演讲。主要介绍了DolphinScheduler及其架构、DolphinScheduler与OceanBase 的联合大数据方案。 DolphinScheduler是什么&#xff1f; Apache Dolph…

使用Rust实现http/https正向代理

相关库的安装 利用vcpkg安装openssl库 vcpkg install openssl:x64-windows并设置openssl库位置的环境变量 $Env:OPENSSL_DIR"D:/vcpkg/packages/openssl_x64-windows/"安装openssl软件&#xff0c;因为需要利用openssl生成自签名证书 Cargo依赖 [dependencies] …