https://github.com/training360/vue-basics-public
A Vue.js alapjai tananyag publikus repoja a leckék kódjával, feladatokkal, és feladat megoldásokkal
https://github.com/training360/vue-basics-public
Last synced: about 1 year ago
JSON representation
A Vue.js alapjai tananyag publikus repoja a leckék kódjával, feladatokkal, és feladat megoldásokkal
- Host: GitHub
- URL: https://github.com/training360/vue-basics-public
- Owner: Training360
- Created: 2023-01-11T14:02:28.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2023-12-08T15:10:14.000Z (over 2 years ago)
- Last Synced: 2025-03-27T10:17:36.430Z (about 1 year ago)
- Language: Vue
- Homepage:
- Size: 3.67 MB
- Stars: 0
- Watchers: 1
- Forks: 4
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# A Vue.js alapjai
## Szintaxis
- [A fejlesztőkörnyezet beállítása](01-syntax/lessons/00-settings/)
- [Vue-alkalmazás inicializálása, text interpolation](01-syntax/lessons/01-init-vue-app/)
- [A `v-html` direktíva](01-syntax/lessons/02-v-html/)
- [A `v-bind` direktíva](01-syntax/lessons/03-v-bind/)
- [A `v-bind` direktíva használata objektummal](01-syntax/lessons/04-v-bind-with-object/)
- [A `v-for` direktíva](01-syntax/lessons/05-v-for/)
- [Index használata a `v-for` direktívánál](01-syntax/lessons/06-v-for-index/)
- [A `v-for` használata átstrukturálással](01-syntax/lessons/07-v-for-destructuring/)
- [A `v-for` használata többdimenziós tömbök esetében](01-syntax/lessons/08-v-for-multidimensional-array/)
- [A `v-for` `key` alias](01-syntax/lessons/09-v-for-with-object/)
- [A `v-if` direktíva és a `template` tag](01-syntax/lessons/10-v-if/)
- [A `v-show` direktíva](01-syntax/lessons/11-v-show/)
- [A `v-else-if` és `v-else` direktívák](01-syntax/lessons/12-v-else-if-v-else/)
- [Style binding](01-syntax/lessons/13-style-binding/)
- [Style binding objektumokkal](01-syntax/lessons/14-style-binding-with-object/)
- [CSS használata](01-syntax/lessons/15-css/)
- [Class binding](01-syntax/lessons/16-class%20binding/)
- [Class binding tömb szintaxissal](01-syntax/lessons/17-class%20binding-array-syntax/)
- [A Vue reaktivitása, a `ref` attribútum, események kezelése](01-syntax/lessons/18-ref/)
- [`computed` property](01-syntax/lessons/19-computed/)
- [A `watch` function](01-syntax/lessons/20-watch/)
- [Kétirányú adatkötés a `v-model` direktívával](01-syntax/lessons/21-v-model/)
- [Eseménymódosítók](01-syntax/lessons/22-event-modifiers/)
- [A `reactive()` függvény](01-syntax/lessons/23-reactive/)
- [A template ref](01-syntax/lessons/24-template-ref/)
- [A `ref()`-ről részletesen](01-syntax/lessons/25-ref-in-depth/)
- [A `reactive()`-ról részletesen](01-syntax/lessons/26-reactive-in-depth/)
- [A `ref()` és a `reactive()` összehasonlítása](01-syntax/lessons/27-ref-vs-reactive/)
- [Feladatok](01-syntax/exercises/)
## Komponensek
- [Egy Vue.js 3 alkalmazás inicializálása](.//02-components/lessons/00-create-app/)
- [Új alkalmazás létrehozása](/02-components/lessons/01-create-new-project/)
- [Komponensek létrehozása I.](/02-components/lessons/02-create-components-1/)
- [Komponensek létrehozása II.](/02-components/lessons/03-create-components-2/)
- [Az alkalmazás lebuildelése](/02-components/lessons/04-build-and-preview/)
- [A `defineProps` használata, szülő-gyermek közötti kommunikáció](/02-components/lessons/05-props/)
- [A `props` használata scripten belül](/02-components/lessons/06-props-inside-script/)
- [`props` binding](/02-components/lessons/07-props-binding/)
- [A `defineEmits` használata, gyermek-szülő közötti kommunikáció](/02-components/lessons/08-events/)
- [Komponens esemény paraméterrel](/02-components/lessons/09-events-with-param/)
- [A defineProps és a defineEmits együttes használata I.](/02-components/lessons/10-events-with-props-1/)
- [A defineProps és a defineEmits együttes használata II.](/02-components/lessons/11-events-with-props-2/)
- [A defineProps és a defineEmits együttes használata III.](/02-components/lessons/12-events-with-props-3/)
- [A Vue.js-komponensek életciklusai, hookok](/02-components/lessons/13-lifecycle-hooks/)
- [Feladatok](02-components/exercises/)
## Alkalmazások
### Video Player
- [A YouTube API használata](03-projects/lessons/01-video-player//01-youtubeAPI/)
- [A videók kilistázása](03-projects/lessons/01-video-player//02-listing/)
- [A VideoList és VideoItem komponensek elkészítése](03-projects/lessons/01-video-player//03-VideoList-VdeoItem/)
- [A VideoItem template-jének véglegesítése](03-projects/lessons/01-video-player//04-VideoItem/)
- [A VideoDetails komponens elkészítése](03-projects/lessons/01-video-player//05-VideoDetails/)
- [Videó kiválasztásának lefejlesztése](03-projects/lessons/01-video-player//06-select-video/)
- [A SearchBar elkészítése](03-projects/lessons/01-video-player//07-SearchBar/)
- [A Vue devtool használata böngészőben](03-projects/lessons/01-video-player//07-SearchBar/)
### User Manager
- [A UserManager alkalmazás inicializálása, backend elkészítése](03-projects/lessons/02-user-manager/01-init/)
- [A usersAPI elkészítése](03-projects/lessons/02-user-manager/02-usersAPI/)
- [A felhasználók kilistázása](03-projects/lessons/02-user-manager/03-list-users/)
- [Bevezetés a state menedzsmentbe](03-projects/lessons/02-user-manager/04-store/)
- [A store használata](03-projects/lessons/02-user-manager/04-store/)
- [A UsersTable komponent elkészítése](03-projects/lessons/02-user-manager/05-UsersTable/)
- [Felhasználó törlése](03-projects/lessons/02-user-manager/06-delete-user/)
- [A felhasználó módosításának előkészítése](03-projects/lessons/02-user-manager/07-modify/)
- [Az EditUserModal komponens elkészítése](03-projects/lessons/02-user-manager/08-EditUserModal-1/)
- [A módosító űrlap template-jének megírása](03-projects/lessons/02-user-manager/09-EditUserModal-2/)
- [A felhasználó szerkesztésének befejezése](03-projects/lessons/02-user-manager/10-EditUserModal-3/)
- [A felhasználó létrehozásának előkészítése](03-projects/lessons/02-user-manager/11-create/)
- [A CreateUserForm komponens elkészítése I.](03-projects/lessons/02-user-manager/12-CreateUserForm-1/)
- [A CreateUserForm komponens elkészítése II.](03-projects/lessons/02-user-manager/13-CreateUserForm-2/)
- [A CreateUserForm komponens elkészítése III.](03-projects/lessons/02-user-manager/14-CreateUserForm-3/)
- [Az AppTitle komponens elkészítése](03-projects/lessons/02-user-manager/15-AppTitle/)
### Webshop
- [A Webshop alkalmazás inicializálása](03-projects/lessons/03-webshop/01-init/)
- [A gitárok lekérése és mentése a store-ba](03-projects/lessons/03-webshop/02-fetchGuitars/)
- [A gitárok elérésének ellenőrzése](03-projects/lessons/03-webshop/03-notification/)
- [A router használata - útvonalválasztás SPA-k esetében](03-projects/lessons/03-webshop/04-vue-router/)
- [A MainNavigation komponens elkészítése](03-projects/lessons/03-webshop/05-MainNavigation/)
- [A router-view használata](03-projects/lessons/03-webshop/06-router-view/)
- [A CartView létrehozása a belső navigáció teszteléséhez](03-projects/lessons/03-webshop/07-add-route/)
- [A GuitarsList komponens elkészítése](03-projects/lessons/03-webshop/08-GuitarsList/)
- [A GuitarsItem komponens elkészítése](03-projects/lessons/03-webshop/09-GuitarItem/)
- [A GuitarImage komponens elkészítése](03-projects/lessons/03-webshop/10-GuitarImage/)
- [A GuitarTitle komponens elkészítése](03-projects/lessons/03-webshop/11-GuitarTitle/)
- [A GuitarDescription komponens elkészítése](03-projects/lessons/03-webshop/12-GuitarDescription/)
- [A GuitarPrice komponens elkészítése](03-projects/lessons/03-webshop/13-GuitarPrice/)
- [A GuitarRating komponens elkészítése](03-projects/lessons/03-webshop/14-GuitarRating/)
- [A GuitarStock komponens elkészítése](03-projects/lessons/03-webshop/15-GuitarStock/)
- [A CartButton template elkészítése](03-projects/lessons/03-webshop/16-CartButton-template/)
- [A CartButton script elkészítése](03-projects/lessons/03-webshop/17-CartButton-script/)
- [A termék kosárhoz való hozzáadásának megírása](03-projects/lessons/03-webshop/18-CartButton-add/)
- [A termék kosárba tehető mennyiségének korlátozása](03-projects/lessons/03-webshop/19-CartButton-interval/)
- [A termék hozzáadásának feltételei](03-projects/lessons/03-webshop/20-CartButton-add-if/)
- [A kosárban lévő termékek darabszámának módosítása](03-projects/lessons/03-webshop/21-CartButton-modify/)
- [Termék törlése a kosárból](03-projects/lessons/03-webshop/22-CartButton-delete/)
- [A ShoppingCart komponens elkészítése](03-projects/lessons/03-webshop/23-ShoppingCart/)
- [A ShoppingCart formázása](03-projects/lessons/03-webshop/24-Finalize/)
- [A felhasználói értesítések megvalósítása kosárba helyezéskor](03-projects/lessons/03-webshop/25)
- [Feladatok](03-projects/exercises/)