Больше контента! Спасибо за свежатину)

ура наконец то дождался next)) пожалуйста, сделайте более продвинутый урок по авторизации в next. например как сделать вход по почте + паролю, как сделать регистрацию, очень интересна работа с токенами (если у меня сервер возвращает два токена jwt). как сделать вход по google кнопке и при этом сохранить токены итд

@hacktau

7 ай бұрын

next auth в помощь

@Den-yg4wz

7 ай бұрын

@@hacktau а как там все кастомизировать? чтобы не на аглицком аутентификация была. Много вопросов. Будем благодарны за обстоятельный обзор этого инструмента и как его реально использовать на проде.

@hacktau

7 ай бұрын

@@Den-yg4wz через next-intl можно

@angryprops

7 ай бұрын

Да, тоже очень интересна эта тема, видео было бы очень полезно

@sour5786

7 ай бұрын

тоже интересна продвинутая работа с next-auth. жду

спасибо, доходчиво и понятно.

Спасибо добрая душа

Люди, использующие next в больших проектах, говорят 13 версия принесла немало багов, и вообще она сыровата ещё, а тут выкатили 14 версию😅

@prostojustme

7 ай бұрын

Да , есть такие баги. Но многих из них исправили в версии 13.5 )

Было бы здорово, если Михаил разобрал тему FSD, если был опыт работы с этой методологией. Тезисный обзор сущностей дополненный мыслями на основании из своего опыта (опять таки, если он есть)

красавчик

Михаил, добрый день! а можете выпустить видео с работой User-agent для определения устройств) так как на next js в проектах SSR и CSR часто используется вместе это вызываем проблемы, потратил день чтобы решить проблему с этим, ну и работу с svg тоже интересно показать) и конечно же спасибо за годный контент!)

Добрый день, Михаил. Во всех видео о server action разбор идет в ключе работы с формой. Где еще может и должен применяться server action? Server action функция всегда содержит директиву 'use sever', хотя во всех разборах данная функция и так находится в серверном компоненте - это такой синтаксис и может ли Server action располагаться внутри "use client" компонента/страницы?

Это называется возвращение в 2000-е когда был пхп)

🔥🔥🔥Михаил спасибо за ратные труды! 🙏🙏🙏 Подскажите по секрету, как вы сделали такую красивую цветную консольку? Будем благодарны! ) ♥

@mishanep

7 ай бұрын

Я использую iTerm терминал. Там много любопытных фишек.

❤🎉

Михаил, здравствуйте! В процессе изучения next.js столкнулся с проблемой. global-error.jsx (error компонент ) НЕ перехватывает ошибки в корневом layout'e. В документации написано, что для перехвата ошибки в корневом layout'e необходимо использовать global-error.jsx, НО он этого не делает. Пытался найти решение и постоянно натыкаюсь на наличие проблемы, но без ее решения. (P.S. заметки: в корневом layout'e делаю обычный throw new error("...") для проверки работы global-error, а в global-error.jsx - стандартный return ( ...), global-error лежит на верхнем уровне app - где и должен; версия next.js - 14.0.2 )

Михаил доброго вам времени суток, наверное пишу свой первый комментарий, но не могу сказать что вы прекрасно преподносите материал, но смотря это видео и читаю документацию оф по Server Actions возник вопрос, надеюсь вы на него ответите. Я думал что вся суть Server Actions это в том что она позволяет нам управлять формой на серверной компоненте и плюс к этому если в браузере не загрузиться js может из за медленного интернета, форма будет все равно работать что говорит про оптимизацию некую. Но читаю статью в документации они используют такое новые хуки по управлению формы как useFormState, useFormStatus, useOptimistic. Как вы по итогу думаете в чем суть теперь Server Actions если у нас клиентские компоненты судя по документации.

@mishanep

7 ай бұрын

Суть server actions в мутации данных. А конкретно - как альтернатива REST API точкам. Касаемо новых хуков - это уже новшества react и react-dom, идущие как экспериментальные и пока не доступные в стабильных релизах. Плюс, на официальной документации реакта по хуку useFormStatus нет ни слова о NextJS. Примеры в официальной доке выглядят любопытно, но пока не было релиза этих хуков, говорить о них рано.

Очень доходчиво и понятно. Спасибо за видео. А в чем преимущество использовании форм в серверных компонентах в отличии от клиентских? Просто чтобы нагрузку с клиента перенести на сервер?

@mishanep

5 ай бұрын

Меньше JS на клиенте - быстрее загрузка страницы. Но тут зависит от требований. Когда нужна сложная валидация на клиенте, то без JS всё равно не обойтись. Но есть и немало сценариев, когда достаточно серверной части. Исторически это были form action, так что это возвращение к истокам.

@Alexander_1ov

5 ай бұрын

@@mishanep спасибо за ответ)

Добрый день, может кто-нибудь обьяснит почему если я создаю action внутри page.tsx мне надо явно прописывать что это use server, разве страницы это не априори серверные компоненты, если вопрос глупый заранее извеняюсь, первую неделю разбераюсь с Next js

Здравствуйте Михаил :) Спасибо за труды! Пытаюсь переварить Server Actions. И не могу понять, какую выгоду мы получили в рамках вашего видео от Server Actions. По факту мы переложили запрос с клиента на сервер, а какой профит от этого? Ведь точно так же могли и с клиента сделать запрос. Буду благодарен ответу :)

@mishanep

7 ай бұрын

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

@alexanderbaltsevich9270

7 ай бұрын

@@mishanep А есть в этом какая то ценность? Как работает бэкэнд в реальности. Там еще целая череда мидлваров и разных проверок прежде чем, хоть что то добавить в базу данных. Та же регистрация, которая проверяет целостность данных, потом проверяет наличие пользователя в базе. Создает токены и т.д.. Не будем же мы все это писать в серверных экшенах. И тоже самое нам нужно и для логина и для большинства других экшенов.

@mishanep

6 ай бұрын

Здесь вопрос выбора архитектуры. Next может быть как полноценным бэкендом, и тогда да - так или иначе какие-то проверки внутри экшнов понадобятся. Либо это прослойка до бэкенда. На моей работе используется именно как прослойка, а бэк на Java.

Привет, Михаил. Вопрос не по теме видео, но все же. Хотелось бы узнать насколько важно понимание работы createEntityAdapter в RTK, нужно ли разбирать эту тему в документации подробно или хватит поверхностного ознакомления? А так же как часто вы встречали createEntityAdapter на своей практике?

@mishanep

7 ай бұрын

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

@pulsarbitw5335

7 ай бұрын

спасибо @@mishanep

оу май год 😱😱😱😱 опять?

Server Actions are not limited to and can be invoked from event handlers, useEffect, third-party libraries, and other form elements like .

как раз столкнулся с проблемой обновления серверного компонента с помощью форм экшен...посмотрим смогу ли разобраться с помощью этого видео

Если action серверный,то как почистить форму на клиенте после submit-а?

@un_defined

7 ай бұрын

он умеет вернуть результат работы, после получения - сбросить

С bind конечно на костыль скорее похоже)

Очень хорошее видео. Ноя у меня пару багов, открыл ваш гит и тоже вроде пару багов если открыть сайт. когда создашь посты к примеру пост 5 пост 6 пост 7 , потом удаляешь их, а потом опять создаешь с другим контентом то все равно кидает тебя на уже созданные пост 5 пост 6 и пост 7 , несмотря на то что тайтл и контент другой. И потом вовсе их удалить нельзя. Или это я чего-то не понимаю

@mishanep

6 ай бұрын

Там могут быть нюансы с кэшированием. По-хорошему, БД должна создавать каждый раз уникальный id. В моем примере используется моковый бэкенд, поэтому он может местами криво работать.

@user-ki4eu5wi1b

6 ай бұрын

спасибо)@@mishanep

@__a8as

6 ай бұрын

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

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

@mishanep

7 ай бұрын

Там речь о том, что когда начинаешь миксовать концепрты фронта и бэка, есть риск нечаянно сенситивные данные отправить в разметку. Next уже даже придумал концепт как предотвратить это, назвав его taint, но он пока в Альфе. У них в блоге большая статья на тему безопасности.

Странно... Почему-то отправляет вовсе не в json не смотря на stringify...

Как отключить роутер кэш на клиенте в next 14?

@mishanep

7 ай бұрын

Полагаю, здесь не должно быть отличия с 13-й версией. Встроенный fetch имеет опциональный третий параметр, который управляет кэшированием. Где-то я об этом на канале рассказывал в цикле по нексту.

@jonyonee

7 ай бұрын

@@mishanep Я не про кэш запросов и данных. Я про роутинг некста его кэш.

Редирект работает только потому, что компонент формы является северным. Попробуйте сделать этот компонент клиентским и никакой редирект не сработает а будет выбрасывать ошибку. Я например хочу сделать валидацию формы на стороне клиента, потому она у меня клиентская и получается, что серверные экшны являются просто бесполезными если они только и могут, что выбрасывать ошибки

@mishanep

8 күн бұрын

Здесь можно по-разному подойти к решению этого вопроса. Первое, что приходит в голову вложить в форму (серверный компонент) клиентские компоненты с инпутами, и валидировать их по мере заполнения (или потери фокуса). Та же кнопка отправки формы может быть неактивна до тех пор пока поля не заполнены корректно.

@Sergey_Klimov

8 күн бұрын

@@mishanep и получается, что всякие библиотеки по типу react-hook-form теряют свой смысл. Я не могу представить себе как я буду связывать такие инпуты как "пароль" и "повторение пароля" друг с другом. Как кнопка будет знать о состояниях инпутов, если она является отдельным клиентским компонентом. Все настолько туманно. Какой то общий стор делать для них что-ли)

Во, уже можно выпиливать experimental: { serverActions: true, }, Еще в то время успел распробовать и уж очень зашло...

становится похоже на php, в котором мы серв и фронт пишем в одном файле. как-то грустно... а куда же денутся хуки? по сути реакт там и не нужен, нужен только jsx

Разработчики next.js изобрели php

@abbze8272

7 ай бұрын

Вообще лютую эко-систему наворотили. Скоро в angular превратят))

@ogg_gang

7 ай бұрын

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

Простите меня конечно, но нет ощущение что это дичь какая то , нагородили какой то хрени ребята в Next )

Ребят, подскажите, как сделать авторизацию через openID на мой одностроничник, я уже голову сломал...

@dimzinnatov7242

2 ай бұрын

Есть уже готовая реализация для openid connect на js и типизированный вариант