ChatGPT-ээр vibe coding: Canvas, Codex, ChatGPT-ээс app бүтээх

ChatGPT-ээр vibe coding гурван аргаар хийж болно. Чатад жижиг app хүсч, canvas дээр урьдчилан харах; жинхэнэ кодын сан дээрх даалгавруудыг OpenAI-ийн coding agent болох Codex-т өгөх; эсвэл AI app builder, жишээ нь Mythex холбож, ChatGPT мэдээллийн сантай бүрэн app бүтээж, hosting хийж, publish хийх. Эхнийх нь нэг хуудасны хэрэгсэлд хамгийн хурдан, хоёрдугаарх нь developer-т тохирох, гуравдахь нь ChatGPT-ээс гарахгүйгээр нэвтрэлт, өгөгдөлтэй бодит app өгнө.

Энд арга бүрийн хэрэглээ, prompt, хязгаарыг харуулсан. Нэр томъёоны ард байгаа санааг хүсвэл vibe coding гэж юу вэ гэдгийг уншаарай.

Сонголт 1: ChatGPT чат ба canvas

Жижиг хэрэгслийн хувьд зүгээр л асуу. ChatGPT кодыг бичнэ, canvas дээр энгийн HTML болон React хуудсуудыг харуулж, та дараад нь дарж үзээд өөрчлөлт хүсч болно.

Нэг хуудасны зөлөг тооцоолуур бич: төлбөрийн дүн, зөлгийн хувь (10, 15, 20 товчлуур болон өөрийн утга), хүний тоо оруулах талбартай. Бичих тусам зөлөг болон нэг хүнд ногдох дүнг шинэчлэн харуул. Утсан дээр сайхан харагдуул.

Тохирох зүйл: тооцоолуур, энгийн тоглоом, landing page-ийн драфт, сурах. "Энэ файлыг кодонд шинэ хүнд тайлбарла" гэж асуувал хурдан сурна.

Хаана зогсдог вэ: backend байхгүй. Таны оруулсан зүйл бусад хэрэглэгчдэд хадгалагдахгүй, нэвтрэлт байхгүй, хуваалцахын тулд кодыг өөр газар хуулж өөрөө хостлох хэрэгтэй. "Мөн багийнхан нь харахын тулд хадгал" гэсэн мөчид та чатаас илүү том зүйл хэрэгтэйг ойлгоно.

Хуулж наах vibe coding

Олон хүн ChatGPT-ээс код асууж, компьютер дээрх файлд эсвэл хостинг үйлчилгээнд хуулж наагаар эхэлдэг. Жижиг статик сайтад ажилладаг ч хурдан эвддэг. Өөрчлөлт бүр нь зөв файлыг олох, зөв хэсгийг наах, солисон зүйлд нь өөр юу ч хамаарч байгаагүй гэж найдахыг шаарддаг. Хэрэв та үүнийг хэдэн удаа хийснээ мэдэрвэл дараагийн хоёр сонголтын аль нэгд шилжих цаг болсон.

Сонголт 2: Бодит кодын сангийн Codex

Codex бол OpenAI-ийн програм хангамжийн ажилд зориулсан agent юм. Та түүнд энгийн хэлээр даалгавар өгнө, тэр repository дээр ажиллана: код уншина, файлуудаар өөрчлөлт хийнэ, команд болон тестүүдийг ажиллуулж, үр дүнг танд шалгахад өгнө. OpenAI-ийн ChatGPT, командын мөр болон editor-ийн өргөтгөлөөр санал болгодог; аль багцад орох болон одоогийн хязгаарыг OpenAI-ийн сайтаас шалгана уу.

Даалгаврын хэлбэрийн prompt хамгийн сайн тохирно:

Энэ repo-д Orders хуудсанд CSV экспортлох товч нэм. Одоогийн шүүлтүүрээр шүүсэн захиалгуудыг огноо, харилцагч, нийт дүн, төлөв баганатайгаар экспортол. Экспортын функцэд тест нэм, тестийн багцыг ажиллуул.

Тохирох зүйл: аль хэдийн төсөлтэй, agent-д бүхэл даалгаврыг авахыг хүсдэг developer болон техникийн үүсгэн байгуулагчид. Энэ нь таны stack болон дүрмүүдтэй ажиллана.

Таны хариуцах зүйл: app хаана ажиллах, мэдээллийн сан, нууц, deploy болон домэйн. Codex кодыг өөрчилдөг; энэ нь хостинг биш.

Codex ба Mythex хамтдаа

Codex нь MCP сервэрүүдэд, Mythex-ийнхийг оруулаад холбогдож чадна. Codex-д https://mcp.mythex.ai/mcp-ийг гадаад MCP сервэр болгон нэм, Mythex дээр хандалтыг зөвшөөр, тэгвэл Codex Mythex төслийг cloud sandbox дээр засах боломжтой; preview, мэдээллийн сан, publish-ийг Mythex хариуцна. Үүнийг Mythex app-ийг Claude, Cursor эсвэл Codex-ээс бүтээх нийтлэлд алхам алхмаар тайлбарласан.

Сонголт 3: ChatGPT-ээс Mythex-ээр бүрэн app бүтээх

Хэрэв та ChatGPT-ийн яриандаа байсаар жинхэнэ, hosting хийгдсэн app авахыг хүсвэл Mythex холбоорой. Mythex ChatGPT дотор app болж ажилладаг: ChatGPT нь MCP-ээр Mythex-ийн хэрэгслүүдтэй харилцдаг. MCP бол өөр газар hosting хийгдсэн хэрэгслүүдийг туслахад ашиглах нээлттэй протокол юм (MCP гэж юу вэ).

Холбогдсоны дараа ChatGPT Mythex төсөл үүсгэж, код бичихийг хувийн cloud sandbox-д хийж, live preview эхлүүлж, мэдээллийн сан болон файлын storage нэмж, app-ийг нийтийн URL дээр publish хийж чадна. Үр дүн нь төслийг Mythex дотор нээж, preview-г хянах линктэй ирнэ.

Яаж холбох вэ

1. Mythex дээр Account settings нээж, MCP хаягаа хуулна.
2. ChatGPT-д apps эсвэл connectors тохиргооноос энэ хаягаар Mythex-ийг нэмнэ. ChatGPT-ийн цэсүүд цаг хугацааны явцад өөрчлөгддөг тул нэр нь өөр байвал OpenAI-ийн app нэмэх тусламжийн хуудсыг дагаарай.
3. Mythex-ийн хуудас нээгдэнэ: нэвтэрч, Allow access гэж сонго. Ямар ч түлхүүр наах шаардлагагүй.
4. Яриа эхлүүлээд хүсэлтдээ Mythex гэж дурдана.

Холболт Mythex-ийн аль ч багцад ажиллана. Бүтээх, preview хийх, publish хийх sandbox хэрэгслүүд Mythex Pro ($25 сард) шаардана, мөн sandbox цаг болон hosting таны Mythex credit-аас гардаг. ChatGPT-ийн хэрэглээ таны OpenAI багцад үлдэнэ.

Туршиж үзэх эхний prompt

Mythex ашиглаад надад ажлын анкетын трекер бүтээ. Би компани, албан тушаал, холбоос, анкет өгсөн огноо, төлөв (өгсөн, ярилцлага, санал, татгалзсан), тэмдэглэл оруулна. Төлвөөр нь самбар харуулж карт чирж болдог байг, мөн долоо хоног бүрийн анкетийн тоог харуулсан энгийн диаграм. Бүгдийг мэдээллийн санд хадгалж, нэвтрэлтээр хамгаалаарай. Preview эхлүүлж линкээ өгөөрэй.

Дараа нь нэг өөрчлөлт нэг мессежид:

Mythex төсөлд анкет бүрт сануулгын огноо нэм, сануулга өнөөдөр эсвэл хугацаа хэтэрсэн картуудыг онцол.

Publish хийгээд надад амьд URL-ээ илгээ.

Тохирох зүйл: ChatGPT-д бодож, төлөвлөдөг, мөн үр дүнгээ мэдээллийн санд хадгалагдсаар амьд байлгахыг хүсдэг хүмүүс, hosting-ийн тохиргоо сурахгүйгээр. Энэ нь энгийн Mythex төсөл учраас Mythex-ийн чатад хүссэн үедээ үргэлжлүүлж болно.

Аль сонголт таны бүтээж буй зүйлд тохирох вэ

ChatGPT-д ажилладаг prompt-ийн зуршлууд

• Хэрэгслийг ашиглуулахыг хүсвэл нэрлээрэй. "Mythex ашиглаад…" гэвэл хүсэлт нь ерөнхий хариулт биш, таны төсөлд зориулагдсаныг тодорхой болгоно.
• Нэг мессежид нэг өөрчлөлт. Олон засварын жагсаалт нь олон нөлөөг дагуулна.
• Том алхамын өмнө төлөвлөгөө гуй. "Юу ч өөрчлөхөөсөө өмнө юуг өөрчлөхөө жагсаагаад миний зөвшөөрлийг хүл."
• Алдааны текстийг яг хуулаарай. Бүрэн алдааны текст аливаа тайлбараас илүү үнэтэй.
• Юу өөрчлөгдсөнийг асуу. "Сүүлийн гурван өөрчлөлтөө энгийн үгээр нэгтгэ" гэвэл кодыг уншаагүй ч чиглэлээ алдахгүй.

Илүү prompt-уудыг vibe coding prompt-ийн товч лавлах дээрээс харна уу.

Аюулгүй байлга

• ChatGPT яриандаа жинхэнэ нууц үг эсвэл API түлхүүр бүү наа. Хэрэв app-д түлхүүр хэрэгтэй бол төслийн нууцад хадгал. Mythex-ийн хэрэгслүүд зөвхөн нууцын нэрийг харуулдаг, утгыг нь хэзээ ч харуулдаггүй.
• Publish хийхээсээ өмнө хэрэглэгчид бие биенийх нь өгөгдлийг харж чадахгүй эсэх, ямар нэг түлхүүр браузерт ажилладаг кодонд орсон эсэхийг шалга. Шалгах жагсаалтыг vibe coding аюулгүй юу хуудаснаас наагаар хуулж болох prompt-уудтай хамт олно.

Claude-г мөн ашигладаг бол хамтрагч гарын авлага Claude ба Claude Code-оор vibe coding-ийг үзнэ үү. Загвар бүрийн харьцуулалтыг ChatGPT vs Claude vs Gemini app бүтээхэд хуудаснаас харна уу.

Асуултууд