Kompilowanie i uruchamianie przykładowej aplikacji z todo

Uwaga

Jest to kontynuacja samouczka, który rozpoczyna się tutaj

W pozostałej części tego samouczka będziesz pracować z prostym menedżerem listy zadań do Node.js. Jeśli nie znasz jeszcze Node.js, nie martw się! Nie jest potrzebne żadne rzeczywiste środowisko języka JavaScript!

W tym momencie twój zespół programistów jest dość mały i po prostu budowania aplikacji, aby udowodnić swoją minimalną konieczną konieczną jakość produktu. Chcesz pokazać, jak to działa i co jest w stanie zrobić bez konieczności myślenia o tym, jak będzie działać dla dużego zespołu, wielu deweloperów i tak dalej.

Zrzut ekranu menedżera listy zadań do zrzucie ekranu

Pobierz aplikację

Przed uruchomieniem aplikacji należy pobrać kod źródłowy aplikacji na swoją maszynę. W przypadku rzeczywistych projektów zwykle klonowane jest repo. Jednak w tym samouczku utworzono plik ZIP zawierający aplikację.

  1. Jeśli używasz programu Windows, upewnij się, że na komputerze lokalnym zainstalowano platformę Docker for Windows lub Docker Community Edition. Zobacz dokumentację dotyczącą instalacji Windows Docker. Proces instalacji sprawia, że plik ZIP zawierający przykład jest dostępny pod adresem localhost. W przypadku komputerów Mac zainstaluj program Docker Desktop dla komputerów Mac.

  2. Pobierz źródło aplikacji z repo platformy Docker. Możesz pobrać plik ZIP dla tego repo. Aby pobrać plik ZIP, użyj zielonego przycisku Kod i wybierz pozycję Pobierz plik ZIP. Otwórz plik ZIP i wyodrębnij wszystko, aby wyodrębnić źródło aplikacji z folderu aplikacji do folderu na dysku twardym.

    Zrzut ekranu przedstawiający zielony przycisk Kod i opcję Pobierz plik ZIP

  3. Po wyodrębnienia użyj ulubionego edytora kodu, aby otworzyć projekt. Jeśli potrzebujesz edytora, możesz użyć Visual Studio Code . Powinny zostać wyświetlony package.json dwa podkatalogi ( src i spec ).

    Zrzut ekranu Visual Studio Code z załadowaną aplikacją

Budowania obrazu kontenera aplikacji

Aby skompilować aplikację, należy użyć Dockerfile . Plik Dockerfile jest po prostu skryptem tekstowym z instrukcjami używanymi do tworzenia obrazu kontenera. Jeśli pliki Dockerfile zostały utworzone wcześniej, poniżej może zostać wyświetlonych kilka wad pliku Dockerfile. Ale nie martw się! Przejmiemy je.

  1. Utwórz plik o Dockerfile nazwie w tym samym folderze co plik o package.json następującej zawartości.

    FROM node:12-alpine
    WORKDIR /app
    COPY . .
    RUN yarn install --production
    CMD ["node", "/app/src/index.js"]
    

    Sprawdź, czy plik nie Dockerfile ma rozszerzenia pliku, takiego jak .txt . Niektóre edytory mogą automatycznie dołączać to rozszerzenie pliku, co spowoduje błąd w następnym kroku.

  2. Jeśli jeszcze tego nie zrobiono, otwórz terminal i przejdź do app katalogu za pomocą . Dockerfile Teraz skompilowanie obrazu kontenera przy użyciu docker build polecenia .

    docker build -t getting-started .
    

    Alternatywnie możesz również kliknąć prawym przyciskiem myszy plik Dockerfile i wybrać polecenie Build Image... (Skompilowanie obrazu),a następnie określić tag w wierszu polecenia.

    To polecenie użyło pliku Dockerfile do skompilowania nowego obrazu kontenera. Być może udało Ci się zauważyć, że pobrano wiele "warstw". Wynika to z tego, że poinstruowany konstruktor, że chcesz rozpocząć od node:12-alpine obrazu. Jednak ponieważ nie masz go na swojej maszynie, ten obraz musiał zostać pobrany.

    Po pobraniu obrazu został on skopiowany w aplikacji i użyty do yarn zainstalowania zależności aplikacji. Dyrektywa CMD określa domyślne polecenie do uruchomienia podczas uruchamiania kontenera z tego obrazu.

    Na koniec -t flaga oznacza obraz. Pomyśl o tym po prostu jako o czytelnej dla człowieka nazwie obrazu końcowego. Ponieważ obraz został nazwany getting-started , możesz odwołać się do tego obrazu po uruchomieniu kontenera.

    Na końcu polecenia informuje, że . docker build docker powinien szukać w Dockerfile bieżącym katalogu.

Uruchamianie kontenera aplikacji

Teraz, gdy masz już obraz, uruchom aplikację. Aby to zrobić, użyj docker run polecenia (pamiętaj, że wcześniej?).

  1. Uruchom kontener przy użyciu polecenia i określ nazwę właśnie docker run utworzonego obrazu:

    docker run -dp 3000:3000 getting-started
    

    Pamiętasz -d -p flagi i ? Uruchamiasz nowy kontener w trybie "odłączony" (w tle) i tworzysz mapowanie między portem 3000 hosta a portem 3000 kontenera. Bez mapowania portów nie można uzyskać dostępu do aplikacji.

  2. Po kilku sekundach otwórz w przeglądarce internetowej adres http://localhost:3000 . Powinna zostać wyświetlony aplikacja!

    Pusta lista zadań do zdjęć

  3. Dodaj element lub dwa i zobacz, że działa zgodnie z oczekiwaniami. Elementy można oznaczać jako ukończone i usuwać. Frontonie pomyślnie przechowują elementy w zadumienie. Dosyć szybko i łatwo, prawda?

W tym momencie powinien być uruchomiony menedżer listy zadań do rzeczy z kilkoma elementami, wszystko sbudowaną przez Ciebie. Teraz dokonajmy kilku zmian i dowiedzmy się więcej na temat zarządzania kontenerami.

Jeśli szybko przyjrzysz się rozszerzeniu aplikacji VS Code, powinny być teraz uruchomione dwa kontenery (ten samouczek i nowo uruchomiony kontener aplikacji)!

Rozszerzenie platformy Docker z uruchomionym samouczkiem i kontenerami aplikacji

Podsumowanie

W tej krótkiej sekcji poznaliśmy podstawowe informacje dotyczące tworzenia obrazu kontenera i utworzono w tym celu plik Dockerfile. Po s zbudowaniu obrazu uruchomiliśmy kontener i zobaczyliśmy uruchominą aplikację.

Następnie dokonasz modyfikacji aplikacji i dowiesz się, jak zaktualizować uruchamianą aplikację przy użyciu nowego obrazu. W ten sposób poznasz kilka innych przydatnych poleceń.

Następne kroki

Kontynuuj pracę z samouczkiem!