Python实践1:从零到一用 Streamlit 打造 Web 应用全攻略

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

文章目录

• 前言
• 一、Streamlit是什么？
• • 1.1 Streamlit的核心定义
  • 1.2 Streamlit 的核心功能：满足数据与 AI 场景需求
• 二、Streamlit的安装
• • 2.1 前提条件
  • 2.2 安装方式
  • 2.3 验证安装是否成功
• 三、创建你的第一个Streamlit Web应用
• • 3.1 创建应用文件
  • 3.2 切换python环境
  • 3.3 在终端中切换环境
  • 3.4 丰富的交互式组件
• 总结

前言

在人工智能与数据科学深度融合的当下，越来越多小白开发者希望将自己的数据分析成果、AI模型预测结果转化为可交互的Web应用，却常被传统Web开发所需的HTML、CSS、JavaScript等技术门槛“劝退”。而Streamlit的出现，恰好为这一痛点提供了优雅的解决方案——它让零基础的Python学习者，无需额外掌握前端知识，仅用熟悉的Python语法，就能在几分钟内搭建出支持数据可视化、AI模型交互、文件上传等功能的专业级Web应用。

无论是展示AI模型对数据集的分析结果，还是让用户通过界面实时调整参数查看模型预测变化，Streamlit都能以极低的学习成本，架起“Python代码”与“Web应用”之间的桥梁。本教程将从最基础的环境搭建开始，一步步带大家掌握Streamlit的核心功能，最终实现从“零代码基础”到“独立开发AI数据Web应用”的跨越，让你的数据与AI成果真正“活”起来，轻松分享给更多人。

一、Streamlit是什么？

1.1 Streamlit的核心定义

Streamlit 是一款专为 Python 开发者设计的低代码 Web 开发框架，其核心目标是 “以最少的代码，快速将数据、模型、分析结果转化为可交互的 Web 应用”。它不需要开发者额外学习前端技术，仅靠 Python 语法就能完成从 “代码” 到 “Web 页面” 的转化，尤其适合数据科学家、AI 从业者、Python 初学者，让大家能把精力集中在数据逻辑与功能实现上，而非页面开发细节。

1.2 Streamlit 的核心功能：满足数据与 AI 场景需求

Streamlit 的功能设计高度贴合数据展示、AI 交互的实际需求，无需复杂配置，就能快速实现以下核心能力：

二、Streamlit的安装

在深入探索 Streamlit 的奇妙世界、利用它构建强大的 Web 应用之前，我们首先需要将其安装到本地环境中，安装过程并不复杂，只要按照以下步骤操作，就能顺利完成。

2.1 前提条件

在安装 Streamlit 之前，确保你的电脑已经安装好了 Python 环境。Streamlit 支持 Python 3.6 及以上版本，你可以通过在命令行中输入python –version（Windows 系统）或者python3 –version（Linux、Mac 系统）来查看当前 Python 的版本信息，若版本不符合要求，需要先升级 Python 环境。

2.2 安装方式

1. 使用 pip 安装（推荐） pip 是 Python 中最常用的包安装工具，使用它来安装 Streamlit 非常便捷。打开命令行（Windows 系统中可通过在 “开始” 菜单中搜索 “命令提示符” 或者 “PowerShell” 打开；Linux 和 Mac 系统中可通过 “终端” 打开），在命令行中输入以下命令：

pip install streamlit

按下回车键后，pip 会自动从 Python 官方的软件包仓库中下载 Streamlit 及其依赖项，并进行安装。安装过程中，你可以在命令行中看到相应的下载进度以及安装提示信息，耐心等待安装完成即可。 2. 使用 conda 安装（适用于使用 Anaconda 环境的用户） 如果你习惯使用 Anaconda 来管理 Python 环境，同样可以通过 conda 命令来安装 Streamlit。首先确保你的 Anaconda 环境已经正确配置并激活（在命令行中输入conda activate 环境名称来激活相应的环境，若不清楚具体环境名称可通过conda info –envs查看），然后输入以下命令：

conda env list #查看当前所有的python环境
#如果只有base环境，则证明没有创建其他的虚拟环境
#创建虚拟环境如下：（如果已经创建好课程所需的虚拟环境则忽略）
conda create -n AI-course python=3.12
##稍等片刻，环境创建成功后
#如果已经有该虚拟环境可直接通过以下命令进入虚拟环境
conda activate AI-course ##激活并进入创建的虚拟环境
#进入虚拟环境后，通过命令安装streamlit
conda install -c conda-forge streamlit

这里的-c conda-forge表示从 conda-forge 这个渠道获取 Streamlit 包进行安装，conda-forge 包含了很多在 Anaconda 官方仓库中没有但很实用的 Python 包，Streamlit 就在其中。同样，等待命令执行完毕，就能完成安装。 3. 关于下载缓慢的解决方案 每次用conda install都要等很长时间，安装包进度条卡住不动？这不是你的网速问题！默认的国外镜像源对国内用户有网络问题，所以解决方案就是更换国内的镜像源进行安装。

• 按下Win+R输入cmd打开命令提示符(windows);打开终端.app(Linux、mac)
• 依次执行以下三条命令（建议直接复制粘贴）：

conda config –add channels https://mirrors.tuna.tsinghua.edu.cn/anaconda/pkgs/main/
conda config –add channels https://mirrors.tuna.tsinghua.edu.cn/anaconda/pkgs/free/
conda config –set show_channel_urls yes

• 最后来个验证命令：
• conda config –show channels
• 看到输出里有tsinghua字样就说明换源成功啦！
• 然后重新执行pip install streamlit

2.3 验证安装是否成功

安装完成后，我们需要验证一下 Streamlit 是否已经成功安装到我们的系统中了。在命令行中输入以下命令：

streamlit –version

如果安装成功，命令行将会显示当前安装的 Streamlit 的版本号，例如Streamlit, version 1.50.0之类的信息，这就表明你已经可以使用 Streamlit 开启 Web 应用开发之旅了。

通过以上简单的步骤，我们就顺利地将 Streamlit 安装到了本地环境中，接下来就可以尽情发挥创意，利用它来打造属于我们自己的精彩 Web 应用了。

三、创建你的第一个Streamlit Web应用

下面，我们将通过最简单的代码来创建第一个Streamlit Web应用。

3.1 创建应用文件

首先打开VsCode并新建一个名为 app.py的文件，并在其中写入以下代码：

import streamlit as st

st.title("Hello, Streamlit! 👋")
st.write("这是你的第一个Streamlit Web应用！")

vscode创建文件如下图所示，也可直接通过Ctrl + N来快速创建新文件 出现如下图所示，则证明创建成功 在新建的app.py文件里输入上述代码，如下图所示：

3.2 切换python环境

如果已安装好streamlit包，但是代码出现未找到相关包的错误，可能是你的代码执行环境和你安装streamlit的环境不一样，如图所示： 通过vscode切换不同的python环境，首先打开vs code设置菜单，如图所示 按ctrl + shift + P（windows）；或者command +shift + P （Mac） 在设置菜单，输入：Python:Select Interpreter 选择完python环境，vscode右下角会显示你当前程序的执行环境，如图所示。 点击右上角的执行按钮，执行代码： 运行代码，仍出现如下问题： 错误信息显示：你直接用 python 命令运行了 Streamlit 应用（python app.py），而不是用 streamlit run app.py。

Streamlit 应用需要用 streamlit run 命令启动，否则会出现 missing ScriptRunContext 的警告，并且网页不会正常显示。

解决方法： 在终端输入以下命令启动你的应用：

streamlit run app.py

这样就能在浏览器中正常访问你的 Streamlit 网页应用了。

3.3 在终端中切换环境

在vscode最下方的终端窗口输入conda activate AI-course，并回车，如图所示

出现如下图所示，就证明终端已成功切换到了AI-course这个python环境中。 输入streamlit run app.py，结果如图所示：

3.4 丰富的交互式组件

Streamlit提供了丰富的交互式组件，能够让Web应用具备更强的交互性和实用性。下面介绍几种常用的组件及其使用方法。

• 滑动条与输入框

滑动条和输入框是收集用户输入的常用组件，以下代码展示了它们的基本用法，可将如下代码直接写入app.py文件中，并通过streamlit run app.py执行代码，查看效果

# 滑动条：用于选择年龄，范围为0到100，默认值为25
age = st.slider("你的年龄是多少？", 0, 100, 25)
st.text(f"你选择的年龄是：{age}")

# 输入框：用于输入姓名
name = st.text_input("你的名字是？")
st.write(f"你好，{name}！")

运行上述代码后，网页中会出现一个滑动条和一个文本输入框，用户可以通过滑动条选择年龄，通过输入框输入姓名，应用会实时显示用户的输入结果，整个过程无需编写任何前端代码。 每更新完一次代码，都要ctrl+S保存，就要刷新一下生成的网页。

• 数据可视化展示 Streamlit能够与Python主流的绘图库无缝集成，轻松实现数据可视化在Web应用中的展示。以Matplotlib为例，绘制正弦曲线的代码如下：

import streamlit as st
import numpy as np
import matplotlib.pyplot as plt

# 生成数据
x = np.linspace(0, 10, 100)
y = np.sin(x)

# 创建图形
fig, ax = plt.subplots()
ax.plot(x, y)

# 在Streamlit应用中显示图形
st.pyplot(fig)

会出现如下错误，说明matplotlib依赖包还没有安装， 输入pip install matpotlib安装 结果如图所示 完整代码如下：

import streamlit as st
import numpy as np
import matplotlib.pyplot as plt
st.title("Hello, Streamlit! 👋")
st.write("这是你的第一个Streamlit Web应用！")
# 滑动条：用于选择年龄，范围为0到100，默认值为25
age = st.slider("你的年龄是多少？", 0, 100, 25)
st.text(f"你选择的年龄是：{age}")

# 输入框：用于输入姓名
name = st.text_input("你的名字是？")
st.write(f"你好，{name}！")
# 输入框：用于输入姓名# 输入框：用于输入姓名
class_name = st.text_input("你的班级是？")
st.write(f"你的班级是{class_name}！")

number = st.text_input("你的学号是？")
st.write(f"你好，学号{number},{class_name}的{name}！")

# 生成数据
x = np.linspace(0, 10, 100)
y = np.sin(x)

# 创建图形
fig, ax = plt.subplots()
ax.plot(x, y)

# 在Streamlit应用中显示图形
st.pyplot(fig)

总结

在这篇教程博客中，我们一同开启了从零到一使用Streamlit打造Web应用的学习之旅。

首先，我们认识了Streamlit到底是什么，了解到它作为一款低代码Web开发框架，凭借着无需前端知识、纯Python开发的优势，以及丰富的交互组件、无缝衔接Python数据与AI生态、能实时预览与快速迭代等强大功能，为数据科学家、AI从业者以及Python初学者们提供了一个便捷高效的Web应用开发途径。

接着，我们详细学习了Streamlit的安装步骤，不管是通过常用的pip安装方式，还是对于使用Anaconda环境的用户适用的conda安装方式，只要按照相应流程操作，并验证安装成功后，就能为后续的开发做好准备。

最后，我们亲手实践，通过简单的代码创建了属于自己的第一个Streamlit Web应用，从最基础的代码结构搭建，到运行应用看到实际效果，再到进一步探索添加更多有趣的功能，大家都体验到了Streamlit的易用性和强大之处。

总的来说，Streamlit极大地降低了Web应用开发的门槛，让更多人能够轻松地将自己的数据、AI模型等成果以直观的Web页面形式展现出来，方便与他人分享和交互。希望大家在掌握了这些基础内容后，能够不断探索、深入学习，利用Streamlit打造出更多满足不同需求、功能丰富多样的精彩Web应用，在数据与AI的世界里更好地发挥自己的创意和价值。