sh-3.2$ poetry install Installing dependencies from lock file No dependencies to install or update Installing the current project: backend (0.1.0) The current project could not be installed: No file/folder found for package backend If you do not want to install the current project use --no-root ''''''///// 我的是这个报错 @@ai-gold-rush
现在的前端开发都是响应式的,而且样式框架都是自定义或者使用开源的,也有用固定开发脚手架的,它生成的代码看上去需要大量的工作才能用。不过这是个很好的开端。如果是企业级应用的话,这个还差的很远,几呼是没用的。
这个比之前微软的 sketch2code 已经好很多了吧, 我感觉如果在某个很垂直的领域自己训练, 应该可以部分商用了.
写元件排版或者找模板的功夫给省下来了
补充 TroubleShooting:
1. 本地后台端口7000启动,生成时如果出错,可以改用端口7001。
2. ·OpenAI的APIKey必须付费,不然当然会出错
3. 即使没有任何问题,生成是也会有错误窗口弹出,这个错误窗口可以无视,不影响结果
4. 一般的页面,生成时间应该在1分钟之内,如果你等了3分钟以上那就要去找错误了。
可以点播吗? 希望做一个关于 tldraw, makereal, cursor editor 的视频。和screen-to-code有类似功能的。
screen-to-code 长于高精度复制出代码。
makereal 擅长理解,扩充 草图画面设计后生成代码。
都很强,都需要OpenAIKey。
谢谢详细的补充
只要不用DETLL E就行。
@@ai-gold-rush我gpt4api聊天之前随便用用就花了五六刀
感謝分享 ❤
再過幾年針對前後端整合跟程式碼優化,這個AI應該就能應付規模小一點的需求了,時代進步真快...
雖然很多人寫說不實用,但是那是因為卡在認知與想像的極限,實際上,這種可能才是未來,他未來若能即時生成對應的HTML,那他的角色其實是跟傳統做一個框架來生成前端DOM會是一模一樣的角色,而且這模型複雜度可以越來越高,但你公司員工記憶力是有上限的,再者你只要做好管理,員工不能帶走程式面的某些隱知識,你的模型只要在,他就能繼續工作。
但說難聽的
專業度會嚴重下降
壓迫到學習網頁撰寫語言的工程師…
@@Anzs1152 其實程式語言只是一種溝通的替代品,如果你是有正規資訊工程教育的工程師會知道自動機理論,任何網頁工程師,學的就是形式語言而已,就算消失也沒有關係,這種替代或轉變在軟體業是天天上演,好比現在網頁工程師完全不懂機械語言或其他低階語言也能寫程式一樣的道理。實際上所有工程師幾乎不懂中間一大段事情,就是懂也沒有意義,因為程式發展下已經變得非常龐大,專業已經呈現一種細分。
所以还是要从最基本开始了解,例如C语言是如何岀现的
快是快,但就跟老程式frontpage那種一頁的網頁設計程式差不多。而且沒有數據庫和購物車,現在類似線上網站商店的設計也很不錯了。基本就只要備圖就能自己開網站賣東西了
數據庫跟購物車你都要他做 還是你辭職算了?
這東西本來就是幫助你而已
@@mai6666 幫助啥? AI前端寫得亂七八糟 如果要跟後端數據接上根本累死自己 還不如自己來
@@user-sj9pu4kw6s 沒錯, 就像找別人做模版, 掉給你他就走了, 你還要理解他的結構, 時間更久。
這點小東西還不如自己做. 現階段沒多大實用性
等到發展成要後台代碼、資料庫的整合才真正實用化
笑死
@@mai6666 對前端工程師而言完全不需要,切版css這些現在隨便用個框架就馬上搭好了,能把JS功能寫好連到後端再說
對不懂網頁的人用又完全用不上,看AI的code再改還不如重寫
看起來很炫,但實務用途不高
因為現在普遍都是動態網站
關鍵是跟後端拿資料然後動態呈現
如果要用它生成的頁面改寫成動態頁面說真的也不是那麼輕鬆,因為它生成的只是一般的html,可能再搭配一點簡單的JS,但現在要開發前端基本都要用框架,不然很難做出比較進階的功能
所以這個程式可以快速解決『前端view』的問題,讓我們只需要專心在後端與資料處串接。
另外我們只需要把生成出來的程式碼區分成哪些是樣板與局部樣板,絕對可以加速我們開發網站的時間~
@@Jones_tonny 妳說的是理想
但單純使用原生HTML 和 JS生出來的view以現在的開發需求來說可用性非常低
別的不說,光是架一個普通的部落格
用三大框架寫出來的view和用原生html/js寫出來的view那個代碼長度和可讀性絕對是無法相提並論的
其實以前figma就已經有提供直接把設計檔轉成html/js的功能了,但就是因為它只能轉成原生html/js所以一直可用性不高,直到最近有個外掛導入AI使得figma能夠產出react框架的代碼才開始慢慢有人去利用
我们后端要的就是样式 ,省的自己 还手写了
@@bradtsai6746 你把低代码平台框架 喂数据给他 绝对能做出来
我想這個AI的實用處並不是像演示裡一樣,擷取一張網站畫面叫他複製,那還不如直接chrome 右鍵另存新檔來的快速,而是可以用修圖軟體拼接想要的布局畫面生成圖片,然後讓他生成Html,這樣就能快速的切版了,真的會省下很多時間
這個影片真是太令人驚嘆了!截圖複刻網站的概念非常創新,而且Github霸榜第一實在是太了不起了!這種快速生成網頁的AI技術絕對是未來網頁開發的一大革命。更令人振奮的是,它還是免費的!這將大大降低網頁開發的門檻,讓更多人能夠輕鬆地創建出精美的網頁。期待看到這項技術未來的發展,以及它將為我們帶來的更多驚喜!
感覺還可以啊,html版不用自己拉,多寫個load和click事件,然後外加個js寫個對應function,js裡面呼叫後端api就可以跑了😂
只有具有能够自动写自适应响应式和各种终端兼容的代码才有用。
我在安装项目文件的时候突然意识到,想要复制浏览器的界面设计,完全可以直接利用浏览器自带的开发者工具查看前端代码
可以很輕鬆做出一頁式詐騙網站...除此之外我想不到這種靜態網站最可被用來做的事了
对前端开发来说,Html,JS,CSS三要素。这个东西直接把两个都搞定,然后剩下弄几下Js就好。效率会很高哦
@@ai-gold-rush AI工具可以砍掉很多人的工作🥲
@@ai-gold-rush 確實 省去刻板的時間專心開發業務功能
看起來也是調GPT
有点规模的ui开发项目不是这样做的@@ai-gold-rush
只是看着像而已。如果窗口大小发生变化,原版网页的 Layout的响应肯定没有复制
现在学习的重点是不是UI或者产品设计,自己画界面布局,让工具自动生成代码
用處不大,很像就算了,但真的差有點多。
我覺得這思路走錯了,還不如將網站或FIGMA直接導出HTML,然後讓它處理並精簡規格化成可用的代碼。
單靠圖片...他截圖都做得很不像了,到時候你還是要重刻。
对于行外人搞个静态主页啥的还是OK的,内行写代码的人就算了,这么弄还不如,我直接给实现需求,让AI生成框架或者函数,然后review一下,自己补补改改更靠谱
太棒了 谢谢炼金师的视频教程!
其实相比于把设计变成实现,我更希望它帮我设计
有更簡單的方法,直接對該網頁按下CTRL+S,就能存下來了........ 哪需要甚麼AI,你說這樣後台資料庫沒有? 阿這AI做出來的也沒資料庫阿.... 所以純屬一個玩具沒任何實際用途
/。。。。。
那有版权法律问题吧,我小白不懂
現階段一次只讓它生成一個component應該會很實用
按这个状态发展下去,普通程序员的工作完全可以被AI代替。
感谢分享
做AI写稿也半年了,虽然不多,按照现在这个进度一年也能存个十来万,也是辛苦钱,电脑面前做一天,腰老不舒服了[笑哭R]
是很強大 但是還是有條件限制 主要是主機用的是那一種
我就想问,跟后端的交互能做出来吗?只是一堆HTML+CSS,有什么用
可以取代寫HTML跟CSS設計師
就像dreamweaver產生的東西一樣吧...
ERROR 17:06:39
[TypeScript] Found 0 errors. Watching for file changes.
可不可以详细的说明一下windows如何安装呢,命令都不同的
哪个命令不同呢?基本一样啊。我用的都是炼金术士笔记里的命令啊
讲的很仔细,喜欢,加油,另外问一下,要使用这个开源的前提是不是一定要使用GPT4.0版本才能使用?
需要OpenAI 的API key 但并不需要GPT4 plus 的订阅
@@ai-gold-rush 3.5的API key也行吗?
@@TTFMABO 注册免费送的5刀不行,只要充值过,开放了GPT Vision,就可以了
好的,谢谢噢!@@ai-gold-rush
@@ai-gold-rush就是说我单独购买的3.5api也可以吧
谨慎使用37次扣了我2.5 刀,效果更宣传图的差距很大🤢
确实不好用
这个是不是必须得 GPT4的 token才能使用?
Windows 系统的安装命令是什么?
就是个吸引眼球的玩具而已,况且还需要4的api,实际用途没有
对gpt4 key的消耗怎么样? 比如像youtube页面. 只生成html css吗? 包含js吗
包含CSS不包含JS,相当于给你一个HTML模版,你可以放进你的前端组建中直接用
參考一下 front end ui還是可以
用這種產出的code都很亂 css缺乏架構
js 也不知所云 改起來更累 不如去找免費的template
來重改, 有興趣可以問我:)
国内没有GPT的验证码?应该怎么弄 合租能有验证码吗?
这个产品最多能博一下眼球,我想不到有什么实际用处
頂多輔助你怎麼寫,但完全沒辦法替代任何一位工程師
往後修改的人應該會殺掉那個指示他修改的人(蓋章
tailwind is versatile
我在乌班图搭建成功了,网址也出来了,但是网址 进去没有用,显示无法访问
如能直接直接输入网址链接来生成就更好了
国内用不了openapi keys,有其它可用的keys注册渠道吗
干了半辈子,感觉白干了。。。
我是小白,这种方式生成的代码是不是和原网站会不同,在一些细节上
而且,这个在线版的工具,也不行,提示项目有问题。
本地版的没问题哦,我在Windows上用了,很智能,一点儿也不傻
感覺我的後台頁面可以靠他了,反正後台不需要好看🤣
可惜要GPT4的帐户的KEY
需要的不是GPT4账户的KEY,而是按照采访次数收费的platform的KEY,它们是不同的。
生成一个相对简单的网页,大约要0.02美元。
@@big-mouth-2023如何改模型?
@@mydou 不需要改模型。该软件用的是GPT-4-turbo模型,只要你给OPENAI付了费(注意不是GPTPLUS),就能用。5美元能生成200多次HTML,足够用了
我想問左邊的命令做科隆的如何開啟??如何安裝?
用docker安装到公网服务器里有问题,配置我都改了,ws会报错,ws的地址我改了,控制台能看到101连接成功,但是马上会报错
具体什么错呢
@@ai-gold-rush 就是ws连接后异常,没研究了
为什么不尝试直接保存网页的源码发给gpt让它重建一份正向开发视角的源码😊,我只是想感觉这样分析图片转文字表达还不如直接给代码
有点牛逼,试试
可不可以出一個docker部署的教程。
网上有的是,这还出啊
能做前端就能做后端,大批程序员下岗未来2,3年的事。。。
請問windows版要怎麼安裝?
感觉没啥用,只是用html css画个样图而已
是的。目前来还是比较鸡肋的,只能借用css,其他的基本用不着。页面整合进已有项目也比较麻烦。不过gpt以后已经会具备这个能力的,早晚问题。
前后端分离呢
15美元100行代码?
请问博主,poetry install无法安装怎么解决,其它都能安装.
具体什么错误呢
sh-3.2$ poetry install
Installing dependencies from lock file
No dependencies to install or update
Installing the current project: backend (0.1.0)
The current project could not be installed: No file/folder found for package backend
If you do not want to install the current project use --no-root ''''''/////
我的是这个报错
@@ai-gold-rush
怎覺得是AI抄襲別人的網頁代碼,這樣會不會有問題。。。
最後的例子根本不一樣
对电脑性能配置有要求吗
Powerful
只能做靜態囉~
必须是gpt4?
没有另一个执行窗口,卡住了,大佬怎么解决
不用寫前端代碼了!!
左上角有红黄绿三个点的这是什么浏览器?
就是Mac啊
在哪里输入命令?
后台使用不能生成吧
小程序可以复刻吗?
多个页面的网站能支持?
如果多个页面,没有重复的话,那就一张一张来吧。如果有重复模块,Emm,可以去提个建议,哈哈
这跟你直接view source code有区别吗?
现在前端已经没有源码
请问1分33秒左侧键入代码的页面如何切换出来,小白
那个是Mac的Terminal命令行,用spotlight 输入terminal就可以打开了
win怎么调出来?
chatgpt 3.5 可以?
外行看热闹,内行看门道。哈哈笑死😂
全部absolute有毛用。
整个图费一堆token,秒变冤大头。
前端们可以洗洗睡了,醒来该投简历了
这种回答一看就是外行,前端难的不是静态视图,是交互
小白用W11系统还是没有成功,不会啊
我弄成功囉
有讨论群吗up大大
可以考虑开一个,电报还是Discord?
@@ai-gold-rush 我投电报+1
肯定电报啊,discord太难用了 @@ai-gold-rush
@@ai-gold-rush开了吗?我也需要😂
釣魚網站的天堂?
为啥呀?
@@user-wn4ub7lz7j 這樣任何網站的登入介面就出來拉,之後後端寫一寫就掉到了
页编失业了....
没有。最多需要的 页编 变少,然后很多页编被迫转行去计算机科学家,研究AI
关键是 ,后台代码。。
和Gpt4商量商量它就能做出来。关键是各种原来的工具和AI联用,和原来的效率不能比的。对于非常熟练的前后两端的工程师这个没啥用,但是他们被这些AI杀死了。
@@big-mouth-2023 Gpt4弄初來的後台你確定真的能用? 除非你自己本身會設計程式再花時間修 不然根本不可能,但是修的時間不知道要弄多久就是了,還不如自己弄一個比較快
@@user-sj9pu4kw6s 「還不如自己弄一個比較快」、这个就是我说的重点啊。能快到哪里去呢?也许像你说的GPT4还没有那么强,但是它成长的很快,再加上与其他工具的联合运用,已经开始对工程师进行屠杀了。 一个只知道WebApp基本理论的人,以前他如果抛弃了工程师,他会因各种细节非常痛苦,好比乘着一辆驴车周游全国,但是现在他已经换上了汽车,虽然周游全国仍然很慢,但是意义已经完全不一样了。
@@big-mouth-2023現階段要談屠殺真的還早,gpt、copilot等真的是很強大的工具,但webdev的開發可不只是把頁面刻出來、api有回應就好。
光是搞懂客戶需求、理解商業流程並轉換成code就是一個工程師一定要介入的點。
不要跟我說PM談一談,然後把生成的code直接貼上就完事了...
只能做静态页面吧?
对
怎么样可以把这个网站发布出去
发布网站我比较推荐Google Firebase,免费,全球部署
screen to code可以寫出vue嗎?
生成本地代码是什么?
右上角有一个显示代码的按钮
會否令到人類智商退化
可是为什么不直接把前端代码扒下来呢😢
油管前端代码扒下来也看不懂吧……
@@ai-gold-rush 本来就不需要看懂啊,用dom找到你想要的元素扒下来就好了,静态页面又不需要js来实现任何功能
其实这个是节省切图和UI对齐时间的。
@@cuigavin2396 节省的就是你说的这个劳动,并给出相对干净易懂的代码
換一個使用情境度想,那我們是不是用畫圖的圖片丟給程式,他也可以呈現程式碼了呢~?
牛,以後更多人不會寫code🎉
docker可以部署吗?求教程~
官網有docker-compose,可以自己build
并没有惊艳到
css做的要吐,这下好了
hehe
詐騙+AI 怕爆
可以把它放到wordpress 吗?
可以的
@@ai-gold-rush 感谢回复,能出个教程吗?那样外贸建站就轻松很多了🙏
@@sunnyho1696 你先讓Screenshot to Code把網站寫好,在拿代碼去創建一個gpts,讓他製作一個無頭wordpress就好了。
@@sunnyho1696 你想多了。目前为止他还没有办法帮助一个外行独立建站。
前端已死
看起來超爛根本不堪用
程序员真是自掘坟墓
并没什么卵用
炫 但不實用
我最近偶爾會自學html CSS,看來可以不用學了
我挺好奇你的想法,學習html css不就是想要構建一個屬於自己的漂亮網頁嗎?為什麼一個複製別人網頁的工具會讓你放棄學習?
@@user-ww3gp5bk4w 😅沒有啦,算是玩笑話,把看到有興趣的介面,透過工具去解析,加速學習速度或是引用
@@user-ww3gp5bk4w 因为用画个图和截图贴都行。这样只要设计就行了
@@user-ww3gp5bk4w現在figma都能輸出layout了,連motion plugins 都能包一起,認真不太用學,要做很厲害的效果也有GSAP根本也不用css寫
詐騙狂喜