---
# System prepended metadata

title: Staż 2019

---

# Staż 2019

## Instalacja
 * Chrome/FF
 * [nvm](https://github.com/coreybutler/nvm-windows/releases/download/1.1.7/nvm-setup.zip) i Node@10
 * [yarn](https://yarnpkg.com/lang/en/docs/install)
 * VScode
 * git
 * Robomongo
 * MongoDB (w wersji ~3.4.5)
 * terminal?
 * Java??
 * Elasticsearch (w wersji ...)

### Przydatne dodatki do VSCode
 * Prettier *(ja polecam, inni raczej nie :D)*
 * angular2-inline
 * Angular Language Service *(dla małych projektów powinien być w porządku)*
 * Search node_modules
 * Path Intellisense
 * Auto Rename Tag

## Nauka
### Javascript
 * podstawy JS: https://www.youtube.com/watch?v=X52b-8y2Hf4
 * es6: https://www.youtube.com/watch?v=3Ay2lS6tm4M
 * (*) Part I z książki https://pepa.holla.cz/wp-content/uploads/2016/08/JavaScript-The-Definitive-Guide-6th-Edition.pdf
 * (***) https://github.com/getify/You-Dont-Know-JS#titles

### Typescript
 * http://www.typescriptlang.org/docs/handbook/typescript-in-5-minutes.html
 * http://www.typescriptlang.org/docs/handbook/basic-types.html

### Angular
 * https://angular.io/start
 * https://angular.io/tutorial
 * gotowe komponenty: https://material.angular.io/

### Mongo & Node
 * filmiki Marcina

### CSS :)
 * https://learnlayout.com/
 * flexboxowe żabki (bardzo fajne :D) https://flexboxfroggy.com/
 * (żabki ale dla grida) https://cssgridgarden.com

### git
 * https://learngitbranching.js.org
 
### VSCode
 * [ściągawka skrótów klawiszowych](https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf)

## Zadanie rozgrzewkowe

### Prosta aplikację typu **Todo list** przy użyciu materialowych komponentów.

Stwórz repozytorium gitowe i commituj na bieżąco zmiany :)
Dodaj je na githubie/gitlabie/bitbucketcie i podeślij link.

#### Aplikacja powinna umożliwiać:

* dodawanie nowych zadań
* usuwanie zadań
* oznaczanie jako wykonane/niewykonane
* wyświetlanie podsumowania (np. *k* / *n* wykonanych zadań)
* (opcjonalnie) filtrowanie: wszystkie/wykonane/niewykonane
* (opcjonalnie) edytowanie zadania
* (opcjonalnie) prosty backend
    * jeśli będziesz chciał zrobić backend, to daj znać, może lepszym wyjściem będzie wrócić do tego później, gdy już poznasz podstawy Node i MongoDB

Czas: 2-5 dni?

## Zadanie główne

### (Etap 1.) Administrator

Aplikacja ma umozliwiać zarządzanie danymi lekarzy.
Powinna ona zawierać listę lekarzy posortowaną po nazwiskach, wybrany lekarz może zostać usunięty lub edytowany.
Lekarz na liście opisany jest przez: imię, nazwisko, specjalności (może posiadać ich kilka).
Aplikacja powinna również umożliwiać dodawanie nowych lekarzy.
Na ekranie umożliwiającym dodawanie/edycję lekarza poza wprowadzaniem jego podstawowych danych (imię, nazwisko itp...) powinna również być możliwość zarządzania jego grafikiem.
Grafik powinien składac się z listy terminów do której można dodawac wpisy, a także edytować je i usuwać.
Każdy termin opisany jest przez: dzień, od jakiej godziny, do jakiej godziny oraz jeśli termin jest zajęty powinien zawierać informacje o pacjencie i opcjonalnie o powodzie wizyty.

### (Etap 1.) Pacjent

Aplikacja ma umożliwiać pacjentom wygodną rejestrację na wizyty.
Wyszukiwanie wolnych terminów powinno uwzględniać: specjalizację lekarza, miasto i daty rejestracji "od-do",
zakładamy że wyszukiwać można po jednej lub wielu wymienionych kategoriach.
Specjalności i miasta powinny być ograniczone do specjalności i mast dostępnych lekarzy.
Podczas wyszukiwania można wybrac tylko jedną specjalność, natomiast podanych może zostać wiele miast.
Rezultat wyszukiwania powinien zawierać listę dostępnych terminów, która będzie posortowana po dacie oraz godzinie.
Dostepny termin powinien zawierać informacje odnośnie lekarza (imię i nazwisko, specjalność), miasta, godziny.
Po wybraniu terminu pacjent może potwierdzić lub cofnąć chęć rejestracji na wybrany termin, dodatkowo może opcjonalnie podać powód wizyty.

### (*Etap 2.) Pacjent

Lista dostępnych wyników powinna być zawężona, z możliwością "doładowywania" kolejnych wyników (poprzez paginację bądź scrollowanie).
Dodatkowo aplikacja powinna umożliwić podgląd wizyt na które się zapisaliśmy, z mozliwością odwołania wizyty, która jeszcze się nie odbyła.

### (*Etap 2.) Lekarz

Aplikacja ma umożliwiać lekarzowi definiowanie własnego grafiku pracy. Grafik powinien składać się z listy terminów do której lekarz może dodawać wpisy, może je również edytować i usuwać. Każdy termin opisany jest przez: dzień, od jakiej godziny, do jakiej godziny oraz jeśli termin jest zajęty powinien zawierać informacje o pacjencie i opcjonalnie o powodzie wizyty.


## Uwagi do cms2

Ściągnij sobie dodatki do VSCode: ESLint i TSLint, żeby podkreśłały ci błędy stylistyczne :D

### Początek:

* Stwórz sobie folder w którym będzie później repozytorium, np **cms**: C:/Users/Dominik/Documents/**cms**
* Stwórz prywatne repozytorium na githubie, sklonuj je będąc w poprzednio utworzonym folderze i zmień lokalnie nazwę folderu repo na *cms2*
* Wypakuj zawartość cms2.zip do folderu cms2 tak, żeby mieć strukturę np.: C:/Users/Dominik/Documents/**cms**/cms2 i w nim mam już normalnie źródła
* Zrób initial commit :)
* Wywołaj `yarn setup`, żeby zainstalować zależności projektu
* `$ yarn gulp rebuild`
* `$ yarn start`
* http://localhost:5634/testowy powinno działać

### Przydatne komendy:

* `yarn start` -- startuje aplikacje (czyli serwer de facto)
* `yarn gulp rebuild` -- buduje wszystkie moduły (serwerowe i klienckie), jak zrobisz `start` i nie masz żadnego klienckiego watcha w tle, to serwer użyje właśnie tych przebudowanych źródeł
* `yarn gulp tsc-watch` -- watchuje kod serwerowy
* `yarn gulp webpack-watch` -- watchuje kod kliencki
* `yarn gulp watch [--start-server]` -- odpala obydwa watchery (opcjonalnie z flagą start-server, jeśli chcesz, żeby serwer się restartował przy każdej zmianie; jest to przydatne przy pracy z frontem)
* `yarn gulp generate` -- generuje pliki dto i proxy (do użycia później na froncie)

#### Polecam:

* W jednym terminalu `yarn gulp watch`
* W drugim `yarn start` (**WAŻNE**: odpalić start dopiero po watch!!!; Pamiętaj też, żeby restartować serwer po zmianach backendowych)
* W trzecim odpalać `yarn gulp generate`, jeśli chcesz przegenerować dtosy/proxy

### Debugowanie kodu serwerowego:

* Wejdź w zakładkę debuggera w VSCode i z dropdowna wybierz Default (to trzeba zrobić tylko raz)
* Postaw breakpoint gdzieś w kodzie
* Naciśnij F5 -- to wystartuje aplikację, więc upewnij się, że nie masz gdzieś już serwera postawionego

### eClinic

Stworzyłem ci moduł *eClinic*, tam możesz wykonywać swoje zadanie :)
Podpatruj rzeczy w module testowym, jak coś nie jest jasne, to może to znajdziesz w `book.md` lub w `doc.md` (ta jest stara, więc ostrożnie!) lub (BARDZO WSKAZANE) pytaj na czacie stażowym!

Dostajesz dużo na raz, łatwo się w tym pogubić, załamać, itp...
Każdy przez to przechodził, więc spokojnie.

A i w sumie ważne jeszcze:
jak wystartujesz aplikację, to wystawiona jest ona na http://localhost:5634 i każdy moduł z aplikacją SPA dostaje swój adres, np:
* aplikacja modułu testowego znajduje się pod adresem http://localhost:5634/testowy
* aplikacja modułu eClinic będzie pod http://localhost:5634/e-clinic

### notatki
odpalanie serwera:
"C:\Program Files\MongoDB\Server\3.4\bin\mongod.exe" --dbpath C:\data

"C:\Program Files\MongoDB\Server\3.4\bin\mongod.exe" --replSet "test" --dbpath C:\data

odpalanie shella
"C:\Program Files\MongoDB\Server\3.4\bin\mongo.exe"

