Bagaimana menjadi Vibe Coding dalam enam bulan
Panduan dengan kurikulum dan sumber daya lengkap

Judul asli: Bagaimana Menjadi Ahli Vibe Coder dalam 6 bulan
Original by: Avid
Foto oleh Peggy Block Beats
Editor menekan: Coding Vibe bukan sekedar "biarkan AI menulis kode Anda" tapi konstruksi lengkap dari ide-ide ke produk online. Cara untuk menjadi benar-benar efektif adalah untuk tidak mengulangi tuntutan samar-samar dan menunggu model untuk menjadi sihir, tapi lebih belajar untuk merencanakan, cepat, meninjau dan menyebar。
Peta jalan memecahkan kode Vibe menjadi enam bulan: pertama untuk menyelesaikan Web, Git dan gudang teknologi dasar, kemudian untuk memperoleh alat-alat seperti Cursor, Claude Code, kemudian untuk belajar tips, teknik konteks, MCP, RAG, pengujian, keselamatan dan penyebaran produksi. Intinya bukan untuk membuat programmer tradisional pemula, tetapi untuk membantu siapa saja yang memiliki ide produk untuk menggunakan AI lebih sistematis untuk membuatnya menjadi aplikasi nyata。
Salah satu rekomendasi yang paling penting untuk pemula bukan hanya untuk melihat kurikulum, tetapi untuk terus melakukannya. Proyek kecil, operasional, diakses dan iteratif harus diselesaikan setiap bulan. Kemajuan nyata datang bukan dari berapa banyak kursus Anda pelajari, tetapi dari apakah Anda benar-benar menerbitkan produk。
Berikut adalah teks asli:
Coding Vibe telah menjadi salah satu keterampilan pembangun paling dikagumi dari percobaan Twitter kecil。
Aku baru saja putus bagaimana untuk menjadi 1% pertama Agenic Coder。
Jendela masuk lebih awal masih terbuka, tapi hanya milik mereka yang benar-benar melakukan sesuatu。
Masalahnya adalah kebanyakan pemula tidak tahu harus mulai dari mana. Mereka biasanya: download Cursor, masukkan ide yang tidak jelas, dan kemudian bertanya-tanya mengapa berantakan; membaca tutorial YouTube yang tak terhitung jumlahnya, tetapi tidak pernah benar-benar membuat sesuatu; melompat ke dalam alat yang kompleks tanpa pemahaman bagaimana mengatur petunjuk, mengelola konteks, atau menyebarkan。
Hasilnya biasanya sama: Demo setengah-selesai, siklus kematian "memperbaiki Bugs dan menciptakan Bugs baru" dan tidak adanya produk online yang nyata。
Pemandu dimaksudkan untuk mengatasi masalah ini. Ini adalah peta jalan bulan demi bulan, dengan sumber daya yang terbukti untuk 2025- 2026, mencakup setiap keterampilan yang Anda butuhkan untuk tumbuh dari basis nol sepenuhnya untuk memberikan produk yang nyata, Vibe Coder. Setiap bulan ada tonggak dan setiap keterampilan memiliki link sumber daya。
Hanya ada satu aturan sebelum kita mulai: semuanya dilakukan dengan tangan。
Ini bukan tentang membaca, ini tentang melihat orang melakukannya, ini tentang membuka alat, mengikuti langkah, melanggar, memperbaiki, dan akhirnya menerbitkannya。
Coding Vibe, apa itu
Kata "Vibe Coding" diusulkan oleh peneliti AI Andrej Karpathy. Dia menggunakannya untuk menggambarkan pendekatan pemrograman yang sepenuhnya dipercayakan kepada AI: menerima setiap saran dari AI, tidak meninjau kode secara manual, fokus semua perhatian pada menggambarkan hasil akhir, daripada menulis logika secara pribadi。
DALAM PRAKTEK, ITU BERARTI BAHWA ANDA MENJELASKAN PERANGKAT LUNAK APA YANG ANDA INGINKAN DALAM BAHASA ALAM, DAN KEMUDIAN MEMBIARKAN AL MENGHASILKAN, TERBALIK, MENGUJI DAN MEMPERBAIKI KODE UNTUK ANDA。
Tapi kebanyakan pemula cenderung mengabaikan satu hal: Coding Vibe bukan menunggu pasif, bukan sihir. Ini adalah proses terstruktur yang pada dasarnya mengubah niat manusia menjadi perangkat lunak operasional。
KUALITAS KELUARAN HAMPIR SEPENUHNYA BERGANTUNG PADA KUALITAS MASUKAN: PETUNJUK ANDA, DOKUMEN KONTEKS, KEMAMPUAN PERENCANAAN, DAN KEMAMPUAN ANDA UNTUK MENINJAU KONTEN KELUARAN AI. DAN MENGUASAI MASUKAN INI ADALAH INTI DARI SELURUH PERMAINAN。
Pada tahun 2026, alat Coding Vibe dibagi menjadi dua kategori luas:
AI aplikasi pembangun: misalnya, Loveable, Bolt dan Reprit. Alat tersebut dapat menghasilkan aplikasi skala penuh berdasarkan deskripsi, termasuk hosting dan penyebaran. Mereka berorientasi terhadap pengguna non-teknis dan pengembang prototipe jalur cepat dan tidak memerlukan lingkungan konfigurasi lokal。
AI programming IDE: misal Cursor 3.0, Claude Code and Windsurf. Alat tersebut tertanam di dalam lingkungan pembangunan dan membantu pengembang untuk mempersiapkan, debug, dan kode iteratif. Mereka membutuhkan basis teknis, tetapi menyediakan kontrol yang lebih tinggi dan kapasitas tutup dalam produksi serius tingkat pengembangan。
Peta jalan ini akan membawa Anda ke kedua dunia: dimulai dengan keterampilan dasar yang membuat semua alat bekerja lebih baik, sebelum bergerak menuju spesialisasi。
Bulan 1: Kapasitas dasar, semuanya setiap Coder Vibe harus memiliki
TUJUAN BULAN INI ADALAH UNTUK MEMAHAMI BAGAIMANA PERANGKAT LUNAK BEKERJA DI TINGKAT KONSEPTUAL, SEHINGGA KODE YANG AL MENGHASILKAN TIDAK LAGI TERLIHAT SEPERTI KOTAK HITAM, DAN BAHWA ITU LEBIH CERDAS UNTUK MENGARAHKAN ITU。
Kesalahan Vibe Coder yang paling umum adalah melewatkan bulan ini sepenuhnya. Mereka membuka sebuah alat, menulis petunjuk samar-samar berikut, melihat hasil dan bingung, dan kemudian jatuh ke apa yang masyarakat sering sebut "lingkaran kematian": untuk memungkinkan AI untuk memperbaiki Bug, dan AI untuk membuat Bugs baru, dan untuk mendaur ulang。
MEREKA YANG MAMPU MELARIKAN DIRI SIKLUS BIASANYA MEMILIKI PENGETAHUAN DASAR YANG CUKUP. MEREKA TIDAK HANYA MENANGGAPI OUTPUT AI, TETAPI MEREKA DAPAT MEMBACANYA DAN MEMBIMBINGNYA。
Kau tak perlu jadi programmer. Anda hanya perlu memiliki cukup dasar konseptual untuk dapat mengajukan pertanyaan cerdas dan menemukan kesalahan yang jelas。
Bagaimana kita bekerja
Sebelum Anda membuat produk Web, Anda perlu memahami infrastruktur apa yang sedang Anda kembangkan. Kebanyakan produk Coding Vibe adalah aplikasi Web. Ini berarti Anda perlu tahu apa yang klien dasar -- model server, bagaimana peramban berkomunikasi dengan ujung belakang, apa yang URL lakukan, dan apa itu API。
Sumber daya:
Dokumen Web MDN: Bagaimana Kerja Web
Taut:https: / / developer.mozilla.org / en-US / docs / Learn / Getting Start dengan web / How the Web works
Ini adalah salah satu interpretasi paling jelas dan otoritatif dari browser, server, dan HTTP yang dijaga oleh Mozilla。
MDN: Overview HTTP (bebas dari muatan)
Taut:https: / / developer.mozilla.org / en-US / docs / Web / HTTP / Overview
Jelaskan perbedaan antara GET dan POST, kode status (200 OK, 400 Permintaan Buruk, 401 Tidak sah, 404 Tidak Ditemukan, 500 Server Error) dan mengapa tips ini muncul di aplikasi Anda。
Tutorial API RET (bebas dari muatan)
Taut:https: / / restriapi.net /
Hal ini pendek, praktis dan langsung berlaku. Setelah belajar, Anda akan mengerti apa yang terjadi pada setiap backend ditulis melalui Coding Vibe ketika memanggil API。
Apa yang perlu kau pahami:
DARI ANDA MASUKKAN URL KE HALAMAN SELESAI MERENDER, APA YANG TERJADI DI TENGAH
Distinksi antara halaman depan dan belakang: ujung depan adalah antarmuka yang dilihat pengguna dan belakang adalah logika server dan basis data
API ADALAH APA, PERMINTAAN ADALAH APA, RESPON ADALAH APA
APA ARTI KODE NEGARA HTTP DAN APA YANG MEREKA WAKILI KETIKA APLIKASI DEBUG
Apa itu "variabel lingkungan" dan mengapa kunci tidak dapat ditulis secara langsung dalam kode。
Git dan GitHub: Mesin waktu Anda
Ini adalah salah satu yang paling penting keterampilan praktis dari seluruh panduan. Setiap serius Vibe Coder akan menggunakan Git。
Tanpa Git, petunjuk AI yang buruk bisa merusak jam kerjamu dan tidak ada jalan kembali. Dengan Git, setiap keadaan normal akan menjadi titik pemeriksaan Anda dapat kembali ke setiap saat。
Git bukan opsional. Ini menentukan apakah Anda membangun produk secara efisien atau apakah Anda akan memulai ulang setiap kali AI mengacau。
Cara untuk belajar adalah tidak mencoba untuk menulis perintah, tetapi untuk memahami model mereka terlebih dahulu. Git akan melacak perubahan berkas dari waktu ke waktu dan memungkinkan Anda untuk bergerak maju atau mundur dalam sejarah ini. Setelah Anda memahami bahwa, perintah menjadi alami。
Sumber daya:
Git bagi Coders Vibe: Apa Sebenarnya Materi
Taut:https: / / www.youtube.com / watch? v = ADEFvP5Gw5c
Untuk Vibe Coder. Through a real Next.js project, talk about guit add, Git part, git push, git pull, branch and roll back。
Git dan GitHub for Vibe Coders (pemandu bebas, DeepakNes.com)
Taut:https: / / deepakness.com / blog / git-for-vibe- coders /
Panduan ini ditujukan untuk pengembang tambahan AI pada akhir tahun 2025, meliputi alur kerja harian Git dari Vibe Coder, termasuk penyerahan setiap 15-20 menit, dan memeriksa perubahan dengan git diff sebelum menerima perubahan generasi AI。
Pelajari Blanching Git (bebas, interaktif)
Taut:https: / / learkitbranching.js.org /
Salah satu alat visual terbaik untuk memahami percabangan dan penggabungan dapat dijalankan langsung di browser tanpa perlu untuk mengatur lingkungan。
Skills GitHub (bebas, interaktif)
Taut:https: / / skils.github.com /
Kursus interaktif resmi GitHub, yang dilakukan langsung di dalam GitHub。
Fokus pada:
ini bukan ide yang baik, itu ide yang baik, itu ide yang baik
Buat suatu branch baru sebelum memulai fungsionalitas baru
lihat sejarah menggunakan log guit dan tidak diubah dengan guit return
membuat berkas .gitignore dan menambahkan berkas .env sebelum push pertama
Gunakan percabangan fungsional ketika bereksperimen dengan AI: buat cabang pertama, kemudian gabungkan mereka dalam percabangan。
Aturannya adalah, mulai sekarang, setiap proyek yang Anda lakukan harus berada di gudang GitHub tanpa pengecualian。
Fonta HTML, CSS dan JavaScript
Anda tidak perlu menjadi pengembang terdepan. Anda hanya perlu dapat memahami komponen yang dihasilkan oleh AI dan memahami secara umum apa yang div, tombol, sekali klik dan usestate。
INI AKAN MEMAKAN WAKTU SEKITAR SEMINGGU, TETAPI ANDA AKAN MENGHEMAT BANYAK WAKTU KETIKA ANDA PERLU MENGARAHKAN MODIFIKASI AI DARI BAGIAN TERTENTU DARI ANTARMUKA。
Sumber daya:
The Odin Project: yayasan (gratis, belajar sendiri)
Taut:https: / / www.theodinproject.com / paths / founds
Salah satu kursus gratis terbaik di Internet. Yang harus Anda lakukan adalah mempelajari yayasan HTML, yayasan CSS dan JavaScript Basics. Kecepatan medium sekitar 1-2 minggu。
freeCodecamp: Desain Web Bebas
Taut:https: / / www.freecodecamp.org / learn / 2022 / responsive- web- design /
Tidak ada lingkungan yang perlu dikonfigurasi berdasarkan praktek peramban. Bisa melengkapi proyek Odin。
JavaScript t.info (referensi gratis)
Taut:https: / / javasliter.info /
Saat ini salah satu dokumen JavaScript paling jelas. Ketika AI menghasilkan kode Anda tidak mengerti, Anda dapat menggunakannya sebagai referensi. Ini sama dengan MDN interpretasi JavaScript。
Fokus pada:
HTML: ELEMEN, ATRIBUT, HUBUNGAN TERTANAM, DAN STRUKTUR HALAMAN
CSS: Pemilih, Flexbox, dan mengapa antarmuka menampilkan gaya
JavaScript: arti dari variabel, fungsi, array, objek dan async / tunggu
Foundation Reasi: Apa itu komponen, apa itu props dan state。
Pilih teknologimu dan lakukan
Salah satu kesalahan yang paling umum dari pemula adalah perubahan konstan dari frameworks。
MODEL AI DILATIH PADA KODE TERBUKA. MEREKA MELAKUKAN JAUH LEBIH BAIK PADA BAR TEKNOLOGI POPULER DAN TERDOKUMENTASI DENGAN BAIK DARIPADA TEKNOLOGI COLD-DOOR. SEMAKIN POPULER SEBUAH GUDANG TEKNOLOGI, KURIKULUM YANG LEBIH RELEVAN, KASUS DAN DATA PELATIHAN, SEMAKIN TINGGI KUALITAS KELUARAN AI。
Pada tahun 2026, gudang teknologi direkomendasikan untuk pemula Vibe Coder:
Frontend: React, used through Next.js (App Router)
Gaya: Tailwind CSS
Basis Data + Otentikasi: Supbase (Basis Data Postgres, otentikasi, penyimpanan, semua digunakan melalui API)
Penyebaran: Vercel
Bahasa: Lebih suka ke TypeScript atau JavaScript。
GUDANG TEKNOLOGI INI RAMAH UNTUK MEMULAI, SEPENUHNYA DISELENGGARAKAN, COCOK UNTUK PENGEMBANGAN DUKUNGAN AI, DAN MEMUNGKINKAN ANDA UNTUK ONLINE DARI BASIS DATA TANPA MENGELOLA INFRASTRUKTUR SERVER DAN MERILIS SELURUH PRODUK STACK LENGKAP。
Ini juga merupakan salah satu rumah teknologi paling umum di dunia, jadi alat AI sangat akrab dengannya。
Sumber daya:
Next.js Resmi course: Learn Next.js (bebas, interaktif)
Taut:https: / / nextjs.org / learn
Kursus interaktif resmi akan membangun aplikasi dashboard lengkap langkah demi langkah. Versi App Router diperbarui pada tahun 2024 dan masih bisa diterapkan。
Taylor CSS Docs (bebas biaya)
Taut:https: / / tailwindcs.com / docs
Tailwind adalah kerangka CSS untuk independen-pertama. Ini kualitas tinggi. Karena kepadatan tinggi data pelatihan, Al generasi kode tailwind biasanya bekerja lebih baik daripada kebanyakan sistem gaya lain。
Dokumen Supabese: Memulai
Taut:https: / / subbase.com / docs / guide / getting-stard
Supabese menyediakan basis data Postgres, kebijakan keamanan baris, identifikasi (kotak surat, log masuk sosial, sandi satu kali) dan penyimpanan berkas, semua yang dapat diakses melalui JavaScript SDK sederhana。
Vercel: Mendapatkan Dimulai
Taut:https: / / vercel.com / docs / getting -stard -with -vercel
Hubungkan gudang GitHub Anda ke Vercel, dan setiap kali Anda mendorong menyebarkan. Seluruh konfigurasi akan mengambil sekitar lima menit。
Bulan 1 tonggak
Pada akhir bulan, Anda harus mampu:
JELASKAN APA ITU API DAN APA YANG TERJADI KETIKA PERAMBAN MEMULAI PERMINTAAN
Buat repositori git, kirim kode, buat branch dan paksa ke GitHub
Baca komponen React yang dihasilkan oleh AI dan memahami struktur perkiraan
Buat sebuah projek dasar Next.js dan jalankan lokal dengan npm run dev
Sebuah halaman statis dikerahkan ke Vercel dengan menghubungkan repositori GitHub。
Bulan 2: penguasaan alat, Cursor 3.0, Claude Code and building ecology
Tujuan bulan ini adalah untuk benar-benar menguasai inti, memahami apa yang berbeda alat yang cocok dan menyelesaikan proyek lengkap pertama Anda。
Sejak bulan ini, Vibe Coding sebenarnya pada tahap operasional. Alat yang tersedia pada tahun 2026 sudah sangat kuat, tetapi mereka menghargai mereka yang tahu bagaimana menggunakannya, dan mereka menghukum mereka yang memperlakukan mereka sebagai "sihir"。
Tabel alat lengkap untuk dimengerti (2026)
Pada tahun 2026, Vibe Coding jelas dewasa. Berikut ini adalah status dari semua alat arus utama yang layak dipahami sebagai Mei 2026。
IDE PEMROGRAMAN AI
Cocok semi- teknologi untuk pembangun teknis。
Kursor 3.0
Tenaga penuh, editor pertama. Free / Pro versi $20 per bulan. Mendukung Agen Windows, Parallel Clouds Agen, Komposer 2, Marketplace, Peramban Internal。
Claude Code
Aku pandai dalam pemrograman Agenic dan penjelasan perpustakaan kode penuh. Berdasarkan penggunaan, juga dapat digunakan melalui Claude Pro pada $20 per bulan. Saat ini mendukung CLI, Plugin VS Code, aplikasi desktop dan Webend。
Windsurfing
Lebih cocok untuk pengguna bisnis dan pengembang dengan anggaran terbatas. Free / Pro versi $15 per bulan. Cascade Agen diperoleh oleh Google pada tahun 2025 sebesar $2,4 miliar。
Kopilot GitHub
Suits untuk memberikan dukungan harian dalam IDE apapun. Free / Pro versi $10 per bulan. Mendukung pengembangan lingkungan dengan VS Code, Jetbrains, Neovim, Xcode, dll。
Cline
Untuk pengguna open-source lanjutan. Alat itu sendiri gratis, dibayar oleh API Token. Ini adalah VS Code plugin yang menghubungkan Claude, GPT-5.5, Gemini atau model lokal。
Google Antigravity
Cocok untuk konstruksi paralel Agen lebih. Harga harus ditentukan. Pada bulan November 2025, berikut Gemini 3, "Manager View" diluncurkan untuk mengelola Agen paralel。
Tidak ada pembuat aplikasi kode / penuh
Cocok untuk melengkapi pengguna basis nol dan pengembangan prototipe cepat。
Loveable
Cocok untuk non-teknis pendiri latar belakang dan React UI membangun. Free / Pro versi $25 per bulan. Anda dapat membuat aplikasi React + Supbage secara lengkap seluruh rumah yang paling ramah bagi pemrogram yang tidak bersahabat。
Bolt.new
Cocok dengan cepat menghasilkan aplikasi Web tanpa konfigurasi lokal. Free / Pro versi $29 per bulan. Ini sepenuhnya dijalankan dalam browser, dan bagus untuk memulai dengan cepat。
Vercel v0
Cocok untuk menghasilkan komponen UI. Versi gratis / $20 per bulan. Lebih cocok untuk digunakan oleh pengembang, mendukung sinkronisasi GitHub dan penyebaran langsung ke Vercel。
Reflit
Set konstruksi dan hosting terpadu. Versi gratis / $20 per bulan. Fitur yang paling lengkap, Agen 3 dapat membangun, menjalankan dan menyebarkan aplikasi langsung di browser。
Dasar 44
COCOK UNTUK CODELESS PENGEMBANGAN ALAT INTERNAL. VERSI GRATIS / $20 PER BULAN. UNTUK PEMBANGUN NON-TEKNIS, MENYEDIAKAN APLIKASI BANTU AI DAN KEMAMPUAN BACK- END。
Pilih Rekomendasi
Jika Anda seorang pemula tanpa latar belakang teknis, Anda dapat mulai dengan Loveable atau Bolt.news。
Bila Anda pengembang, Anda dapat memilih cursor 3.0 atau GitHub Copilot bila Anda ingin mengintegrasikan AI ke dalam aliran kerja saat ini。
Jika Anda terbiasa dengan terminal, dan Anda ingin lengkap kode kontrol perpustakaan, Anda dapat memilih Claude Code。
Jika Anda pengembang yang sensitif anggaran, Anda dapat memilih $15 per bulan untuk Windsurf。
Jika Anda akan membuat aplikasi tingkat-kinerja dengan tim, Anda dapat mempertimbangkan untuk diperoleh oleh Google dan kemudian oleh Windsurf。
Sumber Daya
readmap.sh: 10 Strategi Video Terbaik pada tahun 2026
Taut:https: / / roadmap.sh / vibe-coding / best- tools
Ini adalah daftar alat-alat terbaik yang dijaga komuniti untuk 2026。
BuildMVPFast: 10 Best
Taut:https: / / www.biddmvpfast.com / blog / best-vibe-coding-tools- 2026
Provisi pohon keputusan lengkap dan pembongkaran alat, informasi harga diverifikasi pada tahun 2026。
2026 Vibe Working Tool Comparison (free, Technicle.dev)
Taut:https: / / teknical.dev / post / vibe-coding- tool- perbandingan
Reflit, V0, Loveable dan Bolt dibandingkan dengan proyek。
Coding Vibe:
Taut:https: / / www.koncile.ai / en / ressources / best- vibe- coding-tools- windsurf -vs- locable
Berdasarkan proyek nyata Web, penilaian tim dari empat alat dilakukan dan diterbitkan pada bulan April 2026。
Kursor 3.0: Sebuah remodel lengkap
Kursor 3.0 dirilis pada 2 April 2026, update yang paling penting sejak Anyshe didasarkan pada VS Code pada 2023。
Hal ini tidak lagi hanya sebagai alat "Fungsi AI yang dikenakan pada penyunting berkas", tetapi telah menjadi ruang kerja terpadu untuk membangun perangkat lunak dengan Agen。
Kursor 3.0.00 fungsi baru
Jendela Agendas
Antarmuka hanya dapat dibuka melalui Cmd / Ctrl + Shift + P. AgentsWindow untuk menjalankan beberapa AIAgents dalam paralel. Agen dapat berjalan di mesin-mesin lokal, lingkungan awan, SSH atau Git workstream pada saat yang sama。
Komposer 2
Kursor mempelajari sendiri model pemrograman depan, didedikasikan untuk pengeditan kode multi- dokumen dan pelatihan iteratif。
Ages Awan
Menjalankan Agen di sebuah kotak pasir awan terpencil. Kau bisa memulai misi dan kembali lagi nanti dan memeriksa hasilnya. Perusahaan memiliki awan dan Agen datang online pada 25 Maret 2026。
Peramban Internal
Peramban terpadu memungkinkan Agen untuk melihat render sebenarnya secara langsung dan untuk menguji perbaikan sendiri tanpa harus menggunakan cuplikan layar manual。
Kursor Marketplace
Siapkan plugin satu klik untuk membungkus Skills, Subabents, MCP Server, Hooks dan Rules bersamaan. Plugin tersedia termasuk AWS, Figma, Linear, Stripe, Vercel, Datadog, Snowflake, dll。
Mode Desain
ANDA DAPAT MENGKLIK DAN MENYERET LANGSUNG PADA ELEMEN UI YANG DIBERIKAN OLEH PERAMBAN SEHINGGA AI MENGEDIT BAGIAN YANG SESUAI DENGAN PRESISI. HAL INI TIDAK LAGI DIPERLUKAN UNTUK MENGGAMBARKAN LOKASI KOMPONEN DALAM KATA-KATA。
Organisasi
Fungsi ini diterbitkan pada 5 Maret 2026. Ini adalah Agen permanen yang dapat dipicu oleh peristiwa eksternal seperti misi waktu, pesan Slack, masalah Linear, insiden GitHub dan PagerDuty peringatan. Agen akan memulai kotak pasir awan dan menggunakan MCP Anda telah dikonfigurasi untuk melaksanakan misi Anda。
Tampilan Diffs Baru
Mendukung ulasan perubahan tingkat kata-kata, tabungan sementara dan pembuatan Permintaan Tarik, dan seluruh proses dapat dilakukan dalam Jendela Agenda。
perintah pohon kerja
Biarkan tugas dijalankan dalam stand- alone Git worktree untuk menghindari Agen bekerja untuk mencemari cabang utama。
/ perintah terbaik-of-n
Mari kita jalankan tugas yang sama dalam beberapa model dan mengembalikan hasil terbaik。
Sumber Daya
Kursor Changelog: 3.0 (resmi, bebas)
Taut:https: / / cursor.com / changelog / 3-0
Kursor 3.0。
Apa itu Cursor 3
Taut:https: / / www.datacamp.com / blog / cursor-3
Untuk Cursor 3.0. Salah satu teks yang paling lengkap dari setiap fungsi baru, diterbitkan pada 7 April 2026。
Kursor 3 Perubahan Semuanya untuk Coding Ekonomi
Taut:https: / / www.youtube.com / watch? v = HTKGyLar8AU
Sebuah demonstrasi lengkap dari Windows Argentina, Komposer 2, built-in browser, paralel Agen dan Marketplace oleh projek nyata。
Kursor Tutorial 2026: Pelajari Kode AI dalam 15 Menit
Taut:https: / / www.nxcode.io / resources / news / cursor- tutorial -start-2026
Panduan langkah-langkah untuk pemula meliputi Komposer, Agen Mode dan Abad Awan。
Build Fast with AI: Cursor 3 vs Google Antigravity
Taut:https: / / www.buildfastwithnai.com / blogs / cursor- 3-vs-antigravitasi -i- i- 2026
Membandingkan Cursor 3.0 dengan anti gravitasi AI baru Google。
Claude Code: Sebuah alat pengkodean aktik yang memahami seluruh repositori
Claude Code adalah alat pemrograman Agenic yang diluncurkan oleh Anthropic。
Tidak seperti perangkat IDE yang bekerja terutama di sekitar berkas terbuka, Claude Code dapat membaca seluruh perpustakaan kode, menyimpulkan melalui beberapa berkas, menjalankan perintah, menangani operasi Git, dan melakukan tugas multistep secara otomatis, meminta persetujuan Anda di setiap langkah。
Sekarang tersedia dalam empat lingkungan: terminal CLI, VS Code plugin, Jetbrains IDE dan aplikasi desktop。
Bagaimana memulai
Anda memerlukan langganan Claude Pro, $20 atau lebih per bulan, dan Anda perlu menggunakan terminal di MacOS, Linux atau Windows 11。
pasang melalui npm:
@ antropic-ai / claude-code
Organiser lainnya
cd ~ / projects / my- app & claude
Mulai dengan tip eksplorasi:
Apa pekerjaan proyek ini?
Ini akan memungkinkan Claude untuk menganalisis kode perpustakaan Anda sebelum ia mengubah apa pun。
Core Workstream: Excelre Plan Code
Excellore: Exploration
Tekan Shift + Tab dua kali untuk memasukkan Mode Rencana. Claude akan membaca dokumen dan menjawab pertanyaan, tetapi tidak akan mengubah apa pun. Model ini memungkinkan Anda untuk memahami struktur proyek, data trek mengalir, sisir struktur perpustakaan kode。
Rencana:
Dalam Mode Rencana, biarkan Claude membuat rencana realisasi. Anda perlu untuk meninjau itu, fine-tune itu dan counter bagian-bagian yang tidak setuju. "go ahead" hanya setelah konfirmasi。
Kode: Kode
Potong kembali ke Mode Normal. Claude akan berfungsi seperti yang direncanakan, menampilkan diff dan meminta persetujuan Anda di setiap langkah。
Kirim
ulasan diff, jalankan tes, kemudian menyelesaikannya dengan penyerahan yang jelas。
Apa itu CLUDEMD
CLUDEMD adalah berkas Markdown dalam direktori root projek untuk memberitahu Claude Kode:
Bagaimana proyek Anda bekerja
(Dan kelak Dia akan memenuhi ancaman-Nya) sesuai dengan kehendak-Nya
Perintah mana yang harus dijalankan
Tidak ada yang bisa diubah。
Anda dapat menjalankan:
@ claude / init
untuk menghasilkan versi awal dan kemudian menyesuaikannya sesuai dengan konteks projek。
Sumber Daya
bilder.io: Bagaimana Menggunakan Claude Code
Taut:https: / / www.bilder.io / blog / how -to -use -claude -code
Saat ini salah satu program yang paling lengkap Claude Code Presbyterians meliputi instalasi, Sistem Mode alur kerja, pengaturan CLADEMD dan praktek terbaik, diterbitkan pada April 2026。
Tutorial Kode Claude penuh untuk pemula Non-Teknis (YouTube, gratis)
Taut:https: / / www.youtube.com / watch? v = bqJziWAEn40
Tutorial video langkah untuk membangun aplikasi dari Claude Code, tanpa pengalaman pemrograman, diterbitkan pada April 2026。
Claude Kode Tujuan Penuh; 4 Jam
Taut:https: / / www.youtube.com / watch? v = QoQBzR1NIqi
Saat ini salah satu program video Claude Code yang paling lengkap, mencakup proses penuh dari konfigurasi ke rilis produk dan penjualan。
Claude Kode Tutoran untuk pemula 2026 (pemandu bebas, Dev.to)
Taut:https: / / dev.to / ayyazzfar / claude- code- tutoran -for -for -start -2026-from -restashment -to -to-building-your-first-projects -1ma
Sesi teks, meliputi instalasi, konfigurasi akhir, dan pembangunan proyek pertama。
Dimulai dengan Claude Code: Panduan Pengadaan Peneliti
Taut:https: / / paulgp.substack.com / p / getting -stard-with-claude
Hal ini sangat tepat untuk memahami prinsip menjadi cukup spesifik, manajemen jendela konteks, dan pengingat iteratif。
Cara terbaik Vibe Code a Saas di 2026
Taut:https: / / docs.opensaas.sh / blog / 2026-03-16-best-to-vibe- code- saas- 2026 /
Introduction of Saas Vibe Coding: Claude Code + Structured SaaS Template + LLM friendly dokumen (llms.txt). Juga termasuk bagaimana menjalankan server pengembangan di belakang panggung sehingga Claude dapat melihat log real-time dan bagaimana melakukan autoate browser melalui Chrome DevTools MCP。
Bulan 2 tonggak
Pada akhir bulan, Anda harus mampu:
Pilihan perangkat yang sesuai untuk tipe projek yang berbeda
Gunakan cursor 3.0., Jendela Genents untuk melaksanakan tugas melalui agen cloud
Sebelum menulis kode apapun, rencana dengan Mode Rencana Claude Code
Tata berkas CLAUDEMD untuk semua item
Membangun dan menyebarkan setidaknya satu proyek lengkap, aplikasi Web yang dapat berjalan dengan benar dan memiliki URL nyata di telepon。
Bulan 3: Seni petunjuk, konteks, struktur dan keluaran stabil
Tujuan bulan ini adalah untuk memiliki keterampilan inti Vibe Coding, yaitu untuk menulis petunjuk, mengelola konteks, dan memungkinkan AI untuk melakukan apa yang Anda inginkan dalam upaya pertama yang mantap。
Dalam seluruh teknologi Coding Vibe, petunjuk adalah keterampilan yang paling bermanfaat. Jika petunjuk Anda tidak jelas, alat itu sendiri hampir tidak relevan. Alat biasa dengan petunjuk yang baik selalu lebih baik daripada alat atas dengan petunjuk samar。
Oke, Vibe Coding, bagaimana petunjuk bekerja
Perbedaan antara petunjuk baru dan baik hampir seluruhnya dalam struktur。
Para pendatang baru akan berkata:
Tambahkan halaman log masuk。
Master akan berkata:
Membuat halaman login dalam aplikasi / login / halaman. tsx, menggunakan Supbabase saluran selatan dalam lib / subababase.ts. Gaya formulir mengikuti aplikasi / mendaftar / page.tsx. aplikasi Termasuk kotak surat dan kotak masukan sandi, tombol kirim, dan penanganan kesalahan tip untuk voucher log masuk tidak valid. Jangan ubah dokumen lain。
Mantan dapat menghasilkan komponen yang dapat digunakan, dapat menghancurkan dokumen lain, atau memperkenalkan model yang tidak konsisten dengan perpustakaan kode saat ini. Yang terakhir lebih mungkin untuk menghasilkan komponen yang benar-benar operasional yang konsisten dengan struktur proyek。
Petunjuk baik biasanya terdiri dari empat bagian:
Target: Apa fungsi ini
Konteks: Dokumen mana yang relevan? Apa yang ada di proyek ini
Konstrain: Dimana tidak bisa diubah? Model apa yang harus diikuti
Format keluaran: Apa yang mesti berupa hasil akhir
Sumber Daya
Anthropic: Interactive Prompt Engineering Tutoric (bebas biaya, GitHub)
Taut:https: / / github.com / antropics / prompt-eng- interactive- tutoran
Ini kursus interaktif pasal 90 yang termasuk latihan yang dirancang untuk menjalankan Claude API dalam buku catatan Juckyter. Ini adalah salah satu yang terbaik hands- pada kursus teknik petunjuk tersedia。
ProptingGuide.ai (bebas biaya)
Taut:https: / / www.promottingguide / ai
Menutupi isi penuh teknologi dari tip dasar, rantai pemikiran, contoh gambar-palsu, ke peringatan Agenik, dan mengupdatenya secara berkelanjutan。
r / PromptEngineering: The Ultimate Vibing Coding Guide (free of charge, Reddit)
Taut:https: / / www.reddit.com / r / Prompt Engineering / comments / 1kyboo0 / the multimate vibe coding guide /
Delapan belas pengalaman operasional dari Vibe Code, termasuk bagaimana menangani penyimpangan AI, bagaimana mempertahankan konsistensi antara beberapa fungsi, dan bagaimana membuat dokumen "Common AI Kesalahan"。
Roadmap.sh: Vibe Coding Best Practices
Taut:https: / / roadmap.sh / vibe-coding / best-praktek
Menyediakan 10 aturan praktek untuk membantu Anda mendapatkan hasil stabil dari alat Coding Vibe, yang telah diperbarui sampai 2026。
Appite: Panduan Kerja Vibe Lengkap 2026 (pemandu gratis)
Taut:https: / / appwrite.io / blog / post / the-complete -vibe-coding- guide -2025
Sebuah deskripsi lengkap dari penumpang-penumpang Vibe Coding, bagaimana menulis pesan yang jelas dan bagaimana untuk mempertahankan kontrol sebagai pembangun daripada sebagai alat。
FRAMEWORK PRP: PLANNING, THEN TIP
Penyebab paling umum dari "siklus kematian" adalah awal langsung dari pengembangan fungsi tanpa perencanaan apapun。
AI MENULIS KODE YANG MEMECAHKAN SESUATU, ANDA TETAP ITU, DAN PECAH SESUATU YANG LAIN, DAN KEMUDIAN SELURUH PROSES PERGI KE BAWAH。
Solusinya sangat sederhana: menulis rencana sebelum menulis kata kode。
Framework PRP:
Sebelum membuka alat Coding Vibe, menjawab tiga pertanyaan dalam satu dokumen:
Untuk siapa
Siapa target pengguna? Seberapa nyaman mereka
Apa solusinya
Bersihkan nilai inti dalam satu kalimat。
Seperti apa kesuksesan itu
Kriteria spesifik dan mudah diuji。
Lalu serahkan dokumen ini ke Claude atau ChatGPT, dan perluas ke dokumen permintaan produk lengkap, atau PRD. PRD ini akan menjadi frase pembuka Anda dalam Cursor atau Claude Code。
Kebiasaan ini adalah "orang yang dapat menerbitkan produk mereka" dan "orang yang terjebak dalam siklus kematian"。
Terutama di Claude Code, Anda harus menekan Shift + Tab dua kali ke Mode Rencana sebelum sesuatu terjadi. Biarkan Claude menunjukkan dokumen mana yang akan dibuat atau diubah, yang berfungsi akan memperkenalkan, yang situasi batas atau struktur perlu dipertimbangkan untuk keputusan. Anda harus meninjau rencana untuk membantah unsur-unsur yang mencurigakan dan kemudian mengatakan "pergi ke depan" hanya setelah konfirmasi。
llms.txt: Standards untuk dokumen mudah dibaca
Salah satu teknik yang paling kurang dihargai di Vibe Coding adalah llms.txt。
Ini adalah berkas teks biasa Markdown yang ditempatkan di bawah pustaka, bingkai, atau direktori root projek untuk menyediakan alat AI dengan konteks yang tepat yang diperlukan untuk memakai projek dengan benar。
Ini memecahkan masalah dari kebanyakan dokumen perpustakaan yang dibuat dapat diakses dan dioptimalkan untuk pembacaan peramban. Model AI tidak bekerja dengan baik dengan HTML, atau JavaScript halaman dokumen dan menu navigasi. Allms.txt menghapus semua interference ini dan menyediakan model dengan referensi API bersih, terstruktur, fokus yang dapat ditempatkan dalam jendela konteks。
dimana allms.txt dan bagaimana menggunakannya
kebanyakan perpustakaan arus utama kini menerbitkan llms.txt. misalnya:
https: / / docs.subababase.com / llms.txt
Anda dapat menempelkan URL ini ke Claude Code, Cursor, atau ChatGPT, dan berkata: Baca dokumen ini terlebih dahulu, dan kemudian bantu saya membangun fungsionalitas dengan pustaka ini。
Untuk perpustakaan yang tidak memiliki llms.txt, Anda dapat menghasilkan salah satu dari Anda sendiri: salinan dokumen API dari pustaka, menempelkannya ke Claude, dan kemudian mengatakan: Silakan mengorganisir dokumen ke format llms.txt yang jelas, yang termasuk kategori, metode, parameter yang diperlukan dan contoh. Terkendali dalam 5.000 token。
Brankas teknologi OpenSaaS, yaitu Claude Code + Open SaaS Boilerplate, menggunakan llms.txt baik untuk Boilerplate dan kerangka Wasp. Dan itulah salah satu alasan mengapa Claude Code dapat menghasilkan kode yang lebih stabil di bawah konfigurasi ini daripada gudang teknologi manapun。
Sumber Daya
llms.txtResmi Standar
Taut:https: / / llmstxt.org /
peraturan resmi, daftar pustaka dan framework dari semua dokumen llms.txt yang diterbitkan。
OpenSaas: Cara terbaik untuk Kode Vibe pada tahun 2026
Taut:https: / / docs.opensaas.sh / blog / 2026-03-16-best-to-vibe- code- saas- 2026 /
Ini adalah kasus nyata bagaimana menggabungkan llms.txt, SaaS boilerplate dan Claude Code ke salah satu konfigurasi Vibe Coding paling stabil di 2026。
Aturan kursor dan CLAUDEMD: Perintah jangka panjang ke AI
Peraturan Kursor dan dokumen CLAUDEMD adalah salah satu praktik dengan laju terendah penggunaan di Vibe Coding tapi keluaran tertinggi。
INI ADALAH BERKAS PERINTAH DAYA TAHAN YANG AL AKAN BACA DI AWAL SETIAP SESI. MEREKA MENDEFINISIKAN PROYEKMU, KONTRAKMU, KUBAH TEKNOLOGIMU, DAN APA YANG AL TIDAK BISA LAKUKAN。
Pengaturan Kursor untuk 2026
Kursor kini menggantikan berkas tunggal .cursorrus sebelumnya dengan .cursorrus / rules / katalog dan mengadopsi aturan manajemen berkas .mdc terpisah。
Aturan memiliki empat mode aktif:
Selalu Terapkan
Setiap dialog dimuat, terlepas dari konteks。
Otomatis Terlampir (global)
otomatis diaktifkan ketika mengacu ke mode pencocokan berkas, misalnya * .tsx berkas。
Agen Diperlukan (berdasarkan deskripsi)
AI DINILAI KETIKA UNTUK MENERAPKAN BERDASARKAN DESKRIPSI MISI。
Manual (@ rule-name)
Hanya jika Anda secara eksplisit mengutip dalam petunjuk。
Apa yang harus aturan yang baik termasuk
(a) sebuah dokumen .cursor / index.mdc untuk menggambarkan profil proyek, gudang teknologi dan perjanjian umum, yang diusulkan untuk terkandung dalam 100 baris
Buat beberapa berkas .mdc terpisah dalam .cursor / rules /, sesuai dengan konteks spesifik, seperti otentikasi, mode basis data, komponen UI, dsb.
Menempatkan berkas CLUDEMD dalam direktori root untuk menulis informasi yang sama untuk Claude Code。
Sumber Daya
Akademi Koding Vibe: Aturan Kursor Panduan Lengkap + 15 Templat
Taut:https: / / www.vibecodingakademis.ai / blog / cursor- rules-complete-guide
Ini adalah salah satu panduan paling rinci 2026 pada Aturan Kursor, meliputi format .mdc, empat mode aktivasi dan template replicable untuk 15 tumpukan teknologi umum。
CLUDEMD dan Cursor Aturan: Multi Loves (YouTube, gratis dari biaya)
Taut:https: / / www.youtube.com / watch? v = ia54BXac5o
Diskusi mendalam tentang cara mengatur aturan multilayer untuk Cursor dan Claude Code, berisi kasus nyata. Video itu dirilis pada pertengahan 2025, tapi masih sepenuhnya berlaku。
Cara Membuat dan Menggunakan SSILLS.md dalam Kursor (YouTube, gratis)
Taut:https: / / www.youtube.com / watch? v = DfL5 zbWGc
Pengantar ke sistem keterampilan Cursor, diterbitkan pada Februari 2026. Konten overwrites bagaimana membuat. kursor / keterampilan / berkas yang Agen dapat panggil dengan perintah slash。
Direktori Kursor (bebas, komunitas)
Taut:https: / / cursor.directory /
Sebuah katalog dokumen peraturan untuk kontribusi masyarakat, meliputi sejumlah besar toko teknologi. Pilih berkas aturan yang cocok dengan tumpukan teknologimu dan kemudian mengaturnya。
Aturan Kursor yang mengagumkan (bebas, GitHub)
Taut:https: / / github.com / PatrickJS / awesome- cursorrules
Sebuah repositori dokumen-dokumen aturan berkualitas tinggi yang dipilih, diklasifikasikan oleh kerangka kerja dan terus diperbarui。
Kode Sinkronisasi: cursor, Claude Code, dan Windsurf
Taut:https: / / www.concretorio / blog / sync-coding- standards-across- cursor- agentforce -vibes- claude
PENDEKATAN YANG LEBIH MAJU: OTOMATIS MENYELARASKAN BERKAS ATURAN MASTER KE DALAM SEMUA PERANGKAT AI DENGAN HARD LINK。
Spec- Driven Development: Vibe Coding Profesional upgrade
Spek- Driven Development, sebuah pengembangan spesifik-didorong bernama SDD, adalah pendekatan khusus yang muncul ketika Vibe Coding memasuki sebuah proyek nyata dan perlu diperluas。
Pendekatan ini secara resmi diperkenalkan oleh Jetbrains di DeepLearning. Kursus AI di 2026. Ini menekankan apa yang harus dilakukan melalui spesifikasi yang terstruktur definisi sistem dokumen sebelum setiap Agen diperbolehkan untuk menulis kode dan menempatkan mereka langsung ke dalam repositori kode。
Coding Vibe biasanya crash dinding sekitar bulan ketiga proyek. Model mulai menghasilkan kode yang bertentangan dengan keputusan sebelumnya; konteks akumulasi; pola konflik mulai muncul; dan siklus kematian mengikuti。
Spek- Driven Development mencoba untuk memecahkan masalah ini dengan memungkinkan spesifikasi, yaitu dokumen spesifikasi, daripada pengingat tunggal, untuk menjadi sumber faktual dari projek。
SSD WORKFLOW
Menulis dokumen spesifikasi
Sebelum setiap kode muncul, jelaskan perilaku sistem tepatnya: apa fungsi ini lakukan dari luar, apa yang masuk, ekspor, batas dan hambatan. Ini bukan tentang rincian, ini tentang perilaku yang dapat diamati。
Buat permintaan
Berikan dokumen spesifikasi untuk Agen AI untuk menghasilkan dokumen permintaan terstruktur. Dan kemudian Anda memeriksa: apakah itu mencakup segalanya? Apakah rasio atau amandemen diperlukan
Buat Dokumen Desain
AI MENERJEMAHKAN PERSYARATAN YANG DISETUJUI KE DALAM RENCANA TEKNIS YANG BERISI KODE, TES, DAN TUGAS DOKUMENTASI. ANDA PERLU MENINJAU RENCANA SEBELUM ANDA MENULISKAN BARIS PERTAMA。
Berhasil
AI MENULIS KODE BERDASARKAN DOKUMEN SPESIFIKASI, TIDAK BERDASARKAN PETUNJUK SAMAR. MENCOBA LOGIKA, PENGOLAHAN, DLL., DAN PERILAKU LEMBUR HARUS DIPUTUSKAN DALAM DOKUMEN SPESIFIKASI DARIPADA DALAM IMAJINASI MODEL。
Hasilkan dan jalankan tes
Karena dokumen spesifikasi telah mengidentifikasi masukan, keluaran, dan batas, contoh tes juga dapat dihasilkan langsung dari dokumen spesifikasi。
MEMBUAT SSD STRUKTUR DOKUMEN YANG BENAR-BENAR EFEKTIF
maaf, nona
Jelaskan apa yang Anda bangun dan mengapa Anda membangunnya。
.md
Inti keputusan teknis - membuat didokumentasikan。
aku tidak tahu
Membongkar fase subproyek dalam rangka prestasi。
specs / [feature-name] / plan.md
Satuan tugas yang mati-matian untuk fungsi ini。
spesifikasi / [feature-name] / resurements.md
Scope, keputusan kunci-membuat dan konteks dari fungsi ini。
specs / [feature-name] / validation.md
Criteria untuk kesuksesan dan kondisi konsolidasi。
Ketika memakai SSD, ketika memakai Coding Vibe Murni
Vibe Coding dapat digunakan jika itu adalah prototipe, percobaan, bukti konsep, atau arah dieksplorasi dalam 3- 4 bulan peta jalan。
JIKA SEBUAH FUNGSI MEMBUTUHKAN PERAWATAN JANGKA PANJANG, PROYEK INI MELIBATKAN KONTRIBUTOR KEDUA, ATAU JIKA TINDAKAN FUNGSIONAL MELIBATKAN PENGARUH KOMERSIAL ATAU HUKUM, SDD HARUS DIGUNAKAN。
Jalur kompromi adalah untuk menjalankan "konstitusi" dengan SDD, yaitu misi, teknologi dan arsitektur; dalam perbatasan ini, tugas-tugas tertentu dilakukan dengan Coding Vibe。
Sumber Daya
Menuju Data Science: Dari Vibe Coding ke Pembangunan Yang Didorong
Taut:https: / / to warrisdatascience.com / frum-vibe-coding- to-spec- diven- development /
Salah satu panduan praktisi SSD yang paling rinci saat ini berisi struktur dokumen yang lengkap, rencana GNU mengimplementasikan loop meragukan, dan bagaimana mengotomatisasi aliran kerja spesifikasi ke keterampilan Claude Code。
Kit Spec GitHub (bebas, open source)
Taut:https: / / github.com / github / spec- kit
GitHub Resmi Open Source Specification Driving Toolkit. Menyediakan templat, menentukan Cli, dan perintah terstruktur yang dapat digunakan bersama dengan Claude Code, GitHub Copilot dan Gemini CLI, termasuk / spesifikasikan, / rencana dan tugas. Mendukung 30 multiple encodings。
GitHub Blog: Dapatkan Dimulai dengan Pengembangan Spek- Driven
Taut:https: / / github.blog / ai- and-ml / generative-ai / sect-driven-development -with -i- get-stard-with -a-new-open -sourkit /
Perkenalan resmi GitHub dengan penggunaan Spec Kit termasuk empat tahap: Spectify Plan Tugas Implementing, bagaimana memasang CLI tertentu, dan bagaimana membangun prinsip-prinsip pemerintahan proyek dengan / speckis.constitution. yang spesifik。
Jetbrains Course: Spec- Driving Development with Coding Agency
Taut:https: / / www.deplearning.ai / court / spec-driven- perkembangan -with -coding-agents /
Formalisasi kurikulum metodologi. Menutupi rencana lengkap, realisasi, siklus validasi, dan bagaimana cara otomatisasi aliran kerja SSD menjadi keterampilan yang dapat digunakan kembali dalam Claude Code。
Tes Colbab: Dari Koding Vibe ke Pengembangan Tergerak (pemandu gratis)
Taut:https: / / testcollab.com / blog / from -vibe-coding- to-spec-diven- development
Artikel interpretasi SDD, yang tidak mengikat alat-alat tertentu, berisi kasus-kasus nyata dan menggambarkan bagaimana CLUDEMD, Kursor Aturan dan GitHub Copilot PRD bekerja mencapai pola dasar yang sama。
Red Hat: Vibes, Specs, Skills, and Ages; The Four Bills of AI Coding
Taut:https: / / developmens.redhat.com / artikel / 226 / 03 / 30 / vibes- spesis- kills-agents- a- coding
Kerangka yang lebih maju: menjelajah dengan getaran, gunakan spesifikasi untuk memastikan akurasi, segel kemampuan Agen yang dapat digunakan kembali dengan keterampilan, dan jalankan tugas dengan anagent. Ini adalah salah satu profesi pemahaman Al mendukung pengembangan model mental yang lebih lengkap。
18 praktek yang digunakan oleh masing-masing tingkat keahlian Coder Vibe
Praktek-praktek ini datang langsung dari komunitas R / ClaudeAI dan r / PromptEngineering dan divalidasi dengan pengalaman praktisi dari 2025 sampai 2026。
Mulailah dengan visi rinci
Tulis semua yang kau mau sebelum kau buka alat apapun。
Penggunaan besar-besaran dari Git dan branch
Setiap eksperimen fungsional menciptakan cabang baru。
menyelaraskan folder
Membuat direktori sebuah / docs atau / interaksi untuk merekam arsitektur, komponen, dan keputusan-dibuat dengan berkas Markdown。
Membongkar fungsionalitas ke beberapa tahap
JANGAN MINTA AI SEKALIGUS UNTUK MELAKUKAN FUNGSIONALITAS PENUH. BAGIKAN MENJADI TIGA SAMPAI LIMA PETUNJUK。
Mulai percakapan baru ketika konteks terlalu panjang
Dialog jangka panjang mengurangi kualitas output. Ketika mengembangkan fitur baru, disarankan untuk memulai ulang sesi。
Setiap tanda kutip berkas spesifik
BERITAHU AI FILE MANA YANG HARUS DICARI。
Jangan pasang terlalu banyak konteks
Sebutkan saja dokumen yang paling relevan dan jangan tinggalkan semuanya。
Referensi ke komponen yang ada
KETIKA ANDA MEMINTA AI UNTUK MEMBUAT KOMPONEN BARU, MENUNJUK KOMPONEN YANG ADA SEBAGAI REFERENSI GAYA。
Pemeriksa kedua dengan Gemini 3.5 Pro
Salin kode generasi Gemini untuk memeriksa celah keamanan atau pola buruk。
Selalu verifikasi dan bersihkan data pada tingkat layanan
Jangan pernah percaya data yang diajukan oleh klien。
Kunci pada server
Gunakan variabel lingkungan untuk tidak pernah memasukkan Kunci API ke kode awal。
Kesalahan pemrosesan terlihat
SALIN INFORMASI GALAT DARI KONSOL DAN TEMPELKAN KE AI。
Jika perbaikan gagal tiga kali, coba lagi
JANGAN GUNAKAN PETUNJUK PROBLEMATIC YANG SAMA UNTUK MEMINTA AI UNTUK MENCOBA KEEMPAT KALINYA。
BIARKAN AL MENAMBAHKAN SEBUAH LOG
Ketika debug, jangan menebak. Permintaan AI untuk menambahkan konsole.log ke titik kunci。
Bersihkan scope
(Dan janganlah kalian menuruti apa yang aku minta dari kalian) untuk disampaikan kepada kalian
Pertahankan berkas "Kesalahan AI umum"
CATATAN KESALAHAN BERULANG YANG DIBUAT OLEH AI DAN MENGUTIP MEREKA KETIKA MEMULAI FUNGSI BARU。
Rencana pertama, bukan kode
SELALU BIARKAN AL MEMBERIKAN RENCANA DAN KEMUDIAN ANDA MENYETUJUINYA。
BIARKAN AI MENJELASKAN KODE ANEH
JANGAN MENERIMA KODE ANDA TIDAK MENGERTI SAMA SEKALI. SEBELUM MELANJUTKAN, BIARKAN AI MENJELASKAN。
Milestone 3
Pada akhir bulan, Anda harus mampu:
(b) Tulis petunjuk terstruktur dan mendapatkan keluaran stabil pada percobaan pertama
GUNAKAN FRAMEWORK PRP UNTUK MENYELESAIKAN PERENCANAAN SEBELUM MEMBANGUN APLIKASI APAPUN
Setup Kursor Aturan dan CLAUDE.md untuk item apapun
(b) Aplikasi adat dari 18 lebih ahli praktek
Berkas Kesalahan AI umum tersedia bagi projek Anda。
Bulan 4: Membangun proyek nyata, dari ide-ide ke produk online
TUJUAN BULAN INI ADALAH UNTUK MEMBANGUN 2-3 PROYEK LENGKAP DARI IDE-IDE KE URL NYATA. PROYEK INI AKAN MENJADI KOLEKSIMU。
Jarak antara kurikulum, Demo, dan produk sebenarnya adalah dimana kebanyakan Vibe Coder berhenti permanen. Produk nyata memiliki pengguna yang menyebabkan masalah dengan cara yang tak terduga, memerlukan basis data dan otentikasi, dan harus fungsional di ujung ponsel. Fokus bulan ini adalah untuk mengisi celah itu。
1
Lupakan pelacak kustom, lupakan aplikasi cuaca. Proyek Coding Vibe terbaik seringkali sempit, produk yang sangat vertikal yang dapat mengatasi titik nyeri yang berbeda bagi sekelompok orang tertentu。
Ini adalah ide-ide nyata: beberapa dari mereka telah dikonversi oleh pengembang independen pada tahun 2026, beberapa dari mereka telah benar-benar dibuat. Tak satu pun dari mereka adalah item template tunggal。
Primary: Dimulai dengan tangan asli (bulan 3-4)
Proyek-proyek ini tunggal, jelas - cut, dengan real-use skenario yang biasanya dapat dibuat selama akhir pekan dan tidak hanya Demo, tapi benar-benar berguna。
Generator Trek Reddit Disks
Alat ini menghubungkan Reddit API melalui PraW (Python Reddit API Wrapper), mengambil komentar dari semua posting, mengidentifikasi sarki dan ekspresi ofensif terbaik, menghubungkannya dengan LLM, dan akhirnya mengeluarkan berkas .wav melalui transliterasi teks dan penyuntingan audio dasar。
Ini aneh, lucu, bagus untuk disebarluaskan, seperti itulah proyek yang mendapat perhatian di Twitter。
ANDA DAPAT BELAJAR: INTEGRASI API PIHAK KETIGA, PANGGILAN BERANTAI LLM, PEMBUATAN BERKAS AUDIO。
Generator Brief Pertemuan AI
Sebelum pertemuan dimulai, pengguna memasuki nama perusahaan dan tujuan pertemuan. Alat ini menangkap jaringan para pejabat perusahaan dan informasi LinkedIn, membaca pertukaran email baru-baru ini antara Anda dan satu sama lain (melalui Gmail API) dan kemudian menghasilkan singkat pertemuan satu halaman yang termasuk poin bicara, risiko kunci dan rekomendasi。
ANDA DAPAT BELAJAR: BEBERAPA PENANGKAPAN DATA SUMBER, HINT LINK, OTENTIKASI API。
Likuiditas: bagi konsultan dan manajer klien, $19 per bulan. Hal ini terutama tepat untuk orang-orang yang memiliki lebih dari lima pelanggan panggilan per minggu。
Ini pertama kalinya aku mendengar ini
Alat ini menghubungkan repositori GitHub dengan GitHub API. Membaca panggilan terbaru setiap minggunya, apa perubahan telah dibuat dalam ekstraksi dan secara otomatis mempersiapkan log update yang jelas dan terorientasi pada klien。
pengembang biasanya tidak suka menulis changelogs, dan alat ini dapat mengotomatisasi hal ini。
Anda dapat belajar: GitHub API, keluaran LLM terstruktur, tugas waktu。
Pengguna target sangat jelas: pendiri independen dan tim pengembangan。
Chaser Bebas
Ini adalah alat yang dirancang untuk pekerja lepas untuk mengatasi kegagalan mereka untuk mengembalikan pembayaran yang terlambat。
Ia dapat mengintegrasikan Stripe atau menggunakan data faktur rekaman secara manual. Sistem secara otomatis mengirim pemberitahuan pembayaran yang sopan tapi progresif sesuai dengan jadwal yang sudah ditetapkan. Semakin lama faktur terlambat, semakin kuat nada dan rekaman dari semua operasi。
Anda dapat belajar untuk mengirim surat melalui Resend / Nodemailer, pekerjaan kron, pengolahan buku web Stripe。
Ini adalah alat yang orang-orang liberal inginkan pada pandangan pertama。
StickyCanvas: A Notebook Tool Unless Notion
Ini adalah proyek nyata yang pencipta gunakan setiap hari。
Ini adalah kanvas yang sangat singkat, dan pengguna bebas untuk menyeret dan stiker. Tidak dapat memperoleh folder:% s:% s Proposisi nilai penuh cukup sederhana。
Tidak ada menu, tidak ada perintah, tidak ada gagasan jenis kompleksitas. Hanya kanvas dan beberapa catatan。
Anda dapat belajar: seret dan tarik, kanvas dan penyimpanan lokal。
Proyek ini dapat online dalam satu akhir pekan。
Second: Proyek Workgroup yang menarik perhatian (4-5 bulan)
Proyek-proyek ini memerlukan basis data, otentikasi pengguna dan desain nyata untuk menunjukkan pemikiran produkmu。
MESIN OBROLAN AI VERTIKAL UNTUK ORANG-ORANG INDUSTRI TERTENTU
Ini bukan robot obrolan universal, tapi robot obrolan yang dilatih untuk basis pengetahuan bisnis tertentu。
Pilih area vertikal: klinik gigi, bengkel mobil, broker real estate, galeri yoga. Membangun robot obrolan yang dapat menjawab pemesanan, pertanyaan harga dan sering bertanya, dan menjual layanan penyebaran ke bisnis tersebut。
Beberapa pengembang independen menanggapi bahwa proyek vertikal tersebut bisa menghasilkan $850- 3200 per bulan dalam satu sub-pasar。
Anda dapat belajar: pipe RAG, pencarian vektor Supabese, widget yang tertanam, struktur multi-penyewa。
Pelacak Versi Proposal
Ini adalah alat untuk pekerja lepas dan agen untuk melacak setiap versi dari proposal penjualan yang dikirim kepada klien。
Hal ini dapat menunjukkan edisi yang telah dibuka, berapa lama klien telah menyaksikan, dan mengirim pemberitahuan ketika klien membuka kembali proposal. Pembukaan kembali proposal oleh klien biasanya berarti bahwa mereka mulai berpikir serius lagi。
Anda dapat menafsirkannya sebagai: analtik dokumentasi, dibuat khusus untuk proposal。
Anda dapat belajar: PDF mengunggah dan menyimpan, membuka email pelacakan, pemberitahuan real-time, Supbage database design。
Screenshot - to -React Constable
Pengguna mengunggah cuplikan layar UI secara acak, seperti halaman pendaratan, antarmuka aplikasi yang kompetitif, atau desain Figma yang mereka sadap。
Alat ini mengirimkan cuplikan layar ke model visual seperti GPT-5.5 atau Claude, lalu menghasilkan komponen React + Tailwind yang cocok dengan tata letak asli dan gaya sebanyak mungkin。
ANDA DAPAT BELAJAR: MODEL VISUAL API, GAMBAR UPLOAD, KELUARAN TERSTRUKTUR DARI MODEL MULTI- MODULAR。
Alat ini sangat berguna bagi pengembang dan dapat dengan mudah mendukung harga 250 dolar per bulan。
Alat Peta Pirin / Infrastruktur Air
Ini adalah proyek nyata pada subreddit Coding Vibe: sebuah alat pemetaan interaktif yang memungkinkan kotalitas atau tim utilitas untuk menggambar pipa dan watersheds, menambahkan riwayat pemeliharaan, biaya, dan catatan pemeliharaan, dan pencarian dan layar berdasarkan tanggal atau lokasi。
ALAT OPERASIONAL YANG DISESUAIKAN SERING MEMILIKI BEBERAPA KARAKTERISTIK: VERTIKAL, AGAK MEMBOSANKAN, TAPI SANGAT BERGUNA. PEMBELI B2B TIDAK AKAN RAGU UNTUK MEMBAYAR ALAT TERSEBUT。
Anda dapat belajar untuk menggunakan Mapbox atau Leaflet untuk membuat peta, menyimpan data geospasial dalam Supbase, bentuk berat UI, mengunggah berkas。
Chore App Keluarga Gamified
Para pencipta proyek ini tidak berniat untuk menerbitkannya pada awalnya, hanya karena mereka membutuhkannya di rumah, dan melakukannya pada akhir pekan. Sebulan kemudian, lebih dari 100 keluarga sudah digunakan。
Aplikasi ini memberikan tugas rumah tangga kepada anggota keluarga, memiliki poin setelah menyelesaikan misi, yang dapat membuka kunci insentif yang ditetapkan oleh orang tua. Gudang teknologi adalah FastAPI + PostgreSQL + PWA。
Ini adalah pengalaman sederhana: untuk membangun produk untuk masalah yang telah Anda temui。
Lebih cepat dan lebih nyata. Karena Anda adalah salah satu pengguna, pengguna nyata lainnya lebih mudah ditemukan。
Advanced: proyek kompleks untuk membuktikan kapasitas real (5- 6 bulan)
Proyek-proyek ini cukup kompleks untuk memerlukan struktur yang wajar, teknik konteks dan multi- konferensi konstruksi. Setiap orang bisa menjadi produk nyata, bukan Demo。
VC Invester CRM
INI ADALAH JALUR TRANSAKSI YANG DIRANCANG UNTUK INVESTOR VENTURA ATAU INVESTOR MALAIKAT。
Ini melacak transaksi proyek kewirausahaan, sejarah hubungan manajemen, dialog penumpukan otomatis, dan menunjuk perusahaan dengan investasi LLM berdasarkan definisi tesis。
Wawasan utamanya adalah CRM yang ada, seperti Saleforce, HubSpot, dirancang untuk tim pemasaran, bukan untuk investor. Model mental benar-benar berbeda。
Pembangunan produk untuk kelompok tertentu pengguna diabaikan oleh alat yang ada adalah salah satu yang paling mungkin income- menghasilkan jalur。
Permainan Simulasi Manajemen Basket
sebuah permainan simulasi bisnis basket penuh, kasus sebenarnya adalah azario.flook.appti。
Pemain bisa mengatur tim basket mereka sendiri, meng-upgrade pemain mereka melalui program pelatihan, berdagang dengan pemain lain di pasar waktu real-real dan mensimulasikan permainan melalui titik waktu nyata。
Anda dapat belajar: manajemen negara yang kompleks, simulasi permainan, data multi- user real-time, peringkat。
Proyek tersebut dapat menunjukkan ambisi rekayasa yang nyata。
Al- powered Speech Terapi App (Aphasio)
Ini adalah aplikasi iPhone yang menggunakan cursor untuk membangun bagi orang-orang dengan trauma。
Aplikasi menyediakan pelatihan bahasa yang dihasilkan AI-, pengguna berlatih membaca kata-kata dan kalimat, dan App mendengarkan dan mengevaluasi pengucapan, dan kemudian menyesuaikan kesulitan untuk dinamika kinerja。
Sang pencipta melakukan ini karena keluarga benar-benar membutuhkannya。
Anda dapat belajar: pengenalan suara API, sendiri-adaptasi praktek generasi, pindah akhir konstruksi, proses pelacakan penyimpanan awan。
Ini semacam proyek yang sangat berarti。
Alat Aksesibilitas PDF bagi Impairments Vital
INI ADALAH ALAT AI UNTUK MENGUBAH PDF APAPUN MENJADI VERSI YANG BENAR-BENAR DAPAT DIAKSES UNTUK ORANG CACAT VISUAL。
Ini bukan hanya ekstraksi teks dasar, tetapi merupakan terjemahan dari tabel kompleks dan grafik ke deskripsi bahasa populer, menghasilkan teks att untuk gambar tertanam, menambahkan urutan membaca yang masuk akal dan mengekspor dapat diakses HTML atau versi EPUB。
Anda dapat belajar: PDF parsing (PyMUPDF atau pdfpoller), multi- modular AI untuk deskripsi grafis, akses ke keluaran HTML。
Arah ini tidak hanya memiliki potensi untuk likuiditas SaAS, tetapi juga dapat menerima pendanaan atau penambahan institusi。
Sumber daya bagi penemuan projek
r / vibecoding: Tunjukkan Proyek Awesome Anda (bebas biaya, Reddit)
Taut:https: / / www.reddit.com / r / vibecoding / comments / 1rl5cj / show me your awesome vibe projects /
Tampilan komunitas yang sebenarnya sudah proyek Coding Vibe online. Hal ini sesuai untuk mencari inspirasi dan untuk melihat gambar yang benar dari lingkup dan kesulitan proyek。
r / vibecoding: Apa Proyek Video Paling Unik Anda? (bebas biaya, Reddit)
Taut:https: / / www.reddit.com / r / vibecoding / komentar / 1rxjc3u / what is your host unik proyek vibecode /
Ada beberapa proyek yang benar-benar aneh dan inovatif di sini, termasuk database trek Diss, PDF alat aksesibilitas, dan basis data geospasial diproduksi dalam waktu 30 hari。
DodoPaments: 30 Ide Micro SaaS untuk 2026 (pemandu gratis)
Taut:https: / / dopayments.com / blogs / micro- sas-ides-2026
Menyediakan 30 disertifikasi Micro SaaS ide, termasuk ukuran pasar, MRR potensial, start- up biaya dan jalur likuiditas. Setiap proyek cocok untuk pengembang independen。
SuperFrameworks: Vibe Coding Hits a Tipping Point
Taut:https: / / subscription works.com / artikel / vibe-coding- pint-what- founders- nee- know
Mendaftar 7 cabang spesifik, pengembang independen telah mendapatkan $500- 3200 per bulan melalui produk Coding Vibe, dengan angka pendapatan yang sebenarnya。
Ideal: 50 Micro- SaaS Ides for Solo Founds pada 2026 (gratis)
Taut:https: / / ideaproa.io / daftar / mikro-saas-ide
Setiap ide termasuk peringkat kesulitan teknis, estimasi biaya awal (US $100.15000) dan analisis kesenjangan pasar-spesifik. Ini adalah salah satu ide yang paling operasional yang tersedia hari ini。
Forum Kursor: Dibangun dengan Kursor pada 2025 (gratis, komunitas)
Taut:https: / / forum.cursor.com / t / bict-with-cursor-in -2025-share -your-projects / 147737
Menampilkan proyek di forum resmi Cursor. Mereka adalah proyek yang nyata, pembangun yang nyata, dan mereka jujur tentang di mana mereka berada。
Plan- Review-Fix Siklus: pendekatan konstruksi Profesional
Sebagian besar pendatang baru Vibe Coder menggunakan loop "tips, picks, takes"。
Ini bisa berguna untuk 20 baris, tetapi jika itu adalah fungsi nyata dalam produk nyata, itu adalah bencana gagal。
Profesional menggunakan loop Plan- Review- Fix, dengan tiga peran yang berbeda: Anda, Agen Kode, dan peninjau AI independen。
Workstream
Perencanaan pertama。
SEBELUM MENULIS KODE APAPUN, BIARKAN DAFTAR AI YANG AKAN MEMBUAT ATAU MENGUBAH BERKAS, YANG BERFUNGSI AKAN MENAMBAHKAN, APA KETERGANTUNGAN YANG DIBUTUHKANNYA, DAN BATAS APA YANG MUNGKIN DIMILIKINYA。
Katakan dengan jelas: tidak menulis apa-apa, hanya menunjukkan rencana。
Kemudian Anda meninjau rencana dan membuat perubahan。
Berhasil。
SETELAH RENCANA DISETUJUI, BIARKAN AI MENULIS KODENYA。
Ulasan。
Salin kode yang dihasilkan dan paste ke sesi Gemini baru 3.5 Pro. Pilih karena memiliki jendela konteks yang sangat besar. Ini bertindak sebagai insinyur keamanan senior dan pemeriksa kode, memeriksa Bug, pelanggaran keamanan, nama paket berhalusinasi, dan pola buruk。
Perbaiki。
Feedback dari temuan peninjau 'untuk kode Agen terus secara iteratif sampai hasilnya bersih。
Sumber Daya
ProjekTTalk: Vibe Coding Best Praktek; Hindari Doom Loop
Taut:https: / / www.projecttalk.org / vibe-coding -best-praktek /
Salah satu panduan yang paling rinci pada "Lingkaran Kematian" dan Plan- Rene- memperbaiki siklus, berisi contoh praktis。
5 Vibe Making Wordflows Itu sebenarnya Kode Produksi Kapal pada 2026
Taut:https: / / dev.to / dohkoai / 5-vibe-workflow -that -actually -ship -project -code -in -2026-1 nmn
Keterangan proses praktis menggunakan Claude Code, Cursor dan Windsurf untuk memberikan kode produksi nyata, bukan Demo. Konten mencakup driver tes, konteks loading pola dan data biaya nyata。
Tiga. Setiap Vibe Coder harus memiliki basis aman
KODE YANG DIHASILKAN OLEH AI ADALAH SUBJEK DARI BEBERAPA MASALAH KEAMANAN YANG BERULANG DAN DAPAT DIPREDIKSI. ANDA TIDAK PERLU MENJADI AHLI KESELAMATAN, TETAPI ANDA PERLU TAHU BAHWA MODEL INI ADA DAN MENGEMBANGKAN KEBIASAAN INSPEKSI SEBELUM PRODUK APAPUN ONLINE。
Daftar Keamanan Kode Vibe
Kunci API dan kunci
semua kunci harus berada di .env.localy. berkas ini harus ditambahkan .gitignore sebelum dorongan pertama. tidak ada pengecualian。
Validasi Layanan
SELALU OTENTIKASI DAN BERSIHKAN SEMUA MASUKAN PENGGUNA PADA AKHIR LAYANAN. AI SERING MELEWATI LANGKAH INI。
Mode Otentikasi
Supbase dapat menangani otentikasi secara benar secara baku. Jika Anda ingin menyesuaikan otentikasi, gunakan perpustakaan dewasa yang sepenuhnya sah。
KONFIGURASI CORS
BIARKAN AI MENJELASKAN PENGATURAN CORS APA YANG DIHASILKAN, DAN MENGAPA. KONFIGURASI CORS YANG SALAH ADALAH MASALAH AI UMUM。
Reliance pada audit
SEBELUM PENYEBARAN, AI DIIZINKAN UNTUK MEMERIKSA APAKAH ADA DEPENDENSI CELAH YANG DIKETAHUI ATAU APAKAH ADA NAMA PAKET ILLUSION- YANG DIHASILKAN. AI KADANG-KADANG MENCIPTAKAN NAMA PAKET TIDAK ADA。
Prompt Injection
JIKA APLIKASI ANDA MELEWATI MASUKAN PENGGUNA KE LLM, PENGGUNA MUNGKIN MENCOBA MEMBAJAK PETUNJUK SISTEM. KAU HARUS MEMBACA PANDUAN OWASP。
Sumber Daya
OWASP Top 10 untuk LLM Apps: Prompt Partipation
Taut:https: / / genai.owasp.org / llmrisk / llm01- proto-injeksi /
Ini adalah referensi otoriter untuk Prompt Injection dan adalah resiko keamanan pertama dalam aplikasi LLM. Ini mencakup baik langsung dan tidak langsung suntikan serangan dan model defensif。
OWASP API Security Top 10 (bebas)
Taut:https: / / owasp.org / APl-Security /
DAFTAR RISIKO KEAMANAN API. ELEMEN-ELEMEN INI HARUS DIPAHAMI SEBELUM SETIAP PRODUK YANG MENERIMA DATA PENGGUNA BERADA DI BARIS。
Carifai: Vibe Coding Best Practices and Security
Taut:https: / / www.klarifai.com / blog / vibe- coding- dijelaskan
DAFTAR KEAMANAN LANGKAH-DEMI-LANGKAH UNTUK GENERASI AI, DENGAN TIPS KHUSUS UNTUK MEMBANTU ANDA MEMBUAT AI LEBIH AMAN。
Sycode MCP Server: Secure AI Code in Real Time
Taut:https: / / cycode.com / blog / international- cycodes-mcp-server /
Server MCP Cycode dapat diintegrasikan langsung ke dalam Cursor dan Windsurf, sebagai pemindai keamanan real time, untuk memeriksa kode generasi AI tanpa meninggalkan alur kerja Coding Vibe。
4 Supabese: seluruh belakang
Supabese layak dipilih karena itu adalah salah satu infrastruktur yang paling penting bagi Vibe Coder untuk membangun produk nyata。
Ini menyediakan basis data Postgres, otentikasi, penyimpanan berkas dan subscriptions real-time, semuanya dapat dipanggil melalui JavaScript SDK dan tidak memerlukan manajemen server。
Sumber Daya
Supabese: Panduan Vibe Coder ke Lingkungan
Taut:https: / / subbase.com / blog / the-vibe-coders -guide -to -subbase- lingkungan
Artikel ini didedikasikan untuk Vibe Coder. Isi ini mencakup pengaturan lingkungan pembangunan dan produksi, migrasi basis data, dan kesalahan yang paling serius dari pemula: menguji data yang sebenarnya secara online。
Undo-type
Taut:https: / / www.youtube.com / @ Supbase
Setiap fungsi utama memiliki panduan video pendek dan praktis seperti otentikasi, basis data, penyimpanan, fungsi waktu. Setiap video sekitar 5-10 menit。
Dokumen Minoritas Supabese
Taut:https: / / subase.com / docs / guiders / development / database- migrations
pertimbangkan setiap skema basis data berubah sebagai migrasi daripada langsung mengedit basis data. ini adalah kunci untuk menghindari hilangnya data bencana. panduan juga berisi skrip rollback。
Lima, sembilan model yang gagal untuk Entrant: di mana proyek Anda akan salah
Universitas DAPLab peneliti Kolombia telah menerbitkan yang paling ketat Vibe Coding gagal studi model sampai saat ini. Dalam misi yang sama, mereka menganalisa Cline, Claude, Cursor, Refrit dan v0, dan akhirnya menemukan sembilan pola kunci kegagalan。
Dua yang paling umum dan berbahaya adalah:
Diam gagal
Kode tampaknya bekerja dan itu tidak salah, tapi itu tidak persis apa yang Anda minta. Terminals tidak melaporkan kesalahan merah, prosedur tidak runtuh, mereka adalah perilaku yang salah dan biasanya ditemukan lama setelah itu, dan bahkan mungkin telah memasuki lingkungan produksi。
Logika bisnis gagal
Model ini benar-benar mencapai mekanisme, tapi salah paham maksud sebenarnya. Sebagai contoh, penghitung kartu seri digantikan dengan kondisi yang Anda lupa menyatakan; jumlah faktur tidak termasuk pajak yang seharusnya disertakan. Kesalahan tersebut bisa menjadi bencana untuk produk nyata。
Tujuh model lainnya diidentifikasi oleh peneliti termasuk:
Galat Memproses Gap
teks mirip dengan mencoba {...} menangkap (e) {} muncul, benar-benar menelan kesalahan dan tidak merekam log。
Lingkup over- edit
Agen dimodifikasi file Anda tidak memintanya untuk bergerak, menyebabkan malfungsi lain。
Diskon konteks lama
Saat percakapan semakin lama, model tersebut secara bertahap lupa keterlibatan proyek Anda。
rasional sendiri uji tanda
Tes ini hanya menguji kecerdasan buatan, bukan menguji perilaku nyata. Hasilnya adalah 100% tingkat lulus, tapi cakupan aktual nol。
Komponen Magnificent menyebar
Sebuah berkas dengan lebih dari 600 baris, berisi lebih dari 10 penggunaan Negara, hampir tidak dapat dipertahankan。
Aturan buta
Agen melihat pengendalian diri Anda sebagai preferensi, bukan aturan. Ini akan mematuhi batasan tersebut sampai menemukan alasan untuk ketidakpatuhan。
Jarak transparansi
Ketika hal-hal gagal, alat saat ini hampir tidak dapat membuat Anda melihat apa Agen mencoba untuk melakukan, di mana ia salah。
Untuk daerah yang buta aturan, penelitian ini menawarkan cara memperbaiki CLAUDEMD dan dokumen peraturan sebagai kontrak wajib, bukan rekomendasi。
Anda perlu menambahkan kondisi yang jelas untuk kegagalan, contohnya:
Jika meja ini tidak memiliki kebijakan RLS, berhenti dan meminta saya untuk tidak melanjutkan。
Tes 6: Kebanyakan kemampuan Vibe Coder akan menyesal setelah bolos
Tanpa proses terstruktur QA, aplikasi Coding Vibe menumpuk hutang teknis sekitar tiga kali laju pengembangan perangkat lunak tradisional. Kesimpulan ini berasal dari analisis meta- dari 101 AI mendukung sumber pembangunan。
Hasil sebenarnya adalah bahwa aplikasi Coding Vibe yang terlihat "dapat diterapkan" biasanya seharga $5.000.000 - $30.000 jika membutuhkan re- rekayasa profesional。
SOLUSINYA ADALAH JANGAN BERHENTI MENGGUNAKAN AI, TAPI UNTUK MENGIJINKAN AI MENULIS TES SAMBIL MENULIS。
Metode Coding Vibe Uji
Sebelum menulis kode fungsional, biarkan Al menulis tes untuk perilaku yang diharapkan. Ini akan memaksa Anda untuk mendefinisikan perilaku fungsional lebih tepat, dan akan segera meningkatkan kualitas kode fungsional. Jalankan tes, menonton gagal. Kemudian biarkan AI menulis kode yang memungkinkan tes untuk lulus. Setelah setiap perubahan besar, biarkan AI menjalankan tes npm. Tes gagal adalah loop umpan balik yang mencegah kembali。
Aturan 70 / 30
INI ADALAH PEDOMAN PRAKTIS UNTUK MENENTUKAN PEKERJAAN MANA YANG PALING COCOK UNTUK AI。
70% UNTUK DUKUNGAN AI:
Kode template, operasi CRUD, validasi bentuk, menulis tes untuk kode yang ada, menulis dokumen, remodeling berdasarkan mode jelas, konversi format (JSON AFT TypeScript), ekspresi reguler, satu-off script。
Tiga puluh persen harus manusiawi-dipimpin:
Desainer arsitektur sistem - membuat, kode kunci keamanan (sertifikasi, enkripsi, pembayaran), kondisi kompetitif yang kompleks, daerah masalah baru, algoritma kritis kinerja, logika hukum dan kepatuhan。
Jika Anda memberikan 95% untuk AI, mungkin Bug. Jika Anda hanya menyelesaikan 20% dengan AI, itu berarti Anda membuang-buang banyak produktivitas。
Sumber Daya
Testemat: 8 Alat Pengujian AI Terbaik untuk Kode Vibe
Taut:https: / / testopa.io / blog / best-a- testing -for -vibe- coders /
Ini adalah salah satu panduan yang paling lengkap 2026 untuk alat pengujian Vibe, yang meliputi alat Vitine, Playwright, dan AI asli QA。
Tes Vibe dengan Playwright + MCP (panduan gratis, Tim Deschryver)
Taut:https: / / timdeschryver.dev / blog / vibe-testing -with-playwright
Jelaskan bagaimana server MCP dramawan digunakan dalam cursor atau VS Copylot untuk menulis dan menjalankan tes peramban dalam bahasa alam. Tombol "salin sebagai masalah" dalam tab yang salah memungkinkan Anda untuk menempelkan tes gagal langsung ke Agen AI。
Catatan Coding Vibe dari Basement
Taut:https: / / www.away- testing.com / 2025 / 04 / a- coding- coding- notes -fe--the-basement
Ini adalah salah satu yang paling rinci praktisi 'panduan pada TDD-first Vibe Coding. Elemen termasuk penggunaan perencanaan o1, penggunaan Cursor + Sonnet 4.6, terus menerus menjalankan tes sebagai umpan balik loop, dan penggunaan gadingest untuk meratakan perpustakaan coding menjadi file tunggal untuk alasan dalam berpikir model。
Codegen Dramawan
Taut:https: / / playwrightt.dev / docs / codegen
Jalankan:
tidak, tidak
Dan kemudian klik aplikasi Anda di peramban seperti pengguna normal. Dramawan merekam setiap klik dan secara otomatis menghasilkan berkas pengujian Playwright. Ini adalah salah satu cara tercepat untuk menulis tes browser。
Dokumen Resmi Vitaest (bebas)
Taut:https: / / vitest.dev /
Ini adalah kerangka pengujian standar untuk 2026 Vite adalah proyek Next.js. Ini cepat, kompatibel dengan Jest, dan keturunan mendukung TypeScript。
Bulan 4 tonggak
Pada akhir bulan, Anda harus memiliki:
2-3 PROYEK LENGKAP DAN DIKERAHKAN, SEMUA YANG MEMILIKI URL BARIS-REAL
Setidaknya satu proyek memiliki database bersertifikat dan Supabese
Setiap fitur kunci disinkronkan atau sebelumnya ditulis
Plan- Review-Fix Workstream tertanam dalam kebiasaan konstruksi Anda
Izin keamanan menjadi standar untuk setiap penyebaran
GitHub memiliki setidaknya tiga gudang nyata di halaman rumah。
BULAN 5: REKAYASA KONTEKS DAN MCP, MEMBEDAKAN ANTARA "SANGAT BAIK" DAN "ATAS" META- KETERAMPILAN
TUJUAN UNTUK BULAN INI ADALAH UNTUK MENANGKAP KERJA KONTEKS, YAITU PADA WAKTU YANG TEPAT, DAN MENYEDIAKAN AI DENGAN INFORMASI YANG TEPAT UNTUK MEMFUNGSIKANNYA UNTUK MENGHASILKAN KUALITAS TINGGI, TERSTRUKTUR, DAN HASIL BERKELANJUTAN。
Kontek adalah kunci untuk membedakan antara umum dan sangat baik Vibe Code. Mantan sering membuat coding pool membingungkan dan tidak konsisten, sedangkan membangun akhir produk bersih dan berkelanjutan. Sebagai lingkup proyek mengembang, manajemen konteks akan menjadi kemampuan yang paling penting。
Apa proyek konteks
PROYEK KONTEKS ADALAH BENTUK INFORMASI SADAR YANG MEMASUKI JENDELA KONTEKS AI SEBELUM DAN SELAMA SETIAP PENGINGAT。
INI BUKAN TEKNIK TUNGGAL, TAPI SISTEM. SISTEM INI TERMASUK BERKAS ATURAN ANDA, STRUKTUR DOKUMEN PROYEK, BERKAS YANG DIKUTIP DALAM PETUNJUK, BAGAIMANA PERPUSTAKAAN KODE TERORGANISIR, DAN BAGAIMANA ANDA MENANGANI BATAS PANJANG KONTEKS AI。
DALAM KASUS DI MANA KONTEKS TIDAK MEMADAI AL, TIDAK KONSISTEN, USANG DAN BAHKAN KODE KONFLIK DIHASILKAN. AL DENGAN KONTEKS YANG BAIK MEMBUAT KODE YANG SESUAI DENGAN MODEL PROJEK, MEMAHAMI ARSITEKTUR DAN MENGHINDARI KESALAHAN YANG DIKETAHUI。
Tile Rekayasa Konteks 2026
.cursor / rules / + CLAUDEMD
Proyek Level Long- Term Direktif, 3 bulan sudah。
menyelaraskan "% s"
Dokumen Markdown merekam keputusan arsitektur kunci, modul dan integrasi pihak ketiga。
Berkas spesifikasi fungsional
Setiap fungsi kunci sesuai dengan dokumen Markdown menjelaskan apa yang dilakukannya, bagaimana itu terhubung ke seluruh sistem, dan apa kendala tersebut。
Contoh berkas
Gunakan komponen yang ada sebagai referensi gaya dalam petunjuk。
Mengembangkan server di belakang panggung
Menjalankan npm run dev sebagai tugas belakang panggung, memungkinkan AI untuk melihat kesalahan terkompilasi dan layanan akhir log secara langsung selama pembangunan。
AUTOMATISASI PERAMBAN MELALUI MCP
Sebagai contoh, dalam kasus Chrome DevTools MCP atau Vercel, Peramban Anent memungkinkan AI untuk melihat render nyata, kesalahan konsol, dan permintaan web tanpa cuplikan layar。
Sumber Daya
NXCode: Agency Engineering; The Complete Guide to AI- First Software Development (panduan gratis)
Taut:https: / / www.nxcode.io / resources / news / regional- engiled -complete -guide -vibe- coding-a- agens-2026
Pada awal 2026, Karpathy memperkenalkan istilah "rekayasa agentic" untuk menggambarkan evolusi dari evolusi biasa Vibe Coding ke pengembangan profesional yang dibantu. Panduan ini mencakup siklus penuh PEV, yang Rencana Aus Eksekusi Verify, struktur konteks dan pintu berkualitas. Diterbitkan pada bulan Maret 2026。
10 Repositor GitHub ke Master Vibe Coding (pemandu gratis, KDnugets)
Taut:https: / / www.kdnuggets.com / 10- github-repositories- to-master- vibe- coding
Pemilihan gudang GitHub yang paling berguna dibuat, meliput proyek konteks, templat kerja, konfigurasi buku aturan, dll。
Koding Vibe yang mengagumkan (bebas, GitHub)
Taut:https: / / github.com / filipecalegario / awesome- vibe-
Salah satu daftar pilihan yang paling lengkap dari referensi Coding Vibe, alat, panduan dan sumber daya。
MCP: Protokol Konteks Model
MCP, nama lengkap Model Kontext Protocol, adalah standar terbuka yang dibuat oleh Anthropic untuk menghubungkan alat AI ke sumber data eksternal seperti database, API, data real-time, dokumen eksternal dan layanan pihak ketiga。
MCP sekarang didukung oleh Cursor 3.0, Claude Code and Windsurf. Dimana Cursor 3.0 dapat digunakan oleh Marketplace。
Memahami MCP berarti Anda akan ke tingkat bawah Vibe Coding: Agen tidak lagi hanya menulis kode, tapi dapat mencari data asli Anda, menemukan dokumen secara langsung, berinteraksi dengan layanan partai ketiga dan melakukan operasi pada sistem eksternal。
APA MCP SEPERTI DALAM PRAKTEK
Stripe MCP server
Biarkan Agen Anda membaca dan membuat faktur Stripe ini。
Supabese MCP
Dapatkan Agen Anda untuk berkonsultasi database real-time dalam proses pembangunan。
Figma MCP
Biarkan Cursor Agen membaca file desain Anda dan mendapatkan komponen di sana。
GitHub MCP
Biarkan Agen menciptakan masalah, membuka PR, mengelola aliran。
Qdrant MCP
Memungkinkan Agen untuk mengakses basis data vektor untuk membangun aplikasi yang mendukung RAG。
Sumber Daya
Dokumentasi Resmi MCP
Taut:https: / / mode contextprotocol.io / internasional
Dokumen resmi dan spesifikasi Mode Konteks Protokol。
Membangun Server MCP Pertama Anda dengan Coding Vibe
Taut:https: / / www.qpython.com / building -your -first -mcp-server-with -python -and -vibe -coding- pk /
Membangun tutorial praktis server MCP pertama dengan Cursor, memungkinkan AI untuk menarik konteks real-time dari sumber luar。
Bangun Server MCP Anda dalam 5 Winters dengan Coding Vibe
Taut:https: / / www.clarananet.com / uk / blog / bild-your-mcp-server-just-5-minutes-using-vibe- coding-kiro /
Salah satu hidangan server MCP tercepat。
Vibe Coding RAG dengan Server MCP Qdrant (gratis, Qrant)
Taut:https: / / qdrant.tech / blog / webinar- vibe- coding- kain /
Cara menggunakan server MCP Qdrant untuk mengijinkan cursor dan Claude Code mengakses database vektor secara langsung selama konstruksi。
Kursor Marketplace (aplikasi)
Taut:https: / / cursor.com / markplace
Anda dapat menelusuri dan memasang plugin server MCP, termasuk AWS, Figma, Linear, Stripe, Vercel, Datadog, dll., dan memasangnya di Cursor 3.0。
3; Figma ke Kode: Desain alur kerja bagi Kode Vibe
Jika Anda ingin produk tidak "dapat diterapkan", tetapi untuk melihat cukup canggih, workflow Figma Code adalah kemampuan desain yang paling menguntungkan dalam kotak perkakas Vibe Coder。
Alih-alih menggambarkan antar muka dengan teks, membuat desain visual dalam Figma dan kemudian menggunakan Figma MCP untuk memungkinkan AI untuk menghasilkan kode yang cocok langsung dari berkas desain。
Workstream
Hubungkan Figma MCP ke Cursor atau Claude Code pertama. Plugin Figma dapat dipasang di tempat Marketplace Cursor。
Kemudian kutip file Figma dalam petunjuk:
Pelajari token desain dalam file Figma ini. Ekstrak palet, nomor fonta dan jarak dan mengorganisir mereka menjadi konfigurasi tailwind. Jangan menulis komponen pertama。
, dan kemudian merujuk ke komponen tertentu:
Membuat komponen Navbar berdasarkan desain Figma. Akurat ruang yang cocok, tata letak fonta, dan status atas. Menggunakan Taylor CSS, hanya TypeScript。
Secara bertahap dibangun oleh blok, selalu mengutip ukuran dan logika tata letak dalam berkas Figma。
Sebuah rekomendasi kunci
Bahkan tanpa Figma MCP, pemula dapat menggunakan alternatif yang lebih cepat: membuat sketsa halaman dengan Canva。
Sebelum membuka alat konstruksi, 30 menit untuk menggambar tata letak di Canva. Ini akan memaksa Anda untuk menjawab beberapa pertanyaan: apa yang ada di setiap halaman? Dimana navigasinya? Apa yang setiap blok berisi
Hal ini akan menghapus sejumlah besar ketidakpastian baik sebelum petunjuk pertama dan menyimpan beberapa jam koreksi。
Sumber Daya
Figma MCP + Kursor: The New AI Design System WorkFlow
Taut:https: / / www.youtube.com / watch? v = 09VgyffLraw
Sebuah demonstrasi lengkap bagaimana menghubungkan Figma ke Kursor, impor token desain, dan menghasilkan komponen yang akurat memenuhi spesifikasi Figma. Diterbitkan pada bulan November 2025。
Claude Kode x Figma MCP: Playbook Designer
Taut:https: / / adplist.substack.com / p / how -to -build -with -figurem--cp-the- disainer
Penulis, dalam kapasitasnya sebagai desainer, melakukan 100 hari Coding Vibe dan merangkum versi halus dari komponen Reafy Kode Figma Claude Code Production. Berisi template petunjuk yang dapat disalin secara langsung, untuk mengekstrak token standar dan untuk menghasilkan blok respon。
Figma Buat (resmi, level bebas)
Taut:https: / / www.figma.com / laws / vibe-coding- tool /
Alat Coding Vibe asli Figma. Anda dapat menjelaskan UI atau prototipe dalam bahasa alami langsung dalam Figma, menghasilkan prototipe interaktif dan ekspor kode bersih. Hal ini dapat diintegrasikan dengan Figma MCP untuk Agen eksternal。
Anima: Kode Vibe Dengan Sistem Desain Figma Anda
Taut:https: / / www.animaapp.com / blog / depar-systems / vibe-code- your-figurem- system /
Impor sistem desain Figma ke Anima, dan kemudian hasilkan komponen React yang mengikuti token desain. Keluaran dapat dikirim ke Claude Code atau Cursor untuk melanjutkan pemrosesan via Anima MCP。
Muzli: Kendali Vibe Bekerja Panduan untuk Designers
Taut:https: / / muz.li / blog / the-complete -vibe-coding -guide -for -couger -2026 /
Membangun panduan lengkap bagi pengembang non- untuk produk yang dihasilkan AI-, mencakup petunjuk sistem desain, referensi visual dalam petunjuk, dan bagaimana mempertahankan konsistensi merek dalam komponen Vibe Coding。
4. Tambahkan fungsi AI ke produk: Vercel AI SDK
If you want to build an "AI- based product" and not just an "AI- based product", then Vercel AI SDK is one of the faster and cleaner options in the Next.js technology vault。
Sumber Daya
Dokumentasi Vercel Al SDK (dokumen resmi gratis)
Taut:https: / / sdk.vercel.ai / docs
Dokumen referensi resmi. Ini mendukung lebih dari 20 penyedia AI melalui antarmuka terpadu, termasuk OpenAI, Anthropic, Google, Mistral, Groq, dll., dan mendukung keluaran saat ini, perangkat panggilan dan generasi terstruktur。
AI SDK V5 Tutorial Series (Youtube, gratis)
Taut:https: / / www.youtube.com / playlist? list = PL4cxeGkC9h2NkvFCBO4kvA4Y9wiDlO
A multi- pool tutorial on using Vercel AI SDK to construct Next.js AI application. Set pertama dari presentasi dan set kedua dari konfigurasi proyek diterbitkan pada bulan Agustus 2025, meliputi proses set- up penuh。
Built a Freeing AI Chat App with Vercel AI SDK and Next.js
Taut:https: / / dev.to / nikolasbarwicki / bild-a- streaming -ai- chat-with -vercel-ai- sdk-dan-textjs-10f6
BANGUN TUTORIAL KODE LANGKAH UNTUK APLIKASI PERCAKAPAN AI STREAMING DARI AWAL。
Apa yang bisa kita lakukan bulan ini
Pilih salah satu proyek bulan 4 Anda untuk menambahkan fungsi AI ke Vercel AI SDK. Sebagai contoh: Tambahkan AI Auto- label ke aplikasi catatan; tambahkan asisten AI ke tracker gubahan "Query your custom data"; secara otomatis hasilkan AI flashcard berdasarkan teks yang disisipkan pengguna。
RG: BIARKAN PERTANYAAN JAWABAN AI BERDASARKAN DOKUMEN ANDA
RAG, nama lengkap Retrieval- Augmented General, adalah Retrieval Enhancement. Ini adalah persaingan inti di balik aplikasi tingkat AI paling serius, seperti robot penumpang, bank pengetahuan internal, pertanyaan dokumen dan alat jawaban。
RAG JUGA SALAH SATU KETERAMPILAN YANG PALING POPULER DAN DIPERLUKAN BAGI ORANG-ORANG YANG INGIN MENGIKUTI RUTE "INSINYUR PRODUK AI"。
KONSEP INTINYA SEDERHANA: BIARKAN LLM MENJAWAB PERTANYAAN DENGAN DATA PELATIHAN SAJA, TAPI PERTAMA-TAMA AMBIL KLIP YANG RELEVAN DARI FILE ANDA SENDIRI, KEMUDIAN MASUKKAN MEREKA KE DALAM PETUNJUK, DAN BIARKAN MODEL MENJAWAB ATAS DASAR INFORMASI YANG ANDA BERIKAN。
Sumber Daya
LlamaIndex: Pengantar ke RAG (berkas bebas resmi)
Taut:https: / / developmenters.llamagindex.ai / python / framework / understance / rag /
Menutupi lima tahap kunci: memuat, indeksikan, penyimpanan, mencari dan menilai。
Tutorial Starter LlamaIndek
Taut:https: / / developmenters.llamagindex.ai / python / framework / getting starter / starter contoh /
MEMBANGUN SISTEM RAG TANPA KODE GARIS KURANG DARI 30。
Langchain Tutorial Untuk Pemula (2026 Guide) (Youtube, gratis)
Taut:https: / / www.youtube.com / watch? v = AOQyRiwydyo
Kompleks 2026 LangChain meliputi Agen, RAG dan Framework RectAgent untuk Data-berbasis Konstruksi Al Act。
Membangun Aplikasi RAG Efisien dengan Langchain dan LlamaIndex (Youtube, gratis biaya)
Taut:https: / / www.youtube.com / watch? v = D7YwcDJ75lQ
Perbandingan horisontal penggunaan Langchain dan LlamaIndex dalam adegan RAG oleh kasus kode nyata。
Cara memilih Framework AI Argentina (LlamaIndex)
Taut:https: / / workforcenext.in / blog / how -to-choose- a- agent- framework /
Diterbitkan pada April 2026. Proposal ini untuk menggunakan LlamaIndex jika yang paling sulit adalah untuk mengambil; dan Langchain / LangGraph jika Anda membutuhkan kemampuan ekologi dan produksi yang lebih luas。
Enam, Biaya Token dan Manajemen Anggaran: Tidak ada yang akan memberitahu Anda apa-apa sampai tagihan tiba
Pada tingkat panggilan tunggal, mungkin ada jeda 30 kali lipat biaya antara model berbiaya rendah dan model garis depan。
Jika Anda menyebut GPT-5.5 atau Claude Sonet 4.6 untuk setiap aplikasi produksi, RUU kemungkinan untuk memperluas dari $20 sampai ratusan dolar per bulan sebelum Anda menyadarinya。
Hal ini diduga bahwa Uber hanya menghabiskan empat bulan di 2026, melelahkan anggaran AI untuk sepanjang tahun karena penggunaan luas sesi Claude Code。
Logika matematika sederhana: panjang konteks meningkatkan biaya linear. Dan jika Claude Code diberikan perpustakaan kode penuh, itu akan segera terkumpul untuk 250.000 sampai 500.000 token。
Aturan manajemen biaya praktis
Atur tutup pengeluaran terlebih dahulu
Mengatur batas bulanan di backstage OpenAI dan Anthropic sebelum fungsi AI apapun online bagi publik. Lakukan sebelum kau online, tidak setelah kau online。
Model pengubahan berdasarkan kompleksitas tugas
Klasifikasi, label, ringkasan dan pemformatan tugas dapat dilakukan dengan claude- haiku atau gpt-5.5-mini. Hanya tugas dengan penalaran yang lebih sulit disediakan untuk Sonnet 4.6, Opus 4.6 atau GPT-5.5。
Untuk tugas sederhana, model murah cenderung memberikan keluaran dengan kualitas yang hampir sama, tapi harganya mungkin 10 kali berbeda。
Gunakan / compact compact command dalam Claude Code
Secara manual dijalankan / kompak sebelum tugas besar dimulai ketika konteks menjadi lebih lama. Claude Code secara otomatis mengkompres riwayat konteks, biasanya 60% -80%, secara signifikan mengurangi jumlah token yang akan disebut waktu berikutnya。
Jaga Jendela Konteks Singkat
Biaya dua kali lipat panjang konteks juga akan kira-kira dua kali lipat. Dalam mengembangkan fungsi baru, akan lebih baik untuk membuka dialog baru daripada melanjutkan yang lama。
Cache Sama Mengulangi Frase
Anthropic yang cepat menangkap hanya 10% harga dibebankan untuk masukan ke dalam cache. Hal ini akan menyebabkan tabungan signifikan selama jangka waktu yang lama untuk petunjuk sistem atau file CLAUDEMD yang diulang setiap panggilan。
Organisasi
atur alarm penagihan ketika 50% dan 80% dari skala bulanan dicapai untuk menghindari bug atau loop panggilan untuk menjalankan tagihan tak terduga sebelum anda menemukannya。
Sumber Daya
MindStudio: Manajemen Anggaran Al Agen Token dalam Claude Code
Taut:https: / / www.studio.ai / blog / a- agen-to-budge- manajements -claude- code /
Terpisah total penanganan Claude Kode dari anggaran token, termasuk keterbatasan konteks kaku, kompresi otomatis pada ambang batas yang dapat diubah dan pemeriksaan anggaran sebelum implementasi untuk operasi mahal. Model ini juga dapat diterapkan untuk produk LLM apapun。
HackerNews:
Taut:https: / / news.ycompinator.com / item? id = 4776415
Proyek sebenarnya membahas bagaimana panjang jendela konteks dalam sesi Claude Code hampir linear mendorong biaya dan memberikan jumlah yang tepat。
HatchWorks: Coding Vibe Real Costa tahun 2026
Taut:https: / / chatchworks.com / blog / gendd / cost-of -vibe-coding /
Sebuah perkiraan lebih jauh dari total biaya Vibe Coding: biaya langganan yang jelas bisa $20- 200 per bulan, tapi biayanya bisa $5.000- $30.000 jika perbaikan keamanan, utang teknis dan rekayasa profesional sudah diperhitungkan. Untuk memahami itu, kita bisa menilai berapa banyak QA dan struktur proses yang layak diinvestasikan。
Dashboard Penggunaan OpenAI (resmi)
Taut:https: / / platform.openai.com / using
Atur batas bulanan di sini sebelum akses terbuka. Pintu masuk ke Billing, Penggunaan Terbatas。
Konsol Anthropic
Taut:https: / / console.antropic.com /
Claude API juga perlu diatur di sini。
Bulan 5 tonggak
Pada akhir bulan, Anda harus mampu:
MENGATUR PROYEK DARI AWAL SEHINGGA AI SELALU MENDAPAT KONTEKS YANG TEPAT
Hubungkan Kursor atau Claude Code ke sumber data eksternal menggunakan MCP
Fungsi AI terintegrasi bagi produk daring menggunakan Vercel AI SDK
MEMBANGUN PIPA DASAR RAG YANG MEMUNGKINKAN AI MENJAWAB PERTANYAAN BERDASARKAN DOKUMEN
MENGATUR PEMANTAUAN BIAYA AKTIF DAN PENGELUARAN TUTUP BAGI SETIAP AKUN AI API
Menjaga struktur bersih / docs sehingga alat AI apapun dapat memahami proyek segera。
Bulan 6: menyebarkan seperti profesional dan memilih orientasi profesional Anda
Tujuan untuk bulan ini adalah untuk memungkinkan proyek Anda untuk mencapai tingkat produksi ketersediaan dan untuk memilih arah mereka sendiri. Penyebaran nyata, pengawasan nyata, produksi pendapatan nyata, sementara menemukan jalan profesional yang cocok dengan tujuan Anda。
1. Produksi penyebaran dan konfigurasi lingkungan
Jarak penyebaran antara Demo dan produk produksi sangat besar. Yang paling penting dari ini adalah pemisahan lingkungan pembangunan dan produksi。
Disarankan penyebaran teknologi gudang pada 2026
Situs web statik atau halaman pendaratan
Ujung depan dikerahkan di Vercel atau Netlifty dan tak diperlukan ujung belakang. Hal ini dapat dikerahkan dari kunci GitHub satu。
Aplikasi stack penuh dengan otentikasi dan basis data
Frontend, Vercel, backend, Supbase. Ini gudang teknologi yang paling direkomendasikan untuk pemula。
Kompleks back- end logika
Antarmuka memakai Vercel, backend memakai Supbase, dan tugas perhitungan diproses melalui EdgeFunctions. Hal ini akan memungkinkan ekspansi tanpa server sewaan。
Kendali penuh server
Backend menggunakan Fly.io atau Railway, dan di ujung depan dapat mencocokkan pilihan apapun. Kontrol lebih kuat, tapi lebih kompleks。
Sumber Daya
Supabese: Panduan Vibe Coder ke Lingkungan
Taut:https: / / subbase.com / blog / the-vibe-coders -guide -to -subbase- lingkungan
Konten wajib untuk penyebaran aman produksi mencakup perbedaan antara lingkungan pembangunan dan lingkungan produksi, migrasi basis data dan strategi rollback。
Tambahkan Jam: Cara Menyebarkan Proyek Vibe Anda
Taut:https: / / addjam.com / blog / 2026-04-07 / how -to -deployal -your -vibe- coded- project /
Panduan penyebaran bagi pengguna non-teknis akan membantu Anda untuk memilih penyebaran yang sesuai menurut tipe proyek dan akan diterbitkan pada April 2026。
Menyebarkan Vibe Anda Proyek Kerja untuk Bebas dengan Vercel dan Netlifty (YouTube, gratis biaya)
Taut:https: / / www.youtube.com / watch? v = 85JVKjw-uG0
Dari GitHub ke kursus langkah demi langkah di Vercel dan Netlifty。
Dokumen Pertahanan Vercel
Taut:https: / / vercel.com / docs / deprove / overview
Dokumen Pemasangan Kantor Vercel, berisi penyebaran pratilik, manajemen variabel lingkungan dan konfigurasi nama domain。
Kontrol produk online Anda
Dalam lingkungan produksi, masalah tak terlihat tidak dapat diperbaiki. Tiga alat berikut ini akan memberikan gambaran lengkap tentang apa yang pengguna alami dan apa yang aplikasi Anda lakukan。
Sumber Daya
Langfuse (sumber terbuka, level bebas)
Taut:https: / / langfuse.com /
LLM Observable Platform. Ini melacak setiap panggilan AI: apa yang dikirim, apa yang diterima, penggunaan token, penundaan, biaya dan kesalahan. Dukungan untuk OpenAI, Anthropic dan Langchain. Pada tahun 2026, alat ini menjadi salah satu alat standar untuk memantau aplikasi AI。
Cara Memantau Aplikasi AI Anda dengan Langseus
Taut:https: / / www.youtube.com / watch? v = V7nutySdrgw
Kursus penuh untuk menggunakan OpenTelmetry untuk mengatur Langseus di lingkungan lokal dan produktif, diterbitkan pada bulan Maret 2025。
Langseus + Free Resmi Guide
Taut:https: / / langfuse.com / docs / observability / sdik / progreced-features
Sebuah deskripsi bagaimana mengirim data pengawasan bug ke Sentry dan menangkap data LLM-observable menggunakan Langfuse. Sebuah konfigurasi tunggal dapat membentuk lengkap produksi pemantauan teknologi gudang。
(resmi, tingkat bebas)
Taut:https: / / sentry.io /
Terapkan suatu alat standar untuk pelacakan bug. Ini dapat digunakan secara online untuk menginformasikan kesalahan pada contoh pertama, daripada menunggu umpan balik dari pengguna。
Analisis Vercel (resmi, bebas biaya)
Taut:https: / / vercel.com / docs / analytics
Vercel 's built-in website analisis alat, diaktifkan dengan satu kunci. Anda dapat melihat tampilan halaman, indikator kinerja dan Core Web Vital。
3. Pilih arah Anda
Pada bulan keenam, Anda telah memiliki keterampilan dasar. Pertanyaan berikutnya adalah: arah mana kau akan masuk
Ada tiga jalan yang layak, dan Anda perlu memilih salah satu yang terbaik sesuai tujuan Anda。
Arah 1: Pembangun produk, yaitu Indie Hacker
Cocok untuk masyarakat: pendiri independen, pengusaha, pengembang independen, dan orang-orang yang ingin membangun dan menjual produk mereka sendiri。
Ini adalah Vibe Code yang paling umum. Anda tidak mencari pekerjaan, tapi Anda menerbitkan produk yang menghasilkan pendapatan。
2026 Indie Hacker Polyteknic
Loable atau Bolt: untuk pengembangan prototipe cepat dan validasi awal
Kursor 3.0 + Claude Code: untuk konstruksi formal dan penyesuaian kedalaman
Supbase: Basis Data dan akreditasi
Stripe: Pembayaran
Vercel: penyebaran
PostHog: Analisis pengguna。
Tipe dari aplikasi variabel dari keprihatinan pada 2026
Alat Mikrotool SaaS
Hanya satu masalah yang sangat spesifik diselesaikan, dengan berlangganan $5- 25 per bulan。
Pembungkus AI
SEBUAH KEMAMPUAN LLM TERTENTU DIKAPSUL DALAM JELAS, SPESIFIK, SUB-PASAR UI。
Direktori atau platform pasar
Tidak dapat memperoleh pesan:% s% s。
Perkakas in- rumah Enterprise
Automasi pekerjaan yang sedang dilakukan secara manual oleh perusahaan menggunakan formulir。
Sumber Daya
Indie Hacker (komunitas bebas)
Taut:https: / / www.indiehackers.com /
Pendiri sebenarnya berbagi data pendapatan, catatan bangunan dan pelajaran yang dipelajari. Ini adalah salah satu sumber informasi sinyal tinggi tentang apa yang benar-benar menjual dan harga。
Dokumen Stripe: Quickstart Pembayaran
Taut:https: / / stripe.com / docs / pembayaran / cepat mulai
Panduan resmi tentang bagaimana menambahkan Stripe Checkout untuk pembayaran satu waktu dan subscriptions. Anda dapat memiliki AI "berlangganan untuk integrasi dari dolar X per bulan" dan kemudian menggunakan panduan ini untuk memverifikasi apa yang dihasilkan。
PostHog Memulai
Taut:https: / / posthog.com / docs
Alat analisis produk open source. Anda dapat melacak perilaku pengguna, mengkonversi corong, mempertahankan dan fungsi switch, sehingga Anda tahu apa yang benar-benar bekerja。
ARAH 2: INSINYUR PRODUK AI
SESUAI DENGAN POPULASI: ORANG-ORANG INGIN MEMASUKI SEBUAH PERUSAHAAN START- UP ATAU SEBUAH PERUSAHAAN TEKNOLOGI UNTUK PENGEMBANGAN PRODUK AI。
Sebuah koleksi karya ke arah ini
buat produk "chatting dengan doktermu"。
PENGGUNA DAPAT MENGUNGGAH 10-20 BERKAS PDF DAN MEMINTA IZIN UNTUK MENGAJUKAN PERTANYAAN BERDASARKAN DOKUMEN INI DAN MENDAPATKAN JAWABAN DENGAN SUMBER KUTIPAN. INI HARUS MENJADI APLIKASI SKALA PENUH, DIKERAHKAN DAN BERSAMA。
Pada tahun 2026, ini adalah salah satu koleksi sinyal tertinggi Anda dapat menunjukkan karyawan atau klien。
Sumber Daya
LlamaIndex: Investasi RAG
Taut:https: / / developmenters.llamagindex.ai / python / framework / understance / rag /
Membangun salah satu jalan tercepat untuk pertanyaan dokumen dan sistem jawaban。
Akademi LangChain: Pengantar ke LangGraph
Taut:https: / / akademisy.langchain.com / course / intro- to-langgrap
LangGraph resmi bebas biaya. LangGraph adalah salah satu frameworks Agen mainstream, meliputi manajemen negara, memori, loop partisipasi manusia dan beberapa kolaborasi Agen。
Vercel AI SDK (dokumen resmi bebas biaya)
Taut:https: / / sdk.vercel.ai / docs
A few codes can be used for any Next.js application to add streaming chats, structured generation and tool call capabilities. Dukungan untuk lebih dari 20 penyedia AI。
Koding Vibe ke Agency AI: Evolusi Berikutnya Programme
Taut:https: / / www.youtube.com / watch? v = LHAvPwolz8U
Sebuah gambaran bagaimana area ini bergerak dari Vibe Coding acak ke sistem terstruktur yang mampu dari perencanaan otonom, implementasi dan validasi. Ini juga arah di mana pasar pekerjaan bergerak。
Apa itu Badan Teknik
Taut:https: / / www.mindstudio.ai / blog / what--is-attic- engineering /
Jelas penjelasan transisi dari Vibe Coding ke Badan Teknik. Pada tahun 2026, ini adalah paradigma kompetensi di mana banyak majikan merekrut。
DIRECTION III: AI AUTOMATION ADVISER
Orang-orang yang ingin melayani perusahaan segera, termasuk pekerja lepas, konsultan atau mereka yang ingin mendirikan perusahaan jasa agensi。
Perusahaan bersedia membayar uang nyata untuk otomatisasi AI karena dapat menggantikan proses yang mahal, berulang-ulang, manual. Ini adalah salah satu jalan tercepat membayar ke Vibe Coding keterampilan。
Adegan otomatisasi yang paling umum dan berharga
PENYORTIRAN AL MAIL DAN RESPON OTOMATIS
Pemutaran potensial klien dan jangkauan individual
Ekstraksi dan pengolahan dokumen
Sebuah robot pelanggan berdasarkan dasar pengetahuan
MELENGKAPI DATA CRM DAN PEMBERSIHAN
Pengalihan suara dan kontrak。
Sumber Daya
dokumentasi n8n (bebas, open source)
Taut:https: / / docs.n8.io /
Alat otomatisasi mengalir kerja tervisualisasikan, asli mendukung node AI. Anda dapat menghubungkan LLM dengan lebih dari 400 integrations, termasuk Slack, Gmail, Notion, HubSpot, Airtable, dll. Versi hosting benar-benar gratis。
9n Full Course; 6 Hours (YouTube, gratis)
Taut:https: / / www.youtube.com / watch? v = QoQBzR1NIqi
Kursus n8n penuh meliputi automatisasi arus kerja AI dari primer ke tingkat lanjut。
Membuat
Taut:https: / / www.make.com /
Visualisasi platform otomatis. Untuk multi- langkah yang kompleks mengalir, itu lebih kuat dari Zapier。
Automatisasi Builders: Vibe Coding to Agency AI (YouTube, gratis)
Taut:https: / / www.youtube.com / watch? v = LHAvPwolz8U
Keterangan tentang bagaimana pembuat otomatis menggabungkan n8n, OpenAI dan Vibe Coding alat dengan end-to-end proses otomatisasi perusahaan。
Sebuah koleksi karya ke arah ini
Bangun proses akhir-to-end otomatis untuk pencitraan potensial pelanggan dan jangkauan:
Petunjuk impor dari CSV atau Airtable
MENGGUNAKAN LLM UNTUK MEMPELAJARI SETIAP PELANGGAN POTENSIAL DAN MENENTUKAN KECOCOKAN SESUAI DENGAN CITRA PELANGGAN YANG DIINGINKAN
rating dan menyortir untuk memimpin
Menggambar pesan jangkauan pribadi dengan nada lain
Tulis semua hasil dan status, catatan kembali ke tabel asli。
Ini adalah proyek otomatisasi yang dapat dibuat dengan biaya yang harus dibayar oleh bisnis。
Feeding: mengembangkan aplikasi mobile dengan Coding Vibe
Semua isi sebelumnya digagalkan pada aplikasi Anda membangun Web. Kebanyakan Vibe Coder melakukan hal yang sama。
Tapi jika ide Anda adalah aplikasi mobile, yaitu produk yang perlu dipasang pengguna pada ponsel, itu berbeda. Sebelum awal bulan pertama, perlu memahami ekologi ini。
Status sebenarnya dari 2026 moving end
Perkembangan bergerak lebih sulit daripada pengembangan Web. Alasannya sangat spesifik: Rect Alam tergantung pada lebih besar dan lebih rentan pohon. AI kadang-kadang menghasilkan kode yang mengasumsikan bahwa beberapa versi paket kompatibel, tapi versi aktual mungkin konflik; iOS dan Android simulator membutuhkan konfigurasi lokal dan AI tidak dapat sepenuhnya dikelola untuk Anda; pengujian UIs mobile baik membutuhkan mesin nyata atau simulator tidak dapat dilihat langsung dalam browser seperti Web; Expo secara signifikan simplifys proses tetapi memperkenalkan keterbatasan sendiri。
Bila Anda ingin membangun aplikasi seluler, konfigurasi yang disarankan adalah:
Frame: Reaksi Alam + Express, bekerja
Tool chain: Expo Router for navigation, based on file route, similar to the Next.js App Router model
Al tools: Claude Code + Cursor, alat yang sama seperti Web, yang mendukung React Nature dengan baik
templat awal: npx create- expo- app atau create- rn- baru untuk menghasilkan scaffolds yang dikonfigurasi
Pratilik: Loop umpan balik tercepat adalah pratilik Express Go App pada telepon fisik melalui kode dua dimensi。
Sumber Daya
Vibe Coding a Mobile App from 0 to Market
Taut:https: / / www.youtube.com / watch? v = SzmXEOzpFg
Sebuah demonstrasi lengkap bagaimana membangun aplikasi pelacakan kebugaran dari nol menggunakan Claude Code + Cursor + React Nature + Express Router. Isi meliputi Figma-to-spec jalan-jalan, Claude Kode fase, dan bagaimana menangani Expo ketergantungan secara real time。
Membangun App Alam Berlatar dengan Koding Vibe pada tahun 2026
Taut:https: / / blog.vibecoder.me / bid- react- nate- app- vibe- coding
Presentasi langkah-langkah langkah pada pengaturan proyek Expo, menulis proyek singkat dan menggunakan Claude Code untuk mengimplementasikan Pasal rencana build aplikasi mobile。
Rect Nature Vibe Code SDK (free, open source)
Taut:https: / / github.com / react-native-vibe-code / react-native-vibe- code-sdk
IDE open source yang dirancang untuk pembangunan aplikasi React Nature and Expo melalui tips bahasa alami. Hal ini dapat dipahami sebagai alat terdekat untuk Loveable dalam pengembangan mobil- end。
Dokumentasi Expo
Taut:https: / / docs.expo.dev /
Konfigurasi Expo, Router dan peralatan acuan API. Disarankan bahwa dokumen ini dibuka dalam peramban saat menggunakan alat AI。
Saran yang paling penting adalah menempelkan contoh-contoh folder dari pustaka Expo ke Google AI Studio setiap kali Anda mulai memindahkan sesi AI sehingga Gemini dapat menggunakan jendela konteks untuk menghasilkan dokumen berdasarkan contoh-contoh ini. Kemudian gunakan dokumen dalam petunjuk, daripada mengharapkan model untuk mengetahui API saat ini。
API DARI TERMINAL SELULER BERUBAH DENGAN CEPAT, DAN PELATIHAN DATA BIASANYA TERTINGGAL DI BELAKANG KENYATAAN。
Feeding: peta alat lengkap - semua alat utama yang ada pada tahun 2026
Panduan ini merekomendasikan Cursor 3.0 dan Claude Code sebagai alat utama. Pada tahun 2026, bagaimanapun, grafik alat lengkap telah diperluas secara signifikan dan berbagai alat yang berbeda cocok untuk skenario yang berbeda. Ini gambar yang lebih lengkap。
Terminal / CLI Agen
Claude Code
Pengawas terminal Anthropic. Ini yang terbaik untuk full-code repositori penalaran dan warehouse tingkat tugas。
Gemini CLI
Open-source terminal untuk Google. Alternatif bebas untuk Claude Code memiliki jendela konteks besar。
Kode Terbuka
Agen CLI Open Source. Model portabel, biaya lebih fleksibel。
Droid Pabrik
Agen rekayasa perangkat lunak Autonomus, untuk perusahaan CI / CD otomatisasi。
Di antara mereka, Gemini ClI layak disebutkan khusus karena benar-benar bebas dan terbuka. Ini menggunakan 1 juta token jendela konteks Gemini 3.5 Pro, yang lebih besar dari Claude Code。
Instalasi:
@ google / gemin- cli
Kemudian jalankan:
gemini
dapat digunakan. Anda dapat menggunakannya sebagai alternatif bebas untuk misi berbasis konteks, atau Anda dapat menggunakannya sebagai peninjau kedua bukannya langkah "tangan menempel Gemini" dalam empat bulan aliran kerja。
Codex OpenAI, Agen Enkoder Awan baru, alih-alih model lama, kini tersedia sebagai Agen Tersandi Awan dalam ChatGPT dan melakukan tugas yang berbeda. Ini berbeda dari Claude Code: naskah kuno berjalan di awan, bukan lokal. Anda dapat mengakses melalui batang samping ChatGPT。
DAFTAR EKSTENSI IDE PEMROGRAMAN AI
Kursor 3.0
Mendukung Windows Agens dan Agen Awan paralel. Versi gratis / $20 per bulan。
Windsurfing
Cascade Agent, yang diperoleh oleh Google, lebih kewirausahaan. Free versi / $15 per bulan。
Kopilot GitHub
Hampir di mana-mana, VS Code, Jetbrains, Xcode, Neovim. Versi gratis / $10 per bulan。
Cline
Open source, bawa modelmu sendiri. Gratis dan dibayar oleh tablet API。
Google Antigravity
Ada banyak Agent Manager View, yang dapat dibangun secara paralel. Harga harus ditentukan。
Zed
PERFORMANCE FIRST, ORIGINAL TO AI FROM THE BEGINNING. BEBAS。
Kode Kilo
Plugin VS Code, open source, mendukung semua penyedia arus utama. Bebas。
Lanjutkan
Alternatif Open Source Copilot, Dukung VS Code and Jetbrains. Bebas。
Sumber Daya
Datacamp: Perkakas Gedung Top 15 untuk Membangun Master di 2026
Taut:https: / / www.datacamp.com / blog / top- vibe-coding- tools-to -build-faster
Salah satu alat yang paling lengkap pada tahun 2026, meliputi Agen CLI, AI IDE, pembuat peramban dan alat khusus. Ini memberikan saran singkat bahwa peramban harus memberikan prioritas untuk v0, editor untuk Codex, skenario full- daya untuk Cursor, dan terminal ke Claude Code。
The Ultimate Vibe Coding Guide (Tutorial Full Court 2026) (Youtube, gratis)
Taut:https: / / www.youtube.com / watch? v = KO vCL1 Zhpi
kursus 3 Jam, satu kali cakupan Cursor, Codex, Antigravity, Claude Code, Loveable, Bolt, Supabese, Vercel, Figma Stitch, V0 dan MCP servvers. Pada Mei 2026, itu adalah salah satu sumber daya video yang paling lengkap。
Full Course 2026 (Youtube, gratis)
Taut:https: / / www.youtube.com / watch? v = BpOsHF5Oj I
Jelaskan cara membangun aplikasi Web, aplikasi desktop dan aplikasi iOS dari pustaka kode yang sama menggunakan Codex dan Firebase. Diterbitkan pada Mei 2026. Mereka cocok untuk pemula yang ingin mencakup beberapa platform, tetapi tidak ingin beralih toko teknologi sering。
Makan: masyarakat layak bergabung
Pembelajaran tercepat sering terjadi di komunitas di mana orang berbagi secara langsung apa yang mereka bangun. Berikut ini adalah komunitas yang masih aktif pada pertengahan 2026。
Loveable Discord (bebas biaya)
Taut:https: / / lovable.dev / community
Dengan lebih dari 160.000 anggota, mencakup semua zona waktu, adalah salah satu yang paling aktif Vibe Coding komunitas pada 2026. Bantuan real--time, aktivitas mingguan, dan saluran layar proyek online。
r / vibecoding (bebas dari charge, Reddit)
Taut:https: / / www.reddit.com / r / vibecoding /
Vibe Coding Community Gathering. Berikut adalah presentasi proyek, perbandingan alat, bantuan debug, dan kisah nyata dari kegagalan yang tidak dapat Anda lihat di YouTube。
Forum Kursor (komunitas bebas resmi)
Taut:https: / / forum.cursor.com /
Kursor resmi komunitas, di mana tim teknik akan membaca dan merespon. Poster "Dibangun dengan Kursor" adalah salah satu sumber terbaik untuk menemukan kasus-kasus proyek nyata dan memahami kesulitan praktis。
Build di Strategi Publik bagi Kode Vibe
Taut:https: / / www.youtube.com / watch? v = ke6oxy8Z7C4
Open Building Strategy Guide for Vibe Code: Apa yang harus diposting, kapan, bagaimana mengubah proses konstruksi proyek menjadi target penonton, dan bagaimana mempercepat rilis berikutnya。
Postiv AI: Kode Vibe ke Baris pipa SaaS
Taut:https: / / postiv.ai / blog / vibe- coding- mark
Mengurusi proses lengkap setelah produk selesai: memvalidasi model bisnis, mengembangkan strategi penyebaran, dan menggunakan LinkedIn dan X untuk mendistribusikan produk yang sudah Anda miliki secara online。
Karo Zieminski: Vibe Coding Hub 2026 (gratis, Substack)
Taut:https: / / karozieminski.subserac.com / p / vibecodinging -revences -hub
Rekam lebih dari 15 hands-on panduan meliputi Vibe Coding, spesifik pengembangan didorong dan AI mendukung pembangunan produk, jalur pembangunan lengkap: dasar, produksi, keselamatan, debug dan pilihan alat. Ini adalah salah satu yang lebih lengkap tunggal halaman pusat sumber daya pada Substack。
0xMinds: Panduan Lengkap untuk Pengembangan Daya-Daya
Taut:https: / / 0xminds.com / blog / guide / vibe-coding- komplit-guide -2026
Panduan lengkap 2026 meliputi penggunaan data, enam tahap dari alur kerja konstruksi, yaitu konseptualisasi dari generasi konteks, ulasan publikasi teroptimalkan, dan beberapa Agen layouts dan akses langsung ke daftar konfigurasi dasar。
Kode Augment: Vibe Coding vs Spec-Driven Development (pemandu gratis)
Taut:https: / / www.augmentment code.com / guide / vibe-coding- vs- spec- diven- development
Untuk menyediakan decision yang jelas - membuat kerangka untuk membantu menilai ketika sesuai untuk Coding Vibe murni dan ketika spesifikasi harus digunakan untuk mendorong pengembangan. Artikel ini juga menggambarkan "dinding tiga bulan" yang umum bagi projek Coding Vibe dan bagaimana mengidentifikasi kapan untuk beralih mode。
Bagaimana menggunakan peta jalan ini
Kebanyakan orang yang membaca artikel ini tidak akan benar-benar menyelesaikannya. Bukan karena isinya terlalu sulit, tapi karena mereka menganggapnya sebagai daftar bacaan daripada sebagai rencana konstruksi。
Vibe Coder, sukses sejati pada tahun 2026, biasanya memiliki tiga kebiasaan:
Mereka menerbitkan produk, bukan hanya belajar。
SETIAP BULAN MILESTONE HARUS BERAKHIR DENGAN PROYEK YANG DIKERAHKAN, URL NYATA DAN DIAKSES, DARIPADA KURSUS SELESAI. ENAM TIDAK SEMPURNA TETAPI PRODUK DITERBITKAN OUTNUMBER 20 KURSUS SELESAI。
Mereka dibangun di depan umum。
Publishs proses membangun Anda di X, LinkedIn atau platform target pengguna. Sebagai contoh, "Hari pertama membangun X" dan "Saya di X, ini adalah apa yang saya pelajari". Kesempatan terbaik di daerah ini biasanya datang dari visibilitas daripada dari CV。
Mereka menyusut pertama, kemudian mereka melebar。
Hanya satu alat yang dipilih dalam enam bulan pertama, seperti Cursor atau Claude Code, sebuah gudang teknologi, seperti Next.js + Supabese + Vercel, dan sebuah arah, seperti pembuat produk, Al insinyur atau konsultan otomatis. Lebih dalam dari lebar. Ketika Anda benar-benar menerbitkan tiga hal, Anda memperluas lingkup。
Artikel ini disusun oleh penulis berdasarkan catatan enam bulan dan jalur praktek pribadi dan diedit oleh AI Model Minimax dan Opus 4.6。
[Terkekeh]Tautan Asli]
