Lewati ke konten utama
diskon 50% semua paket, waktu terbatas. Mulai dari $2.48/mo
16 min left
AI dan Machine Learning

Cara Menjalankan Code Server dan Claude Code pada VPS: Lingkungan Dev AI Berbasis Peramban

H Oleh Haze 16 menit baca
A browser-based VS Code IDE with a Claude Code terminal panel running on a VPS, viewed on a tablet

Anda menutup laptop, berjalan ke kedai kopi, dan membuka peramban di sebuah tablet. Editor VS Code penuh Anda ada di sana, dengan terminal yang menjalankan Claude Code di sampingnya, di server yang Anda kendalikan. Tidak ada toolchain lokal, tidak ada sinkronisasi, tidak ada menunggu laptop bangun.

Kombinasi itulah yang dibangun panduan ini: Code Server (VS Code berbasis peramban) dan Claude Code (CLI koding AI dari Anthropic) pada satu Linux VPS. Banyak tutorial mencakup salah satunya, tetapi menjalankan keduanya di boks yang sama memberi Anda IDE bergaya Codespaces yang dibantu AI dan dapat dijangkau dari perangkat apa pun, dengan biaya sebuah VPS dan akses root penuh. Satu klarifikasi sebelum Anda mulai: Server Kode di sini berarti proyek sumber-terbuka dari Coder (coder/code-server), bukan VS Code Server milik Microsoft dan bukan platform enterprise terpisah milik Coder. Keduanya berbagi nama dan terus-menerus tertukar, jadi layak dipastikan sekarang.

Pada akhirnya, Anda akan memiliki lingkungan pengembangan berbasis peramban yang dibantu AI dan berfungsi, berjalan pada VPS milik Anda, diamankan dengan HTTPS dan disiapkan untuk bertahan dari koneksi yang terputus.

Versi Singkat

  • Tumpukannya: Code Server memberi Anda VS Code di tab peramban; Claude Code menambahkan asisten koding AI dari Anthropic di server yang sama. Anda menjangkau keseluruhannya dari perangkat apa pun yang punya peramban.
  • Batas RAM sesungguhnya adalah 4 GB, dan Claude Code adalah penyebabnya. Code Server sendiri berjalan dalam 1 GB, tetapi Claude Code membutuhkan 4 GB+, jadi tumpukan gabungan membutuhkan setidaknya 4 GB RAM, 2 vCPU, dan 120 GB penyimpanan. Rencanakan 8 GB jika Anda ingin kenyamanan.
  • Urutan instalasi kurang penting dibanding langkah autentikasi. Installer natif untuk kedua alat masing-masing satu baris. Mengautentikasi Claude Code pada server tanpa peramban adalah bagian yang membuat sebagian besar setup tersendat. Anda menyalin URL login ke peramban lokal Anda, atau menggunakan token atau kunci API.
  • Claude Code tidak gratis. Ia membutuhkan paket Claude berbayar (Pro, Max, Team, atau Enterprise) atau kunci API Anthropic. Paket Claude.ai gratis tidak menyertakannya.

Apa yang Akan Anda Butuhkan

Sebelum Anda mulai, pastikan Anda memiliki hal-hal berikut. Masing-masing dirujuk oleh langkah selanjutnya, jadi lebih baik memastikannya sekarang daripada menemukan celah di tengah jalan.

  • Sebuah Linux VPS yang memenuhi batas ukuran di bawah. Ubuntu 22.04 LTS digunakan di seluruh panduan ini; perintahnya nyaris identik pada Debian dan rilis Ubuntu lainnya.
  • Ukuran yang tepat: setidaknya 4 GB RAM, 2 vCPU, and 120 GB of NVMe storage. Minimum 4 GB berasal dari Claude Code, bukan Code Server (bagian ukuran menjelaskan alasannya).
  • Sebuah nama domain (opsional tetapi direkomendasikan) jika Anda ingin HTTPS dengan sertifikat asli. Anda bisa menjalankan Code Server pada alamat IP, tetapi domain membuat langkah reverse-proxy lebih rapi.
  • Sebuah paket Claude berbayar atau kunci API Anthropic. Claude Code membutuhkan langganan Pro, Max, Team, atau Enterprise, atau akun Claude Console (API). Paket Claude.ai gratis tidak menyertakan akses Claude Code. Pastikan yang mana yang Anda miliki sebelum langkah instalasi, karena itu menentukan cara Anda mengautentikasi.
  • Akses SSH dasar ke server dengan pengguna yang berkemampuan sudo.

Memilih VPS Anda

Keputusan pertama adalah ukuran, dan saran umum yang akan Anda temukan untuk Code Server keliru untuk tumpukan ini. Sebagian besar panduan Code Server mengutip minimum 1 GB RAM, yang akurat untuk Code Server sendiri. Begitu Anda menambahkan Claude Code, batas itu bergeser.

Daftar persyaratan sistem Claude Code sendiri 4 GB+ RAM (sesuai dokumen setup Claude Code). Code Server membutuhkan kira-kira 1 GB. Menjalankan keduanya, ditambah ekstensi editor Anda, sebuah proyek aktif, dan memori yang digunakan sesi Claude Code agentik selama ia bekerja, berarti batas realistis tumpukan gabungan adalah:

Sumber DayaMinimumDirekomendasikan
RAM4 GB8 GB
vCPU24
Penyimpanan120 GB NVMe240 GB NVMe
OSUbuntu 22.04 LTSUbuntu 22.04 LTS

Kolom yang direkomendasikan adalah tempat Anda ingin berada jika Anda memasang beberapa ekstensi, menyimpan proyek besar dengan direktori node_modules yang cukup besar di server, atau menjalankan Claude Code pada tugas agentik yang menyentuh banyak file sekaligus. Minimum akan menjalankan tumpukan; spesifikasi yang direkomendasikan membuatnya nyaman.

Dua poin yang menghemat uang dan mengurangi kebingungan Anda:

Tidak diperlukan GPU. Claude Code mengirim pekerjaannya ke API Anthropic, jadi semua inferensi model terjadi secara jarak jauh. Anda tidak menjalankan model di server Anda. VPS CPU standar adalah pilihan yang benar, dan membayar untuk instans GPU di sini tidak membeli apa pun untuk Anda.

Pilih pusat data yang dekat dengan Anda. IDE peramban peka terhadap latensi jaringan dengan cara yang tidak dimiliki aplikasi web biasa, karena setiap ketikan dan suntingan file menempuh koneksi WebSocket ke server dan kembali. Semakin dekat server ke tempat Anda secara fisik duduk, semakin editor terasa lokal. Jika Anda mengkode dari satu wilayah sebagian besar waktu, pilih lokasi yang paling dekat dengannya.

Poin kunci bagian ini: Ukur untuk Claude Code, bukan Code Server. Persyaratan 4 GB Claude Code menetapkan batas Anda. Angka 1 GB Code Server tidak berlaku begitu kedua alat berbagi boks.

VPS sizing for Code Server plus Claude Code: 4 GB RAM, 2 vCPU, 120 GB NVMe minimum, 8 GB RAM and 4 vCPU recommended

Menginstal Code Server

Langkah ini menghasilkan editor VS Code yang berfungsi dan dapat dijangkau di peramban Anda pada port 8080. Code Server menyertakan skrip instalasi yang menangani penyiapan paket untuk Anda.

Jalankan installer resmi:

curl -fsSL https://code-server.dev/install.sh | sh

Skrip mendeteksi distribusi Anda dan menginstal Code Server sebagai layanan systemd. Begitu selesai, mulai layanan dan aktifkan agar kembali setelah reboot:

sudo systemctl enable --now code-server@$USER

Code Server terikat ke 127.0.0.1:8080 secara bawaan dan menghasilkan kata sandi acak pada jalannya yang pertama. Anda membutuhkan kata sandi itu untuk masuk. Ia berada di file konfigurasi yang dihasilkan:

cat ~/.config/code-server/config.yaml

Keluaran yang diharapkan terlihat seperti ini:

bind-addr: 127.0.0.1:8080
auth: password
password: 5f3a9c1b2e8d7460a1f2c3b4
cert: false

Salin nilai kata sandi. Anda akan memasukkannya di layar login Code Server begitu server dapat dijangkau di peramban Anda, yang, saat ini, belum, karena ia terikat ke 127.0.0.1 (localhost saja). Itu disengaja: mengekspos Code Server secara aman adalah langkah selanjutnya, dilakukan melalui reverse proxy alih-alih dengan membuka port 8080 ke internet.

Catatan: Code Server membatasi laju upaya login. Jika Anda salah mengetik kata sandi beberapa kali dan terkunci sebentar, itu adalah pembatas laju, bukan instalasi yang rusak. Tunggu semenit dan coba lagi.

Jika Anda lebih suka melewati instalasi manual sepenuhnya, marketplace Cloudzy punya deployment Code Server satu-klik yang menyediakan server dengan Code Server sudah terinstal. Itu jalur yang lebih cepat jika Anda sedang memilih host sekarang; langkah manual di atas bekerja pada VPS Ubuntu apa pun, jadi sisa panduan ini tetap agnostik-penyedia.

Menginstal Claude Code

Langkah ini menambahkan asisten koding AI ke server yang sama. Claude Code terinstal sebagai satu biner dan berjalan dari terminal: terminal yang sama yang nanti akan Anda buka di dalam IDE peramban.

Gunakan installer natif, yang merupakan metode yang direkomendasikan Anthropic:

curl -fsSL https://claude.ai/install.sh | bash

Konfirmasi bahwa ia terinstal:

claude --version

Jika Anda sudah menjalankan Node.js 18 atau yang lebih baru dan lebih suka mengelola alat melalui npm, jalur itu ada sebagai alternatif:

npm install -g @anthropic-ai/claude-code

The native installer is the primary path in Anthropic's current documentation, and it auto-updates in the background. The npm package can also auto-update, but that depends on the npm global directory being writable; if it isn't, Claude Code shows a one-time notice instead of updating silently. Choose the native installer unless you have a specific reason to prefer npm.

Claude Code mendukung Ubuntu 20.04+, Debian 10+, dan Alpine 3.19+, jadi VPS yang Anda ukur di atas sudah memenuhi syarat. Ia membutuhkan paket Claude berbayar atau kunci API Anthropic, yang Anda konfirmasi di prasyarat, dan paket Claude.ai gratis tidak menyertakannya.

Untuk rujukan instalasi yang otoritatif, dokumen terkini berada di code.claude.com. (Tautan lama ke docs.anthropic.com dialihkan ke sana; gunakan alamat code.claude.com secara langsung.)

Mengautentikasi Claude Code pada Server Tanpa Kepala

Jalankan claude untuk pertama kalinya dan ia mencoba membuka jendela peramban untuk menyelesaikan login. Pada server jarak jauh yang dijangkau melalui SSH, tidak ada peramban untuk dibuka. Ini adalah satu langkah yang menghentikan sebagian besar setup server, dan ia punya tiga solusi bersih.

Metode langsung: salin URL login ke peramban lokal Anda. Saat Anda menjalankan claude di server, ia mencetak URL login (tekan c untuk menyalinnya ke papan klip Anda jika ia tidak terbuka otomatis). Buka URL itu di peramban di mesin Anda sendiri, masuk, dan selesaikan otorisasi. Jika peramban menampilkan kode login alih-alih mengalihkan, tempel kode itu kembali ke terminal pada prompt Paste code here if prompted. Ini normal pada sesi SSH dan kontainer. Ini adalah jalur interaktif standar untuk langganan Pro atau Max.

Metode persisten: token berumur panjang. Jika Anda tidak ingin mengautentikasi ulang server secara berkala, hasilkan token OAuth satu-tahun:

claude setup-token

Perintah ini memandu Anda melalui otorisasi OAuth sekali dan mencetak sebuah token. Ia tidak menyimpan token untuk Anda, jadi salin dan tetapkan sebagai variabel lingkungan agar Claude Code mengambilnya pada setiap jalan:

export CLAUDE_CODE_OAUTH_TOKEN=your-token-here

Tambahkan baris export itu ke profil shell Anda (misalnya ~/.bashrc) agar ia bertahan lintas sesi. Token ini mengautentikasi terhadap langganan Anda dan membutuhkan paket Pro, Max, Team, atau Enterprise.

Metode kunci API. Jika Anda menggunakan akun Claude Console (API) alih-alih langganan, tetapkan kunci API Anda sebagai gantinya:

export ANTHROPIC_API_KEY=sk-ant-your-key-here

Satu catatan akurasi agar Anda tidak terkejut pada tagihan: kunci API menagih per token melalui Claude Console, yang merupakan jalur penagihan terpisah dari langganan Pro atau Max. Jika Anda punya baik langganan maupun ANTHROPIC_API_KEY yang ditetapkan, kunci API diutamakan begitu disetujui. Jadi jika Anda berniat menggunakan langganan Anda, jangan tinggalkan kunci API yang tercecer di lingkungan Anda.

Poin kunci bagian ini: Tiga rute untuk autentikasi pada boks tanpa kepala: salin URL login ke peramban lokal Anda, jalankan claude setup-token untuk token langganan berumur panjang, atau tetapkan ANTHROPIC_API_KEY untuk penagihan API langsung.

Three ways to authenticate Claude Code on a headless server: copy the login URL to a local browser, a one-year OAuth token, or an Anthropic API key

Mengekspos Code Server Secara Aman dengan HTTPS

Saat ini Code Server terikat ke localhost dan menyajikan HTTP biasa. Anda tidak ingin membuka port 8080 ke internet dan masuk melalui koneksi yang tidak terenkripsi, karena siapa pun di jalur jaringan bisa membaca sesi Anda. Perbaikan standarnya adalah reverse proxy yang menghentikan HTTPS di depan Code Server.

Ada satu batasan keras yang membentuk langkah ini: Code Server bergantung pada WebSockets (sesuai persyaratan Coder). Editor menggunakan koneksi WebSocket persisten untuk komunikasi langsungnya dengan server, jadi reverse proxy Anda harus meneruskan upgrade WebSocket dengan benar. Inilah mengapa pilihan proxy penting.

Gunakan Caddy atau Nginx. Keduanya menangani proxying WebSocket secara andal, dan keduanya tersedia sebagai aplikasi satu-klik marketplace Cloudzy jika Anda ingin melewati instalasinya secara manual. Caddy adalah jalur yang lebih singkat karena ia memperoleh dan memperbarui sertifikat Let's Encrypt secara otomatis. Caddyfile minimal untuk Code Server adalah:

# /etc/caddy/Caddyfile
code.example.com {
    reverse_proxy 127.0.0.1:8080
}

Itulah keseluruhan konfigurasinya. Caddy mendeteksi upgrade WebSocket dan meneruskannya tanpa direktif tambahan, dan ia menyediakan HTTPS untuk code.example.com dengan sendirinya. Muat ulang Caddy dengan sudo systemctl reload caddy dan jelajahi ke https://code.example.com, dan Anda mencapai layar login Code Server melalui koneksi terenkripsi.

Jika Anda lebih suka Nginx, konfigurasinya lebih panjang karena Anda menetapkan header upgrade WebSocket secara eksplisit dan memperoleh sertifikat secara terpisah dengan Certbot:

# /etc/nginx/sites-available/code-server
server {
    listen 80;
    listen [::]:80;
    server_name code.example.com;
    location / {
        proxy_pass http://127.0.0.1:8080/;
        proxy_set_header Host $host;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection upgrade;
        proxy_set_header Accept-Encoding gzip;
    }
}

Catatan: Nginx dan Caddy adalah dua proxy yang didokumentasikan dokumen resmi Coder, dan keduanya adalah pilihan andal di sini. Apache bisa mem-proxy Code Server juga, tetapi penerusan WebSocket-nya membutuhkan konfigurasi modul tambahan (proxy_wstunnel plus aturan rewrite) yang tidak dicakup dokumen resmi, dan setup yang melewatkan modul-modul itu cenderung berakhir dengan men-debug koneksi editor yang terputus. Jika Anda sudah menjalankan Apache untuk situs lain, jalur paling sederhana adalah menempatkan Code Server di belakang Nginx atau Caddy pada vhost terpisah alih-alih mengonfigurasi Apache untuk mem-proxy-nya.

A reverse proxy terminating HTTPS in front of Code Server on localhost port 8080 and forwarding WebSocket upgrades, using Caddy or Nginx

Menjaga Sesi Anda Tetap Hidup

Dua hal berbeda berjalan di server ini, dan keduanya berperilaku berbeda ketika koneksi Anda terputus. Layak diketahui mana yang mana sebelum Anda kehilangan satu jam dari jalannya Claude Code agentik karena tutup laptop.

Code Server sendiri bertahan dari pemutusan karena Anda menginstalnya sebagai layanan systemd. Menutup tab peramban atau memutus SSH tidak menghentikan layanan Code Server. Pada penyambungan ulang normal, Anda kembali ke sesi IDE peramban yang sama, meskipun pemutusan yang sangat lama mungkin memerlukan pemuatan ulang jendela tergantung pada perilaku penyambungan ulang Code Server.

Claude Code berbeda. Ketika Anda menjalankan claude di terminal interaktif melalui SSH, ia terikat pada sesi terminal itu. Tutup tab peramban yang memegang terminal itu, atau putus koneksi SSH, dan proses mati bersamanya, di tengah tugas jika ia sedang bekerja. Perbaikannya adalah menjalankan Claude Code di dalam multiplexer terminal agar sesi terlepas dari koneksi Anda dan terus berjalan.

tmux adalah alat standar untuk ini. Jika Anda belum pernah menggunakannya, tiga perintah mencakup apa yang Anda butuhkan:

# Start a new named session
tmux new -s claude

# Run claude inside it as normal, then detach without stopping it:
# press Ctrl-b, then d

# Reattach later, from any new SSH session:
tmux attach -t claude

Mulai claude di dalam sesi tmux, lepaskan dengan Ctrl-b lalu d, dan jalannya agentik berlanjut di server. Sambungkan ulang dengan tmux attach -t claude kapan pun Anda menyambung kembali (dari perangkat berbeda, jika Anda mau) dan Anda kembali ke sesi langsung yang sama.

Catatan: screen bekerja dengan cara yang sama jika Anda sudah menggunakannya (screen -S claude untuk memulai, Ctrl-a lalu d untuk melepaskan, screen -r claude untuk menyambung ulang). Salah satu alat memecahkan masalah yang sama; pilih yang Anda kenal.

Menggunakan Claude Code di Dalam IDE Peramban

Begitu kedua alat ada di boks, ada dua cara untuk menjangkau Claude Code dari IDE peramban: terminal terintegrasi, dan ekstensi VS Code. Salah satunya andal hari ini; yang lain perlu diuji sebelum Anda bergantung padanya.

Jalur terminal bekerja, menurut konstruksinya. Buka Code Server di peramban Anda, buka terminal terintegrasinya (Terminal > New Terminal, atau Ctrl+`), dan jalankan:

claude

Anda sekarang memiliki CLI Claude Code penuh yang berjalan di dalam IDE peramban, di direktori yang sama dengan proyek yang Anda buka. Ini adalah jalur yang dapat diandalkan: terminal adalah shell nyata di server, dan Claude Code adalah CLI yang terinstal di server itu, jadi ia berjalan. Pasangkan dengan langkah tmux di atas dan sesi bertahan dari koneksi yang terputus.

Jalur ekstensi VS Code mungkin dilakukan, tetapi jalur terminal tetap merupakan dasar yang lebih aman untuk setup ini. Anthropic menerbitkan ekstensi Claude Code VS Code dan dokumen terkininya mengatakan ia bisa diinstal dari Open VSX, yang penting karena Code Server menggunakan Open VSX alih-alih VS Code Marketplace milik Microsoft. Coba cari "Claude Code" di tampilan Extensions Code Server, atau instal ekstensi Anthropic.claude-code dari Open VSX jika ia muncul di instans Anda. Jika ekstensi tidak terinstal dengan bersih, atau jika integrasi IDE berperilaku berbeda dari yang di desktop VS Code, kembalilah ke terminal terintegrasi. CLI bekerja di terminal apa pun, dan untuk setup VPS ini, itulah jalur yang andal.

Deploy IDE AI Berbasis Peramban Anda Sendiri

Anda sekarang punya gambaran penuh: editor VS Code yang dapat dijangkau peramban dengan Claude Code di sampingnya, diamankan dengan HTTPS dan disiapkan untuk bertahan dari koneksi yang terputus, pada VPS yang Anda kendalikan.

Satu bagian dari ini yang murni kerja penyiapan adalah permulaannya: menyediakan server dan membuat Code Server terinstal sebelum Anda bisa melakukan hal menarik. Jika Anda ingin melewati itu, kami menawarkan deployment Code Server satu-klik di marketplace Cloudzy yang menyediakan VPS dengan Code Server sudah berjalan, sehingga Anda langsung mendarat di layar login dan langsung menuju penginstalan Claude Code dan autentikasi. Untuk penggunaan harian reguler, tetap tempatkan instans di belakang HTTPS dengan Caddy atau Nginx seperti ditunjukkan di atas alih-alih memperlakukan login http://<server-ip>:8080 mentah sebagai jalur akses produksi final.

Yang sama Linux VPS menampung seluruh tumpukan (editor, CLI AI, dan reverse proxy) dengan akses root yang dibutuhkan setup ini. Dari sana, langkah-langkah di atas adalah semua yang berdiri antara Anda dan koding dengan AI dari peramban apa pun.

Jika Anda masih menimbang CLI koding AI mana yang akan dipilih sebelum membangun ini, perbandingan kami tentang OpenCode vs Claude Code dan adu tanding CLI koding agentik yang lebih luas mengupas kompromi-komprominya.

Pertanyaan yang Sering Diajukan

Spesifikasi VPS Apa yang Saya Butuhkan untuk Code Server dan Claude Code?

Anda membutuhkan setidaknya 4 GB RAM, 2 vCPU, dan 120 GB penyimpanan untuk tumpukan gabungan. Minimum 4 GB didorong oleh Claude Code, bukan Code Server (Code Server sendiri berjalan dalam sekitar 1 GB). Untuk penggunaan yang nyaman dengan ekstensi dan proyek yang lebih besar, 8 GB RAM dan 4 vCPU adalah ukuran yang direkomendasikan.

Apakah Claude Code Gratis?

Tidak. Claude Code membutuhkan paket Claude berbayar (Pro, Max, Team, atau Enterprise) atau kunci API Anthropic melalui Claude Console. Paket Claude.ai gratis tidak menyertakan akses Claude Code.

Bagaimana Saya Mengautentikasi Claude Code pada Server Tanpa Peramban?

Jalankan claude dan salin URL login yang dicetaknya ke peramban di mesin lokal Anda untuk menyelesaikan login, menempelkan kode kembali ke terminal jika diminta. Untuk server yang persisten, jalankan claude setup-token untuk menghasilkan token OAuth satu-tahun dan tetapkan sebagai CLAUDE_CODE_OAUTH_TOKEN, atau tetapkan ANTHROPIC_API_KEY untuk mengautentikasi dengan kunci API Claude Console.

Apakah Ekstensi Claude Code VS Code Bekerja di Dalam Code Server?

CLI Claude Code berjalan sepenuhnya di dalam terminal terintegrasi Code Server, yang merupakan cara paling andal untuk menggunakannya dalam setup IDE peramban ini. Ekstensi VS Code juga layak dicoba karena Anthropic mengatakan ia bisa diinstal dari Open VSX, dan Code Server menggunakan Open VSX alih-alih VS Code Marketplace milik Microsoft. Jika ekstensi tidak terinstal dengan bersih atau berperilaku berbeda di instans Anda, gunakan jalur terminal terintegrasi sebagai gantinya.

Bisakah Saya Menggunakan Ini dari iPad atau Ponsel?

Ya. Code Server berbasis peramban, jadi perangkat apa pun dengan peramban modern (termasuk iPad atau ponsel) menjangkau IDE penuh. Akses yang agnostik-perangkat itu adalah keunggulan utama IDE peramban dibanding VS Code Remote SSH, yang membutuhkan instalasi VS Code lokal untuk terhubung.

Share

Lebih banyak dari blog

Lanjutkan membaca.

Siap deploy? Mulai $2,48/bln.

Cloud independen, sejak 2008. AMD EPYC, NVMe, 40 Gbps. Garansi uang kembali 14 hari.