Membuat aplikasi dengan Claude Code: tutorial iPhone
Oleh Mehdi Azizi
Diperbarui , 15 mnt
Instal Claude Code, buat proyek Expo, tulis CLAUDE.md, beri prompt per layar, lalu kirim ke TestFlight dengan EAS: tutorial lengkapnya.
Membuat aplikasi dengan Claude Code: jawaban singkatnya
Untuk membuat aplikasi dengan Claude Code, kamu butuh akses berbayar ke Claude Code (langganan yang kompatibel atau Console dengan bayar sesuai pemakaian), Node.js, iPhone dengan Expo Go, dan proyek Expo. Kamu menulis file CLAUDE.md yang menjelaskan stack dan aturanmu, meminta satu layar setiap kali, menguji tiap layar di iPhone, lalu mengirim aplikasinya ke TestFlight dengan EAS.
Tutorial ini melengkapi panduan saya membuat aplikasi iOS dengan AI, yang menjelaskan apa yang dikerjakan AI dengan baik dan apa yang sering meleset. Di sini kita langsung praktik: perintah, file, dan prompt.
Saya menulis kode aplikasi iOS saya dengan Claude Code dan Cursor setiap hari. Stack saya: React Native, Expo, EAS, RevenueCat, dan Supabase. Solys, alarm dengan mini-game, dan TradaZen, aplikasi latihan trading, sudah terbit di App Store. Nolera dan Clic pernah ditolak Apple, lalu diperbaiki. Semua yang ada di bawah ini berasal dari pekerjaan itu.
Kalau ingin melihat metode ini diterapkan pada aplikasi yang sudah terbit, saya sudah mendokumentasikan perjalanan TradaZen, dari commit pertama sampai penolakan Apple dan perubahan arah. Pengalaman nyata ini melengkapi langkah-langkah di tutorial.
Langkah 1: siapkan prasyaratnya
Sebelum perintah pertama, pastikan kamu punya semua ini.
Akun Claude berbayar
Claude Code tidak termasuk dalam paket gratis claude.ai. Menurut dokumentasi Anthropic, kamu butuh akun Pro, Max, Team, Enterprise, atau Console. Paket Pro sudah cukup untuk mulai, dalam batas pemakaiannya.
Node.js dan terminal
Expo membutuhkan Node.js versi LTS, di macOS, Windows, atau Linux. Claude Code berjalan di macOS 13 ke atas, Windows 10 ke atas, dan distribusi Linux utama.
iPhone dan Expo Go
Instal Expo Go dari App Store di iPhone-mu untuk mencoba layar pertamamu tanpa mengompilasi aplikasimu sendiri. Sebelum membuat proyek, cek versi SDK yang kompatibel dengan instalasimu di halaman Expo Go. SDK terbaru dan versi yang didistribusikan di App Store tidak selalu tersedia bersamaan: Expo misalnya sudah mendokumentasikan selisih ini pada Mei 2026. Jadi jangan berpatokan pada nomor versi dari tutorial lama. Untuk memakai modul native milikmu sendiri, siapkan development build.
Mac? Tidak wajib
Build iOS dikompilasi di server Expo dengan EAS Build, memakai versi Xcode yang dipilih oleh SDK Expo-mu (ITMS-90725), dan EAS Submit berjalan di macOS, Linux, dan Windows. Jadi kamu bisa sampai ke TestFlight dari PC. Panduan menerbitkan aplikasi iOS tanpa Mac menjelaskan alurnya secara detail.
Akun Apple Developer, nanti saja
Kamu belum butuh akun ini untuk coding dan menguji di Expo Go dari App Store. Akun ini jadi wajib saat kamu mengirim aplikasi ke TestFlight. Kita bahas lagi di langkah 7.
Langkah 2: instal Claude Code
Di macOS, Linux, atau WSL, cara yang direkomendasikan Anthropic adalah installer native:
curl -fsSL https://claude.ai/install.sh | bash
Di Windows, lewat PowerShell:
irm https://claude.ai/install.ps1 | iex
Lalu pastikan instalasinya berhasil:
claude --version
Kalau kamu lebih suka npm, perintahnya npm install -g @anthropic-ai/claude-code. Jangan pakai sudo di depannya, dokumentasinya secara tegas tidak menyarankannya.
Saat pertama kali menjalankan claude, browser akan terbuka agar kamu masuk ke akunmu. Setelah itu, kamu cukup menulis dalam bahasa Indonesia: Claude membaca file-filemu, mengusulkan perubahan, dan menjalankan perintah, dengan persetujuanmu.
Langkah 3: buat proyek Expo
Masuk ke folder tempat kamu menyimpan proyek, lalu jalankan:
npx create-expo-app@latest my-app
cd my-app
npx expo start
Kalau tool-nya menawarkan pilihan antara kompatibilitas dengan Expo Go dari App Store dan SDK terbaru, pilih kompatibilitas untuk latihan ini. Apa pun pilihannya, pastikan versi yang dibuat didukung oleh Expo Go yang terpasang di iPhone-mu sebelum lanjut. Kamu bisa menyiapkan development build nanti saat proyekmu membutuhkannya.
Sebuah kode QR muncul di terminal. Pindai dengan kamera iPhone-mu: aplikasinya terbuka di Expo Go. Ada satu hal yang sering bikin macet di awal: Expo Go hanya membuka proyekmu kalau Expo CLI dan Expo Go masuk ke akun Expo yang sama. Jalankan npx expo login di komputermu dan masuk dengan akun yang sama di aplikasinya.
Kenapa Expo, bukan Swift? Claude sangat paham React Native, dan kamu bisa menguji tanpa Mac. Saya menjelaskan pilihan ini di halaman React Native dan Expo untuk aplikasi mobile.
Ingat satu batasan Expo Go: aplikasi ini hanya berisi modul native yang sudah dibawanya. Begitu kamu menambahkan library native yang tidak dikenalnya, misalnya pembelian dalam aplikasi, kamu butuh development build. Untuk layar-layar pertama, ini bukan masalah.
Pilih lingkungan uji yang tepat
Expo Go, development build, dan TestFlight tidak membuktikan hal yang sama. Expo menggambarkan development build sebagai aplikasi uji milikmu sendiri, lengkap dengan modul native yang dibutuhkan proyekmu.
| Yang ingin kamu cek | Tempat menguji | Batasan pengujiannya |
|---|---|---|
| Menampilkan layar pertama dan mencoba navigasinya | Expo Go, dengan SDK yang kompatibel | Perilaku modul native yang tidak ada di Expo Go |
| Memakai library native yang ditambahkan ke proyek | Development build yang menyertakan library tersebut | Versi yang didistribusikan maupun diterima atau tidaknya oleh Apple |
| Menjelajahi aplikasi untuk penguji, lalu menguji pembeliannya | Build yang dikirim ke TestFlight dan produk yang dikonfigurasi benar | Pembayaran nyata dari pelanggan atau persetujuan untuk dijual |
Sebelum menambahkan dependensi, tanya Claude: "Apakah ini kompatibel dengan SDK dan lingkungan ujiku saat ini? Apakah aplikasinya perlu dikompilasi ulang? Dasarkan jawabanmu pada dokumentasi." Dengan begitu kamu tidak menghabiskan semalaman membetulkan modul yang memang tidak bisa dimuat Expo Go, atau SDK yang ditolak saat pengiriman karena API non-publik.
Langkah 4: tulis file CLAUDE.md proyek
Ini langkah yang paling menguntungkan. Claude Code bisa menyimpan memori proyek, tapi kamu harus menuliskan aturannya secara eksplisit. File CLAUDE.md, yang diletakkan di root proyek, memberi instruksi yang berlaku di semua sesi. Di situlah kamu menulis hal-hal yang tidak bisa ditebak Claude.
Di folder proyek, jalankan claude, lalu ketik /init. Menurut dokumentasinya, Claude menganalisis proyek dan membuat CLAUDE.md pertama berisi perintah dan konvensi yang ditemukannya. Setelah itu kamu melengkapinya dengan aturanmu. Anthropic menyarankan agar file ini tetap di bawah 200 baris: makin panjang filenya, makin sedikit instruksi yang diikuti.
Ini contoh singkat, mirip dengan yang saya pakai:
# My app
## Stack
- Expo (SDK dari create-expo-app), React Native, TypeScript strict
- Navigasi: Expo Router, satu file per layar di app/
- Data: Supabase (nanti), jangan pernah ada secret key di aplikasi
## Aturan
- Satu layar setiap kali. Jangan sentuh file di luar permintaan.
- Tidak ada tinggi tetap dalam point: ukuran relatif terhadap layar,
ScrollView kalau kontennya bisa melebihi layar.
- Setiap layar menangani 3 state: loading, kosong, error.
- Teks antarmuka dalam bahasa Indonesia yang baik dan benar.
- Sebelum mengubah lebih dari 2 file: usulkan rencana dan tunggu persetujuanku.
## Perintah
- Menjalankan: npx expo start
- Tes: pakai script yang benar-benar ada di package.json.
Kalau belum ada, laporkan; jangan mengklaim tes berhasil.
- Tipe: npx tsc --noEmit
- Setelah setiap perubahan: jalankan tes dan pengecekan tipe, lalu jelaskan
apa yang berubah dan cara mengeceknya di iPhone.
Aturan soal tinggi tetap itu bukan kebetulan. Kita bahas lagi di langkah 6.
Langkah 5: beri prompt satu layar setiap kali
"Buatkan aplikasi pelacak kebiasaan dengan langganan" menghasilkan proyek raksasa yang rapuh dan mustahil diperiksa ulang. Metode yang berhasil justru kebalikannya: satu permintaan, satu layar, satu hasil yang bisa kamu uji dalam lima menit.
Mulai dengan rencana
Untuk semua yang menyentuh beberapa file, pindah ke plan mode. Tekan Shift+Tab sampai muncul plan mode on di status bar. Dalam mode ini, Claude membaca file dan mengusulkan rencana, tapi tidak mengubah apa pun sebelum kamu setuju. Kamu baca ulang, koreksi, lalu setujui.
Prompt pembingkaian pertama kira-kira seperti ini:
Aku mau aplikasi pelacak kebiasaan. Versi 1: hanya satu fungsi,
mencentang kebiasaan hari ini. Usulkan daftar layar dan
struktur foldernya. Jangan tulis kode dulu.
Jelaskan layarnya, state-nya, dan batasannya
Setelah itu, satu prompt per layar. Makin banyak kasus tepi yang kamu sebutkan, makin kecil kemungkinan Claude melupakannya:
Buat layar app/index.tsx yang menampilkan daftar kebiasaan hari ini.
- Setiap baris: nama kebiasaan, kotak centang, streak yang sedang berjalan.
- State kosong: sebuah teks dan tombol "Tambah kebiasaan".
- State loading dan state error dengan tombol "Coba lagi".
- Datanya dari array lokal untuk sementara.
- Harus muat di iPhone SE maupun iPhone terbesar:
tanpa tinggi tetap, daftarnya bisa di-scroll.
Jalankan tes dan pengecekan tipe di akhir.
Perbaiki tanpa membiarkan semuanya ditulis ulang
Kalau ada detail yang salah, tetap spesifik dan batasi cakupannya:
Di iPhone-ku, tombol "Tambah kebiasaan" tertutup bar bawah
kalau daftarnya panjang. Perbaiki hanya masalah ini di app/index.tsx,
tanpa menyentuh file lain. Jelaskan penyebabnya.
Kamu juga bisa menempelkan screenshot di terminal: Claude bisa membacanya.
Latihan: kebiasaan yang tetap tercentang setelah aplikasi dibuka ulang
Ini latihan untuk dikerjakan di proyekmu sendiri, bukan tangkapan dari fitur yang sudah jadi. Tujuannya beralih dari layar hasil generate ke perilaku yang bisa diverifikasi. Latihan ini tidak butuh akun pengguna maupun pembelian dalam aplikasi.
- Simpan satu kebiasaan lokal saja bernama "Baca 10 menit".
- Minta kotak centang dan penyimpanan lokal yang kompatibel dengan proyek Expo-mu.
- Minta agent menyebutkan file yang diubah, dependensi tambahan (kalau ada), dan perintah yang benar-benar dijalankan.
- Instal atau buka aplikasimu di iPhone, lalu lakukan pengecekan di bawah.
Berdasarkan layar yang sudah ada, buat kebiasaan "Baca 10 menit"
bisa dicentang dan simpan statusnya setelah aplikasi ditutup lalu dibuka lagi.
Pakai penyimpanan lokal yang kompatibel dengan dependensi proyek.
Jangan buat akun, server, langganan, atau statistik tambahan.
Sebelum menulis kode, jelaskan bagaimana kamu menangani loading dan kegagalan
saat membaca atau menyimpan. Setelah itu, buat perubahan yang terbatas.
Di akhir: file yang diubah, perintah yang dijalankan, batasan yang belum diuji,
dan langkah persis untuk mengecek hasilnya di iPhone.
| Aksi di iPhone-mu | Hasil yang diharapkan | Kalau gagal |
|---|---|---|
| Membuka aplikasi untuk pertama kali | Kebiasaan dan kotaknya terlihat, tanpa error | Cek state awal dan pemuatan penyimpanan |
| Mencentang lalu menutup dan membuka aplikasi | Kebiasaan tetap tercentang | Periksa penulisan lalu pembacaan dengan key yang sama |
| Menghapus centang lalu membuka ulang | Kebiasaan tetap tidak tercentang | Pastikan nilai false juga disimpan |
| Mengulang alurnya dalam mode pesawat | Fungsi lokal tetap tersedia | Cari dependensi jaringan yang ditambahkan tanpa alasan |
| Memperbesar ukuran teks | Nama dan kontrolnya tetap bisa diakses | Hapus batasan yang memotong atau menyembunyikan aksinya |
Jangan minta "tulis ulang semuanya" kalau satu baris gagal. Jelaskan aksinya, hasil yang diharapkan, dan hasil yang terlihat. Contohnya: "Setelah dibuka ulang, kotaknya kosong lagi padahal tadi sudah kucentang. Jelaskan penyebabnya dan perbaiki penyimpanannya tanpa mengubah desain."
Unduh template CLAUDE.md dan lembar pengecekan (.md). Buka di editor atau aplikasi catatanmu. Sesuaikan perintahnya dengan proyekmu sebelum menyerahkannya ke agent.
Langkah 6: minta review dan uji
Claude Code menulis kode yang kelihatannya benar. Hanya tes dan iPhone-mu yang bisa memastikan apakah memang benar.
Tes supaya yang sudah jalan tidak rusak
Makin besar aplikasimu, makin besar risiko setiap permintaan merusak layar yang sudah beres. Proyek buatan Expo belum punya tes: minta Claude dulu untuk menginstal Jest dengan jest-expo, seperti yang disarankan dokumentasi Expo. Lalu minta tes untuk logika penting (menghitung streak, validasi formulir) dan suruh tes itu dijalankan setelah setiap perubahan. Karena itulah perintah tes ditulis di CLAUDE.md: Claude menjalankannya tanpa perlu kamu ingatkan. Dengan file aturan dan tes, AI jauh lebih jarang merusak yang sudah berjalan.
Periksa setiap perubahan
Kamu tidak perlu memahami setiap baris. Kamu perlu tahu file mana yang berubah, dan kenapa. Kalau Claude menyentuh file yang tidak berhubungan, tanyakan alasannya sebelum menerima. Lalu ajukan pertanyaan ini: "apa yang bisa rusak di sini?".
Cek di iPhone kecil dan iPhone besar
Ini pelajaran yang paling mahal buat saya. Solys ditolak Apple berdasarkan guideline 2.1: demo onboarding-nya mustahil dimenangkan di iPad Air, tempat aplikasinya berjalan dalam mode kompatibilitas iPhone. Penyebabnya: tinggi yang ditulis dalam point tetap, bukan relatif terhadap ukuran layar. Di iPhone saya, semuanya baik-baik saja. Kodenya sudah direview, tesnya hijau. Tapi tidak ada satu tool pun yang melihat layarnya di ukuran lain.
Sejak itu, saya mengecek setiap layar minimal di iPhone terkecil dan terbesar. Kalau kamu hanya punya satu ponsel, simulator Xcode di Mac atau teman yang punya model lain sudah cukup. Perhatikan terutama teks panjang, keyboard yang terbuka di formulir, dan tombol yang menempel di bawah.
Hal yang kurang dikuasai Claude Code
Claude Code jago di urusan layar dan logika. Di luar folder proyekmu, dia jauh kurang bisa diandalkan.
Signing dan sertifikat
Tanpa koneksi yang diizinkan ke akun Apple-mu, Claude tidak tahu kondisinya. Dia bisa mengarang prosedur sertifikat yang mencampur Xcode dan Expo. Biarkan EAS yang mengurus signing: dokumentasi Expo menjelaskan bahwa EAS CLI bisa membuat dan menyimpan file-file ini untukmu, setelah terhubung ke akun Apple Developer-mu.
App Store Connect
Halaman aplikasi, deklarasi privasi, screenshot, dan tautan legal adalah data yang harus dicek di App Store Connect. Claude Code sekarang bisa bertindak di browser yang sudah login lewat integrasi Chrome-nya, dengan akses yang diperlukan. Itu tidak menjamin isian kolomnya benar: periksa ulang informasinya, cek akun yang dipakai, dan setujui sendiri komitmen serta pengiriman ke review.
Langganan
Menulis paywall butuh sepuluh menit. Menyelaraskan produk di App Store Connect, konfigurasinya di RevenueCat, dan kodenya, itu cerita lain. Satu karakter saja beda di identifier, paywall-nya kosong di layar reviewer. Jebakan paling umum ada di kesalahan paywall iOS yang sering dibuat pemula.
Kasus tepi
Tanpa instruksi, Claude hanya menangani kasus normal. Tidak ada jaringan, daftar kosong, pembelian yang terputus: kamulah yang harus menyebutkannya.
Keamanan Supabase
Saat Claude membuat tabel di Supabase, pastikan row level security (RLS) aktif, dengan policy yang membatasi setiap pengguna hanya ke datanya sendiri. Pastikan juga tidak ada secret key yang masuk ke kode aplikasi. Tulis kedua larangan ini di CLAUDE.md begitu kamu menghubungkan database.
Langkah 7: masuk ke TestFlight dengan EAS
Layar-layarmu sudah dicek di Expo Go atau di development build, tergantung modul yang dipakai. Sekarang lanjut ke build yang akan dibagikan ke penguji.
Siapkan EAS
Sekarang kamu butuh akun Apple Developer berbayar: seperti diingatkan Expo, akun ini wajib untuk mengirim aplikasi ke App Store. Lalu instal tool Expo dan konfigurasikan proyeknya:
npm install --global eas-cli
eas login
eas build:configure
Tambahkan bundle identifier yang unik di app.json, di bawah ios.bundleIdentifier, misalnya com.yourname.myapp.
Kompilasi dan kirim
eas build --platform ios --profile production
eas submit --platform ios
Perintah pertama mengompilasi aplikasi di server Expo. Saat pertama dijalankan, EAS menawarkan untuk terhubung ke akun Apple-mu guna membuat sertifikat. Perintah kedua mengirim build ke App Store Connect. Kamu juga bisa melakukan semuanya sekaligus dengan eas build --platform ios --auto-submit.
Build harus diproses Apple dulu sebelum muncul di TestFlight, dan proses ini bisa menolaknya, misalnya dengan ITMS-90717 untuk ikon transparan. Jadi pengiriman yang sukses belum berarti build-nya sudah bisa diinstal: cek statusnya di App Store Connect. Penguji internal, eksternal, dan beta review dijelaskan di panduan saya TestFlight untuk menguji aplikasi iPhone.
Ulangi pengecekan di langkah 6 pada build ini. Aplikasi yang jalan di Expo Go masih bisa crash di production, misalnya kalau ada modul native yang hilang.
Berapa biaya sebenarnya
Berikut harga yang tercantum di masing-masing layanan, dicek pada 27 September 2026, dalam dolar AS. Jumlah yang ditagih juga tergantung wilayahmu, pajak, dan pemakaianmu: cek penawarannya sebelum berlangganan.
- Langganan Claude: paket Pro seharga 20 dolar per bulan, atau 17 dolar per bulan kalau bayar tahunan. Paket Max mulai dari 100 dolar per bulan, untuk pemakaian lebih banyak.
- Akun Apple Developer: 99 dolar per tahun, wajib untuk TestFlight dan App Store.
- EAS: paket gratis Expo mencakup 15 build iOS per bulan, di antrean prioritas rendah. Paket Starter seharga 19 dolar per bulan, ditambah pemakaian ekstra.
Untuk prototipe kecil, Pro dan paket gratis EAS bisa jadi dasar, asalkan kamu tetap dalam kuotanya. Tambahkan akun Apple sebelum TestFlight, lalu hitung terpisah layanan yang benar-benar dibutuhkan: database, penyimpanan, atau API berbayar. Template anggaran aplikasi pertama membantu menyusun pos-pos ini. Waktu untuk konfigurasi dan pengecekan juga tetap harus kamu perhitungkan.
Batasan yang jujur, dan di mana orang biasanya mentok
Claude Code sudah mengubah siapa saja yang bisa membuat aplikasi iPhone. Tapi dia tidak mengubah syarat Apple untuk menerbitkannya. Penolakan datang dengan cepat: Solys pernah kena, Nolera dan Clic juga. Alasan yang paling sering diceritakan di kenapa Apple menolak aplikasi.
Dengan tutorial ini kamu bisa sampai ke TestFlight sendirian. Tempat orang paling sering mentok justru sesudahnya: memasang langganan, menyiapkan berkas untuk reviewer, memahami penolakan. Untuk gambaran besar seluruh perjalanannya, baca halaman membuat aplikasi iPhone.
Untuk bagian ini, iOS Kit mengumpulkan kode awal aplikasi-aplikasi saya, termasuk langganan, skill Claude Code untuk setiap tahap, dan Apple Review Kit. Alur lengkapnya ada di halaman kursus Claude Code untuk membuat aplikasi iOS.
Sudah mentok dan tidak tahu di mana masalahnya? Diagnostik gratis memberi tahu apa yang sebenarnya menghambatmu dan mengirimkan checklist anti-penolakan Apple saya.
Pertanyaan umum
Bisakah membuat aplikasi iPhone dengan Claude Code tanpa bisa coding?
Bisa untuk layar dan logika sederhana, asalkan kamu memeriksa dan menguji setiap langkah. Tidak bisa kalau kamu berharap tidak perlu paham apa-apa sama sekali. Kamu harus bisa membaca pesan error, menjalankan perintah, dan mengecek apa yang diubah Claude. Semua itu cepat dipelajari sambil membangun.
Apakah Claude Code gratis?
Tidak. Claude Code butuh akun Pro, Max, Team, Enterprise, atau Console. Paket gratis claude.ai tidak mencakupnya. Paket Pro cukup untuk mulai, dengan batas pemakaian yang perlu diperhatikan.
Apakah perlu Mac untuk membuat aplikasi iOS dengan Claude Code?
Tidak. Kamu bisa coding di komputer apa saja, menguji di Expo Go di iPhone-mu, dan EAS mengompilasi serta mengirim aplikasinya dari server Expo. Mac tetap praktis untuk simulator, tapi tidak wajib.
Claude Code atau Cursor untuk aplikasi React Native?
Saya pakai keduanya, setiap hari. Claude Code bekerja di terminal dan menjalankan perubahan sekaligus tes sendiri secara berurutan. Cursor adalah editor. Metodenya lebih penting daripada tool-nya: aturan, satu layar setiap kali, dan tes.
Berapa lama untuk menerbitkan aplikasi pertama dengan Claude Code?
Tergantung ukuran aplikasi dan waktumu. Aplikasi dengan satu fungsi jauh lebih cepat. Bagian yang paling sulit diprediksi tetap review Apple.
Bisakah Claude Code mengatur langganan dalam aplikasi?
Dia bisa menulis kode paywall dan RevenueCat. Dengan tool yang terhubung dan izin yang diperlukan, dia juga bisa bekerja di konsol-konsolnya. Jangan pernah menyimpulkan dari adanya kode bahwa produknya sudah dikonfigurasi: cek identifier, harga, dan hak akses setelah pembelian, lalu uji pembelian dan pemulihan pembelian di TestFlight. Kesalahan umum paywall iOS memberimu poin-poin yang perlu dicek.