首页
学习
活动
专区
圈层
工具
发布

Python应用开发——30天学习Streamlit Python包进行APP的构建(4)

通过构建 Bored API 应用学习如何使用 API Bored API 应用可以在你无聊的时候建议你做些有意思的事! 技术上来说,这也演示了如何在 Streamlit 应用内使用 API。...如何使用?...v=vIQQR_yq-8I") # 初始化代码编辑器和图表的默认数据 # # 在这篇教程中,我们会用到 Nivo Bump 图的数据 # 你能在“data”标签页下获取随机的数据:https://nivo.rocks...代码编辑器 # # 首先,我们将其默认值设为之前初始化好的 st.session_state.data...编辑器已经将一个延迟回调函数绑定至 onChange 了,因此即便你更改了 Monaco 的内容 # Streamlit 也不会立刻接收到,因此不会每次都重新运行

1.8K10

快速搭建一个代码在线编辑预览工具(实战)

: 1.把本次拖动瞬间的偏移量由像素转换为百分比; 2.如果是向左拖动的话,检测本次拖动编辑器的左侧是否存在还有空间可以压缩的编辑器,没有的话代表不能进行拖动;如果有的话,那么拖动时增加本次拖动编辑器的宽度...,同时减少找到的第一个有空间的编辑器的宽度,直到无法再继续拖动; 3.如果是向右拖动的话,检测本次拖动编辑器及其右侧是否存在还有空间可以压缩的编辑器,没有的话也代表不能再拖动,如果有的话,找到第一个并减少该编辑器的宽度...,这样后期无法再动态修改语言,我们修改为切换文档模型的方式: // 创建编辑器 editor = monaco.editor.create(editorEl.value, { minimap:...= monaco.editor.createModel(code, language) // 设置成新的 editor.setModel(newModel) // 销毁旧的模型 if...2021-05-14-14-37-28.gif 有没有更快的方法 如果你看到这里,你一定会说这是哪门子快速搭建,那有没有更快的方法呢,当然有了,就是直接克隆本项目的仓库或者codepan,改改就可以使用啦

4.9K30
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    快速搭建一个代码在线编辑预览工具

    : 1.把本次拖动瞬间的偏移量由像素转换为百分比; 2.如果是向左拖动的话,检测本次拖动编辑器的左侧是否存在还有空间可以压缩的编辑器,没有的话代表不能进行拖动;如果有的话,那么拖动时增加本次拖动编辑器的宽度...,同时减少找到的第一个有空间的编辑器的宽度,直到无法再继续拖动; 3.如果是向右拖动的话,检测本次拖动编辑器及其右侧是否存在还有空间可以压缩的编辑器,没有的话也代表不能再拖动,如果有的话,找到第一个并减少该编辑器的宽度...,这样后期无法再动态修改语言,我们修改为切换文档模型的方式: // 创建编辑器 editor = monaco.editor.create(editorEl.value, { minimap:...= monaco.editor.createModel(code, language) // 设置成新的 editor.setModel(newModel) // 销毁旧的模型 if...如果你看到这里,你一定会说这是哪门子快速搭建,那有没有更快的方法呢,当然有了,就是直接克隆本项目的仓库或者codepan,改改就可以使用啦~ 结尾 本文从零开始介绍了如何搭建一个代码在线编辑预览的工具

    4.7K20

    手把手教你实现在Monaco Editor中使用VSCode主题

    ps.想直接了解如何实现的可以跳转到【具体实现】小节。...如果遇到报错或者语法提示不生效,那么可能需要配置一下worker文件的路径,可以参考官方示例browser-esm-webpack。...退而求其次 既然VSCode的主题不能直接使用,那么就只能能用多少用多少,因为Monaco Editor内置的主题token就只有那么多,那么把它所有的token颜色换成VSCode的主题颜色不就行了吗...应该会同时帮你再安装monaco-textmate、onigasm、monaco-editor这几个包,monaco-editor自不必说,我们自己都装了,其他两个可以自行检查一下,如果没有的话需要自行安装...加载onigasm 首先我们要做的是加载onigasm的wasm文件,这个文件需要首先被加载,且加载一次就可以了,所以我们在编辑器初始化前进行加载: import { loadWASM } from '

    4.6K41

    肘子的 Swift 周报 #051| Xcode 并不孤单

    如何减少 iOS 上的本地 AI 模型大小[9] DanielJia[10] 随着越来越多的 iOS 应用集成 AI 功能来增强用户体验,模型的体积和初始化速度变得尤为关键。...Daniel Jia 在本文中探讨了几种在 iOS 上减小本地 AI 模型大小的策略,以提升应用的性能和响应速度。这些策略包括模型压缩、利用系统缓存预热模型、以及远程下载和异步加载模型的方法。...在本文中,Giovanni Monaco 深入探讨了在 SwiftUI 中实现混合模式的技术,以及如何利用这些技术创造引人注目的视觉效果。...#049 创新可以有很多种 #048 我们需要更多的《悟空》 THANK YOU 如果你觉得这份周报或者我的文章对你有所帮助,欢迎 点赞、赞赏,并将其 转发 给更多的朋友。...Basics): https://t.ly/IJv3C [8] Majid Jabrayilov: https://x.com/mecid [9] 如何减少 iOS 上的本地 AI 模型大小: https

    1.2K10

    25次对话,1个小时,用腾讯CodeBuddy IDE做了一款超实用的工具

    点击Log in,使用谷歌账号登录或者新注册一个账号都可以。登录成功。输入邀请码。3、测试体验界面乍一看和VSCode很像。...界面很简洁,但是作为一个AI编辑器,该有的功能都有了。输入框上面那一排菜单,从Figma选择、选择组件、配置集成、配置MCP、上传图片、预览、部署。...项目概述:基于React + TypeScript构建的Web应用采用Monaco编辑器提供专业的Markdown编辑体验使用shadcn/ui组件库确保界面美观统一支持实时预览、多种卡片模板和导出功能技术架构...:前端:React 18 + TypeScript + Tailwind CSS编辑器:Monaco Editor(VS Code级别体验)Markdown解析:markdown-it导出功能:html2canvas...“完美,请帮我部署一下”第一次部署遇到问题,访问是空白页面,于是它检查出了问题,重新部署。

    1.9K72

    「 工具篇 」VS Code

    Visual Studio Code VSC 的前身是微软基于云端的编辑器项目:Monaco 编辑器,它作为微软云服务的一部分,提供在线编辑源代码的能力。 ?...VS Code 技术路线 VSCode 采用了 Electron,使用的代码编辑器名为 Monaco。...VSCode 核心 核心层 base: 提供通用服务和构建用户界面 platform: 注入服务和基础服务代码 editor: 微软 Monaco 编辑器,也可独立运行使用 wrokbench: 配合...主要功能如下: 在行号槽显示正在编辑的文件的改动情况 Git状态栏(位于左下角)会显示当前所在分支,编辑指示符以及未提交或者未拉取的提交的数量 能够在编辑器内完成常用的 Git 操作: 初始化一个仓库...把开发环境作为沙箱,以免影响本地计算机配置 让新手轻松上手,让每个人都保持一致的开发环境 使用原本在本地环境不可用的工具或运行时,或者管理它们的多个版本 在WSL里开发Linux应用 从多台不同的计算机访问现有的开发环境

    4K30

    如何开发Cursor

    今天,我们来聊聊如何从零开始,开发一款像Cursor一样智能的编程助手(此篇借鉴了资深大厂程序员讲稿总结)。...如何开发一款像Cursor一样的AI编程助手Cursor也包含前端和后端开发,前端就是一个客户端负责与用户进行对话交互,后端复杂处理用户的输入,以文本形式输出给用户。...前端开发:打造用户界面和交互体验基础框架搭建我们首先用WebIDE(C++)作为底层,或者用Electron框架,把网页技术(HTML、CSS、JS)打包成桌面应用。这样既能保证性能,又能快速开发。...核心代码编辑器代码编辑功能是核心,我们用Monaco Editor(VS Code的核心编辑器组件),它能提供语法高亮、代码补全、错误提示等专业功能。...所谓大模型训练,也就是我们要训练一个非常复杂的函数,这个函数已经复杂到没有办法使用数学方程表达式表达出来,它可能需要一个复杂网络架构来表示,这个网络架构我们可以称之为它是神经网络架构。

    52711

    富文本及编辑器的跨平台方案

    如果仅存储在本地,那么换台手机或者清除数据后,数据就无法找回了,这必然不符合大众的需求。...,可以根据项目需要酌情选择: 之前分享的文章中,L2 阶段的富文本编辑器的数据模型多是 JSON 结构,本节直接沿用之前的例子展开介绍下 JSON 数据模型是如何满足以上三个条件的: 遵循条件规范,...本节解决的问题是:WEB 端产出的富文本内容,在各平台如何得到最本源的展示效果。那么如何保证各个平台都是输出相同的数据模型呢?这也就引入了下节的内容——编辑器的跨平台。...为什么不选择直接用 Native 编辑器或者 Web 编辑器,而是选择这样组合的形式呢?...在跨平台编辑器中,重新上传需要在 WEB 编辑器中触发,交由Native APP 重新上传。Native APP上传图片的前提是拿到图片的本地路径。

    1.2K40

    前端踩坑系列《二》

    问题会以 top 3、 top 2、 top 1 的形式带给大家 排版上采用了一个大佬写的微信排版编辑器工具,最大的好处是支持 markdown,而且代码的主题可以选择 Top 3 问题描述 在打包过程中...Top 2 问题描述 在开发的时候,在某个文件夹下,我们称它为 comp,添加了文件夹以及文件, git 都没有办法追踪到。...然而看了一下,并没有忽略… 方法二 清除 git 缓存。 git rm -r --cached . 没有作用!...可能原因一 可能异步操作了这个数据,毕竟是偶现的,我怀疑是不是异步哪里会修改到这个数据导致闪退。结果并没有发现相关的异步操作。...可能原因二 success 下面的数据有问题,数据如下,我们可以发现,下面的嵌套是很深的,有没有可能是因为 JSON 嵌套层级或者数据量的问题导致 APP 闪退的呢? ?

    47620

    Windows平台Java开发环境的搭建

    JVM在加载类的时候,就会根据这个环境变量来查找有没有类存在,有的话会加载。如果这个配置错误的话,在运行程序的时候就有可能出现找不到类的异常。 PATH 代表在命令提示符中运行命令的查找位置。...网络设置 如果你有代理的话推荐给Idea加上,因为如果以后进行Spring或者Maven开发的话,默认的网络连接非常慢,可能一下午都没办法下载一个包。所以有代理的话加上,方便下载。...在这里可以更改所有的字体。...如果只想更改java编辑器的字体,在右边找到java,然后修改Java Editor Text Font,推荐选择Consolas或者Monaco或者Liberation Mono字体。...如果想要让所有的代码窗口都显示这种字体,可以修改Basic下的Text Font,这样所有的代码窗口包括Console窗口都会使用这种字体。

    1.6K10

    那些年我们一起踩过的坑——WebIDE 前端札记

    当时有一个坑,大家知道 React 如果用 CoffeeScrip 写出来没有办法看,这不是 React 提倡的方式,所以到第三版时我们直接换掉了 CoffeeScript。...一般情况下,这些组件被叫做容器组件(container components),或者说的更加确切的话,就是连接组件(connected components)。...CodeMirror 上自带了 diff view,merge view,在 CodeMirror 上我们又重新把 Java 的代码提示写了一遍。...之前有用户向我们建议使用 monaco 的编辑器,但是更换编辑器会有很多细节需要处理,如果接下来有精力我们可能会换到 monaco。换编辑器也需要很大的工作量,这是一个很头疼的问题。...DOM 还会拖慢 JavaScript,所有的 DOM 操作都是同步的,会堵塞浏览器。JavaScript 操作 DOM 时,必须等前一个操作结束,才能执行后一个操作。

    1.4K40

    富文本及编辑器的跨平台方案

    如果仅存储在本地,那么换台手机或者清除数据后,数据就无法找回了,这必然不符合大众的需求。...,可以根据项目需要酌情选择: 之前分享的文章中,L2 阶段的富文本编辑器的数据模型多是 JSON 结构,本节直接沿用之前的例子展开介绍下 JSON 数据模型是如何满足以上三个条件的: 遵循条件规范,...本节解决的问题是:WEB 端产出的富文本内容,在各平台如何得到最本源的展示效果。那么如何保证各个平台都是输出相同的数据模型呢?这也就引入了下节的内容——编辑器的跨平台。...当然,不是所有的事情都是一帆风顺的。我在开发过程中,也踩了一些坑,跟大家分享下。...在跨平台编辑器中,重新上传需要在 WEB 编辑器中触发,交由Native APP 重新上传。Native APP上传图片的前提是拿到图片的本地路径。

    86530

    Linux 软件安装 DAY14

    (2)conda的安装(电视买好了,也通电了)下载安装包 -- bash 安装 -- 接受协议 -- 选择默认安装路径(回车) -- 初始化 -- 重新加载~/.bashrc -- 调用帮助文档## 下载...conda --help(3)添加频道(调到湖南卫视)不要添加重复的频道,以及频道的顺序是有意义的,下载软件时,首先从第一个频道查询有没有这个软件,没有就在下一个频道。...# -i 是指清除掉构建好的index,清除掉之后才会从新的频道下载软件包conda clean -i # 也可以把所有的缓存都清除掉conda clean -a (4)创建独立小环境# 创建名为rna...的软件环境来安装转录组学分析的生物信息学软件conda create -y -n rna python=3.9# 创建小环境成功,并成功安装python3.9版本# 查看当前conda环境conda env list# 或者...方法2:用yml文件安装conda env create -n rna -f rna.yaml方法3:可以根据路径直接激活别人配置好的conda环境为我们所用④如何指定软件安装的版本⑤如何确定软件已经安装上

    41610

    原来VSCode里藏了腾讯文档400行代码?鹅厂源码公开

    合入腾讯文档代码的是微软 VSCode 团队现主要负责人之一Alexdima(VScode 前身 Monaco Editor 的负责人),他和 Erich Gamma ( VSCode 之父) 来自同一团队...由于使用者众多,任何编辑器其实都不能做到面面俱到去满足所有的使用者。如果什么用户的需求都要满足,就需要把所有的功能都塞进去。这不但臃肿,还不好维护。下面一起来看看我们如何解决。...编辑器用户量不止上千万,用户需求非常多样,必然难以招架。...实现一个强大的配置系统还能保证整体的质量和性能是很不容易的,上图是实际项目中的一个改造例子,左边的表达式收集会转化成右边表达式配置,左边所有的 if 会到配置表里面转嫁给接入方或者可视化配置界面,之后每当变动配置表的信息...你如何理解开源精神?怎么看待当下的开源现状? 如果只能给其他开发者推荐一个开源项目,你会推荐什么? 欢迎在评论区聊一聊你的看法。

    87630

    富文本及编辑器的跨平台方案

    如果仅存储在本地,那么换台手机或者清除数据后,数据就无法找回了,这必然不符合大众的需求。...本节解决的问题是:WEB 端产出的富文本内容,在各平台如何得到最本源的展示效果。那么如何保证各个平台都是输出相同的数据模型呢?这也就引入了下节的内容——编辑器的跨平台。...4.1.1 页面初始化 跨平台编辑器的编辑页由 Native APP 和 Webview 中的 Web Editor 组成,那么意味着页面的初始化需要两个模块协同实现。...当然,不是所有的事情都是一帆风顺的。我在开发过程中,也踩了一些坑,跟大家分享下。...在跨平台编辑器中,重新上传需要在 WEB 编辑器中触发,交由Native APP 重新上传。Native APP上传图片的前提是拿到图片的本地路径。

    2.2K50

    百度编辑器的那些坑

    解决办法: 非常简单,只需要关闭查看源代码的按钮就行,完美解决 如果一定要保留,在不知道如何处理的情况下,并且急需交差的时候,可以这么干(当时情况是第二天就得交差,由于一直找不到问题点,加班到晚上10想出来的办法...解决办法: 也是直接上代码: var ue = UE.getEditor('ueditor'); //初始化内容 window.onload = function(){...) 问题复现: 这也是我要说的重点问题,目前我依然没有找到解决办法,下面的内容都是我的个人尝试,希望找到有过处理经验的人或者有其他方式的办法,有偿感谢!!...说实话,看不懂,凭感觉这里的dataTransfer没有内容,基本上是找不到如何获取粘贴板数据的点 所以个人判断是IE浏览器本身就对这种粘贴操作没有进行兼容或者处理(万恶的IE浏览器) 至此,我知道自己的能力不足...连官方那边都找不到办法,有点万念俱灰,于是把问题往上抛了,八成需要换编辑器,又有的忙了。。。。 分享: 说了这么多,其实我最想说的是,解决问题建议各位一定要留下文档记录,哪怕是如何解决的也好。

    1.8K30

    “改造” VS Code 编辑器,一起写个插件吧!

    VS Code 的编辑能力来自于一款同样来自微软叫做 monaco 的开源 Web 编辑器,同时为了实现跨平台的需求又引入了 Electron:一个使用 JavaScript,HTML 和 CSS 构建跨平台的桌面应用程序...(是否初始化 git 仓库?) Which package manager to use?...进入刚创建的文件目录 cd test-extension,文件目录: 或许你觉得文件目录嘛,一看就知道了,不就是几个配置信息或者项目说明嘛,但是这里面的配置信息「非常重要」x3,重要到你可能少一个配置或者配置的不对...不知道你们有没有这个疑问,上面那个 console.log 去哪里看?...这样的限制在于: 确保用户的操作在可控范围内,保证操作的一致性 防止因为底层 Web 技术的更迭导致对一些已存在的插件会有影响 保证开发人员可以继续在原有插件基础上进行一如往常的迭代,而不用再去打破原有的规则重新学习

    95120
    领券