Wordpress: Środowisko deweloperskie na macOS

0:00Cześć! Witaj w kolejnej lekcji, w której chciałbym pokazać Ci, jak skonfigurować lokalne

0:04środowisko deweloperskie w systemie macOS. To tak, jakby Twój

0:08komputer był serwerem, na którym działa strona czy aplikacja internetowa. Będziesz

0:13mógł dzięki temu rozwijać ją lokalnie i dodawać nowe elementy,

0:18również działając w trybie offline. Takie lokalne środowisko deweloperskie

0:22jest też niezwykle praktyczne pod kątem utrzymania aplikacji, ponieważ

0:26powinieneś rozdzielić właśnie to środowisko, gdzie testujesz, optymalizujesz,

0:30dodajesz jakieś nowe funkcje do Twojej strony czy aplikacji webowej, a z drugiej strony jej

0:35wersję produkcyjną, czyli taką, która jest dostępna na zewnętrznym

0:39serwerze i dostępna dla klientów, czyli twoich użytkowników. W momencie

0:43kiedy będziesz gotowy wgrać te zmiany, które zrobisz sobie lokalnie na

0:48produkcie, po prostu zaktualizujesz pliki, a w bardziej wymagających środowiskach, czy

0:52też przy okazji współpracy z innymi programistami, będziesz do tego

0:56celu wykorzystywał jeszcze inne narzędzia, takie jak na przykład Git, ale tego nauczysz się

1:01jeszcze później. Na razie spróbujmy skonfigurować - z pomocą prostej

1:05aplikacji MAMP - nasze lokalne środowisko deweloperskie. Aplikację MAMP

1:09możesz pobrać ze strony i ja mam ją w wersji 5.2. Jeżeli

1:14nowsza wersja, którą pobierzesz, będzie znacznie się różnić od tej mojej, proponuję Ci

1:18po prostu pobrać sobie tę wersję starszą i później się dopiero zaktualizować. Instalacja

1:24aplikacji MAMP jest niezwykle prosta. Musisz przejść przez kilka

1:28prostych kroków, które sprowadzają się do zaakceptowania licencji,

1:32i możesz też wybrać w opcji Installation Type sekcję Customise, a

1:37następnie odłączyć sobie wariant MAMP PRO. MAMP występuje

1:41w dwóch wersjach. Wersja PRO to wersja płatna, ale nam w zupełności wystarczy ta

1:46wersja darmowa. W momencie gdy MAMP będzie już zainstalowany na Twoim komputerze, wystarczy,

1:51że go uruchomisz. Ja z pomocą Findera wpisałem tutaj MAMP i teraz będę

1:55mógł wystartować serwery. To spowoduje, że serwer Apache

2:00oraz serwer bazy danych mySQL zostanie uruchomiony lokalnie

2:04na moim komputerze. Teraz mogę przejść do przeglądarki i w

2:08pasku adresu podać localhost:8888. Te

2:12cztery ósemki to jest port, na którym działa w tym momencie MAMP i jeżeli

2:16wszystko poszło okej, to powinieneś zobaczyć Index of, czyli to znaczy, że wszystkie

2:21serwisy działają poprawnie. Jeżeli wyłączyłbym serwer, miałbym znów

2:25tę stronę niedostępną. Przejdźmy teraz do ustawień MAMPA. Przejdę

2:29do preferencji, czyli MAMP, a następnie Preferences. Możesz wcisnąć

2:33Cmd+średnik i teraz możemy przejść do sekcji Porty. Mamy

2:37tutaj te porty, które możemy sobie skonfigurować. I możemy też je

2:42przywrócić do portów domyślnych, czyli jeśli wybierzesz opcję Set Web

2:46and mySQL ports to 80 i 3306 i zatwierdzisz,

2:50to teraz serwer zostanie odświeżony i będzie działał na portach domyślnych. Musimy

2:55jeszcze się zautoryzować w naszym systemie, dać zezwolenie na korzystanie tej aplikacji ze

3:00wspomnianych portów. I teraz już nie będziesz musiał używać tego ":8888" i

3:06po prostu localhost będzie się wyświetlał jako indeks Twojej

3:10głównej witryny. To jest tak, że różne aplikacje na Twoim komputerze działają

3:14sobie na różnych portach. Czasem może wystąpić konflikt tych portów

3:18i jeśli jakaś aplikacja będzie blokowała przykładowo te domyślne

3:22porty, możesz mieć problem z uruchomieniem Twojej strony. Dlatego możesz

3:27przejść do terminala i jeżeli taki problem występuje, wpisać sobie następujące

3:31polecenie i autoryzować hasłem. To polecenie wyświetli Ci

3:36wszystkie porty, które obecnie są zajęte przez aplikacje różne

3:41otwarte i wtedy będziesz mógł ewentualnie taką aplikację zamknąć albo zmodyfikować

3:45porty w zależności od Twoich potrzeb. Możesz też skorzystać ewentualnie

3:49z Network Utility i tutaj w sekcji Port

3:53Scan wpisać sobie localhost, wybrać opcję Scan i to przeskanuje

3:57również wszystko, co działa lokalnie na Twoim komputerze i zwróci Ci

4:02otwarte aktualnie porty. W naszym przypadku żadne błędy nie występują. Mamy

4:06index of, więc nie musimy się przejmować portami. Przejdźmy w związku z tym jeszcze

4:10raz do preferencji MAMPA. Cmd+średnik a następnie w

4:14sekcji General odznaczmy te dwa checkboxy i uruchamiajmy serwery

4:18przy każdym starcie MAMPA. Jak również możemy upewnić się, czy wersja

4:22interpretera PHP jest wybrana na najnowszą. W  moim przypadku 7.2 i wersja

4:27bazy danych mySQL. Przejdźmy teraz do sekcji Web Server. Tutaj

4:32mamy do wyboru serwer Apache, z którego będziemy korzystać, a także to

4:36miejsce, w którym będzie domyślna ścieżka do naszej strony, czyli w którym znajdą

4:40się wszystkie pliki naszego projektu. Wybieramy polecenie Show in Finder. Okazuje

4:44się, że jest to w katalogu Applications, później MAMP i htdocs, czyli to właśnie

4:49w tym folderze będą lądowały wszystkie pliki, które

4:53będą dotyczyły naszego projektu. Natomiast tę ścieżkę

4:57możemy zawsze sobie zmienić i przykładowo możemy przejść do dokumentów, następnie utworzyć

5:01tutaj nowy folder. Ja nazwę go WWW. Od razu zrobię sobie skrót

5:05do tego folderu tutaj pod Desktopem i to tutaj chciałbym, żeby

5:09znajdowały się pliki. Czyli wybieram polecenie Select, aby zmienić ten katalog. I

5:13wskazuję na katalog WWW. Jak widzisz, teraz już będziemy

5:18mogli w tym katalogu WWW tworzyć sobie pliki. Po zapisaniu przez OK

5:22nasz serwer zostanie ponownie uruchomiony, a ja mogę z pomocą

5:26na przykład aplikacji Visual Studio teraz skonfigurować

5:30sobie ten folder, czyli przenieść po prostu tę malutką ikonkę i upuścić

5:34ją na Visual Studio. W tym momencie będę miał dostęp do całego

5:39katalogu WWW i mogę w nim, powiększmy sobie okno, stworzyć

5:43nowy plik. Nazwę go index.html. Wkleję tutaj

5:47podstawową strukturę, HTML-a, która powinna wyświetlić Hello Server! I

5:51zobaczymy na stronie localhost. P o odświeżeniu powinniśmy widzieć dokładnie

5:55tę frazę Hello Server!, czyli wszystko działa poprawnie. Ten plik index.html też znalazł się

6:00już katalogu WWW, więc wszystko jest okej. Jeżeli chodzi o MAMPA, to

6:04co prawda nie możesz na raz uruchamiać kilku projektów, przynajmniej

6:08w tej wersji darmowej, w wersji PRO j est to możliwe, natomiast nie będziesz

6:12w zasadzie musiał. Głównie będziemy pracować na jednym projekcie, natomiast gdybyś chciał, możesz

6:16też skorzystać z takiej sztuczki, polegającej na utworzeniu kolejnego projektu. Mogę

6:21sobie zrobić kopię tego folderu i będę tutaj miał

6:25też plik index.html, który otworzę z pomocą Visual Studio Code i wyedytuję

6:30go na Hello Server 2!, a następnie będziesz musiał

6:34przełączyć się po prostu w MAMP-ie, w preferencjach, i wybrać ten

6:38drugi folder, czyli moim przypadku WWW copy. W  tym momencie, jeśli

6:42zatwierdzić zmiany, serwer zostanie zrestartowany i będziesz już mógł

6:47przejść do localhosta. Zobaczysz, że działamy teraz w drugim katalogu. W

6:51wersji PRO będziesz mógł uruchamiać sobie wiele projektów, ale też podrzucam

6:55link do dokumentacji, który pokaże Ci, jak można tę kwestię rozszerzyć

6:59również w wersji darmowej. Nam na potrzeby szkolenia nie będzie to potrzebne, a

7:04więc ważne, żebyś po prostu wskazał teraz odpowiedni katalog i będziemy pracować

7:08na jednym projekcie.