Udemy
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  
Development
Web Development Data Science Mobile Development Programming Languages Game Development Database Design & Development Software Testing Software Engineering Development Tools No-Code Development
Business
Entrepreneurship Communications Management Sales Business Strategy Operations Project Management Business Law Business Analytics & Intelligence Human Resources Industry E-Commerce Media Real Estate Other Business
Finance & Accounting
Accounting & Bookkeeping Compliance Cryptocurrency & Blockchain Economics Finance Finance Cert & Exam Prep Financial Modeling & Analysis Investing & Trading Money Management Tools Taxes Other Finance & Accounting
IT & Software
IT Certification Network & Security Hardware Operating Systems Other IT & Software
Office Productivity
Microsoft Apple Google SAP Oracle Other Office Productivity
Personal Development
Personal Transformation Personal Productivity Leadership Career Development Parenting & Relationships Happiness Esoteric Practices Religion & Spirituality Personal Brand Building Creativity Influence Self Esteem & Confidence Stress Management Memory & Study Skills Motivation Other Personal Development
Design
Web Design Graphic Design & Illustration Design Tools User Experience Design Game Design Design Thinking 3D & Animation Fashion Design Architectural Design Interior Design Other Design
Marketing
Digital Marketing Search Engine Optimization Social Media Marketing Branding Marketing Fundamentals Marketing Analytics & Automation Public Relations Advertising Video & Mobile Marketing Content Marketing Growth Hacking Affiliate Marketing Product Marketing Other Marketing
Lifestyle
Arts & Crafts Beauty & Makeup Esoteric Practices Food & Beverage Gaming Home Improvement Pet Care & Training Travel Other Lifestyle
Photography & Video
Digital Photography Photography Portrait Photography Photography Tools Commercial Photography Video Design Other Photography & Video
Health & Fitness
Fitness General Health Sports Nutrition Yoga Mental Health Dieting Self Defense Safety & First Aid Dance Meditation Other Health & Fitness
Music
Instruments Music Production Music Fundamentals Vocal Music Techniques Music Software Other Music
Teaching & Academics
Engineering Humanities Math Science Online Education Social Science Language Teacher Training Test Prep Other Teaching & Academics
AWS Certification Microsoft Certification AWS Certified Solutions Architect - Associate AWS Certified Cloud Practitioner CompTIA A+ Cisco CCNA Amazon AWS CompTIA Security+ AWS Certified Developer - Associate
Graphic Design Photoshop Adobe Illustrator Drawing Digital Painting InDesign Character Design Canva Figure Drawing
Life Coach Training Neuro-Linguistic Programming Personal Development Mindfulness Meditation Personal Transformation Life Purpose Emotional Intelligence Neuroscience
Web Development JavaScript React CSS Angular PHP WordPress Node.Js Python
Google Flutter Android Development iOS Development Swift React Native Dart Programming Language Mobile Development Kotlin SwiftUI
Digital Marketing Google Ads (Adwords) Social Media Marketing Google Ads (AdWords) Certification Marketing Strategy Internet Marketing YouTube Marketing Email Marketing Google Analytics
SQL Microsoft Power BI Tableau Business Analysis Business Intelligence MySQL Data Modeling Data Analysis Big Data
Business Fundamentals Entrepreneurship Fundamentals Business Strategy Online Business Business Plan Startup Freelancing Blogging Home Business
Unity Game Development Fundamentals Unreal Engine C# 3D Game Development C++ 2D Game Development Unreal Engine Blueprints Blender
30-Day Money-Back Guarantee
Development Web Development React

React od podstaw

Teoria i praktyka
Rating: 4.7 out of 54.7 (1,903 ratings)
6,616 students
Created by Samuraj Programowania, Mateusz Domański
Last updated 1/2021
Polish
30-Day Money-Back Guarantee

What you'll learn

  • Znajomość biblioteki React w stopniu, który pozwoli Ci z niej korzystać i ubiegać się o pracę tam, gdzie jest ona wymagana
  • Tworzyć Single Page Application (w warstwie widoku)

Course content

19 sections • 207 lectures • 48h 15m total length

  • Preview14:21
  • Preview19:48
  • Preview17:14
  • Preview17:56

  • Preview44:03
  • Preview22:34
  • Preview19:55

  • JSX – cz. 1
    20:30
  • JSX - cz. 2
    16:46
  • Komponenty - tworzenie komponentów funkcyjnych i klasowych, zagnieżdżanie
    16:51
  • Obiekty state i props na przykładzie listy zakupów
    17:20
  • Mini-aplikacja "Add sign" dodająca znak do tekstu po kliknięciu przycisku - cz.1
    15:04
  • "Add sign" - cz.2: Metoda bind, setState, definiowanie state w konstruktorze
    19:51
  • "Add sign" - cz.3: nowy komponent dla wyświetlania tekstu, losowanie liczby
    15:40
  • Tekst pojawiający się po wpisaniu w input – cz. 1
    18:18
  • Tekst pojawiający się po wpisaniu w input – cz. 2: analiza zmiany stanu
    07:05
  • Przycisk pokaż/ukryj - cz. 1
    20:56
  • Przycisk pokaż/ukryj - cz. 2: korzystanie z debuggera
    10:19
  • Zliczanie kliknięć i wyświetlanie wyniku, cz. 1: przepływ danych w React
    31:29
  • Zliczanie kliknięć i wyświetlanie wyniku, cz. 2: komponent dla przycisków
    23:38
  • Zliczanie kliknięć i wyświetlanie wyniku, cz. 3: komponent dla pokazania wyniku
    06:20
  • Wersja deweloperska i produkcyjna biblioteki React
    09:22

  • JSX
    26:42
  • Komponenty
    26:36
  • State
    15:03
  • Props
    25:37
  • Przepływ danych, eventy
    09:52
  • Radzenie sobie z problemami z this
    20:08
  • Nazewnictwo metod
    08:13

  • Projekt 1: checkbox, cz. 1 - wiadomość w zależności od zaznaczenia checkboxa
    18:29
  • Projekt 1: checkbox, cz. 2 - walidacja zaznaczenia po kliknięciu przycisku
    13:23
  • Projekt 1: checkbox, cz. 3 - połączenie 2 komponentów w jeden, destrukturyzacja
    15:04
  • Projekt 1: checkbox, cz. 4 - przeniesienie formularza do osobnego komponentu
    08:22
  • Projekt 2: koszyk, cz. 1 - struktura i logika aplikacji
    12:56
  • Projekt 2: koszyk, cz. 2 - warunkowe dodanie przycisku i obsługa stanu magazynu
    10:20
  • Projekt 2: koszyk, cz. 3 - wyszarzenie wartości 0 w CSS
    05:24
  • Projekt 2: koszyk, cz. 4 - destrukturyzacja
    02:39
  • Projekt 3: praca z tablicami, cz. 1: wyświetlanie elementów tablicy jako listy
    12:57
  • Projekt 3: praca z tablicami, cz. 2 - wykorzystanie template string
    05:12
  • Projekt 3: praca z tablicami, cz. 3: praca z danymi w obiektach
    09:39
  • Projekt 3: praca z tablicami, cz. 4: sortowanie po płci
    07:21
  • Projekt 3: praca z tablicami, cz. 5: filtrowanie po płci
    19:17
  • Projekt 4: interaktywne menu restauracji, cz. 1 - struktura aplikacji
    13:04
  • Projekt 4: interaktywne menu restauracji, cz. 2
    16:31
  • Projekt 4: interaktywne menu restauracji, cz. 3 - praca z listą
    10:49
  • Projekt 4: interaktywne menu restauracji, cz. 4 - logika aplikacji
    13:48
  • Projekt 5: formularze w React, cz. 1 - komponent kontrolowany i niekontrolowany
    20:34
  • Projekt 5: formularze w React, cz. 2 - optymalizacja
    08:02
  • Projekt 6: przelicznik walut, cz. 1
    13:38
  • Projekt 6: przelicznik walut, cz. 2 - optymalizacja
    08:35
  • Projekt 6: przelicznik walut, cz. 3 - rozbudowa aplikacji o select
    24:06
  • Zadanie 1 dla Ciebie - losowanie wróżby
    04:49
  • Zadanie 1 dla Ciebie - rozwiązanie na 5
    11:03
  • Zadanie 1 dla Ciebie - rozwiązanie na 6
    12:08
  • Zadanie 2 dla Ciebie - usuwanie elementów listy
    01:45
  • Zadanie 2 dla Ciebie - rozwiązanie
    30:41

  • Destrukturyzacja
    10:54
  • Praca z formularzami
    13:21
  • Metoda setState - asynchroniczność i scalanie - teoria
    34:42
  • SetState - asynchroniczność i scalanie w praktyce
    14:42
  • Cykl życia komponentu - teoria
    18:08
  • Lifecycle w kodzie
    11:02
  • Cykl życia komponentu na przykładzie przycisku
    11:29
  • ComponentDidUpdate na przykładzie countera
    14:11
  • ComponentDidMount i componentWillUnmount na przykładzie zegara - cz. 1
    21:12
  • ComponentDidMount i componentWillUnmount na przykładzie zegara - cz. 2: przycisk
    12:32

  • Create React App - wprowadzenie i instalacja
    15:31
  • Zmiana od kwietnia 2019 - ważne
    00:44
  • Przegląd struktury aplikacji w środowisku CRA
    19:34
  • Aplikacja stoper - cz. 1: przygotowanie
    23:41
  • Aplikacja stoper - cz. 2
    22:54
  • Środowisko deweloperskie Create React App - teoria
    30:36
  • Moduły - teoria: eksport modułów w React, import modułów, bibliotek zewnętrznych
    16:37
  • Pobieranie i instalacja projektów
    00:25
  • Projekt: Pobieranie danych z dynamicznego źródła
    24:59
  • Projekt: JSON i metoda fetch
    33:27
  • Projekt: Obiekt XMLHttpRequest
    34:03
  • Fetch w praktyce – cz. 1: wyświetlanie 5 losowych użytkowników po kliknięciu
    44:30
  • Fetch w praktyce – cz. 2: dodawanie użytkowników po kliknięciu przycisku
    14:54
  • AJAX i JSON - teoria
    10:58
  • API - teoria
    11:57
  • Techniki AJAX - teoria
    09:29
  • Metoda fetch i obietnice (promises) - teoria
    36:17
  • Pobieranie danych w React - teoria
    08:09

  • Wstęp - opis projektu
    06:04
  • Tworzenie struktury formularza - pola tekstowe, checkbox i przycisk zapisywania
    22:55
  • Walidacja formularza - dodanie do struktury komunikatów błędu
    10:06
  • Funkcja walidująca wypełnianie formularza, reset poprawnie wysłanego formularza
    18:27
  • Komunikat potwierdzający wysłanie formularza
    06:08

  • Jak będzie wyglądał projekt
    05:19
  • Struktura aplikacji
    08:49
  • Dane w aplikacji i ich wyświetlanie
    19:51
  • Metody usuwająca i modyfikująca zadanie
    21:21
  • Wyświetlanie zadań w sekcjach do zrobienia i zrobionych
    11:59
  • Wyróżnienie zadań priorytetowych i wyświetlenie daty potwierdzenia
    12:50
  • Formularz dodawania zadania - struktura
    12:53
  • Formularz dodawania zadania - obsługa pola tekstowego, checkboxa i wyboru daty
    13:15
  • Obsługa pozostałych pól formularza
    03:11
  • Obsługa dodawania nowego zadania, czyszczenie pól formularza po dodaniu zadania
    17:18
  • Sortowanie dodanych zadań po dacie w obu sekcjach
    28:55

  • Czym jest routing i czym jest React Router
    15:48
  • Projekt SPA z menu i różnymi adresami URL - BrowserRouter i Link
    08:14
  • Projekt SPA z menu i różnymi adresami URL - Route
    09:20
  • Projekt SPA z menu i różnymi adresami URL - Aktywny przycisk i CSS
    15:28
  • Projekt SPA z menu i różnymi adresami URL - strona 404 i Switch
    06:06
  • Projekt2 SPA - wprowadzenie
    08:03
  • Projekt2 SPA - komponent główny
    18:22
  • Projekt 2 SPA - nawigacja
    18:55
  • Projekt 2 SPA - header
    22:09
  • Projekt 2 SPA - routing na stronie
    10:33
  • Projekt 2 SPA - articles na stronie startowej
    11:47
  • Projekt 2 SPA - zakładka kontakt i ochrona przed utratą danych w formularzu
    19:41
  • Projekt 2 SPA - Redirect w zakładce admina
    07:44
  • Projekt 2 SPA - lista produktów i podstrony dla konkretnych produktów
    20:36
  • Projekt 2 SPA - Stopka
    16:19

Requirements

  • Znajomość HTML i CSS w stopniu podstawowym
  • Znajomość JavaScript - jeśli wiesz, czym jest i jak użyć klasy, arrow function, rozumiesz - chociaż częściowo - mechanizm this, to jest ok

Description

Biblioteka React to jedno z najpopularniejszych rozwiązań w pracy front-end developera.  React to nowe podejście do tworzenia interfejsów użytkownika. Ten kurs ma dać Ci mocne fundamenty teoretyczne, ale także, poprzez wiele przykładów, nauczyć cię praktycznego wykorzystania React. To nie jest chwilowa moda czy przypadek, że mnóstwo ogłoszeń o pracę na stanowisku front-end developera wymaga znajomości Reacta. Jeśli poznałaś/poznałeś już JavaScript, to kolejnym krokiem w Twojej nauce może być React.

UPGRADE 09.2020 - kilkanaście godzin materiałów dogranych przez Mateusza Domańskiego: Hooki, React Context, Redux, MobX czy TypeScript (mini kurs). A na deser projekt w którym tworzymy front (React) i backend aplikacji.

W kursie uczę biblioteki React od podstaw, jednak od uczestnika wymagam już podstaw HTML i CSS oraz podstawowej znajomości JavaScript. W pierwszej fazie kursu przypomnę najważniejsze koncepcje JS, które często pojawiają się podczas pisania aplikacji w React, takie jak klasa, dziedziczenie, funkcja strzałkowa, sposoby pracy na tablicy i mechanizm this.

Jeśli nie czujesz się mocna/mocny w JS, to przed rozpoczęciem nauki React zapraszam Cię do mojego kursu Programowanie w JavaScript. Pamiętaj, że React to biblioteka JavaScript.

Kurs jest skierowany do osób, które nie mają żadnego doświadczenia w pracy z biblioteką React lub poznali ją, ale jedynie bardzo powierzchownie.

Who this course is for:

  • Osoby, które szukają pracy jako front-end developerzy
  • Osoby, których obecna praca wymaga znajomości React
  • Osoby, które chcą tworzyć własne projekty w oparciu o React
  • Freelancerzy, którzy chcą tworzyć nowoczesne strony typu Single Page Application

Instructors

Samuraj Programowania
Startupowiec, web developer i programista JavaScript
Samuraj Programowania
  • 4.8 Instructor Rating
  • 20,405 Reviews
  • 31,155 Students
  • 8 Courses

Nazywam się Bartłomiej Borowczyk, ale bardziej znany jestem jako Samuraj Programowania - od nazwy kanału, który prowadzę na YouTube. Jestem absolwentem Uniwersytetu Warszawskiego (politologii, niestety), ale także studiów podyplomowych związanych z programowaniem na Uniwersytecie Łódzkim (aplikacje internetowe) oraz w WSZiM w Sochaczewie (.NET, C# i MS SQL). Pierwszą stronę internetową stworzyłem w 2008 roku w systemie Joomla. Prowadzę kanały Samuraj Programowania oraz Websamuraj na YouTube zawierające materiały dotyczące nauki tworzenia stron internetowych i programowania w JavaScript.

Mateusz Domański
Software Engineer
Mateusz Domański
  • 4.7 Instructor Rating
  • 2,015 Reviews
  • 6,966 Students
  • 2 Courses

Jestem programistą z pasji, która się narodziła w wieku 13 lat kiedy napisałem pierwszy hello world w C++, opierając się na książce 'C++ dla każdego' Jesse Liberty, później związałem się z językiem C ponieważ elektronika była moją drugą pasją, a więc z ich połączenia, stworzyłem parę hobbystycznych urządzeń elektronicznych, których sercem były mikrokontrolery atmega zaprogramowane przy użyciu języka C. W pewnym momencie w życiu stwierdziłem, że warto było by połączyć pasję z pracą i tak zaczęła się moja przygoda z JavaScriptem (przy okazji HTML/CSS), później React, TypeScript i wciąż stawiam sobie wyzwania robiąc projekty "do szuflady" w Node.js czy .Net.
Przeszedłem długą ścieżkę w przygodzie z programowaniem od hobby do pracy zawodowej, przebranżawiając się w wieku 30 lat z sukcesem, więc mam nadzieję, że czas spędzony ze mną będzie dla Ciebie również skutkował życiem z pasją.
Poza pracą zawodową i moimi kursami, udzielam się również na kanale Samuraj Programowania na youtube oraz staram się spędzać jak najwięcej czasu z moją cierpliwą do mnie żoną jak i moją trójką wspaniałych synów.

  • Udemy for Business
  • Teach on Udemy
  • Get the app
  • About us
  • Contact us
  • Careers
  • Blog
  • Help and Support
  • Affiliate
  • Impressum Kontakt
  • Terms
  • Privacy policy
  • Cookie settings
  • Sitemap
  • Featured courses
Udemy
© 2021 Udemy, Inc.