- Autor:
- Długość
- liczba lekcji: 54, czas trwania: 5:52:07
- Ocena
Kurs video
React i GatsbyJS. Kurs video. Nowoczesne strony internetowe w oparciu o headless CMS i GraphQL
- Wydawnictwo:
- Videopoint
- Wersja:
- Online
- Czas trwania:
- 5:52:07
- Technologia:
- Gatsby 5.12, React 18.2
- Ocena:
Spis lekcji kursu video
-
1. Wprowadzenie 29:58
-
2. Headless CMS i SEO 37:45
-
3. Wybór hostingu i dodatkowa konfiguracja 16:36
-
4. Podstawy tworzenia komponentów 1:06:30
- 4.1. Podejście do tworzenia komponentów 1:48
- 4.2. Hook useState 4:00
- 4.3. Input component 11:10
- 4.4. Stworzenie komponentu dla przycisku 7:10
- 4.5. Focus & visible w przycisku 3:45
- 4.6. Link component 3:36
- 4.7. Uproszczenie kodu 2:03
- 4.8. Hamburger button 13:03
- 4.9. FAQ Element 12:19
- 4.10. Layout component 2:51
- 4.11. Gatsby-ssr i gatsby-browser 4:45
-
5. Tworzenie sekcji strony 1:42:54
- 5.1. Podstawowe tworzenie modeli w DatoCMS 8:40
- 5.2. Jak pobierać dane za pomocą GraphQL 4:19
- 5.3. Struktura HeroSection 9:43
- 5.4. Style dla HeroSection 4:02
- 5.5. Stworzenie nawigacji 8:30
- 5.6. Header 8:48
- 5.7. Struktura danych dla sekcji strony głównej 5:36
- 5.8. Struktura komponentów dla drugiej i trzeciej sekcji 9:08
- 5.9. Style dla drugiej i trzeciej sekcji 11:02
- 5.10. Jak ograniczyć szerokość całej strony 2:20
- 5.11. Struktura realizacji w DatoCMS 7:26
- 5.12. Realization Card 5:28
- 5.13. Struktura komponentu naszych realizacji 17:52
-
6. Kontakt i FAQ 1:04:06
-
7. Wszystkie realizacje 34:18
Opis kursu video : React i GatsbyJS. Kurs video. Nowoczesne strony internetowe w oparciu o headless CMS i GraphQL
Obierz kurs na GatsbyJS
Znany i uwielbiany przez programistów React doczekał się potomka. Tak bowiem można by nazwać Gatsby.js – generator stron statycznych bazujący na bibliotece React. Gatsby używa jej jako swojej podstawy do budowania interfejsów użytkownika. Dalsze podobieństwa to między innymi struktura projektu i zastosowanie komponentów zapewniających modularność i reużywalność kodu. Co zatem nowego oferuje Gatsby? Przede wszystkim unikalne funkcje, takie jak generowanie statyczne (ang. static site generation – SSG) i własne koncepcje zarządzania stanem. Framework ma także rozbudowany ekosystem pluginów i obsługuje headless CMS. W praktyce wszystkie te elementy są kluczowe dla tworzenia szybkich, wydajnych stron internetowych i optymalizacji SEO. Pomimo statycznego generowania Gatsby umożliwia również budowanie dynamicznych stron i dodawanie interaktywności dzięki właściwości client side routing.
W trakcie naszego profesjonalnego szkolenia:
- Nauczysz się budować komponenty w GatsbyJS
- Dowiesz się, jak prawidłowo skonfigurować SEO strony WWW
- Zaznajomisz się z procesem hostowania aplikacji tworzonej przy użyciu GatsbyJS
- Nauczysz się tworzyć style na bazie styled-components
- Utworzysz animacje za pomocą biblioteki react-slick
- Poznasz zasady dynamicznego generowania stron
- Opanujesz tworzenie modeli w headless CMS
- Nauczysz się pobierać dane za pomocą GraphQL
Szkolenie React i GatsbyJS. Kurs video. Nowoczesne strony internetowe w oparciu o headless CMS i GraphQL ukończysz na poziomie średnio zaawansowanym. Wszystkie zagadnienia zostaną omówione krok po kroku, jednak dla efektywnego wykorzystania możliwości Gatsby przyda się podstawowa znajomość Reacta. Nabędziesz umiejętności tworzenia strony, od podstawowej konfiguracji aż po umieszczenie jej na darmowym hostingu Netlify, by była dostępna w sieci. Na początek dowiesz się, jak skonfigurować projekt i jak pracować z systemem kontroli wersji. Poznasz system zarządzania treścią – headless CMS – i będący jego odmianą DatoCMS, służący do kreowania contentu niezależnie od wyglądu strony. Nauczysz się tworzyć komponenty i zarządzać stanem aplikacji. Dowiesz się, jak zastosować GraphQL w komponentach Gatsby.js do pobierania danych z DatoCMS. Utworzysz warstwę wizualną za pomocą styled-components i nauczysz się generować animacje z react-slick. Znajomość takiego stosu technologicznego pozwoli Ci budować efektywne i profesjonalne strony internetowe.
W ostatnich latach technologia React podbiła serca developerów i stała się jedną z najpopularniejszych na świecie. Wraz z solidnym i szybkim rozwojem musiały się pojawić kolejne rozszerzenia do tej technologii. W ramach tego kursu zajmiemy się jednym z nich, czyli Gatsby.js. Otwórz swoje środowisko, w którym piszesz kod, i pisz razem ze mną, bez działania niczego się nie nauczymy. Zapraszam!
Wybrane bestsellery
Videopoint - inne książki
Dzieki opcji "Druk na żądanie" do sprzedaży wracają tytuły Grupy Helion, które cieszyły sie dużym zainteresowaniem, a których nakład został wyprzedany.
Dla naszych Czytelników wydrukowaliśmy dodatkową pulę egzemplarzy w technice druku cyfrowego.
Co powinieneś wiedzieć o usłudze "Druk na żądanie":
- usługa obejmuje tylko widoczną poniżej listę tytułów, którą na bieżąco aktualizujemy;
- cena książki może być wyższa od początkowej ceny detalicznej, co jest spowodowane kosztami druku cyfrowego (wyższymi niż koszty tradycyjnego druku offsetowego). Obowiązująca cena jest zawsze podawana na stronie WWW książki;
- zawartość książki wraz z dodatkami (płyta CD, DVD) odpowiada jej pierwotnemu wydaniu i jest w pełni komplementarna;
- usługa nie obejmuje książek w kolorze.
Masz pytanie o konkretny tytuł? Napisz do nas: sklep[at]helion.pl.
Książka, którą chcesz zamówić pochodzi z końcówki nakładu. Oznacza to, że mogą się pojawić drobne defekty (otarcia, rysy, zagięcia).
Co powinieneś wiedzieć o usłudze "Końcówka nakładu":
- usługa obejmuje tylko książki oznaczone tagiem "Końcówka nakładu";
- wady o których mowa powyżej nie podlegają reklamacji;
Masz pytanie o konkretny tytuł? Napisz do nas: sklep[at]helion.pl.
Książka drukowana
Oceny i opinie klientów: React i GatsbyJS. Kurs video. Nowoczesne strony internetowe w oparciu o headless CMS i GraphQL Albert Strzyżewski (0) Weryfikacja opinii następuję na podstawie historii zamówień na koncie Użytkownika umieszczającego opinię. Użytkownik mógł otrzymać punkty za opublikowanie opinii uprawniające do uzyskania rabatu w ramach Programu Punktowego.