Wdrożenie projektu

Sprawdź angielską wersje tej lekcji w naszym rozszerzonym tutorialu Bootstrap.

Stworzyłeś swój pierwszy mały projekt przy użyciu MDB. Gratulacje!

Teraz nadszedł czas, aby podzielić się nim ze światem!

W tej lekcji dowiesz się, jak dzięki MDB GO możesz łatwo i bezpłatnie opublikować oraz hostować swoją stronę w internecie.

Krok 1 - Zainstaluj Node.js

Aby uruchomić wiersz poleceń MDB (czyli MDB CLI) na swoim komputerze, potrzebujesz Node.js.

Aby go zainstalować, przejdź na https://nodejs.org/ i kliknij przycisk do pobrania.

Zobaczysz tam 2 przyciski - LTS po lewej stronie i Current po prawej stronie. Nie ma tak naprawdę znaczenia, którą wersję wybierzesz, ale aby nie przejmować się zbytnio, wybierz wersję po prawej ("Current").

Po pobraniu, uruchom plik, zaakceptuj warunki i po prostu klikaj "Dalej", aż instalacja zostanie zakończona.

Po zakończeniu instalacji, zobaczysz okno terminala, jak na zrzucie ekranu poniżej. Kliknij dowolny przycisk, aby kontynuować.

Teraz sprawdźmy, czy instalacja zakończyła się pomyślnie. Uruchom terminal (jeśli używasz systemu Windows, wpisz "cmd" wyszukiwaniu systemowym i uruchom aplikację Wiersz polecenia / na MacOS, szukaj aplikacji "terminal".

Następnie wpisz w terminalu node -v i kliknij enter. Powinieneś zobaczyć wersję zainstalowanego oprogramowania node.js, podobnie jak na poniższym ekranie (zauważ, że twoja wersja może być inna, ponieważ od momentu opublikowania tego samouczka mogła pojawić się aktualizacja).

Krok 2 - Utwórz konto MDB

Aby korzystać z MDB GO, potrzebujesz konta MDB. Możesz je założyć za darmo pod tym linkiem.

Najlepiej jest zarejestrować się używając swojego adresu e-mail. Ułatwi to korzystanie z konta w terminalu w przyszłości.

Wypełnij formularz, zarejestruj się i potwierdź swój adres e-mail.

Krok 3 - Zainstaluj MDB CLI

MDB CLI to narzędzie, które umożliwi ci zarządzanie swoimi projektami i publikowanie ich w Internecie za pomocą terminala na twoim komputerze.

Uruchom terminal i wpisz następujące polecenie. Następnie potwierdź je, klikając enter.

                                  
                                    npm install -g mdb-cli
                                  
                                

Wprowadź polecenie mdb -v w terminalu, aby sprawdzić, czy MDB CLI został poprawnie zainstalowany. Jeśli, podobnie jak na zrzucie ekranu poniżej, zobaczysz numer wersji (pamiętaj, że może się różnić), to wszystko jest w porządku.

Krok 4 - Zaloguj się na konto MDB w terminalu

Aby zalogować się do MDB GO, wprowadź w terminalu polecenie mdb login i naciśnij enter.

Następnie wprowadź swoją nazwę użytkownika i hasło, które ustawiłeś podczas rejestracji konta MDB.

Krok 5 - Zmień nazwę folderu, w którym znajduje się twój projekt, i nawiguj do niego w terminalu

Jesteśmy prawie gotowi, aby opublikować nasz projekt w Internecie. Został tylko jeden mały krok, który bardzo często jest pomijany przez początkujących programistów i sprawia im wiele frustracji.

Musimy po prostu nawigować w terminalu do folderu, w którym zapisaliśmy nasz projekt.

W poprzedniej lekcji pobrałem i rozpakowałem pakiet MDB w swoim katalogu "Downloads" i pracowałem nad nim w tej lokalizacji.

Oryginalna nazwa pobranego pakietu wygląda mniej więcej tak:

MDB5-STANDARD-UI-KIT-Free-6.0.0

To długa i skomplikowana nazwa, która może sprawić pewne problemy i trudności w nawigacji. Zmień ją na coś prostszego, na przykład:

mdb-tutorial

Przeniosłem ten folder na pulpit, i w rezultacie ścieżka do mojego projektu wygląda tak (przy okazji - pracuję na systemie Windows):

                                  
                                    C:\Users\MDB\Desktop\mdb-tutorial
                                  
                                

Teraz otwórz terminal i wpisz polecenie cd (co oznacza przejście do określonej ścieżki) i wklej ścieżkę do folderu, w którym masz swój projekt.

Jeśli wprowadziłeś prawidłową ścieżkę, powinieneś zobaczyć w terminalu, że zostałeś przeniesiony do wybranej lokalizacji.

Krok 6 - Opublikuj swój projekt!

Dobra, jesteśmy gotowi do działania!

1. W terminalu wpisz polecenie mdb publish i naciśnij enter. Zobaczysz wiadomość:

Required .mdb file not found. Create? (Y/n)

Wpisz literę "Y" i naciśnij enter.

2. Następnie zostaniesz poproszony o nazwę swojego projektu. Możesz pozostać przy mdb-tutorial, jeśli chcesz.

3. Potem zostaniesz zapytany o typ projektu. Domyślnie wybrana jest opcja frontend i pozostaniemy przy niej. Po prostu naciśnij enter.

4. Następnie zostaniesz zapytany o domyślny menedżer pakietów. Pozostań przy opcji npm i naciśnij enter ponownie.

5. Potem zostaniesz zapytany o kilka rzeczy, takich jak opis projektu czy jego wersja. Zignoruj te pytania i naciśnij enter we wszystkich, aż zobaczysz ostateczne pytanie Is this OK? (Yes). Kliknij enter także tutaj. Następnie twój projekt zacznie się wysyłać.

I jest gotowe! Twój projekt jest dostępny pod linkiem podanym w terminalu.

Ten link jest automatycznie skopiowany do schowka, więc możesz natychmiast nacisnąć ctrl + v i wkleić go do paska wyszukiwania w przeglądarce.

Kliknij w ten link i podziwiaj swój pierwszy projekt w MDB, dostępny online na całym świecie!

Na przykład, mój projekt jest dostępny pod adresem:

https://ascensus-mdb-tutorial.mdbgo.io/