ChatGPT帮我基于streamlit搭了个人网站

379 阅读6分钟

前言

之前在《我的不算精彩的AI故事》 - 掘金 (juejin.cn)这篇文章我提到了我有一个streamlit的小项目在做,现在我将他做成了一个我的个人主页,并且也部署完成了。和大家分享一下,我的心路历程和整个项目的内容以及后续打算。

项目链接:jasonai.streamlit.app

GitHub地址:HeteroCat/jason.ai (github.com)

背景

这其实是一个前段时间的笔试题,基本目标就是用streamlit做一个基于大模型的文本游戏对话页面,我认为我做出来了,我认为这个一个有趣的项目,之前我打算去学一下streamlit的部署等等,然后再放几个游戏的prompt进行去,这样子我觉得会比较完整,也可以当作一个自己的小项目慢慢去提高自己的开发能力。带着这样的想法我去找了各种streamlit的教程,于是我发现streamlit也可以做个人主页,是这样子我之前就打算用GitHub在上面进行部署个人主页来着,只是一直忙于其他的东西没时间去了解。所以借助这个契机我决定用streamlit创作一个只属于我的个人网站,并且将大模型的文字游戏bot也加进去,带着这样的想法我就开始我的尝试。

首先需要说明的是我没有什么前端的开发经验,只是会一点Python数据分析和后端的flask框架,然后安装视频教程和GPT的建议,完成了整个的项目流程。

主页面

最开始的主页面当然就是一些个人信息内容,毕竟是个人主页你得稍微介绍一下自己和自己做过的一些事情吧。我主要分成这样几个板块:欢迎简介、研究方向、项目经历、相关证书、工作经历、技能、联系方式。主要就是以图片、文字和链接的方式去呈现我想表现的内容。 image.png 这里面哪里用到了GPT呢,有的在开发的过程中我有任何的卡点我都会去问GPT,比方说怎么调整图片的大小啦,怎么进行图片的展示啦,最有特点的就是技能这部分,我是直接问GPT我不满意之前的展示模式,问他streamlit可以用什么更好的方式展示我的技能数据,于是他给了我CSS的代码应用到streamlit中果然效果比之前好多了。对的我不需要学习CSS到底怎么写,我也不清楚CSS,我需要的只是告诉GPT我想要的是什么效果即可。 image.png 可能一开始的效果不会很好,那么请耐心一点,继续提问直到达到你想要的效果。关于主界面目前就是这样了。未来我会尝试加入一些动画,以及自己的一些其他的项目内容等等,不断完善和丰富自己,同时也不断完善和丰富自己的展示,包括展示内容和展示形式两个方面。

image.png

文本游戏Demo

接着来到第二个页面,也是原本项目的页面就是文本游戏的页面,这里对接的是OpenAI的api,你需要先在左侧把你的api key输入进去,通过上面的提示词game rules prompt将游戏启动,接着你就可以进行一步步的文本游戏探索了,这是一个文明冒险文本游戏通过一步步的提示进行游戏的进程,感兴趣的话可以尝试玩一玩,你需要准备一个OpenAI的api key就行了。

对于这部分我后续的准备是添加一些的prompt,可以进行更多好玩的游戏或者其他的一些有趣的东西等等。同时有别的大模型应用尝试demo也会添加进来,我相信未来有更多demo,而不仅仅只是一个调用api的文本对话bot。 img_v3_02cr_18585b19-54b3-494c-bfe4-0bd76069257g.jpg

ai 图片

这里部分包括下一个部分其实是从主页面分离出来的,因为我想展示我的AI画作,而不仅仅只是简单的描述,所以我会在这里展示我的AI生图优秀作品,包括进行后续sd的学习等等。其实目前已经有一些好看的图片想分享了,不过我还没有放上去,应该近期会放上去展示,敬请期待。 image.png

ai 音乐

这个部分我会放我的音乐MV,我很喜欢听音乐,我也喜欢创作音乐,在suno通过AI我已经能够创作出好听的歌曲了,同时我希望可以通过视频MV的形式表现出来,所以我会有一个单独放音乐的地方。目前我已经做了我自己首个AI音乐MV,并在我们的学习活动中获得最佳色彩搭配的奖项。我会在后续放上来,敬请期待。这个部分没有那么简单而且目前的技术也还不太成熟,尽管已经有即梦,可灵,runway等等有用的工具,但在具体实施中还是有比较大的难点,所以我会持续学习了解这方面的内容,包括剪辑、音乐、场景、画面布局等等专业知识,毕竟我不是专业出身,还是有很多不懂的地方。

但是我有足够的热爱,对我来说“耳机是一种不用扎针的输液管,音乐是一种无需服药的良药。”音乐陪我度过漫长岁月,我会带上音乐走向星辰大海。我不知道未来AI音乐会怎么发展,但是我会一直在路上,和AI音乐一起。 image.png

总结

最后总结一下,其实也没什么好总结的。一个巧合+一个突发奇想=一个奇奇怪怪的小项目,这中间其实GPT才是我的伙伴,这个项目更像是我和GPT一起完成的,有点像网上和GPT一起开公司做项目那味道,哈哈哈挺奇妙的。如果大家感兴趣的话,可以继续关注我,我会在后续更新我更多的尝试和项目的变化,也可以找我沟通把这个小项目做得更加有趣、实用或者你也想要这样一个小主页我也可以帮你制作等等。Anyway,The future is an unstable future。但是不变的是,AI将带来更美好的未来。

AI的道路你我同行,共勉!Heterocat