Git i GitHub dla zielonych: tworzymy pierwsze repozytorium

Jest taki moment w nauce programowania, że chcesz podzielić się swoim kodem z innymi. Jeśli uczymy się w grupie, chcemy, by ktoś nasz kod sprawdził. Mamy problem, najwygodniej byłoby pokazać nasz kod komuś bardziej doświadczonemu, kto doradzi rozwiązanie. W trakcie poszukiwania pracy też chcemy nasze osiągnięcia pokazać. A w pracy nad jednym projektem, nawet jednym plikem może pracować kilka osób na raz. Co zrobić, żeby nie wchodzić sobie w drogę i nie nadpisywać zmian? Tutaj z pomocą przychodzi Git – system kontroli wersji. Swój kod wrzucisz na GitHuba – platformę do udostępniania projektów i ich kontrolowania za pomocą Gita.

Pierwsze kroki w GitHubie

Co to jest Github i czym się różni od Git’a?
W skrócie:

  • Git to system kontroli wersji, a więc narzędzie do zarządzania historią kodu źródłowego.
  • GitHub to usługa hostingowa dla repozytoriów Gitowych.

Więc nie są tym samym: Git jest narzędziem, a GitHub jest usługą, gdzie możemy trzymać projekty korzystające z Gita.

Więcej o tym czym jest Git i jak go obsługiwać znajdziecie we wpisie: Git dla początkujących – ucz się interaktywnie.

Teraz skupimy się tylko na tym jak udostępnić swój kod przez Githuba.

Utworzenie konta i pierwszego repozytorium (folderu) jest banalnie proste. Właściwie Github sam, od podstaw przeprowadza nas przez proces tworzenia konta i wrzucenia pierwszego projektu.

1. Rejestracja

W pierwszej kolejności należy zarejestrować nowe konto na Githubie przez: github.com/join. Należy dodać swoje podstawowe dane i utworzyć nazwę użytkownika. Pamiętajcie, że nazwę tę widać publicznie. Jest też bardzo prawdopodobne, że konto na Githubie w przyszłości podacie swojemu pracodawcy – nazwa użytkownika typu dvpa666 jest niezalecana 😉

github od podstaw - rejestracja

W kolejnym kroku Github proponuje nam darmowe (publiczne) lub płatne konto (możemy tworzyć repozytoria prywatne widziane tylko przez osoby, którym damy dostęp). Na początek konto darmowe wystarczy, nic więcej nie trzeba zaznaczać.

Do trzeciego kroku można nie przechodzić, bo będziemy dodawać nasz projekt krok po kroku poniżej.

2. Utworzenie pierwszego repozytorium

Zainstaluj Gita na swoim systemie ze strony git-scm.com.

Załóżmy, że mamy już stworzony prosty projekt, trzymamy go na pulpicie w folderze, w środku jest plik/i, które chcemy umieścić. Na potrzeby tutoriala utworzyłam plik index.html, wy możecie wrzucić dowolny plik tekstowy – notatki.txt.

Dodajemy nowe repozytorium:

Github nowe repozytorium

Nie tworzymy pliku README. Klikamy: create repository

3. Dodanie plików z komputera

Wracamy do siebie – lokalnie, na swój komputer. Na pulpicie mamy stworzony folder z jednym plikem, który chcielibyśmy dodać do naszego repozytorium.

Za pomocą konsoli (cmd – windows / terminal – linux & mac ) wchodzimy do katalogu, w którym jest nasz projekt. Moja ścieżka do folderu to po prostu Pulpit > NazwaFolderu. Jeśli swój projekt trzymacie w folderze dokumenty, czy gdziekolwiek indziej i nie jesteście pewni gdzie jest wasz folder:

  • Windows: należy kliknąć prawym przyciskiem myszy w folderze i wybrać właściwości, skopiować ścieżkę do folderu. Następnie w wierszu poleceń wpisujemy komendę cd oraz ścieżkę do folderu z plikiem np. cd C:\Users\rita\Documents\Form1
  • Linux: w folderze, w którym jesteśmy możemy wybrać prawy przycisk – uruchom terminal, terminal domyślnie uruchomi się ze ścieżką do tego folderu
  • Mac: ścieżkę do folderu można mieć podaną na dole Findera (instrukcja tutaj) lub odrazu skopiować spod menu / trybika (jak istnieje na to profesjonalna nazwa to przygarnę informację 😀 ), wklejamy do terminal z komendą cd czyli cd /Users/rita/Desktop/Form1

Każdą komendę potwierdzamy enterem. Jeśli wszyscy przebrnęli przez ten etap, to jesteśmy w naszym folderze, żeby się upewnić możemy użyć polecenia ls, które wylistuje nam wszystkie pliki w folderze lub, pwd pokaże nam pełną ścieżkę do aktualnego folderu.

Folderze zaczynamy od inicjalizacji repozytorium komendą git’a:

git init

Powinen pojawić nam się nowy folder .git (folder ukryty, na widowsie nie będzie domyślnie widoczny, należy włączyć pokazywanie ukrytych plików).

Następnie chcemy dodać nasz plik do utworzonego repozytorium:

git add index.html

Jeśli w twoim folderze jest więcej niż jeden plik i nie chcesz dodawać ich pojedynczo po nazwie możesz użyć komendy git add . – kropka oznacza dodanie wszystkich plików w folderze.

Następnie dodajemy nasz pierwszy commit oraz krótki komentarz co się dzieje w danym commicie – zamiany jakie dokonaliśmy. To informuje nas (oraz naszych współpracowników) czego zmiana dotyczy. W tym wypadku tylko nas, dajemy więc sobie zrozumiałą wiadomość:
git commit -m "my first repository"

Teraz musimy się połączyć z naszym zdalnym repozytorium (tylko poraz pierwszy):

git remote add origin https://github.com/ritaly/test-repo.git

git push -u origin master

https://github.com/nazwa_uztykownika/nazwa_repozytorium.git – to adres mojego świeżo utworzonego repozytorium. Chcę te dwa foldery skomunikować – repozytorium na GitHubie i moje lokalne dane w folderze. Przy komendzie git push będziemy musieli podawać dane do logowania z Githuba.

Można to ominąć zapamiętując hasło na komputerze:

git config credential.helper store
git push

Username for 'https://github.com': nazwa_użytkownika
Password for 'https://nazwa_użytkownika@github.com': hasło

Voila, jeśli odświeżymy stronę, to nasz pierwszy projekt jest już widoczny na GitHubie.

4. Modyfikacje w projekcie

Na pewno nie zaszkodzi dodać plik README, który opisuje zawartość repozytorium, co jest celem projektu i jakie technologie zostały wykorzystane. Plik README można utworzyć lokalnie w folderze jako plik tekstowy readme.md lub w GitHubie klikając na Add README.

Scrollujemy na dół, by zapisać plik.

Zapisujemy zmiany.

Lokalnie ściągniemy ten plik do siebie za pomocą komendy git pull.

Podsumowanie kiedy używamy git push, i dlaczego robimy git pull:

Dodanie nowego pliku

W konsoli wpisujemy: git status – wylistowuje stan w jakim znajdują się pliki w repozytorium. W tej chwili wszystkie pliki są aktualne – stan naszego repozytorium lokalnego i stan naszego zdalnego jest taki sam. Jeśli dokonamy zmian w pliku index.html (albo dodamy nowy plik style.css) komenda: git status dla nas to zaznaczy.


Zmiany w pliku dodamy za pomocą polecenia git add <nazwa_pliku>, a używając git add -p – zobaczymy jakie zmiany zostały dokonane w pliku. Możemy je zaakceptować lub odrzucić:

Wszystkie zaakceptowane zmiany znowu dodajemy do commita:

git commit -m "twój opis"

i wypychamy do zdalnego repozytorium za pomocą git push.

Na screenie widać, że zmiany w pliku index.html, były już zaakceptowane (zielony plik), a plik style.css czekał na dodanie.

5. GitHub w skrócie

Jeśli już udało Ci się dodać pierwszy projekt do GitHuba, czas się przyjrzeć samej platformie.

Strona naszego profilu github.com/nazwa_uzytkownika prezentuje się jak na poniższym screenie.

Oczywiście, nowo utworzone konto będzie puste.

Od góry mamy główne menu z paskiem wyszukiwania, który pozwala na przeszukiwanie wszystkich publicznie dostępnych repozytoriów (np. wpisując Django Girls znajdziecie oficjalny tutorial warsztawów 😉 ). W prawym górnym rogu jak już wiecie dodajmy nowe repozytorium oraz przejdziemy do ustawień konta.

Profil na GitHubie możemy sperosonalizować dodając zdjęcie, krótkie bio czy podpis jaki ma się wyświetlać zamiast naszej nazwy użytkownika. Jest to przydatne, zwłaszcza gdy pracujecie w grupie, a twój nick to losowy ciąg znaków. Niby każdy wie, że ty to przecież @m4k0w4l5k4, ale jednak czytelniej wygląda komunikat updated by MariaKowalska. Dodatkowo pod bio znajdują się organizacje / zespoły (publiczne), w których się udzielamy.

W głównej części możemy przypiąć wybrane rypozytoria. Wykorzystaj to podczas szukania pracy: warto wtedy przypiąć projekty, z których szczególnie jesteśmy zadowoleni i chcemy, by zwrócono na nie uwagę podczas rekrutacji.

W dolnej części profilu jest widoczna aktywność, ale tylko aktywność publiczna (we własnych projektach czy projektach open-source). Jeśli rozwijamy kod w repozytoriach prywatnych informacja ta nie będzie widoczna, dla osób z zewnątrz.

Moja aktywność całkowita:

Aktywność widoczna publicznie:

Skąd różnica? Najwięcej kodu piszę w pracy. Rozwijamy produkt komercyjny, także wszystkie repozytoria są widoczne tylko dla pracowników. Jeśli chcemy, możemy udostępnić naszą pełną aktywność, bez pokazywania prywatnych repozytoriów. Ustawieniach profilu, sekcja pod danymi osobowymi:

6. Co dalej?

To nie koniec nauki, a na pewno nie koniec komend Gita, które możecie używać.

Dobre nawyki: 

  • Jeden projekt = jedno repozytorium. Nie traktuj repozytorium jako folderu, w którym masz kilka projektów na raz. Sama tak wielokrotnie robiłam. Zadania na studiach wrzucałam w jeden folder, a folder na GitHuba, aby mieć kopię zapasową oraz żebym mogła w każdej chwili rzucić okiem niezależnie od komputera, na jakim będę pracować. Trzymanie kopii zapasowej kodu, jest mądre. Trzymanie śmietnika na GitHubie – nie. Nie idźcie tą drogą!
  • Nazwy plików i folderów nie powinny zawierać spacji oraz polskich znaków. Najlepiej zrezygnuj z polskiego nazewnictwa w plikach 😉
  • Komentarze w commitach staraj się pisać w sposób zrozumiały, krótki i jednocześnie uporządkowany np. w formie równoważników zdań np. dodanie pliku style.css, zmiana tła w headerze. Jeszcze lepiej, jeśli będziesz komentarze pisać w języku angielskim 🙂
  • Dodaj plik README. W pliku README umieszczaj krótki opis projektu, cel, wykorzystane technologie oraz jeśli są konieczne – wersje języka (PHP5 =/= PHP7, Python 2.7 =/= Python 3.6), bibliotek, frameworków jakie właśnie używasz. W przyszłości może okazać się, że wersje zostały zmienione i masz problem z uruchomieniem własnego programu. Informacja o wersji pozwoli Ci szybko znaleźć przyczynę problemu.

Warto wiedzieć: Dwa najpopularniejsze serwisy do przechowywania repozytoriów Git to GitHub i Bitbucket. Oba działają podobnie: umożliwiają hostowanie i współpracę z repozytorium Git, a także pozwalają wygodnie przeglądać i przeszukiwać repozytoria. Istotna różnica leży w rodzaju opłat. GitHub oferuje nieograniczone darmowe repozytoria publiczne, bez względu na liczbę osób pracujących nad projektem oraz płatną usługę jeśli chcemy tworzyć repozytorium prywatne. Bitbucket pozwala na publikację bezpłatnych prywatnych repozytoriów, ale pobiera opłaty przy większej liczbie współpracowników. To, której usługi używasz do konkretnego repo zależy od twoich konkretnych potrzeb. Po utworzeniu konta, oba serwisy działają na bazie Gita, więc używa się je analogicznie.

Jeśli przydał Ci się ten post i chcesz być na bieżąco z wpisami wpadnij na facebooka – Fly Nerd.