fbpx

Dreamsands – 把網頁的螢幕截圖轉換成使用不同前端框架可執行的程式碼

Contents

上週的 GPT-4 線上展示中,OpenAI CEO 有做了一個很令大家驚奇的功能展示 – 將手繪的網站草稿變成 HTML/JS/CSS 程式碼,並可以立即在瀏覽器中展示。

其實這個功能早在 5 年前就有團隊做了出來,並開源,請參考 從手繪 Wireframe 自動生成 HTML 程式碼

我在網路上看到一些評論提到這樣的功能實用價值不高,因為大部分的網頁都是比較複雜的,而且目前真正在專案中使用的前端框架也不僅僅使用 HTML/JS/CSS,而是會使用 React/Vue/Angular 這樣的前端框架來開發比較複雜且大型的網頁應用程式的前端。

今天要介紹的這家新創公司應該就聽見了市場的聲音,它們做出來的工具就可以去把網頁的截圖擷取下來,然後你可以選擇你想要轉換成哪一種前端框架

Dreamsands 的產品的介紹影片中,他們將 Notion 的入口網頁擷取了下來,然後使用這個工具轉換成前端程式碼並可以馬上執行,可以看到目前流行的前端框架 React/Angular/Vue 都有支援

前端開發的工作要被 AI 取代了嗎?

看到這樣的工具,可能有不少人會說未來的前端開發工作是不是也會跟翻譯工作一樣走向末日? 我倒是沒這麼悲觀,畢竟前端開發需要很多的溝通,AI 也許會把一些很簡單的網頁前端開發降低了門檻,但是需要比較複雜的人機介面,還需要考慮到 UX 的可用性,這個工具可以把前置作業的繁瑣工作所要花費的時間省了下來,讓開發者把時間更專注在與後端工程師的溝通與協調,UX 使用性的功能提升與網頁效能等工作。所以這樣的工具出現,會讓我們去思考,那接下來前端工程師的技能要再往哪個方向去提升?

相關線上課程

不受 FB 演算法影響,歡迎透過 e-mail 訂閱網站更新

支持 Soft & Share

❤️您應該有留意到,我們的網頁並不會出現干擾人的跳出煩人的廣告或是在內容中嵌入廣告,因為我們發現這樣對閱讀網頁的內容體驗真的是不好!

如果您覺得我們提供的內容服務還不錯,歡迎透過對以下產品/服務的購買投資來支持本站的營運走得更遠

如果暫時還不需要以下的付費服務,幫我們把這個網站分享給有需要的朋友,您的小小舉動會對 Soft & Share 有莫大的幫助!感謝您的支持!

🎈如果您點選優惠連結後,還是沒有看到優惠價格,請將瀏覽器的 cookie 清除 ( 清除 udemy 網站的就可以了 ),然後重新點選優惠連結並登入 Udemy 就可以了

不受 FB 演算法影響,歡迎透過 e-mail 訂閱網站更新

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料

Powered by WordPress.com.

Up ↑

%d 位部落客按了讚: