Скачать "42 - React JS Практика - Redux"

Обложка аудиозаписи

Подождите немного, мы готовим ссылки для удобного просмотра видео без рекламы и его скачивания.

Предыдущее видео: 73 - React JS - http put, local state Следующее видео: C++ Разработчик учит Python

C++ Разработчик учит Python

C++ Разработчик учит Python

Канал: Winderton

73 - React JS - http put, local state

73 - React JS - http put, local state

Канал: IT-KAMASUTRA

🍿 СТРИМ 📦 STATE MANAGEMENT ☄️ effector убийца redux

🍿 СТРИМ 📦 STATE MANAGEMENT ☄️ effector убийца redux

Канал: SIBERIA CAN CODE 🧊 - Frontend

17.x Уроки React JS (инкубатор - теперь и онлайн)

17.x Уроки React JS (инкубатор - теперь и онлайн)

Канал: IT-KAMASUTRA

39 - Уроки, Курс React JS - action creator, action type

39 - Уроки, Курс React JS - action creator, action type

Канал: IT-KAMASUTRA

32. Уроки React JS - прокидываем callback через props

32. Уроки React JS - прокидываем callback через props

Канал: IT-KAMASUTRA

React JS / Redux - Урок #5 - Контейнеры

React JS / Redux - Урок #5 - Контейнеры

Канал: Гоша Дударь

55 - React JS практика - pagination, постраничный вывод пользователей

55 - React JS практика - pagination, постраничный вывод пользователей

Канал: IT-KAMASUTRA

78 - React JS - login и logout api

78 - React JS - login и logout api

Канал: IT-KAMASUTRA

ФИНАЛ! УСПЕЮ ЛИ Я? ПОЛНАЯ КОПИЯ Youtube с НУЛЯ | День 7

ФИНАЛ! УСПЕЮ ЛИ Я? ПОЛНАЯ КОПИЯ Youtube с НУЛЯ | День 7

Канал: RED Group

javascript

программирование

уроки

с нуля

обучение

js

react

react js

reactjs

react курс

react практика

react пример

redux

курсы

инкубатор

минск

online

бесплатно

практика

примеры

курс

00:00:05

пойди гайде кран

00:00:07

кама

00:00:08

утро

00:00:12

кук друзья привет согласитесь это полный

00:00:15

беспредел

00:00:16

а ведь время пришло гости оправиться

00:00:19

сделать тебя старинный друг

00:00:21

вовсе не славный мой друг самый главный

00:00:23

own3d средах с пошумим пошумим да друзья

00:00:25

все наконец-то вы пришли к вами с вами к

00:00:28

редактуре дак средах с редакция все

00:00:30

тянул и тянул кота за хвост пытаясь там

00:00:33

вокруг да около вам знание бить

00:00:35

определенная но мы пойдем дальше да мы

00:00:36

ведь как работает и под практики в

00:00:38

теории поэтому будем уже

00:00:39

бомбить этот ридак потихоньку будем

00:00:42

возвращаться в прошлое для того чтобы

00:00:43

для того чтобы там что-то вспомните да и

00:00:46

понять фундаментально все то что

00:00:50

происходит будет происходить давайте

00:00:52

напомню пещере dax ни слова часто че за

00:00:55

фигня ридак зачем вам нам нам вообще

00:00:57

нафиг сдался редакций на стоит задача с

00:01:00

вами стоит менеджмента управление сайтом

00:01:02

то есть мы как-то решить должны эту

00:01:05

проблему как нам хранить состояние

00:01:06

нашего приложения и мы могли бы выбрать

00:01:09

локальность стоять классовых компонент

00:01:10

всегда смело же можно добавить и

00:01:12

локальный state локальный стоит скажем

00:01:16

так хуков дав им цена хуков ну суть как

00:01:20

бы одна и та же фактически а можно

00:01:22

использовать что-то сторонние

00:01:24

потому что приложение большое стэйта

00:01:26

много и мы будем использовать вами

00:01:27

что-то сторонний например при dax или

00:01:30

например в бокс нет будем использовать

00:01:31

редакции и номере такси мы

00:01:33

останавливаемся популярная штуковина

00:01:35

сегодня мы будем именно ее прокачивать

00:01:39

так вот так вот так вот так вот то есть

00:01:41

наш стоит находится снаружи извне дни

00:01:45

приложение вот наша react а снаружи наш

00:01:48

стоит собственно говоря мы с вами

00:01:50

фактически уже используем редакции

00:01:53

почему потому что мы начали его

00:01:54

концепции переносить на свой код и мы

00:01:56

как бы создали свой фактический ридак

00:01:58

вот у нас есть стоит который я все очень

00:02:01

сильно хотел переименовать стол альт f1

00:02:03

открываю здесь то вкладку которые

00:02:05

открыто здесь сейчас переименован в

00:02:07

створ если дела shift f6 и поставлю

00:02:11

галочки все по идее должно на

00:02:12

переименовать вообще мне надо обновить в

00:02:15

шторм обновить шторма не лицензии могу

00:02:19

это сделать очень легко

00:02:22

star star star а вы тоже можете легко

00:02:25

сделать с помощью торрентов stor

00:02:29

все посмотрим все ли хорошо приложение

00:02:32

упало ли

00:02:33

упала то есть встречи с ты не знаешь что

00:02:35

такое короче блин упало storm упал

00:02:40

сейчас я иду в яндекс джесс и наш stor

00:02:45

здесь где-то подключал наш стол стоит

00:02:48

ёшкин матрёшкин за ерунда а у нас пути

00:02:51

файл был или не был этого файла

00:02:53

обязывает не понимаю что за ошибка stay

00:02:55

джесс но усач файл от directory этого

00:02:58

территорию file as to jest

00:03:00

да стоит же с у нас уже нет как же тогда

00:03:03

в нем ошибка типа stay джесс так давайте

00:03:06

мы сделаем npm старт иногда ребят

00:03:13

некоторые стоп ним иногда некоторые

00:03:16

изменения в коде бывают странными точнее

00:03:20

приводит сама чтобы нужно перезагружать

00:03:22

пири-пири стартовать все приложение я не

00:03:25

знаю почему это коснулось и джесса но

00:03:28

переименование файлов какая штука что

00:03:29

происходит вся штука когда мы каждый раз

00:03:31

стартуем изменяем файл происходит

00:03:33

определенная компиляция до изменяются

00:03:34

некоторые файлы компиляции почему

00:03:36

происходит тоже gsx не понимает browser

00:03:38

браузер нужен java script браузер не

00:03:41

пони не то что расширение файла джейсон

00:03:42

смит а сам коджи и секса вы браузер не

00:03:45

понимает скажем так импорт и экспорт и

00:03:47

на может не понимать потому что не

00:03:50

читайте не понимает браузер там может не

00:03:52

понимать новый синтаксис там например

00:03:54

свойств соответственно все компилируется

00:03:57

транслируется в старой версии с помощью

00:03:59

бей баллов и так далее поэтому лучше

00:04:03

депрессию все хорошо видите поэтому все

00:04:05

хорошо вот нам пришлось после изменения

00:04:07

имени файла делать вот эти вот пири-пири

00:04:10

стартовать проект чтобы более

00:04:12

глобального перекомпилировать скажем так

00:04:14

чтобы все обновите ну короче это так так

00:04:16

себе новость всё ребят старджесс

00:04:18

то есть star это наша напоминаю это

00:04:22

какой-то менеджер этого пышный объект у

00:04:24

которого есть

00:04:26

стоит он управляет сетей то есть мы как

00:04:29

стоит у нашему главному стоит у

00:04:30

приложение обращаемся через тор мы

00:04:33

говорим stor get стоит

00:04:34

если хотим стоит получить нижнее

00:04:35

подчеркивание помните говорит о том что

00:04:37

напрямую к этому объекту лучше не

00:04:39

прикасаться мы хотим нас top подписаться

00:04:43

катя estore когда ты будешь меняться мы

00:04:45

хотим узнать об этом весь чего нам это

00:04:46

нужно для того чтобы в яндекс ds в

00:04:50

яндекс джесс на то чтобы в яндекс джесс

00:04:53

можно было каждый раз перерисовку

00:04:55

запускать всего дерева но потому что

00:04:56

стоит изменился значит это все

00:04:58

перерисовать помните такую концепцию что

00:05:00

как бы как картинка как бы не что самое

00:05:04

главное до state state актуальны мы

00:05:06

можем всё взять и перерисовать

00:05:08

и получить визуально то что нужно

00:05:10

благодаря virtual домом перерисовка это

00:05:13

происходит на самом деле очень

00:05:14

оптимально и очень круто при этом да

00:05:17

конечно

00:05:18

кто там прокачаны пожарин и вот так вот

00:05:20

всё глобально перерисовывает на каждый

00:05:22

чих это тоже не классно тоже не класс но

00:05:25

это тема для отдельного разговора и мы

00:05:27

об этом поговорим очень-очень скоро

00:05:28

отдельно пока наша задача получается

00:05:34

понять что такое storm вспомнишь такой

00:05:36

спор в stor

00:05:38

в торе есть методе спать то есть мы

00:05:40

dispatch ему какие-то экшены действия и

00:05:42

зевая и эти действия нет непосредственно

00:05:46

преобразуют state при этом их что с вами

00:05:49

сделали на прошлом занятии мы ввели

00:05:51

reviews are и функции которые принимают

00:05:53

часть стоит а нужную этому reviews are u

00:05:55

экшн и если нужно преобразовывать ту

00:05:58

часть ее выплевывают поэтому мы ее перед

00:06:00

присваиваем слева заново и потом

00:06:02

уведомляем всех подписчиков

00:06:03

уведомляем всех подписчиков напоминаю о

00:06:06

том что мы экшены экшн экшн и когда dice

00:06:10

по чем мы их где спать чем с помощью

00:06:11

action криттеров точнее бы сам экшен не

00:06:14

создаем вручную экшн это объект у

00:06:15

которого как минимум листик мы не задаем

00:06:18

вручную мысли дома с помощью action

00:06:19

креаторов апдейт не пост action трейдер

00:06:21

этот экшен трейдер мы положили с вами

00:06:24

файлик среди узором тут у нас action

00:06:26

type тип и экшенов какие типы вообще что

00:06:28

мы можем выполнить такие действия у нас

00:06:30

есть скажем так системы и мыть экшен и

00:06:32

кидаем и этих шин и обрабатываем вроде

00:06:36

бы все окей хорошо где наш ридак 100

00:06:38

войти подключать ридак сирота вокруг да

00:06:40

около вокруг да около давайте редакции

00:06:42

то отдельная библиотека нужно ее про

00:06:44

инсталлировать

00:06:46

все кстати горя когда npm install

00:06:47

собираетесь писать вообще желательно

00:06:50

стопочек проект ну давайте не будем

00:06:52

ступать так как я нет терминал или mpm

00:06:54

старт писал я писала с помощью этой вот

00:06:56

вспомогательные консольки соответственно

00:06:57

скорее все запустила отдельный терминал

00:06:59

там запустил этот проект

00:07:02

дать проверим npn npm install и да

00:07:13

подожди

00:07:14

так вот друзья вот в момент 2 дефиса

00:07:17

сейф в одессе сюда я раньше ставил один

00:07:19

думаю что все окей а на самом деле все

00:07:22

окей было потому что поведение по

00:07:24

умолчанию то есть рак наш как бы сейчас

00:07:26

типа сайт можно не писать ну наверное

00:07:29

лучше его писать потому что это типа

00:07:31

явно ты не знаю наверное лучше писать

00:07:33

это такие нюансы которые на самом деле

00:07:34

плевать это сегодня так завтра и так это

00:07:38

не нечто фундаментальное что надо четко

00:07:40

осознавать и проносить через всю свою

00:07:43

жизнь скажем так который кидает а мелкие

00:07:45

какие-то штучки-дрючки который надо

00:07:46

просто держать в голове актуально для

00:07:48

чтения документации общения вообще с

00:07:51

коллегами и постоянно движухи движухи

00:07:53

движухи но есть базе с определенным

00:07:54

фундаментально который никогда до них да

00:07:57

никогда уже никуда не денется может

00:07:59

потом через лет 50 будет совершенно

00:08:01

мышление все иначе когда там skynet

00:08:04

будет все такое хотя бы через 50 лет по

00:08:06

прогнозам димыча все умрем поголовно все

00:08:10

так ну что вардинге

00:08:12

не обращаем внимание всех все хорошо

00:08:15

главное что нет ошибок вроде как

00:08:18

редакций поставился так вот что же такое

00:08:20

редакции ребята что такое редакции что

00:08:24

значит поставился редакции редакции нам

00:08:26

предоставляет несколько возможностей с

00:08:27

вами на самом деле редокс предоставляет

00:08:30

возможность создать star то есть у

00:08:33

редакции специальная функция который

00:08:34

называется создать stor ну и и вызываем

00:08:37

и у нас появляется storm прикольно то

00:08:41

есть мы создавали stor здесь

00:08:42

самостоятельно объекта он пышный объект

00:08:46

такой как бы типа умный объект это не

00:08:48

совсем прямо пышной объекта лупы когда

00:08:50

киева пешком толпа это там концепции да

00:08:51

там 34 концепции там инкапсуляция и

00:08:54

полиморфизм исследования

00:08:55

это полноценная опыт но как бы это уже

00:08:57

не при примитивный объект к стоит

00:08:59

например это уже умный объект который

00:09:01

там с методами и так далее но мы его

00:09:04

создавали вручную через литерал объекта

00:09:06

к тому же ари dax библиотека которые

00:09:09

заключили она предоставляет вам

00:09:10

возможность создать этот спор не вручную

00:09:13

а с помощью вот библиотеки редакции

00:09:18

войти-то сделаем давайте наш штор

00:09:21

оставим как есть добавим еще сюда файлик

00:09:23

назовем его ридак 100

00:09:26

то есть наш торт я вам рекомендую не

00:09:29

удаляй да пока вы не устройтесь на

00:09:30

работу или пока вы не дойдёте очень

00:09:34

далеко в этом курсе когда у вас все

00:09:36

будет четко уже понимание в голове грубо

00:09:38

говоря до 150 уроков 50 урока когда

00:09:41

идете не удаляйте свой стороны потому

00:09:43

что в любой момент вы можете посмотреть

00:09:45

этот сторону и мы будем подсматривать

00:09:47

для того чтобы понимать как работать три

00:09:49

daxter все ребят то есть смотрите ребят

00:09:52

что у нас есть было просто storm мы его

00:09:54

создавали с помощью литерал объекта а с

00:09:56

помощью а редакторский sport red star

00:09:59

star который принадлежит редакцию

00:10:02

который создаст нам редакции мы говорим

00:10:03

great star мы вызываем какую-то функцию

00:10:07

которая варит крейг сто раз создай

00:10:08

сторону alt-enter нажимаем она

00:10:11

предлагает нам за inserted

00:10:12

из библиотеки редакции все то есть мы с

00:10:15

вами мучались создавались top вручную да

00:10:17

для того чтобы понять как он работает не

00:10:19

просто так типа чернее пострадать от

00:10:22

одну с целью определенные сейчас мы уже

00:10:24

эту цель достигли мы примерно понимаем

00:10:26

что там внутри и мы с вами создаём стар

00:10:29

уже с помощью функции клеит столь важный

00:10:33

момент окей что типа все готово

00:10:35

этот сорт бери используй ну на самом

00:10:37

деле нет конечно ну давайте начнем ки

00:10:40

попробовать его использовать где мы тот

00:10:42

storm мы этот стол смотрите

00:10:44

импортировали мыс наш старый спор

00:10:47

импортировали в яндекс джесс яндекс с а

00:10:50

дальше уже даст опрокидывали дальше

00:10:52

dispatch банды все такое а давайте

00:10:54

теперь этот сторону импортируем из

00:10:56

редактора просто поменяем редактор идем

00:11:00

наш редактор экспортировать и вы не

00:11:02

забудем так он импортировался по

00:11:05

умолчанию по дефолту да потому моего

00:11:08

иран экспорт default stor

00:11:11

то есть мы экспортировали все нашей

00:11:14

системе как будто бы теперь нашей

00:11:16

системы her будет использовать столь наш

00:11:19

редакторский настоящий редакторский

00:11:21

сторону но мне на самом деле не все так

00:11:23

хорошо ну пока и пока еще почему потому

00:11:25

что наш торта самом деле обладал

00:11:28

определенными

00:11:29

определенной логикой до который мы

00:11:31

вручную описывали например например

00:11:37

хорошо например get state я вас порадую

00:11:42

точно также у редакторского стараясь

00:11:44

такой метод get стоит поэтому

00:11:45

переписывать ничего не надо а субскрайб

00:11:47

то же самое субскрайб сидит там внутри

00:11:50

сторонам переписывать ничего не надо вот

00:11:52

здесь да нам не надо переписывать

00:11:54

get state маминого субскрайб до молотова

00:11:57

dispatch тоже нам не надо переписывать

00:11:59

мы тоже будем dispatch

00:12:00

экшены а логика вот это вот а логика

00:12:03

ведь у нас идет бреди узорах по факту

00:12:05

правильно помните логика мы перенесли в

00:12:07

ряду сыр и поэтому здесь такая

00:12:09

это так сказать себе логика проста

00:12:11

пробегаем по себе режиссером отдаем

00:12:13

часть какую-то экшн и собираем как бы

00:12:16

новый стоит уже изменены

00:12:18

чтобы уведомить там подписчика при

00:12:20

мальчика я штука-то с по сути к буфету

00:12:22

логика уже в ряде узорах арию сары

00:12:25

написаны по правилам которые нужны с

00:12:27

которой сегодня используют редакторский

00:12:30

спорт то есть что нам сделать просто

00:12:32

отдать эти режиссером нашему редактор

00:12:35

скому сторону то есть торсом по себе как

00:12:37

бы не имеет значение типа стороны всего

00:12:38

лишь storm но пока столько было

00:12:40

неполноценно еще потому что сторону

00:12:42

нужны renew сарай чтобы преобразовывать

00:12:43

работать со скейтом поэтому мы так как у

00:12:46

нас режиссеров много в общем мы должны

00:12:47

эти три режиссера склеить в кучу

00:12:50

склеить в кучу и вот что мы делаем мы

00:12:53

вызываем только специальную давайте лет

00:12:55

и reviews с земли дюсис батч

00:12:59

какой-нибудь там пачка режиссеров

00:13:01

наверное так пирса я могу ошибаться

00:13:03

review сирс на типа среди source ready у

00:13:06

сары и мы вызываем специальную функцию

00:13:09

который называется комбайн радиус

00:13:12

рассвете предлагает мне комбайн readers

00:13:15

функция тоже приходит к нам alt-enter из

00:13:18

редакция то есть мы должны взять и

00:13:22

передать этой функции с комбайне как бы

00:13:24

смешать эти три ready у сыра наших

00:13:26

давайте это сделаем у нас здесь радиус r

00:13:29

ещё вспомним profile reduce

00:13:34

как и как их мешать вопрос 2 да давайте

00:13:37

поставим фигурные скобки i put a good

00:13:40

смешным profile режиссер поставим enter

00:13:42

сейчас я объясню что и происходит диалог

00:13:45

среди сэр , и

00:13:48

sidebar продюсер то есть мы комбайне

00:13:51

объединяем 3 режиссера что это такое эта

00:13:54

функция мы вызываем компьютер и передаем

00:13:56

объект внутри но объект мы знаем состоит

00:13:59

из ключ-значение ключ-значение поэтому

00:14:01

давайте для

00:14:03

для более понятности напишем твор тут

00:14:06

вот это вот запись для более понятной до

00:14:08

понятности особенно для новичков это то

00:14:12

же самое что вот так вот то есть мы

00:14:16

создаем объект

00:14:18

у которого есть свойство profile регистр

00:14:21

значение этого свойства будет являться

00:14:22

регистр который вот которого три usar

00:14:26

которого там функция которую мы

00:14:27

определили то есть это объект у которого

00:14:29

есть по сути 3 радиус r a3 b3 свойства

00:14:33

каждое свойство является режиссером по

00:14:35

сути каждое свойство является методом ну

00:14:38

так это устроено но у тут название

00:14:40

должны быть другие по сути ребят

00:14:42

смотрите что на самом деле вот этот

00:14:43

объект воспринимаете воспринимаете не

00:14:45

как объект как бы связка радиусов а как

00:14:48

воспринимаете как ваш state как ваш

00:14:50

стоит помнить ваш статус на основной

00:14:52

какие у него были редки пошло от вашего

00:14:56

стоит моем случае это profile пейдж до

00:14:58

xp и 7 бар так вот вы должны быть и вот

00:15:01

33 в эти свойства перенести сюда то есть

00:15:05

они вот здесь и должны быть вы говорите

00:15:07

что вашего есть stay the profile пейдж

00:15:10

свойства и за него отвечает profile

00:15:12

regisseur до шуток если как бы обычными

00:15:14

обычным сленгом обычными словами издает

00:15:18

пейдж за него отвечает дай бог среди us

00:15:20

or и есть sidebar пэйдж

00:15:23

царь бар страничка как бы social бар

00:15:26

ветка в этом объекте 100 это из-за него

00:15:29

отвечает sidebar фритюр все в итоге

00:15:32

после того как мы за компании бреду

00:15:34

сарай мы эти за комбо nina & reviews are

00:15:36

и отдаем storm упа и все-таки его тела

00:15:43

автоматически traxtorm

00:15:46

создает внутри себя state у которого

00:15:49

есть три вот такие вот свойства то есть

00:15:52

тоже самое что у нас была вот здесь

00:15:55

но у нас-то свойства были с какими-то

00:15:58

значениями а сейчас этих значений нет

00:16:02

получается потому что ну да как бы мы их

00:16:04

не перенесли то есть этого всего не

00:16:05

будет дать общее проверим что ну как бы

00:16:07

типа работает по идее

00:16:09

мне кажется должно принести тоже типа

00:16:10

заработать вот она ругается на что что

00:16:18

profile пейдж дарит user profile пейдж

00:16:22

возвращает undefined во время

00:16:24

инициализации возвращает undefined

00:16:27

во время инициализации что это значит

00:16:29

это значит то что смотрите у нас объект

00:16:33

образовался и у него есть три свойства

00:16:35

три свойства ну к чему равны эти

00:16:37

свойства ну типа ready усеру но нет на

00:16:39

самом деле эти свойства вы должны быть

00:16:41

равны каким-то объектом до каким-то

00:16:43

объектом объекту объекту они по факту

00:16:47

равны ничему и вот он ругается что

00:16:49

profile и режиссер например supra file

00:16:51

viewer

00:16:52

смотрите он получает state и возвращает

00:16:55

стоит если никакого экшена не нашлось

00:16:57

must и это вначале как бы нет даже вот

00:17:00

это и под ветки его нет стоит о которой

00:17:02

он мог получить и например вернуть

00:17:03

обратно

00:17:04

поэтому здесь получает undefined и это

00:17:07

касается всех режиссеров в самом начале

00:17:09

давайте поставим здесь дебаггер мы

00:17:13

увидим что мы ничего не dispatch им но

00:17:15

происходит какой-то dispatch

00:17:16

автоматически смотрите

00:17:18

нажимаю в 12 обновляю мы видим что

00:17:21

dispatch произошел автоматическим

00:17:22

размыть по libre дюрер разные повредился

00:17:24

значит кто-то за dispatcher star

00:17:26

какой-то экшен и мы видим что state

00:17:29

пришел undefined

00:17:30

стоят энди foger action смотрите какой

00:17:33

тип у экшена

00:17:35

какой то непонятный тип что происходит

00:17:37

здесь сам ридак сна строева it скажем

00:17:39

так свою систему настраивает стартовое

00:17:41

свое интеле за циона и значение и он

00:17:44

запускает определенный ряд

00:17:45

экшена и вот естественно этого экшена у

00:17:48

нас нет такого отдав в кейсах здесь

00:17:51

соответственно никакого значения встреть

00:17:53

и нет изначально и мы смотрите в 10

00:17:57

сейчас в 10 10 попадая возвращаем state

00:18:01

помещаем undefined

00:18:02

то есть наш как бы стать не про

00:18:04

инициализироваться profile должен был

00:18:06

вернуть какую-то типа заготовочку

00:18:07

понимаете со старта какую-то заготовку

00:18:09

стартовую которая не оказалось потому

00:18:13

что ну нет у нас она нигде не прописано

00:18:15

в нашем старом история она была

00:18:16

прописана нашим 100 старом истории мы и

00:18:18

как бы за hard к деле вот здесь прям

00:18:20

внутри стэйта а вот здесь как бы ее нет

00:18:22

соответственно возвращается undefined

00:18:24

и все на этом и на этом ругается самаре

00:18:29

dax ридак старджесс

00:18:31

ридак срубается короче о том что как бы

00:18:33

ну фигня какая нету инициализации он

00:18:35

нова значения поэтому нам чтобы вот эта

00:18:38

вот логику всю перенести нужно каждый

00:18:41

режиссер проинициализировать начальным

00:18:43

значением как это делается а это

00:18:46

делается с помощью обычного

00:18:48

java script о-го-го синтаксиса с помощью

00:18:50

параметров по умолчанию шутка параметры

00:18:51

по умолчанию

00:18:52

ду словах лет сам а б мы хотим находить

00:18:56

сумму двух чисел сам эта функция который

00:19:00

находит сумма двух чисел

00:19:03

return a + b все мы вызываем с вами

00:19:08

функцию например интересно почему он

00:19:11

подчеркивает красным стрелку забыл

00:19:13

простите

00:19:15

соответственно мы вызываем суммы говорим

00:19:17

просуммируем не 1 и 3 а мы можем так

00:19:21

сделать например просуммируем ни один и

00:19:23

и сколько чтобы в baby butt and if any

00:19:26

мы можем сказать что если бы не передано

00:19:28

пускай б по умолчанию будет 0 прикольно

00:19:31

а можно сделать так типа если они

00:19:33

переданы да можно если они передано то

00:19:36

возвращая по умолчанию там например тоже

00:19:41

0 или 1 или минус 1 что угодно то есть а

00:19:45

если вдруг не передадут

00:19:46

будет по умолчанию равно вот этому

00:19:48

значению то же самое здесь происходит

00:19:51

стоит если друг не передали а вначале до

00:19:54

редакции может его передать потому что у

00:19:56

него его нет когда я стилизация

00:19:58

происходит поэтому мы объявляем перед

00:20:00

режиссером так называемый и не шоу state

00:20:03

in цивилизационный state который будет

00:20:06

инициализировать имя вот это вот под

00:20:07

веточку конкретно profile то есть мы

00:20:09

идем наш stores тары и забираем наши

00:20:12

profile отсюда вот этот который объект

00:20:14

который отвечает за profile и засовываем

00:20:17

его profile

00:20:20

вот сюда вот у нас есть некоторый объект

00:20:23

который просто сидит

00:20:24

одноразовый объект скажем так ну сидит у

00:20:26

него из какие-то стартовые данные и вот

00:20:28

мы говорим вот и одноразово объект в

00:20:30

случае если state сюда не придет будешь

00:20:33

тем самым stay там то есть ты будешь

00:20:35

начальным stay там дальше уже дальше уже

00:20:37

когда он вернётся первый раз все когда

00:20:39

мы будем без патчить свои экшена стоять

00:20:41

еда всегда будет приходить и мы будем

00:20:43

этот при приходящий стоит уже

00:20:44

использовать а вначале

00:20:45

когда этого стоит а нет мы будем

00:20:47

использовать это диниш all state все нам

00:20:50

нужно сделать то же самое с и дает среди

00:20:52

сэром мы объявляем лет и не шел стоит

00:20:56

название везде одинаковый отдаем идем

00:20:59

наш редактор

00:21:00

в сторону олдскульные самописный

00:21:04

копируем этот объект

00:21:06

копируем этот объект и переносим вы сюда

00:21:11

все

00:21:12

и говорим state равно и ниши state все и

00:21:18

у нас осталось последнее и не шел стоит

00:21:20

это для сайдбара

00:21:22

так как sidebar нас ничего не делает в

00:21:24

любом случае он должен 40

00:21:25

и не шоу state а не должен быть мы

00:21:28

объявляем эту переменную здесь выше и не

00:21:31

шил стоит равно стоит ехать да ну

00:21:33

главное чтоб объект был чтобы не было

00:21:35

нди фонтане был атомного пустоты и так

00:21:38

далее все сохраняем и смотрим все

00:21:43

отображается смотрим печатать или

00:21:45

сообщения не печатается давайте подумаем

00:21:49

почему не могу прочитать profile пейдж у

00:21:52

undefined

00:21:53

для меня это уже честно говоря как бы

00:21:56

нежданчик я не думал что будет такая

00:21:57

ошибка ну и хорошо что ошибка потому что

00:21:59

я зато сейчас немножко с вами под и

00:22:01

божим как бы я мог бы части по опять же

00:22:03

включить мозговую активность сразу там

00:22:05

перейти сразу перейти в страничку на

00:22:08

страничку ну попытаться глазами понять в

00:22:11

чем проблема но я буду либо жить а

00:22:13

попозже 20 строчка apps контур shift and

00:22:17

apps 20 строчка это внутренность уже gsx

00:22:21

анджей сексе нельзя поставить точку

00:22:23

останова ну не только и разве что в этих

00:22:26

стрелочных функции auto мыслей краску

00:22:28

кожей ну

00:22:30

проблема такая что стоит не находится

00:22:31

profile пэйдж и говорит я не могу взять

00:22:34

стоит он define давайте поставим точку

00:22:36

останова здесь дебаггер обновляем в 12

00:22:40

печатаем что-то папа и видим что у к нам

00:22:43

пришел в прописи

00:22:44

state undefined мы почему стоит энди

00:22:48

фармит то есть треть свойства есть но но

00:22:50

он дефо не значит растает свойства есть

00:22:52

значит там где а папа рисуется там я

00:22:54

папа рисуются кто-то в атрибут добавил

00:22:56

state просто его значение undefined

00:22:59

где папа рисуется в индекс s давайте

00:23:02

пойдем в индекс s давайте пойдем в

00:23:05

яндекс джесс и рисуется у нас это дело

00:23:08

вот здесь давайте поставим дебаггер

00:23:11

здесь сохраняем обновляем control-r я

00:23:16

обычно нажимая чтобы обновить и смотрим

00:23:18

state пришел к нам

00:23:20

откуда он к нам пришел как мы оказались

00:23:22

в этой функции как узнать давайте

00:23:24

немножко вам покажу у нас есть такое

00:23:26

понятие как call stack

00:23:27

стык вызова сейчас здесь когда масштаб

00:23:31

большое но к сожалению мало места

00:23:32

занимает но и мало места для работы от

00:23:35

не scope

00:23:37

фото вызова на школ стек стек вызовов

00:23:40

когда мы используем какие-то framework

00:23:41

типа энглер react там куча куча куча

00:23:44

промежуточного всего иногда очень сложно

00:23:46

будет работа не только быстро что вы где

00:23:48

точно просто бюджет не пугайтесь ну во

00:23:52

многих сценариях каустик очень как бы

00:23:54

полезен например так как мы оказались в render

00:23:56

in the retry и мы видим что call stack

00:23:58

как тарелочки снизу лежит самая первая

00:24:00

запущенная функция анонимная да какая-то

00:24:03

глобальная там скажем так и идет он

00:24:05

может хотя здесь не меняя ним не скорее

00:24:08

все так ну неважно как это первая

00:24:09

функция и дальше как тарелочки отдано

00:24:11

другую кладется вверх и пока верхняя

00:24:13

тарелочка стек тарелочки не отработает

00:24:16

нижняя тоже не отработает и идет сверху

00:24:18

вниз называется первый вышел первый

00:24:21

пришел последний вышел но это тема для

00:24:24

отдельного разговора так вот нашу рендер

00:24:26

интер 3 вызвал индекс с смотрим она вот

00:24:30

где мы вызвали в 17 строке то есть мы

00:24:32

взяли stor взяли у него state запихнули

00:24:34

сюда ok все хорошо заходим внутрь и

00:24:38

видим что стоит ей да стоит передали в

00:24:40

первом случае все хорошо но потом мы

00:24:43

впечатываем кнопочку внимание что

00:24:45

происходит опять вызвался рендер это

00:24:48

m332 типа пофантазируем и попробуем

00:24:51

понять почему он вызвался как вы думаете

00:24:53

паузу нажимаете думаете через три

00:24:55

секунды возвращаетесь а я отвечаю потому

00:24:57

что стейк

00:24:58

изменился и мы перри вы вызвали эту

00:25:01

штуку а если стоит меняется наша функция

00:25:04

render in the retry вызывается почему

00:25:06

потому что мы подписались вы подписались

00:25:08

то есть мы отдали свою функцию отдали

00:25:10

а далее ну а далее storm stores

00:25:15

субскрайб отдали свою функцию и мы

00:25:17

почему-то рассчитываем что старт тогда

00:25:20

произойдет изменение передаст нам сюда

00:25:22

стоит а он стоит не передался доверить

00:25:24

undefined

00:25:25

им этот он дефайны дальше кидаем по по

00:25:27

дереву понимаете к проблем к и это как

00:25:31

бы ну проблем какие проблемы к эти такая

00:25:32

это такая правда жизни то есть мы вот

00:25:35

эти что мы делали мы в своем в

00:25:36

реализации своего скоро каждый раз когда

00:25:38

происходила изменениям и уведомляли

00:25:40

подписчика

00:25:41

да dispatch его ядом ляли подписчика и

00:25:43

передавали подписчику свой state так вот

00:25:47

редакторский старт такого не делает

00:25:49

ридак saw this top когда уведомляет

00:25:51

подписчиков он не передает им стоит это

00:25:55

и удобно и неудобно одновременно это как

00:25:58

бы ну это так идея концепция как как я

00:26:01

понял такая что как бы надо разделять

00:26:03

моя задача просто уведомить тебя я не

00:26:05

хочу тебе ничего не передавать хотя

00:26:07

паттерны вот эти вот все с подписчиками

00:26:08

связанные как бы не запрещает передать

00:26:10

что-то в данном случае не передают то

00:26:12

есть если мы хотим

00:26:14

потом state за использовать нам надо как

00:26:17

бы 100 и то есть каждый раз когда

00:26:19

подписчик срабатывает когда мы узнаем

00:26:21

что стоит изменился нам это у stora

00:26:23

заново запросить этот state так как я не

00:26:27

хочу render in the retry

00:26:29

загрязнять функцию сторону и прошением у

00:26:32

stora этого стоит а поэтому я возьму

00:26:34

здесь сейчас обернут это вот то есть я

00:26:36

отдам нашему storm в качестве подписчика

00:26:39

не вот эту вот функцию рендер интернет

00:26:42

риадом некоторую анонимную

00:26:44

стрелочные функцию внутри стрелочные

00:26:47

функции я уже сделаю вызов нашего рендер

00:26:49

эльдары 3 то есть

00:26:51

астор вызовет когда стоит изменится нашу

00:26:53

стрелочные функцию он вызовет наш

00:26:56

стрелочные функцию она вызовется и мы в

00:26:59

нее выезжаем уже render in the retry но

00:27:01

нам нужно взять это стоит и мы берем

00:27:03

этот стоит и просим у сторону вот здесь

00:27:05

мы говорим лет state равно вместо минус

00:27:11

поставил вот так и передаем я стоит туда

00:27:14

дальше все смотрим печатаем печатает

00:27:23

добавляем все добавляется переходим в

00:27:26

менеджер

00:27:27

печатаем все печатается добавляем все

00:27:32

друзья обратите внимание мы изменение

00:27:37

провели по сути только

00:27:39

только вот в отдельном файле есть мы

00:27:41

создавали stor так теперь создавались

00:27:43

торт так если бы я заранее вам я у меня

00:27:46

были мысли ну я не помню почему я решил

00:27:48

не переделать если бы заранее сделал так

00:27:50

чтобы не рассчитываем на то что к нам

00:27:53

приходит state внутри подписчика внутрь

00:27:56

подписчика то нам бы тут даже ничего

00:27:58

менять не пришлось то есть мы поменяли

00:27:59

бы только вот создание stora мы раньше

00:28:01

воссоздавали так сейчас по-другому все

00:28:03

понимаете

00:28:04

анри де у сары да мы доработали сами но

00:28:06

я тоже мог были доработать еще и вот в

00:28:09

том в том варианте но я как бы просто

00:28:10

хочу же скорее вас к акту привести я вас

00:28:13

к редакцию друзья привел поздравляю вас

00:28:15

это очень-очень важный шаг пересмотрите

00:28:17

это видео два-три раза сколько вам

00:28:19

понадобится

00:28:20

не думайте что дальше типа будет также

00:28:22

легко как было до этого все начинается

00:28:24

взрослая жить хотя по факту по факту

00:28:26

мысли будем одно и то же одно и то же

00:28:28

одно и то же месить туда-сюда как бы и и

00:28:31

все будет круто мы будем уже дома стояли

00:28:34

до уже настоящая практика все

00:28:35

практически практически вот этот вот

00:28:37

точнее как редактор

00:28:39

радиус r и это уже то как она будет

00:28:42

всегда ну это уже как бы правильный код

00:28:46

и конечно доработки здесь нуждаются

00:28:48

какие-то мелкие но это уже так вот в

00:28:49

сети так пишут на работах короче когда

00:28:51

пишут проекта заказчик дает вот так

00:28:53

примерно пишет

00:28:55

итак пример написано все вы как бы уже

00:28:57

взрослые ребята поздравляем вас все

00:28:59

поставьте лайк до новых встреч три dax

00:29:02

ты знать будешь круто

00:29:07

этика найти gun

00:29:09

я массу

00:29:10

1

00:29:12

а

Описание:

🚀Стань квалифицированным разработчиком за 9+ месяцев с трудоустройством в IT —INCUBATOR: Front-end https://it-incubator.io/front-end Back-end https://it-incubator.io/back-end Поддержать меня можно на patreon https://www.patreon.com/itkamasutra или оформив спонсорство на данном канале. Помогайте друг другу вот здесь: https://t.me/reactjs_samurai И вот мы подошли к важному - Redux!!! Наконец-таки! Дальше будем работать в связке React-Redux и оттачивать мастерство. Да, нам ещё предстоит подключение библиотеки react-redux, чтобы можно было забыть про ооп-шный store и использовать библиотеку в более простом варианте! Да, речь про функцию connect! Но это завтрашний день ;) Удачи, друзья! Уроки по React JS: https://www.youtube.com/playlist?list=PLcvhF2Wqh7DNVy1OCUpG3i5lyxyBWhGZ8 * Сайты: https://it-kamasutra.com/ https://it-incubator.io/ https://samuraijs.com * Мы в соц. сетях: https://vk.com/itkamasutra https://www.facebook.com/unsupportedbrowser https://telegram.me/itkamasutra * Мои личные VK и Insta: https://vk.com/d.kuzyuberdin https://www.facebook.com/unsupportedbrowser

Готовим варианты загрузки

Популярные

HD видео

Только звук

Все форматы

* — Если видео проигрывается в новой вкладке, перейдите в неё, а затем кликните по видео правой кнопкой мыши и выберите пункт "Сохранить видео как..."

** — Ссылка предназначенная для онлайн воспроизведения в специализированных плеерах

Вопросы о скачивании видео

Как можно скачать видео "42 - React JS Практика - Redux"?

Сайт http://unidownloader.com/ — лучший способ скачать видео или отдельно аудиодорожку, если хочется обойтись без установки программ и расширений. Расширение UDL Helper — удобная кнопка, которая органично встраивается на сайты YouTube, Instagram и OK.ru для быстрого скачивания контента.
Программа UDL Client (для Windows) — самое мощное решение, поддерживающее более 900 сайтов, социальных сетей и видеохостингов, а также любое качество видео, которое доступно в источнике.
UDL Lite — представляет собой удобный доступ к сайту с мобильного устройства. С его помощью вы можете легко скачивать видео прямо на смартфон.

Какой формат видео "42 - React JS Практика - Redux" выбрать?

Наилучшее качество имеют форматы FullHD (1080p), 2K (1440p), 4K (2160p) и 8K (4320p). Чем больше разрешение вашего экрана, тем выше должно быть качество видео. Однако следует учесть и другие факторы: скорость скачивания, количество свободного места, а также производительность устройства при воспроизведении.

Почему компьютер зависает при загрузке видео "42 - React JS Практика - Redux"?

Полностью зависать браузер/компьютер не должен! Если это произошло, просьба сообщить об этом, указав ссылку на видео. Иногда видео нельзя скачать напрямую в подходящем формате, поэтому мы добавили возможность конвертации файла в нужный формат. В отдельных случаях этот процесс может активно использовать ресурсы компьютера.

Как скачать видео "42 - React JS Практика - Redux" на телефон?

Вы можете скачать видео на свой смартфон с помощью сайта или pwa-приложения UDL Lite. Также есть возможность отправить ссылку на скачивание через QR-код с помощью расширения UDL Helper.

Как скачать аудиодорожку (музыку) в MP3 "42 - React JS Практика - Redux"?

Самый удобный способ — воспользоваться программой UDL Client, которая поддерживает конвертацию видео в формат MP3. В некоторых случаях MP3 можно скачать и через расширение UDL Helper.

Как сохранить кадр из видео "42 - React JS Практика - Redux"?

Эта функция доступна в расширении UDL Helper. Убедитесь, что в настройках отмечен пункт «Отображать кнопку сохранения скриншота из видео». В правом нижнем углу плеера левее иконки «Настройки» должна появиться иконка камеры, по нажатию на которую текущий кадр из видео будет сохранён на ваш компьютер в формате JPEG.

Сколько это всё стоит?

Нисколько. Наши сервисы абсолютно бесплатны для всех пользователей. Здесь нет PRO подписок, нет ограничений на количество или максимальную длину скачиваемого видео.