Udostępnij za pośrednictwem


Samouczek: tworzenie aplikacji kontenera za pomocą programu Visual Studio Code

Ten samouczek jest początkiem czteroczęściowej serii wprowadzającej docker do użycia z programem Visual Studio Code (VS Code). Dowiesz się, jak tworzyć i uruchamiać kontenery platformy Docker, utrwalać danei zarządzać wieloma kontenerami za pomocą narzędzia Docker Compose.

Program VS Code oferuje rozszerzenie narzędzi kontenera, które umożliwia pracę z lokalną usługą docker Desktop. Program Docker Desktop działa na komputerze i zarządza lokalnymi kontenerami, które są kompaktowymi środowiskami zwirtualizowanymi, które zapewniają platformę do tworzenia i uruchamiania aplikacji. Kontenery nie wymagają rozmiaru i obciążenia kompletnego systemu operacyjnego.

Z tego pierwszego samouczka dowiesz się, jak wykonywać następujące działania:

  • Tworzenie kontenera platformy Docker.
  • Tworzenie obrazu kontenera.
  • Uruchom kontener aplikacji.

Warunki wstępne

Samouczek działa z systemem Windows 10 lub nowszym i programem Docker Desktop skonfigurowanym do korzystania z kontenerów systemu Linux.

Tworzenie kontenera

Kontener to proces na komputerze. Jest odizolowany od wszystkich innych procesów na komputerze hosta. Ta izolacja używa przestrzeni nazw jądra i grup kontrolnych.

Kontener używa izolowanego systemu plików. Ten niestandardowy system plików jest dostarczany przez obraz kontenera . Obraz zawiera wszystkie elementy potrzebne do uruchomienia aplikacji, takie jak wszystkie zależności, konfiguracja, skrypty i pliki binarne. Obraz zawiera również inną konfigurację kontenera, taką jak zmienne środowiskowe, domyślne polecenie do uruchomienia i inne metadane.

Po zainstalowaniu rozszerzenia Narzędzia kontenera dla programu VS Code można pracować z kontenerami w programie VS Code. Oprócz menu kontekstowych w Eksploratorze kontenerów możesz wybrać pozycję Terminal>Nowy terminal , aby otworzyć okno wiersza polecenia. Można również uruchamiać polecenia w oknie powłoki Bash. O ile nie określono, każde polecenie oznaczone jako powłoki Bash może działać w oknie powłoki Bash lub w terminalu programu VS Code.

  1. Ustaw pozycję Docker na tryb kontenera systemu Linux. Aby przełączyć się do kontenerów systemu Linux, jeśli obecnie ustawiono kontenery systemu Windows, kliknij prawym przyciskiem myszy ikonę platformy Docker na pasku zadań systemowych, gdy jest uruchomiony program Docker Desktop, a następnie wybierz pozycję Przełącz do kontenerów systemu Linux.

  2. W programie VS Code wybierz pozycję Terminal>New Terminal.

  3. W oknie terminalu lub w oknie Bash uruchom to polecenie.

    docker run -d -p 80:80 docker/getting-started
    

    To polecenie zawiera następujące parametry:

    • -d Uruchom kontener w trybie odłączonym w tle.
    • -p 80:80 Przypisywanie portu 80 hosta do portu 80 w kontenerze.
    • docker/getting-started Określa obraz do użycia.

    Napiwek

    Możesz połączyć flagi składające się z pojedynczych znaków, aby skrócić pełne polecenie. Na przykład powyższe polecenie można napisać jako:

    docker run -dp 80:80 docker/getting-started
    
  4. W programie VS Code wybierz ikonę Kontenery po lewej stronie, aby wyświetlić Eksploratora kontenerów.

    Zrzut ekranu przedstawiający rozszerzenie Narzędzia kontenera z uruchomionym samouczkiem docker/getting-started.

    Rozszerzenie VS Code Narzędzia Kontenerowe pokazuje kontenery uruchomione na Twoim komputerze. Możesz uzyskać dostęp do dzienników kontenerów i zarządzać cyklem życia kontenera, takim jak zatrzymywanie i usuwanie.

    Nazwa kontenera, modest_shockley w tym przykładzie, jest tworzona losowo. Twój będzie miał inną nazwę.

  5. Kliknij prawym przyciskiem myszy docker/getting-started, aby otworzyć menu kontekstowe. Wybierz pozycję Otwórz w przeglądarce.

    Zamiast tego otwórz przeglądarkę i wprowadź http://localhost/tutorial/.

    Zobaczysz stronę hostowaną lokalnie na temat platformy DockerLabs.

  6. Kliknij prawym przyciskiem myszy docker/getting-started, aby otworzyć menu kontekstowe. Wybierz pozycję Usuń, aby usunąć ten kontener.

    Aby usunąć kontener przy użyciu wiersza polecenia, uruchom następujące polecenie, aby uzyskać identyfikator kontenera:

    docker ps
    

    Następnie zatrzymaj i usuń kontener:

    docker stop <container-id>
    docker rm <container-id>
    
  7. Odśwież przeglądarkę. Strona Wprowadzenie, która została wyświetlona chwilę temu, zniknęła.

Tworzenie obrazu kontenera dla aplikacji

W tym samouczku używana jest prosta aplikacja Todo.

Zrzut ekranu przedstawia przykładową aplikację z kilkoma dodanymi elementami oraz polem tekstowym i przyciskiem umożliwiającym dodanie nowych elementów.

Aplikacja umożliwia tworzenie elementów roboczych i oznaczanie ich jako ukończonych lub usunięcie.

Aby skompilować aplikację, utwórz plik Dockerfile. Plik Dockerfile to tekstowy skrypt instrukcji używany do tworzenia obrazu kontenera.

  1. Przejdź do repozytorium Docker Getting Started Tutorial, a następnie wybierz opcję Kod>Pobierz plik ZIP. Wyodrębnij zawartość do folderu lokalnego.

    Zrzut ekranu przedstawia część witryny GitHub z wyróżnionym zielonym przyciskiem Kod i opcją Pobierz plik ZIP.

  2. W programie VS Code wybierz pozycję Plik>Otwórz folder. Przejdź do folderu aplikacji w wyodrębnionym projekcie i otwórz ten folder. Powinien zostać wyświetlony plik o nazwie package.json i dwa foldery o nazwie src i specyfikacji .

    zrzut ekranu programu Visual Studio Code przedstawiający plik package.json otwarty z załadowaną aplikacją.

  3. Utwórz plik o nazwie dockerfile w tym samym folderze co plik package.json z następującą zawartością.

    FROM node:lts-alpine
    RUN apk add --no-cache python3 g++ make
    WORKDIR /app
    COPY . .
    RUN yarn install --production
    CMD ["node", "/app/src/index.js"]
    

    Notatka

    Upewnij się, że plik nie ma rozszerzenia pliku, takiego jak .txt.

  4. W eksploratorze plików po lewej stronie VS Code, kliknij prawym przyciskiem myszy na plik Dockerfile, a następnie wybierz opcję Build Image. Wprowadź getting-started jako tag obrazu w polu wprowadzania tekstu.

    Etykieta jest przyjazną nazwą zdjęcia.

    Aby utworzyć obraz kontenera z poziomu wiersza polecenia, użyj następującego polecenia w folderze app zawierającym Dockerfile.

    docker build -t getting-started .
    

Użyłeś Dockerfile do utworzenia nowego obrazu kontenera. Możesz zauważyć, że pobrano wiele "warstw". Dockerfile . Chyba że ten obraz był już na komputerze, ten obraz musi zostać pobrany.

Po pobraniu obrazu, Dockerfile kopiuje twoją aplikację i używa yarn do instalacji jej zależności. Wartość CMD w pliku Dockerfile określa domyślne polecenie do uruchomienia podczas uruchamiania kontenera z tego obrazu.

Polecenie . na końcu docker build informuje, że Docker powinien szukać pliku Dockerfile w bieżącym katalogu.

Uruchamianie kontenera aplikacji

Teraz, gdy masz obraz, możesz uruchomić aplikację.

  1. Aby uruchomić kontener, użyj następującego polecenia.

    docker run -dp 3000:3000 getting-started
    

    Parametr -d wskazuje, że kontener jest uruchomiony w trybie odłączonym w tle. Wartość -p tworzy mapowanie między portem hosta 3000 a portem kontenera 3000. Bez mapowania portów nie można uzyskać dostępu do aplikacji.

  2. Po kilku sekundach w programie VS Code w Eksploratorze kontenerów w obszarze KONTENERY kliknij prawym przyciskiem myszy pozycję Wprowadzenie i wybierz polecenie Otwórz w przeglądarce. Zamiast tego możesz otworzyć przeglądarkę internetową pod adresem http://localhost:3000.

    Powinieneś zobaczyć działającą aplikację.

    Zrzut ekranu przedstawia przykładową aplikację bez elementów i tekst

  3. Dodaj element lub dwa, aby sprawdzić, czy działa zgodnie z oczekiwaniami. Możesz oznaczyć elementy jako kompletne i usunąć elementy. Front-end pomyślnie przechowuje elementy w back-endzie.

Następne kroki

Ukończyłeś ten samouczek i masz działający menedżer listy zadań z kilkoma pozycjami. Wiesz już, jak tworzyć obrazy kontenerów i uruchamiać konteneryzowaną aplikację.

Zachowaj wszystko, co zostało zrobione do tej pory, aby kontynuować tę serię samouczków. Następnie spróbuj wykonać część II tej serii:

Poniżej przedstawiono niektóre zasoby, które mogą być przydatne: