Use Community Cloud to develop with GitHub Codespaces

要使用GitHub Codespaces进行Streamlit开发,您需要一个正确配置的devcontainer.json文件来设置环境。幸运的是,Streamlit社区云在这里提供帮助!虽然社区云主要用于部署和与世界各地的其他人共享应用程序,但我们内置了一些方便的功能,使使用GitHub Codespaces变得容易。本指南解释了如何创建社区云帐户并使用自动化工作流程进入GitHub代码空间并实时编辑Streamlit应用程序。所有这些都直接在您的浏览器中完成,无需安装。

如果您已经创建了Community Cloud账户并连接了GitHub,请跳转到从模板创建新应用

  • 您必须拥有一个GitHub账户。
  1. 前往 share.streamlit.io
  2. 点击“继续登录”。
  3. 点击“使用GitHub继续”。
  4. 输入您的 GitHub 凭据并按照 GitHub 的认证提示操作。
  5. 填写您的账户信息,然后点击底部的“我接受”。
  1. 在左上角,点击“工作区 警告”。
Connect your GitHub account to a new Community Cloud account
  1. 从下拉菜单中,点击“连接GitHub账户”。
  2. 输入您的 GitHub 凭据并按照 GitHub 的认证提示操作。
  3. 点击“授权streamlit”。
Authorize Community Cloud to connect to your GitHub account
  1. 在左上角,点击您的 GitHub 用户名。
Access your workspace settings
  1. 从下拉菜单中,点击“设置”。
  2. 在对话框的左侧,选择“关联账户”。
  3. 在“源代码管理”下,点击“在此连接 arrow_forward”。
  4. 点击“授权streamlit”。
Authorize Community Cloud to connect to your private GitHub repositories
  1. 在右上角,点击“创建应用”。
Create a new app from your workspace in Streamlit Community Cloud
  1. 当被问到“您是否已经有一个应用程序?”时,点击“不,从模板创建一个”。
  2. 从左侧的模板列表中,选择“空白应用”。
  3. 在底部,选择选项“打开 GitHub Codespaces...
  4. 在底部,点击“部署”。
  1. 等待 GitHub 设置您的代码空间。

    完全初始化您的代码空间可能需要几分钟时间。在您看到代码空间中的 Visual Studio Code 编辑器后,安装 Python 并启动 Streamlit 服务器可能需要几分钟时间。完成后,您将看到一个分屏视图,左侧是代码编辑器,右侧是正在运行的应用程序。代码编辑器默认会打开两个标签页:仓库的 readme 文件和应用程序的入口文件。

    Your new GitHub Codespace
  2. 转到左侧窗格中的应用程序入口点文件(streamlit_app.py),并通过在st.title中添加“Streamlit”来更改第3行。

    -st.title("🎈 My new app") +st.title("🎈 My new Streamlit app")

    每次编辑后,文件会自动保存在您的代码空间中。

  3. 在输入更改后的一瞬间,右侧的应用程序将显示重新运行的提示。点击“总是重新运行”。

    Edit the title of your sample Streamlit app

    如果在您点击之前重新运行的提示消失了,您可以将鼠标悬停在溢出菜单图标(more_vert)上以使其重新出现。

  4. 可选:继续编辑并在几秒钟内观察变化。

  1. 在左侧导航栏中,点击源代码控制图标。
See your deployed Streamlit app
  1. 在左侧的源代码管理侧边栏中,为您的提交输入一个名称。
  2. 点击“检查 提交”。
See your deployed Streamlit app
  1. 在确认对话框中,点击“”以暂存并提交所有更改。您的更改将在您的代码空间中本地提交。

  2. 在左侧的源代码管理侧边栏中,点击“cached 1 arrow_upward”将您的提交推送到GitHub。

  3. 在确认对话框中,点击“确定”将提交推送到“origin/main”。

    您的更改现在已保存到您的GitHub仓库中。Community Cloud将立即在您部署的应用中反映这些更改。

  4. 可选:要查看您更新并发布的应用程序,请返回到工作区的“我的应用程序”部分,位于share.streamlit.io,然后点击您的应用程序。

如果你还没有学习Streamlit的基本概念,现在是去Fundamentals的好时机。使用你的代码空间来逐步学习和尝试基本的Streamlit命令。完成后,回到这里学习如何清理你的代码空间。

当你停止与你的代码空间互动时,GitHub通常会为你停止代码空间。然而,避免不必要使用你的资源的最可靠方法是在完成后停止或删除你的代码空间。

  1. 前往 github.com/codespaces。在页面底部,列出了您所有的代码空间。点击您的代码空间的溢出菜单图标(more_horiz)。
Stop or delete your GitHub Codespace
  1. 如果您想稍后返回工作,请点击“停止代码空间”。否则,请点击“删除”。

    Stop your GitHub codespace
  2. 恭喜!您刚刚将一个应用程序部署到了Streamlit社区云。🎉 返回您的工作空间 share.streamlit.io/部署另一个Streamlit应用程序

    See your deployed Streamlit app
forum

还有问题吗?

我们的 论坛 充满了有用的信息和Streamlit专家。