Zbuduj panel wdrożeń w konsoli
Ten bezpłatny kurs ma 10 rozdziałów. Zbudujesz Acme Deploys od pustej strony po wdrożoną aplikację z trasami, danymi i testami. Każdy rozdział działa na żywo w DevTools podczas czytania.
Postęp0/10
- 01Pierwsze krokiUtwórz aplikację, wyrenderuj pierwszą stronę i obsłuż klawisz.5 min
- 02Layout z BoxZbuduj szkielet panelu za pomocą Flexbox w komórkach: górny pasek, pasek boczny i karty.7 min
- 03Tekst i styleNadaj karcie wdrożenia kolory, atrybuty tekstu i tokeny motywu.6 min
- 04Obsługa wejścia i mapy klawiszyPoruszaj się po wdrożeniach klawiaturą i dodaj nakładkę pomocy pod ?.8 min
- 05TrasowaniePodziel aplikację na trasy ze wspólnym layoutem, linkami ze skrótami klawiszowymi i historią.8 min
- 06Dane i handlery trasUdostępniaj wdrożenia z app/api, pobieraj je na stronie i dodawaj nowe żądaniami POST.8 min
- 07Table, List i wykresyZastąp ręcznie tworzone wiersze sortowalnym komponentem Table i wykresem, który nigdy nie przesuwa layoutu.7 min
- 08TestowanieRenderuj poza ekranem, naciskaj klawisze i sprawdzaj asercje na klatce jako tekście.6 min
- 09Uruchamianie w terminaluUruchom ten sam panel na pełnym ekranie w terminalu poleceniem text run.5 min
- 10PublikacjaZbuduj, ustaw metadane i wdróż Acme Deploys.4 min
- ▼CertyfikatZdobądź certyfikat ze swoim imieniem i nazwiskiem, wyrenderowany w konsoli.
Kurs działa w twojej konsoli
Otwórz konsolę skrótem ⌘⌥JCtrl+Shift+J⌘⌥KCtrl+Shift+K⌘⌥C (najpierw włącz funkcje programistyczne), kliknij poniżej i wybierz rozdział strzałkami.
▼ learn
Otwórz konsolę
⌘⌥J
CtrlShiftJ
⌘⌥K
CtrlShiftK
⌘⌥C
Aplikacja renderuje się w DevTools.Najpierw włącz „Pokazuj funkcje dla deweloperów witryn” w Safari: Ustawienia → Zaawansowane. Potem kliknij tutaj i naciśnij ↓.
Otwórz na komputerze
Ta aplikacja renderuje się w konsoli DevTools, która wymaga przeglądarki na komputerze.