Workshop 5

Navigation Guards, Dynamic Forms

Zadanie 1:

• Obejrzeć prezentacje na temat vue-router, głownie zagadnienie Navigation Guards: https://web.microsoftstream.com/video/bf9d76e1-bb5d-4b9f-a854-725b820645e9

Zadanie 2:

• Przenieś wywołanie akcji z Vuex'a 'fetchEmployeesList' (https://github.com/PGS-dev/vue-workshop/blob/Workshop-4/src/store.js), do jednego z Navigation Guards dla widoku tabeli pracowników, tak aby akcja została wykonana przed wejściem na tą stronę i tabela mogła się poprawnie wyrenderować.

Zadanie 3:

• Utworzyć Mixin i wydzielić do niego część logiki, pokrywającej się w Home.vue i NewEmployeeForm.vue.

Zadanie 4:

• Utwórz własny Vue Plugin i dodaj globalne fukncjonalności np. sterowanie Loader'em, rejestrowanie globalne componentów, dyrektyw itp, logowanie informacji o komponentach na poszczególnych lifecycle hookach.

Zadanie 5:

• Utwórz widok logowania do aplikacji. Widok formularza z polami: email i password, renderowanie pod /login w routingu.

Zadanie 6:

• Zaimplementuj autentykacje użytkownika przy pomocy Navigation Guards, wykorzystując nowo utworzony widok logowania. np. możesz sprawdzić czy dane uzytkownika są w store/localStorage i przekierować odpowiednio na /login lub /.