Single page app építése

Témakörök:

A Create React App használata
A React Router működése
Hangszer nyilvántartó oldal építése

Figyelem!

Az epizód elkészülése óta elérhető React Router 6-os verziója már nem kompatibilis a tutorialunkban ismertetett kóddal!

Ahhoz hogy a kód rendben lefusson, a React Router 5.2-es verzióját telepítsd, az alábbi parancs segítségével!

npm i --save react-router-dom@5.2

Ha át szeretnéd alakítani a kódot, hogy a React Router 6-os verziójával működjön, akkor az alábbi megoldást használd!
Köszönet VincentVega002-nek a kódért!

Próbáld ki a működő appot:

Nézd meg a slide-okat

Kisokos

Leghasznosabb Visual Studio Code gyorsbillentyűk

A "Keyboard shortcuts" alatt állíthatók be a VSCode-ban

Művelet	Megnevezés
Kijelölés duplikálása	Duplicate Selection
Keresés	Find
Keresés és csere	Replace
Kijelölés mozgatása fel	Move Line Up
Kijelölés mozgatása le	Move Line Down
Dokumentum automatikus formázása (A VSCode első formázáskor felszólíthat, hogy tölts le egy formázó plugint. Ilyen pl a Prettier plugin. Ha PHP-t szeretnél formázni, ahhoz a PHP Intelephense nevű bővítményt kell telepítened)	Format Document

Gyakori Docker parancsok

Művelet	Parancs
Összes konténer leállítása (Akkor hasznos, amikor port ütközést tapasztalsz, egy másik futó konténer miatt)	docker stop $(docker ps -a -q)
Összes konténer eltávolítása	docker rm -f $(docker ps -a -q)
Konténerek indítása egy adott projektben	docker-compose up
Docker image-ek újraépítése és konténerek indítása (Leginkább akkor hasznos, amikor újra akarod építeni az adatbázist)	docker-compose up --build
Konténerek leállítása és eltávolítása egy adott projektben	docker-compose down
Image-ek kitörlése (Idővel felgyűnek az image-ek és egyre több helyet foglalnak a gépeden. Ezt a parancsot pár havonta érdemes lefuttatni.)	docker image prune
Volume-ok törlése (A volume-ok időnkénti törlésével több GB-nyi hely felszabadítható. Figyelem, adatvesztéssel járhat!)	docker volume prune