Спасибо за работу, Михаил! Если еще покажете про работу с призмой, то будет супер

Комментарий для поддержки канала. Очень помогают ваши видео глубже разобраться в теме. Особенно нравится ваше объяснение со стороны человека, который глобально может оценить задачу. Спасибо

Спасибо вам! Наконец-то я разберусь с этой аутентификацией🎉

А за видео отдельное спасибо! Всё разложено по полочкам. Всё как всегда прекрасно, Михаил!

Это однозначно самый лучший контент по JavaScript, который я видел в интернете за год обучения. Автор умеет удивлять, умеет подбирать контент и никогда не даёт лишней информации и воды, за что огромный респект. Такой труд очень дорогого стоит. Если будет какой-то курс, то я точно буду первым в списке покупателей.

Михаил, спасибо за простой и понятный разбор библиотеки NextAUTH !!!

Спасибо за великолепную подачу и полезное видео! По поводу автоимпорта, тоже порой не подхватывает, но после полного написания, помогает сочетание клавиш "ctrl + ." на элементе, который необходимо импортировать

Огромное спасибо за подробные объяснения👍 жду новые уроки😊

Отличный урок Михаил. Спасибо вам за ваш труд.

Очень подробное и познавательное видео! Спасибо Вам за него!

Великолепно, спасибо большое =) Очень было бы здорово если бы запили видео как работать с image в next js )))

спасибо за урок! было бы круто расширить этот пример с помощью библиотеки Prisma и реальным примером работы с БД (сохранить данные после авторизации, etc). 😊

Спасибо огромнющее, дай Вам Бог всего самого наилучшего!!!

Очередной лайк и Share за бесценную работу

Хочу предложить идею видео по добавлению к проекту NextJs с AuthJs интернационализации с поддержкой AppRouter (например Next-Intl). Очень как-то не просто подружить два пакета, работающих как middleware, с NextJs. Даже не смотря на наличие документации, при отсутствии полного рабочего примера приложения задача оказывается совсем не тривиальной. В инете эту тему ещё вообще никто полностью не раскрывал, только вопросы без ответов на Stackoverflow. У вас получилось отличное видео с разбором авторизации! И было бы здорово дополнить его другим роликом, где будет рассказано, как настраивать middleware пакеты при совместном использовании в NextJs. Спасибо за познавательные видео!

Спасиб за видео! Доступно, понятно, полезно)

отличный подробный ролик! Спасибо!)

Как всегда браво Михаил! И лайк

Отличное видео, очень понятно про auth, хотелось бы посмотреть с куки, но это ладно)

Отличное видео 👍. Спасибо

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

классно мы с этим разобрались, спасибо!)

Отличные и познавательные видео, спасибо! Будут ли подобные видео, но для мультиязычности на сайте? Не совсем понятно, как это делать с App Router.

Спасибо, ценное видео

Михаил запиши, пожалуйста, видеоурок от самого начала создания полноценного приложения на Next JS + Type Script и к нему добавить Базу данных на Mongo. Твои уроки как голоток свежего воздуха на русскоязычном ютубе!

Отличный туториал

Жаль мне не попалось пару месяцев назад это видео. Спасибо.

Спасибо, ждал)

Очень помогло твое видео. Жду следующих. Не мог бы ты разобрать тему способов передачи данных между клиент компонентами и сервер компонентами. Или сетап стейт менеджмента напр. Redux чтобы можно было иметь доступ к стейту как на клиенте так и на сервере

Спасибо вам большое за ваш труд! Вы планируете рассказать как работает реакт квери в app роуте?

Михаил. Великолепные навыки ментора. Если будет у тебя интерес к теме next + ORM sequelize, сделай плиз. Хотелось бы глянуть как ты с сиквелом работаешь.

@ilyamartynov2743

11 ай бұрын

Лучше typeorm, если призма сложновато. Sequelize не рекомендую, из-за кривой типизации

Великолепно, спасибо большое =) Вопрос, будет ли оно так же хорошо работать с каптчей...

Amazing video!

Спасибо большое

Вопросов больше чем ответов) Как теперь работать redux, rtk query, mobx, react query Как правильно использовать axios, вместо fetch Как делать асинхронные запросы в серверных компонентах Как получать pathname в серверных компонентах Еще целую вечность ждать когда обновятся все документации 😢

Михаил подскажите, через эту библиотеку можно работать с перехватчиком токенов, что бы полностью оказаться от аксиоса?

Очень круто

Спасибо!

Спасибо за доступное объяснение. Ток вот не очень понятно что с такой авторизацие делать (если использовать гугл и другие провайдеры, кроме как лагин и пароль). Я в том смысле по сути инфы о пользоателе вообще не какой. Какой толк от такой авторизации - просто вывести "привеит ИМЯ_ПОЛЬЗОВАТЕЛЯ" ? Хотелось бы больше практичности увидеть от next-auth ( втом сымсле как с этим работать дальше)

Спасибо.

Спасибо за работу, хотелось бы ещё увидеть как редакс получает данные от серверных компонентов

@mishanep

11 ай бұрын

Напрямую никак, в серверных компонентах нет редакса. В принципе можно попробовать спустить данные пропсами в клиентский компонент и там уже использовать с редаксом. Не пробовал =)

@nickolz1091

11 ай бұрын

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

вы супер!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Как сделать все страницы protected и при этом через /signin вошел бы? ну для админки

Какой next сейчас для продакшена?

Файл с мидлварами получается только один. В принципе, на фронте их вроде не так много случается, но все-таки. Либо функциями выносить, либо все в кучу. И матчер общий: т.е. либо смириться, либо вручную внутри мидлвары разруливать по адресу.

Спасибо за видео. Но есть один момент. Подскажите, как избавится от бага в нашем случае в хедере. Суть в том, что будучи авторизоваными при обнавлении страницы у нас на некоторе время пропадает защищенный пункт меню, а потом появляется, так как проверяется авторизация и на это надо время. Об этом ни кто никогда не говорит особо и я даже заметил, что частенько в видео не обновляют страницу. По идее это можно решить на уровне сервера. Но в нашей ситуации клиентский компонент. Буду очень благодарен (да и не только я), если объясните этот момент. Заранее СПАСИБО!

как правильно сделать запрос на сервер и получить данные, сохранить их в Redux toolkit с Next JS 13.4

Я все повторил как в видео, однако есть нюанс что когда после логинизации отрисовывается страница то на 1сек видно кнопку "Логин". Можно ли как то от этого избавиться?

Не знаю где еще спросить, но что за проблема с флагом --turbo? " Wasm binding does not support --turbo yet", это только у меня такая или у кого-то еще? И в чем вообще проблема? как решить ее?

Спасибо, вопрос теперь как это все выложить на nginx или вообще себе на сервер)

Добрый день, Михаил! Подскажите, сколько примерно роликов будет по Next.js?

@mishanep

Жыл бұрын

У меня нет четкого контент плана. Я пока не знаю когда будет следующее видео по этой теме. На работе 12-я версия и получается небольшая шизофрения при разборе 13й :)

💙💙💙

А как можно сделать редирект если я сделаю аутентификацию через firebase?

Сними на тему "on-demand revalidation"

Спасибо за видео. Что делать если у меня уже есть мидлвара которая обрабатывает интернационализацию как их правильно объединить?

Михаил спасибо большое за ваши уроки вы очень помогли мне при изучении JS -TS, лучшие уроки из всех что видел - англоязычные уроки трудно смотреть-так как это превращается в изучение английского языка а не ЯП, сейчас изучаю nest, как по вашему мнению - нест перспективный в бекенд разработке сейчас?

@mishanep

11 ай бұрын

Мне сложно компетентно ответить про перспективы nest на рынке бэкенда. Фреймворк популярный, но я с ним пока не работал.

@user-yf2er5vr8q

11 ай бұрын

@@mishanep а с какими работали - просто интересно узнать если не секрет

Если не работают автоимпорты в VS Code (и по многим другим проблемам) можно попробовать Ctrl-Shift-P и выбрать "TypeScript: Перезапустить сервер TS (Restart TS Server)"

@19fetisoff

9 ай бұрын

a можно попробовать использовать webstorm в разработке и забыть что такое писать импорты руками

@victormog

9 ай бұрын

@@19fetisoff VS Code нормально добавляет импорты, а WebStorm - платный...

@hiki7661

8 ай бұрын

@@19fetisoff а смысл?

На 9:50 мы создаем Клиентский компонент - Provider, и оборачиваем в него все остальное, получается, что все компоненты внутри Provider будут клиентскими?

@en_kratia

6 ай бұрын

Да

это все конечно здорово, но вот в сагах непонятно как юзать например :)

А вообще норм практика сервер с node.js перенести на next, я читал что next тоже работает с Sequelize , и в принципе можно сделать полноценное апи на next, кто-то практиковал? как оно геморройно?

@mishanep

10 ай бұрын

Норм. Встанут вопросы миддлвейров, тут они они иначе устроены. Но возможно да.

Не подскажет ли кто нибудь как подцепить "Одноклассников" в nextauth?

Добрый день Михаил. Спасибо за ваши труди, весь контент очень крутой, понятный, интересный. У меня вопрос относительно авторизации и взаимодействии с БД. Опишу вкратце мою задачу. У меня есть приложение. Есть кнопка «Продолжить с Google» При нажатии мы авторизуем юзера и получаем его данные от гугл провайдера. Далее, я проверяю по email, есть ли этот пользователь в БД. Я использую MongoDB. Если нет, сохраняю его в БД в таблицу User (email, provider type). Естественно уникальный ID генерируется автоматически. Далее юзер может создавать записи в таблице “posts”. Где есть id записи, user_id - из таблицы Users, content - сама запись. Сейчас, чтобы получить все записи пользователя, я передаю в get запросе на сервер user_id. Как мне этого избежать? Как я могу получать user_id на стороне сервера, если юзер авторизован, чтобы манипулировать с БД? Я понимаю, что это можно реализовать с помощью JWT токенов, в который обычно зашифровывается все нужная информация при успешной авторизации и потом на стороне сервера дешифруется и вытягиваются данные. Гугл провайдер может выдать JWT, но в нем, как я понимаю, зашифрован гугловский id, а не тот, что у меня создается в БД. Конечная цель это 1. Пользователь авторизовался при помощи гугл 2. Получить на клиенте все записи пользователя, не передавая в get запросе user_id, из таблицы User. 3. При получении get запроса, на сервере, иметь доступ к авторизованному user_id, чтобы вытащить все записи нужного пользователя и вернуть. В общем тема не самая легкая для понимания. Не могли бы вы раскрыть ее в отдельном видео или просто ответить лично. Заранее спасибо

@ilyamartynov2743

11 ай бұрын

Вы сами ответили на свой вопрос) напримере гугла. При регистрации вы создаёте пользователя в БД, генерирует jwt, отдаёте клиенту, со всеми запросами передаёт его в header, сервер из jwt достаёт id пользователя. Аналогично при логине. Ещё раз, при аунтификацию гуглом, вы создаёте или получаете пользователя в БД и передаёт jwt токен с каждым запросом.

Когда продолжение?

Было бы круто посмотреть как оперировать jwt токенами. Когда у тебя бэкенд, к примеру на nest, и нужно контролировать актуальность сгенерённого там токена. Чтобы избежать рассинхрона, когда nextauth думает что пользователь авторизован, а на бэке токен уже протух.

@alexsanders7240

Ай бұрын

Вышло разобраться с JWT токенами?

@user-pi1vr6rf1k

Ай бұрын

@@alexsanders7240 Полностью делегировал генерацию и проверку токенов на "большой бэкенд" на nest-е. На фронте access токен хранил обычных куках, а refresh - в httponly.

1. Есть ли какие-то сильный изменения сейчас, или в next 14?; 2. Как можно создать регистрацию пользователя, и как создать проверку аккаунта через otp код, или url на email?

Есть ли смысл связывать такую аутенфикацию со своим бэком (отдельным сервером)? Например, после ответа от гугла в callbacks делаем запрос на свой сервер, и там получаем свои токены и все данные пользователя.Но всё равно не оч понятно как дальше работать со стором

@ilyamartynov2743

11 ай бұрын

Юзайте effector и не будет проблем)

@---Maksim---

10 ай бұрын

Конечно есть смысл. Ты авторизуешь пользователя и при успехе идешь запросом с сервера next-a на сервер с БД, затем отдаешь эти данные в профиль пользователя на клиент.

подскажите пожалуйста google cloud - платный ? вижу про кредит в 300$

@mishanep

8 ай бұрын

Обычно облачные сервисы предоставляют какой-то стартовый бюджет - на попробовать. А дальше баланс уже придется пополнять. Плюс сам стартовый бюджет могут начислять после привязки карты.

А если нужна авторизация только через логин/пароль есть ли смысл использовать next auth? Или проще обернуть в рут лайауте приложение в protected-routes в котором делать запрос за юзером по токену к апи и если токен не валидный, кидать на страницу авторизации?

@mishanep

Жыл бұрын

Вы можете описать логику protected route в middleware, чтобы не перегружать рут лейаут. А там уж как вам удобнее. Если вы видите, что библиотека только усложняет процесс, то не используйте.

@user-js7lf6vb9n

Жыл бұрын

Нельзя

@user-js7lf6vb9n

Жыл бұрын

И как, в таком случае, сохранить юзера в стор ваще непонятно 😢

Куда копать по поводу валидации ошибок в форме (в данном случае - формы логина), чтобы выдавать конкретные сообщения пользователю?

@mishanep

Жыл бұрын

Для фронтовой валидации вы можете использовать либо html атрибут pattern, который работает с regex, либо валидировать в момент отправки формы средствами js, либо использовать сторонние библиотеки, вроде react-hook-form. При проверке credentials сервисы обычно не уточняют какие именно данные были введены некорректно, в частности, чтобы нельзя было проверить со стороны если учетная запись на конкретную почту.

@victormog

Жыл бұрын

@@mishanep Вот и я не увидел в логе, что именно пароль не верный... 😞

А стоит уже сейчас делать реальный проект на апп дире , или он еще сырой ?

@mishanep

Жыл бұрын

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

Что означает собака в этом пути import { authConfig } from "@/configs/auth";

@mishanep

Жыл бұрын

Это просто один из способов задачи алиасов путей. В данном случае - дефолтный вариант, идущий с некст из коробки. По сути, @ указывает на корневую директорию проекта в данном случае.

Не совсем понятна концепция хэндлеров и апи - получается, что эта история нужна нам, когда мы отказываемся от бэка и все бэковские задачи перетаскиваем на фронт?

Мне понравилось называть папку (auth), тогда не попадает лишний разделитель в урл.

Годно, спасибо

почему на гитхабе код другой?

@mishanep

8 ай бұрын

Вероятно на гитхабе есть разные ветки, и под это видео в частности.

что-то мне совершенно не понравилась библиотека. не обновляет токен из коробки с провайдером keycloak

Здравствуйте, у меня такой вопрос) я стврорив сайт используя next js и вот он у меня такой красивый загружается только локально, конечно я хочу его так сказать загрузить его в сам интернет. Чтобы он мог отображаться в поиске. Каким образом мне нужно это сделать? Много видео где все льют все на версел и тд, но это чуточку не то) помогите решить эту проблемку)

@mishanep

Жыл бұрын

Я использую Vercel. Он оптимально подходит для сайтов на Next. Плюс имеет бесплатный вариант (разумеется, со своими ограничениями).

@OlehBilostotskyi

Жыл бұрын

@@mishanep окей, тогда такой вопрос, у меня сейчас такая ситуация, я сделал знакомому сайт и его типа можно просто выгрузить на вересель и все? Типа поисковые систимы будут видеть этот сайт и, ну чисто гипотетически он сможет со временем выйти в топ? Возможно где-то можно об этом более подробно почитать, потому что я что-то думал, что это как-то проще работает))

@oleksiishe7417

10 ай бұрын

@@OlehBilostotskyi цікаво, і як в тебе получилось? Сайт бачить гугл?

@shortsvideo4570

4 ай бұрын

залий на хост любой@@OlehBilostotskyi

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

Я не эксперт но мне это кажется очень замороченной авторизацией😅

16:05

всем привет. У кого еще была такая же проблема? Argument type {credentials: {password: {label: string, type: string, required: boolean}, email: {label: string, type: string, required: boolean}}, type: "credentials", authorize(credentials: any): Promise} is not assignable to parameter type UserCredentialsConfig

12 30

don't work with pages and many errors like resolver

@mishanep

Жыл бұрын

Для pages немного по-другому идёт базовая настройка. Смотрите документацию.

@boyywnkobe

Жыл бұрын

@@mishanep смотрел но что то не виходит. У меня уже есть мои компоненти sign-in, sign-up, reset-password

@boyywnkobe

Жыл бұрын

Слелал

Всем привет ! Кто делал авторизацию через openid в Next js ???? ХХЕЕЛЛПП

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

@mishanep

6 ай бұрын

Мы смотрели как проверить наличие сессии. Вы можете добавить проверку наличия сессии на странице авторизации, и при ее наличии делать редирект.

@loreart9320

6 ай бұрын

@@mishanep Спасибо, я так и сделал вчера, просто думал есть возможность запретить некоторые страницы для авторизованных пользователей, как мы это делали с неавторизоваными, и чтобы переадресацией в такие моменты была на главную страницу а не на форму авторизации. Ваши уроки действительно помогают изучать паттерны решения задач, так ещё и отвечаете на вопросы оперативно, спасибо ещё раз.

Очень помогло твое видео. Жду следующих. Не мог бы ты разобрать тему способов передачи данных между клиент компонентами и сервер компонентами. Или сетап стейт менеджмента напр. Redux чтобы можно было иметь доступ к стейту как на клиенте так и на сервере