Hostowanie twojej strony na Github

Github jest firmą której głównym celem jest przechowywanie i udostępnianie, często mówimy w tym kontekście o hostowaniu, na określonych zasadach "repozytorium kodu", czyli całego kodu projektu. Wiele repozytoriów kodu hostowanych jest na licencji  "otwartego źródła" (ang. open source), co oznacza że ich licencja zezwala na wykorzystanie takiego repozytorium do dowolnego własnego celu wraz z modyfikacją jego kodu. To jest wspaniałe, ponieważ właśnie w ten sposób programiści uczą się od siebie! Khan Academy także posiada kilka repozytoriów z otwartym kodem źródłowym. Takie repozytoria kodu źródłowego mogą zawierać kod źródłowy w różnych językach programowania nie tylko HTML i CSS, lecz w jakimkolwiek innym, który jest potrzebny do działania projektu.

Czemu wspominam akurat o tym serwisie? Ponieważ, Github ma także funkcjonalność stron Github, która w prosty i darmowy sposób umożliwia stworzenie strony internetowej składającej się z wielu plików. Strona będzie widoczna pod adresem twojanazwauzytkownika.github.io, czyli składa się z twojego loginu na github i sufiksu ".github.io".

Wejdź na github.com, zobaczysz formularz rejestracyjny na pierwszej stronie. (Jeśli go nie zobaczysz - gratulacje! Już posiadasz konto! Możesz przejść do kolejnego punktu.)

Kiedy będziesz wybierać nazwę użytkownika, pamiętaj że będzie publicznie widoczna, a także będzie częścią adresu twojej strony: http://twoja_nazwa_użytkownika.github.io. Niektórzy, dbając o swoją prywatność lubią używać pseudonimów lub zabawnych słów zamiast ich prawdziwych imion i nazwisk, lecz to już zależy od ciebie.

W drugim kroku wybierz plan darmowy. Repozytorium twojej strony będzie publicznie dostępne, zatem nie musisz płacić za możliwość posiadania prywatnych repozytoriów. (Zawsze możesz to zmienić później, w razie potrzeby posiadania prywatnych repozytoriów)

Krok trzeci: Możesz odpowiedzieć na pytania ankiety, lub pominąć ten krok:

Po wypełnieniu formularza nowego konta, upewnij się w swojej skrzynce email znajduje się wiadomość od Github. Otwórz link "verify your email address".

Po potwierdzeniu swojego adresu email, zobaczysz poniższą stronę startową. Kliknij "Start a project"

Na stronie tworzenia projektu zostaniesz zapytany o nazwę projektu. Upewnij się, że nazwą projektu jest dokładnie taka sama jak nazwa użytkownika (login) z suffixem ".github.io", np dla użytkownika o loginie "PamelaFoxBot" nazwa projektu powinna być "PamelaFoxBot.github.io". To specjalnie nazwany projekt jest wskazówką dla Github aby wyświetlić go jako stronę HTML.

Gratuluję, właśnie utworzyłeś nowy projekt. Ale póki co, nie ma w nim plików. Możesz w szybki sposób utworzyć pierwszy plik. Kliknij na łącze "README"

Teraz patrzysz na interfejs edytora plików Github, dla pliku o nazwie README.md. Zmień nazwę pliku z README.md na index.html. Serwery spodziewają się że plik index.html będzie głównym plikiem w katalogu strony internetowej. Twój index może prowadzić do innych podstron na stronie internetowej.

Skasuj przykładową treść, która była w edytorze i w zamian wstaw kod HTML swojej strony internetowej. Możesz skopiować i wkleić kod HTML z projektu Khan Academy który tworzyłeś na swoim komputerze.

Przewiń stronę, aż do miejsca na komentarz do zatwierdzenia i wciśnij przycisk "Commit new file". Ponieważ, w mowie powszechnej nigdy nie spotkałem się z użyciem polskiego odpowiednika słowa zatwierdzenie (ang.'commit'), w dalszej części także będę używał oryginalnego określenia. Pamiętaj jednak, że chodzi o zatwierdzenie zmian w repozytorium. Za każdym razem gdy tworzysz nową wersję pliku tworzysz "commit" aby zapisać jego wersję w historii wersji. Każdy commit może posiadać wiadomość opisującą zmiany. Dobrą praktyką jest by zawsze umieszczać opis jakie zmiany wprowadza commit. Github sugeruje domyślną wiadomość (w tym przypadku "utworzenie pliku index.html"), ale możesz ją zmienić poprzez podanie swojego opisu w polu komentarza.

Github zabiera od 1 do 10 minut, aby wgrać na twoją stronę internetową zmiany jakie wykonałeś w projekcie. Zatem musisz się uzbroić w cierpliwość. Czasami będziesz musiał wykonać "twarde odświeżenie" (przytrzymując klawisz shift podczas odświeżania), aby wymusić wyczyszczenie  pamięci podręcznej przeglądarki. Klawisz shift, to ten który zmienia wielkość wpisywanych liter.

Niektórzy z was mogą już pracować nad stronami składającymi się z wielu plików poza Khan Academy, lokalnie, na swoim komputerze. Twoja strona może mieć wiele plików HTML, CSS, JS i zdjęć.

Jeśli chcesz wgrać taką stronę na Github, nie martw się. Nie musisz kopiować i wklejać każdego z tych pojedynczych plików z osobna. To mogłoby rzeczywiście okazać się dość żmudnym zajęciem. Istnieje lepszy sposób... 

Zobaczysz interfejs Github, do jednoczesnego wgrywania wielu plików. Aby zaznaczyć pliki do wgrania przeciągnij je i upuść na poniższe pole lub kliknij na link "wybierz swoje pliki" (choose your files)

Ogólnie rzecz biorąc chcesz wgrać wszystkie zmienione przez ciebie pliki. Jeśli nie jesteś pewny o które chodzi, po prostu prześlij wszystkie. Github korzysta z algorytmów sprawdzających co się zmieniło i tworzy wersję wyłącznie zmienionych plików.

Pamiętaj, że zanim zobaczysz zmiany może upłynąć nawet 10 minut. Cierpliwości, cierpliwość jest cnotą.

Dlatego najlepiej rozwijać i testować stronę na lokalnym komputerze, a na Github (lub na innego dostawcę hostingu) wgrywać zmiany tylko jak już jesteś zadowolony z tego jak Twoja strona wygląda lokalnie.