對(duì)于一些初、中級(jí)程序員，想開發(fā)并部署一個(gè)中小應(yīng)用（如開源項(xiàng)目的文檔、個(gè)人博客、個(gè)人網(wǎng)站、在線簡(jiǎn)歷和在線 ChatGPT 聊天工具等）還是有一定門檻的，需要先在電腦上裝好對(duì)應(yīng)的開發(fā)環(huán)境（如 Python、Java、Go、NodeJS等），然后到 GitHub 上創(chuàng)建一個(gè)項(xiàng)目，拉到本地，開發(fā)完后 push 代碼，再到阿里云買云主機(jī)，配環(huán)境、證書，綁 ssh key，拉代碼、編譯……純前端項(xiàng)目相對(duì)方便一點(diǎn)，可以本地編譯傳 CDN，或使用 GitHub Pages 服務(wù)等?？傮w來(lái)說(shuō)，開發(fā)部署應(yīng)用的過程費(fèi)時(shí)費(fèi)力，效率較低。

現(xiàn)在，有這樣一個(gè)網(wǎng)站，完美地解決了上述問題。

InsCode： InsCode - 讓你的靈感立刻落地

一站式應(yīng)用開發(fā)平臺(tái)

從官網(wǎng)介紹看，InsCode是一個(gè)可以在瀏覽器中實(shí)時(shí)運(yùn)行代碼，支持?jǐn)?shù)十種編程語(yǔ)言的開發(fā)平臺(tái)，開發(fā)-部署-運(yùn)維-運(yùn)營(yíng)都可以在線完成，并且內(nèi)置 ChatGPT 問答助手輔助編程。

云端開發(fā)環(huán)境，豐富的模板

InsCode 提供2核/4GB的云端開發(fā)環(huán)境和 AI 編程助手，可以開發(fā)普通項(xiàng)目、開發(fā)AI 應(yīng)用、一鍵部署項(xiàng)目（同樣是2核/4GB的環(huán)境），以及現(xiàn)在最熱門的運(yùn)行 AI 模型。

InsCode的模板中心提供了很多常見的編程語(yǔ)言，如 Python、Java、HTML/CSS/JS、NodeJS、PHP、Go 等。就目前來(lái)看，后端開發(fā)比前端稍微活躍一些，僅Python 就有約 5000 次的使用。

除編程語(yǔ)言外，模板中心還有豐富的模板可供用戶選擇，像熱門的 VueJS、React、Next.js、Nuxt.js 都是有的，當(dāng)然，也少不了 iView （這里有一個(gè)小秘密：InsCode 網(wǎng)站就是用 iView 開發(fā)的）

除此之外，InsCode模板中心還有不少游戲和圖形相關(guān)的框架，如 Three.js、p5.js 以及 WebGL 等。在這里向大家推薦Kaboom ，InsCode上一個(gè)好玩的小游戲，有興趣的用戶可以進(jìn)行嘗試。

接下來(lái)介紹創(chuàng)建一個(gè) VueJS 項(xiàng)目的流程：

創(chuàng)建好項(xiàng)目會(huì)自動(dòng)進(jìn)入一個(gè)在線 IDE 的頁(yè)面，代碼編輯器用的是 VSCode，編程體驗(yàn)上和本地 IDE 是一樣的（畢竟本來(lái)就是同一個(gè)東西）。

點(diǎn)擊頂部的 Run 按鈕，右邊會(huì)打開一個(gè)終端，這里可以看到運(yùn)行了 npm i 和 npm run dev 命令，說(shuō)明背后運(yùn)行的是一個(gè)真實(shí)的 Node.JS 環(huán)境（可以 node -v 和 npm -v 看看版本）。通過終端信息可以看出這個(gè)模板使用了 Vite，啟動(dòng)后會(huì)在右側(cè)打開 預(yù)覽，在InsCode平臺(tái)上能夠在同一個(gè)界面里寫代碼、運(yùn)行代碼、預(yù)覽效果，這個(gè)本地 IDE 目前是做不到的。

除此之外，還有 Vite 的 熱更新，并且有熟悉的 調(diào)試 面板：

IDE 的右上角能看到當(dāng)前的環(huán)境和服務(wù)信息，CPU、內(nèi)存使用率，并提供了 MySQL 的使用通道，滿足廣大用戶做后端項(xiàng)目的機(jī)會(huì)。

AI 編程助手

如果要問 2023 年什么技術(shù)最火，那必須得是 ChatGPT！

InsCode 就內(nèi)置了 AI 輔助編程！

新建一個(gè) sendmail.js 文件，一開始就寫有兩行注釋：

//sendMail
// 參數(shù)：to、title、body

選擇這兩行代碼，頂部會(huì)出現(xiàn)一個(gè) AI 工具欄，點(diǎn)擊 完成代碼 按鈕，右邊的 AI 窗口就會(huì)返回需要的代碼了，并順便解釋了步驟和代碼用法。

以下是 InsCode AI 編程助手返回的代碼

const nodemailer = require('nodemailer');
async function sendMail(to, title, body) {
  try {
    // 創(chuàng)建一個(gè)SMTP客戶端配置
    const config = {
      host: "smtp.qq.com", // 郵箱的SMTP服務(wù)器地址
      port: 587, // 端口號(hào)，一般采用587
      auth: {
        user: "your-email@qq.com", // 發(fā)件人的郵箱地址
        pass: "your-email-password", // 郵箱的授權(quán)碼
      },
    };
    // 創(chuàng)建一個(gè)SMTP客戶端對(duì)象
    const transporter = nodemailer.createTransport(config);
    // 發(fā)送郵件
    const info = await transporter.sendMail({
      from: '"Your Name" <your-email@qq.com>', // 發(fā)件人的名稱和郵箱地址
      to, // 收件人
      subject: title, // 郵件標(biāo)題
      text: body, // 郵件正文
    });
    console.log("Message sent: %s", info.messageId);
  } catch (error) {
    console.error(error);
  }
}

除了 AI 完成代碼，InsCode還有 解釋代碼、添加注釋、尋找 Bug、優(yōu)化代碼 等功能，也可以就某段選中的代碼進(jìn)行提問，代碼功能在閱讀別人代碼，尤其是開源項(xiàng)目（如 Vue）時(shí)非常有用。

在 InsCode 社區(qū) 進(jìn)行搜索，已經(jīng)有很多純 AI 生成的作品了，比如：

• · 網(wǎng)頁(yè)九宮格小游戲（AI生成）

• · Python獲取域名的解析IP地址

• · 21點(diǎn)小游戲

• · Vue實(shí)現(xiàn)1024 霓虹燈

一鍵部署至生產(chǎn)環(huán)境

項(xiàng)目做好后，下一步就是 部署 出去讓別人訪問。

InsCode 能夠直接一鍵部署項(xiàng)目。打開部署面板，只需點(diǎn)擊 部署項(xiàng)目 按鈕（如下圖）就可以實(shí)現(xiàn)部署至生產(chǎn)環(huán)境，并且支持修改域名。

部署編譯的過程：

 部署成功：

部署好后點(diǎn)擊域名就可以進(jìn)行訪問：

 如果想要更新已經(jīng)部署完成的項(xiàng)目，直接在 云 IDE 中修改代碼，之后一鍵更新部署。這一切都是在瀏覽器中完成的，不需要配置環(huán)境，不需要購(gòu)買云主機(jī)……隨時(shí)隨地都可以進(jìn)行，在iPad 上同樣可以做到。

一鍵部署自己的專屬 ChatGPT 應(yīng)用

InsCode 在開發(fā)環(huán)境中內(nèi)置了GPT 3.5 API，可以一鍵擁有一個(gè)專屬自己的 ChatGPT 應(yīng)用。

使用官方提供的模板，只需要一鍵 Fork 或者一鍵部署 就可以了。

模板地址：ChatGPT Template With Vue

下面是作者自制的 AI 中英互譯 ChatGPT 應(yīng)用，當(dāng)輸入中文時(shí)，自動(dòng)翻譯為英文，當(dāng)輸入英文時(shí)則翻譯為中文。

在線體驗(yàn)：AI 中英互譯

一鍵開啟 Stable Diffusion AI 繪畫

今年最火的除了 ChatGPT，還有 AI 繪畫 及其相應(yīng)的大模型，比如Stable Diffusion。下面這種類型的圖，最近是不是經(jīng)常看見呢？

它們都是由 AI 繪畫模型 Stable Diffusion 完成的。但是，安裝 Stable Diffusion 是有一定門檻的，并且需要相應(yīng)配置的顯卡，這讓很多想體驗(yàn)一下的新手用戶望而卻步。

InsCode 提供了在線的 Stable Diffusion 模型，可以一鍵啟動(dòng) WebUI 進(jìn)行 AI 繪畫：

 花一塊錢，就能換來(lái)一個(gè)小時(shí)的 RTX 3090 體驗(yàn)。

 在InsCode提供的環(huán)境中體驗(yàn)AI繪畫：

 試玩地址：Stable Diffusion 模型

社區(qū)學(xué)習(xí)

InsCode 的 Ins 并不是 Instagram 的 Ins，而是 Inspiration 的 Ins。意思是創(chuàng)作、尋找有靈感的代碼。

InsCode 本身也是一個(gè)很好的學(xué)習(xí)平臺(tái)，在它的 社區(qū) 中已經(jīng)有非常多優(yōu)秀的作品了：

• · Sentiment analysis AI 100k：情感分析模型，基于TensorFlow，準(zhǔn)確率83%,數(shù)據(jù)集為IBDM，參數(shù)量100k

• · Python實(shí)現(xiàn)五子棋：一個(gè)用 Python 做的 Console game

• · 指節(jié)跳動(dòng)：一個(gè)練習(xí)打字的 HTML5 應(yīng)用

• · Minecraft：我的世界 Web 版

InsCode中每個(gè)發(fā)布到社區(qū)的作品代碼都是開源的，方便大家學(xué)習(xí)：

 對(duì)于開源項(xiàng)目的代碼有看不懂的地方，還可以直接問 AI 編程助手，能夠高效地提供準(zhǔn)確的結(jié)果，對(duì)新手來(lái)說(shuō)非常友好：

 歡迎大家來(lái)探索 InsCode！

生成海報(bào)

免責(zé)聲明：本網(wǎng)站內(nèi)容主要來(lái)自原創(chuàng)、合作伙伴供稿和第三方自媒體作者投稿，凡在本網(wǎng)站出現(xiàn)的信息，均僅供參考。本網(wǎng)站將盡力確保所提供信息的準(zhǔn)確性及可靠性，但不保證有關(guān)資料的準(zhǔn)確性及可靠性，讀者在使用前請(qǐng)進(jìn)一步核實(shí)，并對(duì)任何自主決定的行為負(fù)責(zé)。本網(wǎng)站對(duì)有關(guān)資料所引致的錯(cuò)誤、不確或遺漏，概不負(fù)任何法律責(zé)任。任何單位或個(gè)人認(rèn)為本網(wǎng)站中的網(wǎng)頁(yè)或鏈接內(nèi)容可能涉嫌侵犯其知識(shí)產(chǎn)權(quán)或存在不實(shí)內(nèi)容時(shí)，應(yīng)及時(shí)向本網(wǎng)站提出書面權(quán)利通知或不實(shí)情況說(shuō)明，并提供身份證明、權(quán)屬證明及詳細(xì)侵權(quán)或不實(shí)情況證明。本網(wǎng)站在收到上述法律文件后，將會(huì)依法盡快聯(lián)系相關(guān)文章源頭核實(shí)，溝通刪除相關(guān)內(nèi)容或斷開相關(guān)鏈接。