百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术资源 > 正文

Python Flask 全流程全栈项目实战

off999 2024-11-26 07:21 20 浏览 0 评论

获课:shanxueit.com/4732/

Python Flask 是一个轻量级的 Web 应用框架,因其简洁、易用的特点而受到广大开发者的喜爱。使用 Flask 可以快速搭建起一个功能完整的 Web 应用程序,从后端逻辑处理到前端页面展示。本文将详细介绍如何使用 Flask 构建一个简单的全栈应用程序,涵盖从环境搭建、后端逻辑编写到前端页面设计的全过程。

一、环境准备

1. 安装Python

首先确保你的计算机上已经安装了 Python。可以通过命令行输入 python --version 或 python3 --version 来检查是否已经安装了 Python 以及版本号。

2. 安装Flask

接下来安装 Flask 框架。可以通过 pip 工具安装:

bash

浅色版本

pip install flask

3. 创建项目目录

创建一个新的目录来存放你的项目文件,并进入该目录:

bash

浅色版本

mkdir myflaskapp
cd myflaskapp

二、创建基本应用

1. 创建应用文件

在项目目录下创建一个名为 app.py 的 Python 文件,这是 Flask 应用的核心文件:

python

浅色版本

from flask import Flask, render_template, request, redirect, url_for
app = Flask(__name__)

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

if __name__ == '__main__':
    app.run(debug=True)

这个简单的 Flask 应用只有一个主页,显示 "Hello, Flask!"。

2. 运行应用

保存文件后,在命令行中运行应用:

bash

浅色版本

python app.py

此时你应该能看到类似下面的日志输出:

浅色版本
 * Running on http://127.0.0.1:5000/ (Press CTRL+C to quit)

打开浏览器访问 http://127.0.0.1:5000/,你应该能看到 "Hello, Flask!" 的欢迎信息。

三、添加路由与视图

1. 添加路由

让我们添加一个表单提交的功能。首先修改 app.py 文件,添加一个新的路由 /submit:

python

浅色版本

@app.route('/submit', methods=['POST'])
def submit():
    name = request.form.get('name')
    return f"Hello, {name}!"

2. 创建表单页面

接着我们需要创建一个 HTML 表单页面,让用户输入名字并提交。在项目目录下创建一个名为 templates 的文件夹,并在里面创建一个 index.html 文件:

html

浅色版本

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Submit Form</title>
</head>
<body>
    <form action="{{ url_for('submit') }}" method="post">
        <label for="name">Name:</label>
        <input type="text" id="name" name="name">
        <button type="submit">Submit</button>
    </form>
</body>
</html>

3. 修改主页视图

现在修改主页视图 home,使其渲染刚刚创建的 HTML 文件:

python

浅色版本

from flask import render_template

@app.route('/')
def home():
    return render_template('index.html')

四、静态文件支持

如果想要添加 CSS 或 JavaScript 文件,可以使用 Flask 的静态文件支持。首先创建一个名为 static 的文件夹,并在里面放置你的 CSS 或 JS 文件。然后在 HTML 文件中引用这些文件。

1. 创建静态文件夹

在项目根目录下创建 static 文件夹,并在里面放置一个名为 styles.css 的文件:

css

浅色版本

body {
    font-family: Arial, sans-serif;
    background-color: #f4f4f4;
}

2. 引用静态文件

修改 index.html 文件,引用刚刚创建的 CSS 文件:

html

浅色版本

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Submit Form</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}">
</head>
<body>
    <form action="{{ url_for('submit') }}" method="post">
        <label for="name">Name:</label>
        <input type="text" id="name" name="name">
        <button type="submit">Submit</button>
    </form>
</body>
</html>

五、部署应用

一旦你的应用开发完成并且经过充分测试,下一步就是将其部署到生产环境中。这里简要介绍几种常见的部署方式:

1. 使用本地服务器

如果你只是想在局域网内共享应用,可以直接使用 Flask 的内置服务器。

2. 使用 Docker

Docker 是一个流行的容器化平台,可以帮助你打包应用及其依赖项,以便在任何环境中一致地运行。

3. 使用云服务

有许多云服务提供商(如 AWS、Google Cloud、Heroku)都支持 Flask 应用的部署。你可以根据需求选择适合的服务商进行部署。

结语

通过以上步骤,我们成功地构建了一个使用 Flask 的简单全栈 Web 应用程序。当然,实际应用会比这个例子复杂得多,可能涉及到数据库操作、用户认证等功能。但是,掌握了这些基础知识之后,你可以在此基础上扩展应用,添加更多功能,满足更复杂的业务需求。希望这篇文章对你有所帮助!

相关推荐

Alist 玩家请进:一键部署全新分支 Openlist,看看香不香!

Openlist(其前身是鼎鼎大名的Alist)是一款功能强大的开源文件列表程序。它能像“万能钥匙”一样,解锁并聚合你散落在各处的云盘资源——无论是阿里云盘、百度网盘、GoogleDrive还是...

白嫖SSL证书还自动续签?这个开源工具让我告别手动部署

你还在手动部署SSL证书?你是不是也遇到过这些问题:每3个月续一次Let'sEncrypt证书,忘了就翻车;手动配置Nginx,重启服务,搞一次SSL得花一下午;付费证书太贵,...

Docker Compose:让多容器应用一键起飞

CDockerCompose:让多容器应用一键起飞"曾经我也是一个手动启动容器的少年,直到我的膝盖中了一箭。"——某位忘记--link参数的运维工程师引言:容器化的烦恼与...

申请免费的SSL证书,到期一键续签

大家好,我是小悟。最近帮朋友配置网站HTTPS时发现,还有人对宝塔面板的SSL证书功能还不太熟悉。其实宝塔早就内置了免费的Let'sEncrypt证书申请和一键续签功能,操作简单到连新手都能...

飞牛NAS部署TVGate Docker项目,实现内网一键转发、代理、jx

前面分享了两期TVGate:Q大的转发代理工具TVGate升级了,操作更便捷,增加了新的功能跨平台内网转发神器TVGate部署与使用初体验现在项目已经开源,并支持Docker部署,本文介绍如何通...

Docker Compose 编排实战:一键部署多容器应用!

当项目变得越来越复杂,一个服务已经无法满足需求时,你可能需要同时部署数据库、后端服务、前端网页、缓存组件……这时,如果还一个一个手动dockerrun,简直是灾难这就是DockerCompo...

深度测评:Vue、React 一键部署的神器 PinMe

不知道大家有没有这种崩溃瞬间:领导突然要看项目Demo,客户临时要体验新功能,自己写的小案例想发朋友圈;找运维?排期?还要走工单;自己买服务器?域名、SSL、Nginx、防火墙;本地起服务?断电、关...

超简单!一键启动多容器,解锁 Docker Compose 极速编排秘籍

想要用最简单的方式在本地复刻一套完整的微服务环境?只需一个docker-compose.yml文件,你就能一键拉起N个容器,自动组网、挂载存储、环境隔离,全程无痛!下面这份终极指南,教你如何用...

日志文件转运工具Filebeat笔记_日志转发工具

一、概述与简介Filebeat是一个日志文件转运工具,在服务器上以轻量级代理的形式安装客户端后,Filebeat会监控日志目录或者指定的日志文件,追踪读取这些文件(追踪文件的变化,不停的读),并将来自...

K8s 日志高效查看神器,提升运维效率10倍!

通常情况下,在部署了K8S服务之后,为了更好地监控服务的运行情况,都会接入对应的日志系统来进行检测和分析,比如常见的Filebeat+ElasticSearch+Kibana这一套组合...

如何给网站添加 https_如何给网站添加证书

一、简介相信大家都知道https是更加安全的,特别是一些网站,有https的网站更能够让用户信任访问接下来以我的个人网站五岁小孩为例子,带大家一起从0到1配置网站https本次配置的...

10个Linux文件内容查看命令的实用示例

Linux文件内容查看命令30个实用示例详细介绍了10个Linux文件内容查看命令的30个实用示例,涵盖了从基本文本查看、分页浏览到二进制文件分析的各个方面。掌握这些命令帮助您:高效查看各种文本文件内...

第13章 工程化实践_第13章 工程化实践课

13.1ESLint+Prettier代码规范统一代码风格配置//.eslintrc.jsmodule.exports={root:true,env:{node...

龙建股份:工程项目中标_龙建股份有限公司招聘网

404NotFoundnginx/1.6.1【公告简述】2016年9月8日公告,公司于2016年9月6日收到苏丹共和国(简称“北苏丹”)喀土穆州基础设施与运输部公路、桥梁和排水公司出具的中标通知书...

福田汽车:获得政府补助_福田 补贴

404NotFoundnginx/1.6.1【公告简述】2016年9月1日公告,自2016年8月17日至今,公司共收到产业发展补助、支持资金等与收益相关的政府补助4笔,共计5429.08万元(不含...

取消回复欢迎 发表评论: