Instalacja podstawowego oprogramowania

W sekcji Instalacja podstawowego oprogramowania pokazujemy, jakie narzędzia są potrzebne do podstawowego tworzenia stron internetowych i jak je prawidłowo zainstalować.

Jakich narzędzi używają profesjonaliści?

  • Komputer. Może wydaje się to oczywiste dla niektórych ludzi, ale część z Was czyta ten artykuł w telefonie lub na komputerze w bibliotece. Dla poważnego tworzenia stron internetowych, lepiej jest zainwestować w komputer stacjonarny lub laptop z systemem Windows, macOS lub Linux.
  • Edytor tekstowy, do pisania kodu. Może to być edytor tekstowy (np. Visual Studio Code, Notepad++, Sublime Text, Atom, GNU Emacs, lub VIM), lub edytor hybrydowy (np. Dreamweaver lub WebStorm). Edytory dokumentów biurowych nie nadają się do tego celu, ponieważ opierają się na ukrytych elementach, które zakłócają działanie silników renderujących używanych przez przeglądarki internetowe.
  • Przeglądarki internetowe, do testowania kodu. Obecnie najczęściej używanymi przeglądarkami internetowymi są Firefox, Chrome, Opera, Safari, Internet Explorer i Microsoft Edge. Należy także sprawdzić, jak twoja strona działa na urządzeniach mobilnych i na starszych przeglądarkach, których wciąż mogą używać twoi odbiorcy (takich jak IE 8–10.) Lynx, terminalowa przeglądarka tekstowa, jest świetna do sprawdzenia, jak Twoja strona jest doświadczana przez użytkowników z wadami wzroku.
  • Edytor graficzny, taki jak GIMP, Figma, Paint.NET, Photoshop, lub XD, do tworzenia obrazów lub grafiki dla swoich stron internetowych.
  • System kontroli wersji, do zarządzania plikami na serwerach, współpracy przy projekcie z zespołem, współdzielenia kodu i zasobów oraz unikania konfliktów edycyjnych. Obecnie Git jest najpopularniejszym systemem kontroli wersji, wraz z serwisem hostingowym GitHub lub GitLab.
  • Program FTP, używany na starszych kontach hostingowych do zarządzania plikami na serwerach (Git coraz częściej zastępuje w tym celu FTP). Dostępnych jest wiele programów (S)FTP, w tym Cyberduck, Fetch i FileZilla.
  • System automatyzacji, taki jak Webpack, Grunt lub Gulp, który automatycznie wykonuje powtarzające się zadania, takie jak minifikacja kodu i przeprowadzanie testów.
  • Biblioteki, frameworki, itp., aby przyspieszyć pisanie powszechnych funkcji. Biblioteka jest zazwyczaj istniejącym plikiem JavaScript lub CSS, który zapewnia gotowe funkcje do wykorzystania w kodzie. Framework ma tendencję do kontynuowania tego pomysłu, oferując kompletny system z niestandardowymi składniami do pisania aplikacji internetowej na najwyższym poziomie.
  • Oraz wiele więcej narzędzi!

Jakich właściwie narzędzi potrzebuję na teraz?

Wygląda to na przerażającą listę, ale na szczęście można zacząć tworzyć strony internetowe, nie wiedząc nic o większości z nich. W tym artykule przedstawimy Ci tylko minimum - edytor tekstu i kilka nowoczesnych przeglądarek internetowych.

Instalacja edytora tekstowego

Prawdopodobnie masz już podstawowy edytor tekstu na swoim komputerze. Domyślnie Windows zawiera Notatnik a macOS dostarczany jest z TextEdit. Dystrybucje Linuksa różnią się od siebie; na Ubuntu jest to gedit.

W przypadku tworzenia stron internetowych, przydałby ci się jednak lepszy edytor tekstowy. Polecamy zacząć od Visual Studio Code, który jest darmowym edytorem, oferującym podglądy na żywo i podpowiedzi do kodu.

Instalacja nowoczesnych przeglądarek internetowych

Na razie zainstalujemy kilka przeglądarek internetowych, aby przetestować nasz kod. Wybierz swój system operacyjny poniżej i kliknij odpowiednie linki aby pobrać instalatory swoich ulubionych przeglądarek:

Zanim przejdziesz dalej, należy zainstalować co najmniej dwie z tych przeglądarek i mieć je gotowe do testów.

Uwaga: Internet Explorer nie jest kompatybilny z niektórymi nowoczesnymi funkcjami sieciowymi i może nie być w stanie uruchomić twojego projektu. Zazwyczaj nie musisz się martwić o to, aby twoje projekty były z nim kompatybilne, ponieważ bardzo niewiele osób nadal z niego korzysta - na pewno nie martw się o niego zbytnio podczas nauki. Czasami możesz natknąć się na projekt, który wymaga wsparcia.

Instalacja lokalnego serwera sieciowego

Niektóre przykłady będą musiały być uruchamiane przez serwer sieciowy, aby działały poprawnie. Możesz dowiedzieć się jak to zrobić w Jak skonfigurować lokalny serwer testowy?

W tym module