Darmowy kurs projektowania UI/UX
Dowiedz się, jak tworzyć wyjątkowe projekty, czytając mój nowy samouczek.
Rozpocznij naukę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").
![](https://mdbcdn.b-cdn.net/learn/mdb-foundations/basics/deploy-your-project/assets/node.jpg)
Po pobraniu, uruchom plik, zaakceptuj warunki i po prostu klikaj "Dalej", aż instalacja zostanie zakończona.
![](https://mdbcdn.b-cdn.net/learn/mdb-foundations/basics/deploy-your-project/assets/node-install.jpg)
Po zakończeniu instalacji, zobaczysz okno terminala, jak na zrzucie ekranu poniżej. Kliknij dowolny przycisk, aby kontynuować.
![](https://mdbcdn.b-cdn.net/learn/mdb-foundations/basics/deploy-your-project/assets/node-terminal-terms.jpg)
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).
![](https://mdbcdn.b-cdn.net/learn/mdb-foundations/basics/deploy-your-project/assets/node-version.jpg)
Krok 2 - Utwórz konto MDB
Pomiń ten krok, jeśli już masz konto MDB (które założyłeś na mdbootstrap.com lub mdbgo.com )
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.
![](https://mdbcdn.b-cdn.net/learn/mdb-foundations/basics/deploy-your-project/assets/mdbgo-version.jpg)
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.
![](https://mdbcdn.b-cdn.net/learn/mdb-foundations/basics/deploy-your-project/assets/mdb-login.gif)
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.
![](https://mdbcdn.b-cdn.net/learn/mdb-foundations/basics/deploy-your-project/assets/terminal-path.jpg)
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ć.
![](https://mdbcdn.b-cdn.net/learn/mdb-foundations/basics/deploy-your-project/assets/mdb-publish.jpg)
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/
![John Doe](https://pbs.twimg.com/profile_images/1154666340298493952/F57OFDN7_400x400.jpg)
O autorze
Michal Szymanski
Współzałożyciel MDBootstrap / Umieszczony na liście Forbes „30 under 30” / Entuzjasta oprogramowania open-source / Tancerz, miłośnik wiedzy i książek.
Autor setek artykułów na temat programowania, biznesu, marketingu i efektywności. W przeszłości pracował jako edukator z młodzieżą z problemami w sierocińcach i zakładach karnych.