Jak uruchomić Code Server i Claude Code na VPS: oparte na przeglądarce środowisko programistyczne z AI

Zamykasz laptopa, idziesz do kawiarni i otwierasz przeglądarkę na tablecie. Twój pełny edytor VS Code jest od razu na miejscu, z terminalem, na którym obok działa Claude Code, na serwerze, który kontrolujesz. Żadnego lokalnego zestawu narzędzi, żadnej synchronizacji, żadnego czekania, aż laptop się obudzi.

To właśnie połączenie buduje ten przewodnik: Code Server (VS Code w przeglądarce) i Claude Code (kodujące CLI z AI od Anthropic) na jednym Linuksowym VPS. Wiele samouczków obejmuje jedno albo drugie, ale uruchomienie obu na tej samej maszynie daje ci wspomagane AI IDE w stylu Codespaces, dostępne z dowolnego urządzenia, za cenę VPS i z pełnym dostępem root. Jedno wyjaśnienie, zanim zaczniesz: Serwer Kodu oznacza tutaj projekt open source od Coder (coder/code-server), a nie VS Code Server od Microsoft ani osobną platformę korporacyjną od Coder. Dzielą nazwę i są nieustannie mylone, więc warto to teraz ustalić.

Na koniec będziesz mieć działające, oparte na przeglądarce, wspomagane AI środowisko programistyczne działające na VPS, który posiadasz, zabezpieczone HTTPS i skonfigurowane tak, by przetrwać zerwane połączenie.

Krótka wersja

• Stos: Code Server daje ci VS Code w karcie przeglądarki; Claude Code dodaje kodującego asystenta AI od Anthropic na tym samym serwerze. Docierasz do całości z dowolnego urządzenia z przeglądarką.
• Rzeczywista dolna granica RAM to 4 GB, a powodem jest Claude Code. Sam Code Server działa na 1 GB, ale Claude Code wymaga 4 GB+, więc połączony stos potrzebuje co najmniej 4 GB RAM, 2 vCPU i 120 GB pamięci masowej. Zaplanuj 8 GB, jeśli chcesz komfortu.
• Kolejność instalacji ma mniejsze znaczenie niż krok uwierzytelniania. Natywne instalatory obu narzędzi to po jednej linii każdy. Uwierzytelnienie Claude Code na serwerze bez przeglądarki to część, na której większość konfiguracji się zacina. Kopiujesz URL logowania do lokalnej przeglądarki albo używasz tokena lub klucza API.
• Claude Code nie jest darmowy. Wymaga płatnego planu Claude (Pro, Max, Team lub Enterprise) albo klucza API od Anthropic. Darmowy plan Claude.ai go nie obejmuje.

Czego będziesz potrzebować

Zanim zaczniesz, upewnij się, że masz na miejscu następujące rzeczy. Do każdej z nich odwołuje się późniejszy krok, więc warto potwierdzić je teraz, zamiast odkrywać braki w połowie drogi.

• Linuksowy VPS spełniający poniższą dolną granicę rozmiaru. Ubuntu 22.04 LTS jest używane w całym tym przewodniku; polecenia są niemal identyczne na Debian i innych wydaniach Ubuntu.
• Właściwy rozmiar: co najmniej 4 GB RAM, 2 vCPU, and 120 GB of NVMe storage. Minimum 4 GB wynika z Claude Code, a nie z Code Server (sekcja o rozmiarze wyjaśnia dlaczego).
• Nazwa domeny (opcjonalna, ale zalecana) jeśli chcesz HTTPS z prawdziwym certyfikatem. Możesz uruchomić Code Server na adresie IP, ale domena sprawia, że krok z odwrotnym proxy jest czystszy.
• Płatny plan Claude lub klucz API od Anthropic. Claude Code wymaga subskrypcji Pro, Max, Team lub Enterprise albo konta Claude Console (API). Darmowy plan Claude.ai nie obejmuje dostępu do Claude Code. Potwierdź, który masz, przed krokiem instalacji, bo decyduje on o tym, jak się uwierzytelniasz.
• Podstawowy dostęp SSH do serwera z użytkownikiem z uprawnieniami sudo.

Wybór VPS

Pierwsza decyzja to rozmiar, a powszechna rada, którą znajdziesz dla Code Server, jest błędna dla tego stosu. Większość przewodników po Code Server podaje minimum 1 GB RAM, co jest prawdziwe dla samego Code Server. Gdy dodasz Claude Code, ta granica się przesuwa.

Własna lista wymagań systemowych Claude Code 4 GB+ RAM (według dokumentacji konfiguracyjnej Claude Code). Code Server potrzebuje mniej więcej 1 GB. Uruchomienie obu, plus twoich rozszerzeń edytora, aktywnego projektu i pamięci, którą sesja agentowego Claude Code zużywa podczas pracy, oznacza, że realistyczna dolna granica połączonego stosu to:

Zalecana kolumna to miejsce, w którym chcesz być, jeśli instalujesz kilka rozszerzeń, trzymasz na serwerze duże projekty z pokaźnymi katalogami node_modules lub uruchamiasz Claude Code na zadaniach agentowych, które dotykają wielu plików naraz. Minimum uruchomi stos; zalecana specyfikacja zapewnia mu komfort.

Dwa punkty, które oszczędzają ci pieniędzy i zamieszania:

GPU nie jest wymagane. Claude Code wysyła swoją pracę do API Anthropic, więc całe wnioskowanie modelu odbywa się zdalnie. Nie uruchamiasz modelu na swoim serwerze. Standardowy VPS z CPU jest właściwym wyborem, a płacenie za instancję z GPU niczego ci tutaj nie daje.

Wybierz centrum danych blisko siebie. IDE w przeglądarce jest wrażliwe na opóźnienia sieci w sposób, w jaki zwykła aplikacja webowa nie jest, ponieważ każde naciśnięcie klawisza i edycja pliku podróżuje przez połączenie WebSocket do serwera i z powrotem. Im bliżej serwer jest miejsca, w którym fizycznie siedzisz, tym bardziej edytor wydaje się lokalny. Jeśli programujesz przez większość czasu z jednego regionu, wybierz lokalizację najbliższą jemu.

Kluczowy wniosek z sekcji: dobierz rozmiar pod Claude Code, a nie pod Code Server. Wymaganie 4 GB od Claude Code wyznacza twoją dolną granicę. Liczba 1 GB dla Code Server nie obowiązuje, gdy oba narzędzia dzielą maszynę.

Instalacja Code Server

Ten krok tworzy działający edytor VS Code dostępny w twojej przeglądarce na porcie 8080. Code Server dostarcza skrypt instalacyjny, który obsługuje za ciebie konfigurację pakietów.

Uruchom oficjalny instalator:

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

Skrypt wykrywa twoją dystrybucję i instaluje Code Server jako usługę systemd. Gdy skończy, uruchom usługę i włącz ją, aby wracała po restarcie:

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

Code Server domyślnie wiąże się z 127.0.0.1:8080 i przy pierwszym uruchomieniu generuje losowe hasło. Potrzebujesz tego hasła, aby się zalogować. Znajduje się ono w wygenerowanym pliku konfiguracyjnym:

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

Oczekiwany wynik wygląda tak:

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

Skopiuj wartość hasła. Wpiszesz je na ekranie logowania Code Server, gdy serwer stanie się dostępny w twojej przeglądarce, co w tej chwili nie jest prawdą, ponieważ jest związany z 127.0.0.1 (tylko localhost). To celowe: bezpieczne wystawienie Code Server to późniejszy krok, wykonywany przez odwrotne proxy, a nie przez otwarcie portu 8080 na internet.

Uwaga: Code Server ogranicza liczbę prób logowania. Jeśli kilka razy machniesz się przy haśle i zostaniesz na chwilę zablokowany, to działanie ogranicznika liczby prób, a nie zepsuta instalacja. Odczekaj minutę i spróbuj ponownie.

Jeśli wolisz całkowicie pominąć ręczną instalację, marketplace Cloudzy ma wdrożenie Code Server jednym kliknięciem, które przygotowuje serwer z już zainstalowanym Code Server. To szybsza ścieżka, jeśli wybierasz teraz hosta; ręczne kroki powyżej działają na każdym VPS z Ubuntu, więc reszta tego przewodnika pozostaje niezależna od dostawcy.

Instalacja Claude Code

Ten krok dodaje kodującego asystenta AI na tym samym serwerze. Claude Code instaluje się jako pojedynczy plik binarny i działa z terminala: tego samego terminala, który później otworzysz wewnątrz IDE w przeglądarce.

Użyj natywnego instalatora, który jest zalecaną metodą Anthropic:

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

Potwierdź, że się zainstalował:

claude --version

Jeśli już masz Node.js 18 lub nowszy i wolisz zarządzać narzędziem przez npm, ta ścieżka istnieje jako alternatywa:

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 obsługuje Ubuntu 20.04+, Debian 10+ i Alpine 3.19+, więc VPS, którego wymiarowałeś powyżej, już się kwalifikuje. Wymaga płatnego planu Claude lub klucza API od Anthropic, co potwierdziłeś w wymaganiach wstępnych, a darmowy plan Claude.ai go nie obejmuje.

Aby uzyskać autorytatywne odniesienie instalacyjne, aktualna dokumentacja znajduje się pod code.claude.com. (Starsze linki do docs.anthropic.com tam przekierowują; użyj bezpośrednio adresu code.claude.com.)

Uwierzytelnianie Claude Code na serwerze bezgłowym

Uruchom claude po raz pierwszy, a on próbuje otworzyć okno przeglądarki, aby dokończyć logowanie. Na zdalnym serwerze, do którego docierasz przez SSH, nie ma przeglądarki do otwarcia. To jedyny krok, który zatrzymuje większość konfiguracji serwerowych, i ma trzy czyste rozwiązania.

Metoda bezpośrednia: skopiuj URL logowania do lokalnej przeglądarki. Kiedy uruchomisz claude na serwerze, wypisuje URL logowania (naciśnij c aby skopiować go do schowka, jeśli nie otworzy się automatycznie). Otwórz ten URL w przeglądarce na własnej maszynie, zaloguj się i dokończ autoryzację. Jeśli przeglądarka pokaże kod logowania zamiast przekierować, wklej ten kod z powrotem do terminala w komunikacie Paste code here if prompted. To normalne przy sesjach SSH i kontenerach. To standardowa interaktywna ścieżka dla subskrypcji Pro lub Max.

Metoda trwała: długożyciowy token. Jeśli nie chcesz okresowo ponownie uwierzytelniać serwera, wygeneruj roczny token OAuth:

claude setup-token

Polecenie przeprowadza cię przez autoryzację OAuth raz i wypisuje token. Nie przechowuje tokena za ciebie, więc skopiuj go i ustaw jako zmienną środowiskową, aby Claude Code podnosił go przy każdym uruchomieniu:

export CLAUDE_CODE_OAUTH_TOKEN=your-token-here

Dodaj tę linię export do profilu swojej powłoki (na przykład ~/.bashrc), aby przetrwała między sesjami. Ten token uwierzytelnia się względem twojej subskrypcji i wymaga planu Pro, Max, Team lub Enterprise.

Metoda z kluczem API. Jeśli używasz konta Claude Console (API) zamiast subskrypcji, ustaw zamiast tego swój klucz API:

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

Jedna uwaga co do dokładności, żebyś nie zdziwił się na rachunku: klucz API nalicza opłaty za token przez Claude Console, co jest osobną ścieżką rozliczeniową od subskrypcji Pro lub Max. Jeśli masz zarówno subskrypcję, jak i ANTHROPIC_API_KEY ustawione, klucz API ma pierwszeństwo po zatwierdzeniu. Więc jeśli zamierzasz używać swojej subskrypcji, nie zostawiaj zbłąkanego klucza API w swoim środowisku.

Kluczowy wniosek z sekcji: trzy drogi do uwierzytelnienia na maszynie bezgłowej: skopiuj URL logowania do lokalnej przeglądarki, uruchom claude setup-token dla długożyciowego tokena subskrypcyjnego lub ustaw ANTHROPIC_API_KEY dla bezpośredniego rozliczania przez API.

Bezpieczne wystawienie Code Server z HTTPS

W tej chwili Code Server jest związany z localhost i serwuje zwykły HTTP. Nie chcesz otwierać portu 8080 na internet i logować się przez nieszyfrowane połączenie, ponieważ każdy na ścieżce sieciowej mógłby odczytać twoją sesję. Standardowa poprawka to odwrotne proxy, które terminuje HTTPS przed Code Server.

Jest jedno twarde ograniczenie, które kształtuje ten krok: Code Server zależy od WebSockets (według wymagań Coder). Edytor używa trwałego połączenia WebSocket do komunikacji na żywo z serwerem, więc twoje odwrotne proxy musi poprawnie przekazywać upgrade'y WebSocket. Dlatego wybór proxy ma znaczenie.

Użyj Caddy lub Nginx. Oba niezawodnie obsługują proxy WebSocket i oba są dostępne jako aplikacje jednym kliknięciem w marketplace Cloudzy, jeśli chcesz uniknąć instalowania ich ręcznie. Caddy jest krótszą ścieżką, ponieważ automatycznie uzyskuje i odnawia certyfikat Let's Encrypt. Minimalny Caddyfile dla Code Server to:

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

To cała konfiguracja. Caddy wykrywa upgrade WebSocket i przekazuje go bez dodatkowych dyrektyw oraz samodzielnie zapewnia HTTPS dla code.example.com. Przeładuj Caddy za pomocą sudo systemctl reload caddy i przejdź do https://code.example.com, a dotrzesz do ekranu logowania Code Server przez szyfrowane połączenie.

Jeśli wolisz Nginx, konfiguracja jest dłuższa, ponieważ jawnie ustawiasz nagłówki upgrade WebSocket i osobno uzyskujesz certyfikat za pomocą 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;
    }
}

Uwaga: Nginx i Caddy to dwa proxy udokumentowane w oficjalnej dokumentacji Coder i oba są tutaj niezawodnymi wyborami. Apache też potrafi obsługiwać proxy dla Code Server, ale jego przekazywanie WebSocket wymaga dodatkowej konfiguracji modułów (proxy_wstunnel plus reguły przepisywania), której oficjalna dokumentacja nie obejmuje, a konfiguracje pomijające te moduły zwykle kończą na debugowaniu zrywanych połączeń edytora. Jeśli już uruchamiasz Apache dla innych witryn, najprostszą ścieżką jest umieszczenie Code Server za Nginx lub Caddy na osobnym vhoście, zamiast konfigurować Apache do obsługi proxy.

Utrzymywanie sesji przy życiu

Na tym serwerze działają dwie różne rzeczy i zachowują się różnie, gdy twoje połączenie się zerwie. Warto wiedzieć, która jest którą, zanim stracisz godzinę agentowego przebiegu Claude Code przez zamknięcie klapy laptopa.

Sam Code Server przeżywa rozłączenia, ponieważ zainstalowałeś go jako usługę systemd. Zamknięcie karty przeglądarki lub zerwanie SSH nie zatrzymuje usługi Code Server. Przy normalnych ponownych połączeniach wracasz do tej samej sesji IDE w przeglądarce, choć bardzo długie rozłączenia mogą wymagać przeładowania okna, w zależności od zachowania Code Server przy ponownym łączeniu.

Claude Code jest inny. Gdy uruchamiasz claude w interaktywnym terminalu przez SSH, jest powiązany z tą sesją terminala. Zamknij kartę przeglądarki z tym terminalem lub zerwij połączenie SSH, a proces zginie razem z nią, w połowie zadania, jeśli akurat pracował. Rozwiązaniem jest uruchomienie Claude Code wewnątrz multipleksera terminala, aby sesja odłączyła się od twojego połączenia i działała dalej.

tmux to standardowe narzędzie do tego. Jeśli nie używałeś go wcześniej, trzy polecenia pokrywają to, czego potrzebujesz:

# 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

Początek claude wewnątrz sesji tmux, odłącz się za pomocą Ctrl-b, a potem d, a przebieg agentowy trwa dalej na serwerze. Podłącz się ponownie za pomocą tmux attach -t claude kiedy tylko się połączysz z powrotem (z innego urządzenia, jeśli chcesz), a wracasz do tej samej sesji na żywo.

Uwaga: screen działa tak samo, jeśli już go używasz (screen -S claude aby rozpocząć, Ctrl-a a potem d aby się odłączyć, screen -r claude aby podłączyć ponownie). Każde z tych narzędzi rozwiązuje ten sam problem; wybierz to, które znasz.

Używanie Claude Code wewnątrz IDE w przeglądarce

Gdy oba narzędzia są już na maszynie, są dwa sposoby, aby dotrzeć do Claude Code z IDE w przeglądarce: zintegrowany terminal i rozszerzenie VS Code. Jeden z nich jest dziś niezawodny; drugi wymaga przetestowania, zanim na nim polegniesz.

Ścieżka terminalowa działa, z założenia. Otwórz Code Server w przeglądarce, otwórz jego zintegrowany terminal (Terminal > New Terminal lub Ctrl+`) i uruchom:

claude

Masz teraz pełne CLI Claude Code działające wewnątrz IDE w przeglądarce, w tym samym katalogu, co otwarty projekt. To niezawodna ścieżka: terminal to prawdziwa powłoka na serwerze, a Claude Code to CLI zainstalowane na tym serwerze, więc działa. Połącz to z krokiem tmux powyżej, a sesja przetrwa zerwane połączenie.

Ścieżka z rozszerzeniem VS Code jest możliwa, ale ścieżka terminalowa wciąż jest bezpieczniejszą podstawą dla tej konfiguracji. Anthropic publikuje rozszerzenie Claude Code do VS Code, a jego aktualna dokumentacja mówi, że można je zainstalować z Open VSX, co ma znaczenie, ponieważ Code Server używa Open VSX zamiast VS Code Marketplace od Microsoft. Spróbuj wyszukać "Claude Code" w widoku Extensions Code Server lub zainstaluj rozszerzenie Anthropic.claude-code z Open VSX, jeśli pojawi się w twojej instancji. Jeśli rozszerzenie nie zainstaluje się czysto lub jeśli integracja z IDE zachowuje się inaczej niż w desktopowym VS Code, wróć do zintegrowanego terminala. CLI działa w każdym terminalu, a dla tej konfiguracji VPS to niezawodna ścieżka.

Wdróż własne oparte na przeglądarce IDE z AI

Masz teraz pełny obraz: dostępny w przeglądarce edytor VS Code z Claude Code obok, zabezpieczony HTTPS i skonfigurowany tak, by przetrwać zerwane połączenie, na VPS, który kontrolujesz.

Jedyna część tego, która jest czystą pracą konfiguracyjną, to początek: przygotowanie serwera i zainstalowanie Code Server, zanim będziesz mógł zrobić cokolwiek interesującego. Jeśli chcesz to pominąć, oferujemy wdrożenie Code Server jednym kliknięciem w marketplace Cloudzy, które przygotowuje VPS z już działającym Code Server, więc lądujesz od razu na ekranie logowania i przechodzisz prosto do instalacji Claude Code i uwierzytelniania. Do regularnego codziennego użytku i tak umieść instancję za HTTPS z Caddy lub Nginx, jak pokazano powyżej, zamiast traktować surowe http://<server-ip>:8080 logowanie jako ostateczną produkcyjną ścieżkę dostępu.

To samo Linux VPS hostuje cały stos (edytor, AI CLI i odwrotne proxy) z dostępem root, którego ta konfiguracja potrzebuje. Stamtąd kroki powyżej to wszystko, co dzieli cię od kodowania z AI z dowolnej przeglądarki.

Jeśli wciąż zastanawiasz się, na które kodujące CLI z AI się zdecydować, zanim to zbudujesz, nasze porównania OpenCode vs Claude Code oraz szersze starcie agentowych CLI do kodowania omawiają kompromisy.

Często zadawane pytania

Jakich specyfikacji VPS potrzebuję dla Code Server i Claude Code?

Potrzebujesz co najmniej 4 GB RAM, 2 vCPU i 120 GB pamięci masowej dla połączonego stosu. Minimum 4 GB jest napędzane przez Claude Code, a nie Code Server (sam Code Server działa na około 1 GB). Do komfortowego użytku z rozszerzeniami i większymi projektami zalecany rozmiar to 8 GB RAM i 4 vCPU.

Czy Claude Code jest darmowy?

Nie. Claude Code wymaga płatnego planu Claude (Pro, Max, Team lub Enterprise) albo klucza API od Anthropic przez Claude Console. Darmowy plan Claude.ai nie obejmuje dostępu do Claude Code.

Jak uwierzytelnić Claude Code na serwerze bez przeglądarki?

Uruchom claude i skopiuj URL logowania, który wypisze, do przeglądarki na swojej lokalnej maszynie, aby dokończyć logowanie, wklejając kod z powrotem do terminala, jeśli pojawi się taki komunikat. Dla trwałego serwera uruchom claude setup-token, aby wygenerować roczny token OAuth i ustaw go jako CLAUDE_CODE_OAUTH_TOKEN, albo ustaw ANTHROPIC_API_KEY, aby uwierzytelnić się kluczem API Claude Console.

Czy rozszerzenie Claude Code do VS Code działa wewnątrz Code Server?

CLI Claude Code działa w pełni wewnątrz zintegrowanego terminala Code Server, co jest najbardziej niezawodnym sposobem jego użycia w tej konfiguracji IDE w przeglądarce. Rozszerzenie VS Code również warto wypróbować, ponieważ Anthropic mówi, że można je zainstalować z Open VSX, a Code Server używa Open VSX zamiast VS Code Marketplace od Microsoft. Jeśli rozszerzenie nie zainstaluje się czysto lub zachowuje się inaczej w twojej instancji, użyj zamiast tego ścieżki ze zintegrowanym terminalem.

Czy mogę używać tego z iPada lub telefonu?

Tak. Code Server jest oparty na przeglądarce, więc każde urządzenie z nowoczesną przeglądarką (w tym iPad lub telefon) dociera do pełnego IDE. Ten niezależny od urządzenia dostęp to główna przewaga IDE w przeglądarce nad VS Code Remote SSH, które do połączenia potrzebuje lokalnej instalacji VS Code.