Next.js. Полный курс

Поделиться
HTML-код
  • Опубликовано: 10 ноя 2024

Комментарии • 186

  • @АлексейСкаливенко-в3с
    @АлексейСкаливенко-в3с 7 месяцев назад +2

    Капец, в инете нормальной документации не найдешь, а автор просто все по полочкам разложил... Ваще кайф, Спасибо тебе огромное!!!

  • @velessn
    @velessn 2 года назад +21

    Спасибо, Женя. Очередное классное видео.

  • @ultraduck100
    @ultraduck100 2 года назад +36

    кем тебе приходится Ким Чен Ын, Евгений?)

  • @siawyhy
    @siawyhy 2 года назад +6

    Божечки, когда я понял React впервые я подумал, какая же клаасная библиотека, но вот это😍. Как же она упрощает жизнь. ПРОСТО видео бомба

  • @kb0396
    @kb0396 2 года назад +2

    Евгений, спасибо за курс.
    Пишу на реакте в прод, хочу для себя немного в некст, почитал доку и ваш курс, все просто и понятно!

  • @zerox9646
    @zerox9646 Год назад

    разложил всё по полочкам! отличный тутор

  • @pitbull5314
    @pitbull5314 2 года назад +2

    Закончил смотреть курс, очень информативно и понятно, мне курс зашёл)
    Автор красавчик)

  • @lightscrool
    @lightscrool Год назад

    Большое спасибо!
    Очень полезное видео, всё по делу и без воды

    • @YauhenKavalchuk
      @YauhenKavalchuk  Год назад

      Пожалуйста

    • @lightscrool
      @lightscrool Год назад

      @@YauhenKavalchuk кстати, я сейчас заметил, на гитхабе не всё из видео есть. Может у тебя сохранилась локально и ты можешь обновить репозиторий?

    • @YauhenKavalchuk
      @YauhenKavalchuk  Год назад

      В репозитории весь код курса, смотрите в ветках

  • @aleksandr1277
    @aleksandr1277 2 года назад

    сегодня день ты прожил не зря - от меня лайк заработал, вполне заслуженно!

  • @sidjo6191
    @sidjo6191 2 года назад

    Лучший курс среди моря шлака на youtube! Вообще, очень хороший канал и контент! Спасибо!

  • @АлександрСидоров-п1м

    Спасибо! Очень доходчиво и без воды.

  • @romanr5843
    @romanr5843 Год назад

    Бомбически! Спасибо!

  • @garikmelqonyan9130
    @garikmelqonyan9130 2 года назад

    Good job, Evgeniy, thanks for this detailed explanation.

  • @romababok8759
    @romababok8759 Год назад

    Качественный курс.Спасибо за старания.

  • @pitbull5314
    @pitbull5314 2 года назад

    Хотел учить next как раз)
    И не мог найти норм курсов, и тут как раз на день рождение подгон)

  • @hachipoli822
    @hachipoli822 2 года назад

    Огромный респект что делаешь многое бесплатно

  • @kri4evskiy
    @kri4evskiy 2 года назад

    Охо-хо-хо, Женя) Давно не смотрел твои видео. У тебя волосы!!!))) Класс)))
    И спасибо за контент)

  • @nicothin
    @nicothin 2 года назад

    Это, действительно, классно! Респектище!

  • @AndreiLaurou
    @AndreiLaurou 2 года назад

    спасибо. нравятся Ваши видео.

  • @Капитангрез
    @Капитангрез 2 года назад +3

    Ты просто монстр! Столько контента, что я учиться не успеваю, а ты уже новое выпускаешь!

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад +2

      Спасибо за отзыв

    • @enjoymtx
      @enjoymtx 2 года назад

      так это же старый курс с канала, просто объединённый в одно видео

  • @ivanoliinyk8404
    @ivanoliinyk8404 2 года назад +1

    Спасибо, очень просто и понятно

  • @egorpobylets6597
    @egorpobylets6597 2 года назад

    Прекрасный курс. Спасибо!

  • @ЕвгенийТяка-ч4х
    @ЕвгенийТяка-ч4х 2 года назад

    Очень круто, спасибо

  • @PoRoKLusT
    @PoRoKLusT 2 года назад

    Спасибо за видео. 32:00 В экспериментах выяснил, что если в src указывать путь стрингой как в , то placeholder="blur" работать не будет. Так что обязательно нужно картинку сначала импортировать.

  • @aliakseikaravaichyk1514
    @aliakseikaravaichyk1514 2 года назад

    Женя спасибо за контент, как и всегда!)

  • @dev_k0
    @dev_k0 2 года назад

    Спасибо огромное, курс огонь!!!

  • @almaz.kamaliev
    @almaz.kamaliev 2 года назад

    Отлично, спасибо за труд!

  • @CorleoneMikele
    @CorleoneMikele 2 года назад

    Большое спасибо за курс

  • @xmarsianca
    @xmarsianca 2 года назад

    Спасибо! Как всегда все очень понятно!!шикарная подача, в целом!

  • @emiliakan6986
    @emiliakan6986 2 года назад

    Спасибо большое за такое полезное видео)

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад

      Спасибо большое за отзыв

  • @rudinandrey
    @rudinandrey 2 года назад

    отличный курс, спасибо большое!

  • @Всесвои-э9э
    @Всесвои-э9э Год назад

    Отличное видео!

  • @yakut54
    @yakut54 2 года назад

    Круто, Жека! Пиши ещё!

  • @АлександрСосо-щ1б
    @АлександрСосо-щ1б 2 года назад

    Спасибо! Было полезно!

  • @reginapopova3062
    @reginapopova3062 6 месяцев назад

    спасибо!)

  • @theoty-js
    @theoty-js Год назад +1

    Super

  • @АлександрДробот-у7у

    Топчик👍

  • @Podushka.
    @Podushka. 2 года назад

    Спасибо!!!

  • @kaizen_cs
    @kaizen_cs 2 года назад

    топчик вебчик

  • @seoonlyRU
    @seoonlyRU 2 года назад

    спасибо) держи лукас от сеовебмастера СЕООНЛИ

  • @practical-skills-school
    @practical-skills-school 2 года назад

    Великолепный туториал. Понятно даже без знания реакта, всё по шагам. Пока на середине, почему-то у меня контент (например, список контактов) сваливается вниз, к футеру. А заголовок на странице остается у хедера.

  • @mushnikov35
    @mushnikov35 2 года назад

    Жека красава ! ) делает вещи )

  • @marinasavluchynska737
    @marinasavluchynska737 2 года назад

    Супер: дякую

  • @МаксимИсаев-ъ5о
    @МаксимИсаев-ъ5о 2 года назад

    Класс!

  • @ivanmorozov6197
    @ivanmorozov6197 Год назад

    Спасибо за курс!
    Подскажите, при ssg страницы генерятся только при билде, либо и в прод режиме? Например когда появился новый пост, как произойдет добавление новой страницы?

  • @EvgenichTalagaev
    @EvgenichTalagaev 2 года назад +1

    Спасибо, очень крутое видео.
    Приятная подача материала.
    Будет ли что-то ещё по next?

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад +3

      Так это и был курс по Next

  • @hottabych0770
    @hottabych0770 Год назад

    Почему при использовании мок апи json-server вместо встроенного в next api, не получается сбилдить приложение, хотя функцию getStaticProps оборачиваю в try catch
    Подскажите плиз 🥺

    • @YauhenKavalchuk
      @YauhenKavalchuk  Год назад

      Не видя ошибки не думаю что смогу помочь

  • @bohdan.strilets
    @bohdan.strilets 2 года назад

    cool!!

  • @mrakov
    @mrakov 2 года назад +2

    Хотелось бы увидеть использование какого-нибудь решения для стейт менеджмента, поскольку есть подозрения что они отличаются от не SSR версии поскольку во время первого рендера нету браузерного API.
    Также интересный момент, что типы именуются с маленькой буква, интересно было бы узнать причину.
    И ещё один интересный момент с компонентом Social сначала идёт проверка есть ли он и возврат нала, а при мапинге повторная такая же проверка:)

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад +2

      Возможно в будущем сниму какое-то дополнение

  • @elconrel9665
    @elconrel9665 Год назад

    Видео супер, благодарю! Будет ли когда-то React-Native на канале ?

  • @СашаПолянский-х4ы
    @СашаПолянский-х4ы 2 года назад

    Аж шишка привстала от некста)

  • @jamjam3337
    @jamjam3337 Год назад

    👍👏

  • @michaelmyers717
    @michaelmyers717 Год назад

    Роутинг как в Битриксе, через файлы😄

  • @lukts7839
    @lukts7839 5 месяцев назад

    Хороший курс, спасибо, а есть такой же по 14-й версии?

    • @YauhenKavalchuk
      @YauhenKavalchuk  5 месяцев назад +1

      К сожалению, пока нету

    • @lukts7839
      @lukts7839 5 месяцев назад

      @@YauhenKavalchuk Жаль конечно, но ещё раз спасибо за качественные и очень интереснын видео, всегда их смотрю с удовольствием.

  • @user-og13
    @user-og13 Год назад

    Привет! Правильно ли я понимаю, что данное приложение было написано без backend, и что backend не обязательно использовать для deploy на vps сервер ?

  • @Signtone
    @Signtone 2 года назад

    Ай хорошо!

  • @timgluk
    @timgluk 2 года назад +1

    Напиши пожалуйста какие у тебя стоят расширения для vs code? За материал спасибо, очень доступно.

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад

      ruclips.net/video/g8LmiLTXkqo/видео.html

  • @yagelProject
    @yagelProject Год назад

    Сделайте пожалуйста подробный курс про Next 13 + Sanity CMS

  • @yaroslavshergin2566
    @yaroslavshergin2566 2 года назад

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

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад

      Так может поддержите выход спонсорством?

  • @tema_skakun
    @tema_skakun 8 месяцев назад

    хороший курс, но в next.js вышли обновления. теперь не получается перейти в браузер и открыть страницу posts как 11:11 (

    • @tema_skakun
      @tema_skakun 8 месяцев назад

      разобрался,
      когда при создании приложения next задаёт вопросы, и вы хотите, что бы структура папок была как в уроке надо ответить следующее:
      ✔ Would you like to use TypeScript? … No
      ✔ Would you like to use ESLint? … Yes
      ✔ Would you like to use Tailwind CSS? … No
      ✔ Would you like to use `src/` directory? … No
      ✔ Would you like to use App Router? (recommended) … No
      ✔ Would you like to customize the default import alias (@/*)? … No
      (актуально на момент написания коммента)

    • @tema_skakun
      @tema_skakun 8 месяцев назад

      App Router это какая то новая фича, разбираться с ней буду позже

    • @YauhenKavalchuk
      @YauhenKavalchuk  7 месяцев назад

      👍

  • @hitsuga8828
    @hitsuga8828 Год назад +1

    можете простыми словами объяснить, когда использовать getStaticSideProps, когда getStaticPath и когда getStaticProps. Просто не понимаю почему для контактов и постов используются разные подходы, хоть суть та же, нет?

    • @tema_skakun
      @tema_skakun 8 месяцев назад

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

  • @Mikhail_mxm
    @Mikhail_mxm 2 года назад

    Привет, спасибо за уроки. Не разобрался как правильно типизировать компонент Heading. В остальных компонентах, которые его используют, если не прописывать пропс 'tag', то ts ругается, что нужно заполнить. Подскажите как такие вещи правильно типизировать. Надеюсь нормально сформулировал вопрос. Спасибо.

    • @Mikhail_mxm
      @Mikhail_mxm 2 года назад +1

      Прошу прощения, не заглянул в репозиторий, даже и не подумал, так как все сам писал

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад

      👍

  • @bogdanshelomanov5668
    @bogdanshelomanov5668 Год назад

    генерация статики, постов, если пост был обновлен, он попадет на сайт только после новой сборки получается?

  • @TheLevius
    @TheLevius 2 года назад

    Не понимаю, почему у тебя vscode корректно форматирует jsx в расширении js если в статус панели указано что это javascript

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад

      🤷‍♂️ никогда с этим проблем не было

  • @ЯрославШиденко
    @ЯрославШиденко 2 года назад

    Только начал смотреть, заметил что ты не пишешь return в первом компонете, сделал так же но у меня он не отображается, что-то нужно где-то прописать?

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад

      Сверьте с кодом из репозитория

  • @denismetak5390
    @denismetak5390 7 месяцев назад

    у меня создаётся приложение не с папкой PAGES
    а с папкой SRC, внутри которой лежит APP

    • @YauhenKavalchuk
      @YauhenKavalchuk  7 месяцев назад

      Вышла новая версия next, это одно из изменений

  • @wqqtm3584
    @wqqtm3584 2 года назад

    router же является объектом, как работает метод push, не понял если честно, объясните пожалуйста

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад +1

      Специальный Объект у которого внутри есть метод push

    • @wqqtm3584
      @wqqtm3584 2 года назад

      @webDev Спасибо большое!👍

  • @zerox9646
    @zerox9646 Год назад

    было бы круто увидеть видео по хукам

    • @YauhenKavalchuk
      @YauhenKavalchuk  Год назад

      О каких хуках речь? Если о React хуках, то на канале есть React видеокаст, там подробно рассказываю обо всех хуках

  • @Raubritterr222
    @Raubritterr222 2 года назад

    а что за тема в VS Code стоит?
    Спасибо за такой качественный контент!

  • @КириллМохначевский-о3ю

    Отличное видео, но я не очень понял когда какой метод использовать SSR или SSG

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад +1

      Это зависит от задач, которые вы решаете. Если много статичной информации, по типу новостей, то SSG. Если больше динамики, то SSR

  • @sergeyfirsov9100
    @sergeyfirsov9100 2 года назад

    dobriy den a kak ispolzovat static props esli data hronatca v redux ?

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад +1

      Там есть нюансы, лучше про это прочитать отдельно

  • @sanjsoomin7170
    @sanjsoomin7170 2 года назад

    Посмотрел много материала , почитал документацию next и ни где не налол как работать со state . У меня мульти язычный сайт. Есть store и редьюссер для смены языков в state . Как это организовать в next. На Хабре пишут что redax c next плохо дружат.

    • @Garret-p6b
      @Garret-p6b 2 года назад +1

      как вариант создать реактовский контекст и в нем хранить стейт и коллбек для смены стейта. Обернуть прилку в контекст.провайдер и получать откуда угодно доступ к стейту контекста и коллбеку.

    • @sanjsoomin7170
      @sanjsoomin7170 2 года назад

      @@Garret-p6b Спасибо попробую

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад

      👍

  • @yakut54
    @yakut54 2 года назад

    Двоякое ощущение после просмотра ( и пощупанья 🙂) остался. Общая канвая ясна, но появилось больше вопросов, нежели ответов на них.
    Часть кода в одном и том же компоненте или странице, как удобнее, выполняется в браузере, часть в консоли VSC. ( Я мин 10 тупил, пытался в браузере в консоли response data увидеть. Хрен бы когда догадался.... ) Это и не backend, да уже вроде и не frontend... какой то недофуллстек 🙃
    53:19 вот тут не совсем понятно... Нам же данные с сервера каждый раз разные прилетают. При данном запросе прилетело 100 постов и отсюда сгенерилось 100 html страничек. А если после build`a в запросе прилетит 120 постов, как они на этот раз сгенерируются? Как готовое приложение об этом узнает? Да и страницы довольно часто в себе могут содержать некую интеракивность с пользователем... Инпуты и прочие чекбоксы. Как в этом всём разобраться?!!!
    Короче как всегда копать и копать. Поле непаханое.

  • @ФфсхфзххФфсхфзхх
    @ФфсхфзххФфсхфзхх 2 года назад

    привет, насколько твой курс по React.js актуален? стоит начинать изучение с него?

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад

      Это основы, поэтому актуален. А дополнительно можно посмотреть «React видеокаст», там о последних обновлениях

    • @ФфсхфзххФфсхфзхх
      @ФфсхфзххФфсхфзхх 2 года назад

      @@YauhenKavalchuk спасибо

  • @Developer-qo6lr
    @Developer-qo6lr 2 года назад

    Не понял откуда взялась функция getServerSideProps. Попробовал сделать то же самое, но next не понимает, что это такое

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад +1

      Она поддерживается по умолчанию в next приложениях, дополнительный импорт не нужен

  • @darieandre5598
    @darieandre5598 2 года назад

    Евгений, как в России оплатить спонсорство для получения доступа к видео? Спасибо)

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад

      Видимо никак… Все существующие варианты вам не доступны

  • @hachipoli822
    @hachipoli822 2 года назад

    Женя можешь web3js разобрать?

  • @dmaberlin
    @dmaberlin 2 года назад

    посоветуй пожалуйста книг по JS , если считаешь нужным учиться не только по урокам но и по книгам)

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад +2

      Learn.JavaScript - этого ресурса вполне достаточно

    • @dmaberlin
      @dmaberlin 2 года назад

      @@YauhenKavalchuk спасибо!

  • @lightinthedark5708
    @lightinthedark5708 2 года назад

    Remix пробовал уже?

  • @CTILET
    @CTILET 2 года назад

    Погоди у тебя же был уже ролик про NEXT

    • @YauhenKavalchuk
      @YauhenKavalchuk  2 года назад +1

      У меня 2 формата - кому-то нравятся отдельные уроки, кому-то одно видео

    • @CTILET
      @CTILET 2 года назад

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

  • @ФорменШульц
    @ФорменШульц Год назад

    404 не получаеться написать

    • @YauhenKavalchuk
      @YauhenKavalchuk  Год назад

      🤷‍♂️ сверьте свой код с тем, что в репозитории

  • @penguinl6128
    @penguinl6128 2 года назад

    Очередняра (курс) ..снова незаметим (

  • @НискемкромеСовести
    @НискемкромеСовести 11 месяцев назад

    не чего не работает

  • @mike-aaa
    @mike-aaa Год назад

    Жаль вторая половина в попыхах и все в кучу
    Эти основополагающие концепции надо подробнее разжевывать, а не кусками заране заготовленого кода и фразами типа "берем код, вставляем код"

    • @YauhenKavalchuk
      @YauhenKavalchuk  Год назад

      А можете уточнить, что конкретно в «попыхах», вроде старался всё подробно объяснить

  • @dmitrykarpovich186
    @dmitrykarpovich186 Год назад

    Круто, спасибо , очень доступно и насыщенно

  • @vladyslavkravchenko5955
    @vladyslavkravchenko5955 Год назад

    Спасибо!!!!