Amint a címből is látszik, ebben a bejegyzésben a GitHub és a VSCode (Visual Studio Code) összekapcsolását vettem górcső alá. Ugyanis, ha már VSCode-ban dolgozunk, akkor érdemes a rendszert úgy beállítani, hogy a GitHubra a VSCode-ból commit-olunk.
Előfeltétel
Azért megemlíteném, hogy legyen legalább egy React Native projektünk amit szeretnénk a GitHub-ra feltolni. Ha nincs, akkor itt egy bejegyzésem a projekt létrehozásról.
Új GitHub repository
Az első lépés (feltételezve, hogy már van GitHub fiókunk) egy új repo létrehozása:
Megadunk egy nevet. Beállítjuk, hogy publikus vagy privát legyen, aztán klikk a Create repository gombra:
Ezzel a GitHub oldali részt el is intéztük. Lett a projektünknek egy tároló helye a GitHub-on.
Visual Studio Code beállítása
Jöhet a Visual Studio Code beállítása. Elsőként érdemes a File\Open Folder… menün keresztül megnyitni pontosan azt a projektet, amiben dolgozunk és, amit a GitHub-ra szeretnénk tölteni. A VSCode így pontosan ezt a projektet fogja nekünk betölteni:
Ezután át kell váltani a Source Control részre a lent sárgával megjelölt ikonnal:
Ez után ahogy a képen is látszik a három pontra (…) kell kattintani, ez alatt a Pull, Push-ra, majd a Push to… lehetőséget választani:
Előfordul, hogy a VSCode nem tud kapcsolatot létesíteni a GitHub-bal, hiába vagyunk egy böngészőben belépve. Ilyen esetben felkínál egy lehetőséget:
Kattintsunk az Add Remote gombra. Két lehetőségünk lesz:
Vagy közvetlenül a GitHub oldaláról (ha még nem zártuk be), kimásoljuk a repo linkjét és ezt beillesszük a „Provide rtepository URL or pick a repository source.” mezőbe:
Vagy a másik lehetőség, hogy az Add remote from GitHub linkre kattintunk. Egy kis idő elteltével a VSCode összeszedi az összes GitHub repo-nkat és egy listában megjeleníti:
Innen a megfelelőt ki tudjuk választani. Ezután pedig kér egy Remote name nevet, amibe én azt írom, hogy „origin”:
Enter lenyomásával nyugtázom a beállítást. Ezután már képesek leszünk a GitHub-ra Push-olni a projektet:
Ki kell választani a célt:
Miután kiválasztottuk a megfelelőt, a VSCode push-olja a cuccot a GitHub-ra. Ezt úgy tudom ellenőrizni, hogy a GitHub-on megnyitom a repo-t és látom, hogy van már egy darab commit:
Innentől kezdve minden újabb változást már a VSCode-al fogunk tudni push-olni (commit-olni).
Változások feltöltése GitHub repo-ba VSCode-ból
Bármilyen változás is van, azt a VSCode jelzi nekünk a Source Control ikonon:
Az összes változás commitolásához kattintsunk a Changes sorában levő plusz jelre (Stage All Changes):
Majd ezután a Commit gombra. A megjelenő ablakban meg kell adni valami értelmes üzenetet a Commit-hoz. Ez jelenik majd meg a GitHub-on is. Amit # jel után írunk, az nem kerül bele az üzenetbe. Ha készen vagyunk a beszédes commit üzenettel, akkor a jobb felső sarokban levő kis pipa ikonra (Accept commit message) kell kattintani:
Utolsó lépésként fel kell pusholni a változásokat:
Az a tapasztalatom, hogy az első néhány push esetében még a Push to… opciót érdemes választani, mert kéri a helyet, ahová push-olni szeretnénk:
Ki kell neki választani a helyet (itt nálam most origin, amit előzőleg megadtam). Ez után látszik is, hogy dolgozik a háttérben a push folyamat. A GitHub-on tudjuk ellenőrizni ismét, hogy mit commitoltunk (push-oltunk):
Látszódik, hogy megjelent még egy commit (nálam egyelőre összesen ez a két commit van csak) és ott van az az üzenet, amit a VSCode-ban megadtunk.