@@UlbiTV Привет, при созданий папки, я использовал базовую комплектацию, и у меня нету индекс.нтмл ( 7:16 ), мне стоит начинать все с начало, или есть другой путь?
С недавних пор, этот канал стал для меня главным источником прокачки тех. скиллов, максимальная выжимка полезной и практичной информации в коротких и понятно изложенных роликах, все супер, успехов бро!
Быть не может, я как раз сейчас делаю проект с firebase.... Вчера вечером как раз сидел и думал, вот бы видео вышло новое какое-нибудь, а тут два в одном, сейчас буду смотреть!!! Спасибо огромное!
Смотреть твои видео уже как хобби, firebase наврядли буду использовать, тк цена немаленькая, но посмотреть очень интересно, вот про хуки не знал, все через стандартные средства делал, спасибо.
Switch и Redirect больше не работают, такой подход устарел и у вас вылезет ошибка. Исправить это можно следующим образом, вот аналогичное решение, но с использованием нового подхода и синтаксиса: return user ? ( {privateRoutes.map(({path, Component}) => ( ))}
) Теперь Route нужно присваивать уникальный ключ, а вместо Redirect мы создаем еще один Route с универсальным путем (*) и с помощью Navigate переправляемся туда, куда нам нужно.
Топ контент, кстати, если вдруг захотите сделать так, чтобы при добавлении сообщения скролл автоматически прокручивался вниз - после массива сообщений ( после map ) добавьте пустую дивку, на нее накиньте реф ссылку ( с помощью реакт createRef ) и потом при нажатии на кнопку отправки вызывайте ссылку ( как вы ее назвали ), к примеру blabla.scrollToView({smooth:scroll-behavior}) - скрол бехейвиор можно не добавлять, это просто добавит анимацию прокрутки вниз ( шобы резко не было ). Это похоже на костыль, но я пока ничего другого не придумал.
Можно не пустой див, а просто ref={index === messages.length - 1 ? lastMessageRef : null } на сообщение, и просто в useEffect скролить к єлементу под ссылкой lastMessageRef
Бро, спасибо за очередной годный курс!!! Я с тобой можно сказать с первого видео на этом канале! Получается заходить редко, но всегда захожу! Ты круто, бро!!!)
Как я рад, что наткнулся на твой канал! Отличная подача материала, без воды, с необходимыми объяснениями. Продолжай в том же духе! Давай ещё приложение запилим, по типу сервиса доставки, или такси...
Из-за того, что обновились библиотеки я получил 999% знаний из этого видео) Пришлось читать документацию, причем по пути понял очень много другого... Спасибо =)
Если бы у вас, Тимур, стажировались преподаватели ВУЗов, высшее образование могли бы получать гораздо быстрее и с существенно большей пользой для применения на практике. Прекрасно проведенные полчаса, за которые познается Firebase и React в их сути. И, хотя вы до сих пор не закончили мой любимый курс по Redux, я бессомненно остаюсь в рядах ваших фоловеров. Спасибо за видео.
если у кого-то не получится сейчас импортировать firebase, попробуйте заменить все импорты на следующие import firebase from "firebase/compat/app"; import "firebase/compat/auth"; import "firebase/compat/firestore";
На этапе подключения firebase у вас могут не работать импорты, потому что недавно вышла новая firebase 9.0 и теперь дефолтный импорт firebase (а также библиотек auth и firestore) делается следующим образом: import firebase from 'firebase/compat/app'; import 'firebase/compat/auth'; import 'firebase/compat/firestore'; + у меня почему-то не работало приложение при написании const app = initializeApp(...) (initializeApp было импортировано из firebase/app), вылетала ошибка в консоль, я поменял на firebase.initializeApp(...) и это решило проблему!
Тоже с таким столкнулся и ещё понял, что compat это старое и для обратной совместимости оставлено. По новому так следует делать: import {initializeApp} from 'firebase/app' import {getStorage} from 'firebase/storage' import {getAuth} from 'firebase/auth' const app = initializeApp(firebaseConfig) export const auth = getAuth(app); export const firestore = getStorage(app)
Спасибо большое, в23 году все еще актуально, главное разобраться, что после обновления многих библиотек синтаксис изменён, но это не страшно, пару дней убить,разобраться и всё готово, Тимур тебе спасибо большое 🤍🤘👍
Это реально лучший канал для быстрого обучения React в русском сегменте ютуба. Огромная благодарность автору! С новой версией react router пришлось чуть чуть повозиться, чтобы переделать код из видео, но там совсем ничего сложного для владеющих гуглом. =)
Для поддержки канала)) Давай серию уроков про jest, тестировать можно одно из тех приложений что ты делал в предыдущих видео. Думаю многим будет актуально.
Реально крутой чат. Хоть библиотеки устарели, пришлось документацию читать) Авторизация через системы.... И так просто . Сортировка сообщений еще правда нужна.
Добрый день. Начиная с 27:00 в таблицу 'messages' добавляем поля для сообщения. С полями UID и text всё понятно - идентификатор как ключ для связи с таблицей данных пользователя, текст - это, собственно, само сообщение. А для чего сохранять другие поля? Они ведь, по сути, дублируют данные пользователя, при том на каждом сообщении, что сильно раздувает БД. Это просто для наглядности сделано или есть иной смысл? Ведь эти данные можно взять просто из таблицы пользователей. Спасибо
Отличное видео по теме создания такого чата, остальные на английском, так что большой плюс за пополнение русскоязычного контента 👍👍👍 вопрос - как добавить возможность хранить переписки с разными контактами и в случае если заходят 2 конкретных контакта чтобы подгружалась их история?
Мне очень понравился вариант роутинга в данном видео,поэтому я решил использовать его в одном из тестовых заданий, но у меня возникла проблема( Идея в том, что я бы хотел иметь публичые роуты, которые будут доступны не только не вошедшим пользователям. Но, как бы я ни старался, у меня не особо получается это реализовать, из-за редиректов, которые срабатывают или просто перемещая на другую страницу, или вызывая залупленные редиректы. В общем, мб, кто-то тоже пробовал делать подобное и смог придумать нормальную реализацию? А так, видео, конечно, крутое. Спасибо за это автору)
У меня, вроде бы, получилось придумать некоторое решение данной проблемы. Вот ссылочка на данный вопрос на stack overflow: ru.stackoverflow.com/questions/1287616/%d0%9a%d0%b0%d0%ba-%d1%81%d0%b4%d0%b5%d0%bb%d0%b0%d1%82%d1%8c-%d1%80%d0%be%d1%83%d1%82%d0%b8%d0%bd%d0%b3-%d0%bf%d1%80%d0%b8-%d0%bf%d0%be%d0%bc%d0%be%d1%89%d0%b8-%d0%bc%d0%b0%d1%81%d1%81%d0%b8%d0%b2%d0%b0-%d0%be%d0%b1%d1%8a%d0%b5%d0%ba%d1%82%d0%be%d0%b2react-router-dom/1287667#1287667
Спсибо за полезный контент! Подскажите, пожалуйста, повторил аналогично, но когда делаешь логаут, состояние user не обновляется и попасть на страницу логина можно только с рефреша страницы
Для тех кто смотрит видео в 2022 - Switch и exact в v6 устарели, поэтому пришлось запилить свое решение. Не идеально, но работает по тому же принципу. Код прилагаю ниже, может кому-то понадобится {user ? (privateRoutes.map(({ path, Element, toPath }) => )) : publicRoutes.map(({ path, Element, toPath }) => )} Пример роутов (toPath не объязательный): export const publicRoutes = [ {path: LOGIN_ROUTE, Element: Login}, {path: "*", Element: Navigate, toPath: LOGIN_ROUTE} ]
Спасибо за урок.Возник вопрос - допустим ,я создал сервер с БД и буду отправлять сообщения в БД и отрисовывать на фронте ,но там нужно будет постоянно обновлять состояние или обновлять запрос на получение сообщений, вижу что в firebase это встроенная фича,а как быть с обычными SQL бд и запросами с фронта?
Спасибо автору за замечательный контент! Проблема следующая у меня - как реализовать аутентификацию через VK в firebase? Очень много примеров в интернете , где аутентификацию проводят с помощью готовых provider (google, twitter, facebook, github) А вот как кастомно сделать для VK?
Как же круто, ни нудной вёрстки не по теме, только функционал, спасибо тебе!
Именно такой контент я и стараюсь делать, спасибо друг!)
@@UlbiTV Привет, при созданий папки, я использовал базовую комплектацию, и у меня нету индекс.нтмл ( 7:16 ), мне стоит начинать все с начало, или есть другой путь?
i guess it's kind of randomly asking but does anyone know of a good place to stream newly released movies online?
@@UlbiTV тебе спасибо
С недавних пор, этот канал стал для меня главным источником прокачки тех. скиллов, максимальная выжимка полезной и практичной информации в коротких и понятно изложенных роликах, все супер, успехов бро!
Блин, оч приятно друг) Спасибо за поддержку!
Присоединяюсь к каждому слову!!!
Быть не может, я как раз сейчас делаю проект с firebase.... Вчера вечером как раз сидел и думал, вот бы видео вышло новое какое-нибудь, а тут два в одном, сейчас буду смотреть!!! Спасибо огромное!
Ты думаешь также как я, или я каждый раз угадываю твои мысли?))
@@UlbiTV ахахаха, ну это прямо очень веселое совпадение было:))) тут не хватает вставки из кунг-фу панды: случайности не случайны:)))
Афигеть я только firebase подумал, а тут оно. Не канал а бомба )
Спасибо Андрей!) Стараюсь!
еще днем видел репозиторий с курсом, дождался теперь видоса)
Ого, кто то замечает мои репозитории на гите))
Несколько роликов посмотрел, очень насыщенные, респектос. Редко коменты пишу, тут прям не удержался
Спасибо, спасибо!)
Смотреть твои видео уже как хобби, firebase наврядли буду использовать, тк цена немаленькая, но посмотреть очень интересно, вот про хуки не знал, все через стандартные средства делал, спасибо.
Спасибо дружише!) стараюсь
Так firebase же бесплатный на сколько то приложений, нет?
@@kostasancez2358 сейчас вроде как уже нет
Switch и Redirect больше не работают, такой подход устарел и у вас вылезет ошибка. Исправить это можно следующим образом, вот аналогичное решение, но с использованием нового подхода и синтаксиса:
return user ? (
{privateRoutes.map(({path, Component}) => (
))}
) : (
{publicRoutes.map(({path, Component}) => (
))}
)
Теперь Route нужно присваивать уникальный ключ, а вместо Redirect мы создаем еще один Route с универсальным путем (*) и с помощью Navigate переправляемся туда, куда нам нужно.
Спасибо
Еще можно так npm i react-router-dom@5
спасибо, самому бы Редиректом пришлось бы подольше разбираться. А мне нужно быстро
Топ контент, кстати, если вдруг захотите сделать так, чтобы при добавлении сообщения скролл автоматически прокручивался вниз - после массива сообщений ( после map ) добавьте пустую дивку, на нее накиньте реф ссылку ( с помощью реакт createRef ) и потом при нажатии на кнопку отправки вызывайте ссылку ( как вы ее назвали ), к примеру blabla.scrollToView({smooth:scroll-behavior}) - скрол бехейвиор можно не добавлять, это просто добавит анимацию прокрутки вниз ( шобы резко не было ). Это похоже на костыль, но я пока ничего другого не придумал.
Можно не пустой див, а просто ref={index === messages.length - 1 ? lastMessageRef : null } на сообщение, и просто в useEffect скролить к єлементу под ссылкой lastMessageRef
Бро, спасибо за очередной годный курс!!! Я с тобой можно сказать с первого видео на этом канале! Получается заходить редко, но всегда захожу!
Ты круто, бро!!!)
Олды на месте!)) спасибо бро
Как я рад, что наткнулся на твой канал! Отличная подача материала, без воды, с необходимыми объяснениями. Продолжай в том же духе! Давай ещё приложение запилим, по типу сервиса доставки, или такси...
Когда такие комменты вижу, прям сразу хочется еще что нибудь полезного выложить) Спасибо друг!
Из-за того, что обновились библиотеки я получил 999% знаний из этого видео) Пришлось читать документацию, причем по пути понял очень много другого... Спасибо =)
жиза
бля ахахахах так же
6:50
У кого не рендерит Login, поменяйте в файле routes.js Component: Login на Component: .
Так же в AppRouter замените component на element. Вот так:
Капец интересная тема, обязательно чекну попозже 🔥🔥
спасибо, приятного просмотра!)
Красавчик, очередной супер-полезный видос. Когда появляется какая-то задача которую я не знаю, всегда иду на этот канал.
Дай бог здоровья.
Если бы у вас, Тимур, стажировались преподаватели ВУЗов, высшее образование могли бы получать гораздо быстрее и с существенно большей пользой для применения на практике.
Прекрасно проведенные полчаса, за которые познается Firebase и React в их сути.
И, хотя вы до сих пор не закончили мой любимый курс по Redux, я бессомненно остаюсь в рядах ваших фоловеров. Спасибо за видео.
Каждый раз чуть ли не со слезами на глазах читаю твои комментарии!) Спасибо огромное!) Курс по редакс закончу, обязательно!
если у кого-то не получится сейчас импортировать firebase, попробуйте заменить все импорты на следующие
import firebase from "firebase/compat/app";
import "firebase/compat/auth";
import "firebase/compat/firestore";
Шикарнейший канал с очень доступной инфой!
Спасибо огромное за твой труд!!!! Очень полезное видео. Кратко, четко, понятно, доходчиво.
Более понятного объяснения я еще за бесплатно нигде не видел, спасибо большое!
На канале много интересного, рекомендую! Спасибо вам!
Недавно обнаружил твой канал, еще ничего не смотрел, но когда увидел список видео - поставил автолюкс и подписался.
Спасибо!) тогда советую приступить к просмотру!)
@@UlbiTV Уже смотрю. Планируются ли видео по GraphQL ?
Да, возможно даже в ближайшее время)
Хоть работу бросай и проходи твои курсы ))) Отличное видео!!!
Я думаю это неплохая идея :D Спасибо Артем!)
твой канал находка для меня, кладезь знаний так сказать.спасибо
Спасибо друг, рад что полезно!
Спасибо! Посмотрел с удовольствием и контент полезный!
Спасибо!) Стараюсь!)
Чувак! БОБОБОБОБОБОБОБОМБА!!!! если бы все так четко выражались, жили бы на луне
На этапе подключения firebase у вас могут не работать импорты, потому что недавно вышла новая firebase 9.0 и теперь дефолтный импорт firebase (а также библиотек auth и firestore) делается следующим образом:
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';
+ у меня почему-то не работало приложение при написании const app = initializeApp(...) (initializeApp было импортировано из firebase/app), вылетала ошибка в консоль, я поменял на firebase.initializeApp(...) и это решило проблему!
Спасибо, чувак
Ты просто топ, респект
Тоже с таким столкнулся и ещё понял, что compat это старое и для обратной совместимости оставлено. По новому так следует делать:
import {initializeApp} from 'firebase/app'
import {getStorage} from 'firebase/storage'
import {getAuth} from 'firebase/auth'
const app = initializeApp(firebaseConfig)
export const auth = getAuth(app);
export const firestore = getStorage(app)
на видео 1.88к подписчиков, на данный момент ровно 150к, желаю успехов, чтоб через год было 1.5лям подписчиков!!!!
Спасибо!
спасибо, было полезно и интересно. успехов в выпуске дальнейших видео.
Спасибо друг! И тебе успехов!
Спасибо большое, в23 году все еще актуально, главное разобраться, что после обновления многих библиотек синтаксис изменён, но это не страшно, пару дней убить,разобраться и всё готово, Тимур тебе спасибо большое 🤍🤘👍
классный урок, без воды, все понятно, однозначно лайк
Так ждала новое видео, наконец дождалась!
Спешл фор ю, Даяна
Супер ! React & Firebase,real-time ЧАТ
Очень круто! Без воды и по делу! Продолжай в том же духе!
Спасибо, Кирилл!
Все по делу, очень приятно смотреть!
Спасибо!
Спасибо! Пришлось многое исправлять, так как библиотеки и прочее обновилось, но суть та же осталась) так что спасибо большое!
Как всегда, понятно, четко, быстро!
Большое тебе спасибо! Очень качественная подача материала. Это лучшее видео с примером по firebase на русском языке
Я не успеваю их смотреть.)) Спасибо, все как обычно, круто!)
Спасибо большое!))
Спасибо за урок, как всегда очень круто!
Это реально лучший канал для быстрого обучения React в русском сегменте ютуба. Огромная благодарность автору!
С новой версией react router пришлось чуть чуть повозиться, чтобы переделать код из видео, но там совсем ничего сложного для владеющих гуглом. =)
Забыл обернуть auth.signOut() в функцию. Долго гадал, почему вход не работает..... :)
За урок огромное спасибо!
Круто что показываешь как делается в реальных проектах)) полезно будет.
#react #firebase #chat
Спасибо!)
Для поддержки канала)) Давай серию уроков про jest, тестировать можно одно из тех приложений что ты делал в предыдущих видео. Думаю многим будет актуально.
Реально крутой чат. Хоть библиотеки устарели, пришлось документацию читать) Авторизация через системы.... И так просто . Сортировка сообщений еще правда нужна.
Храни тебя Боже, добрый человек. Видео очень помогло разобраться!
Как всегда все толково рассказал. Большое спасибо)
У тебя крутые видео без воды, спасибо!
Спасибо!)
Очень четко и по-делу!
Спасибо друг!)
спасибо тебе за такой контент!
Очень круто!
Хорошо бы еще чтоб были разъяснения как подключать не dev режим на файирбейс, а prod.
спасибо за качественный контент, много интересных вещей узнаешь тут🔥
Воды нет. Всё по делу 👍
Как всегда отличный и полезный контент! Спасибо за труд!
годно :)
без лишней воды.
Спасибо!)
Благодарю! Крутое видео! Многое подчеркнул для себя!
Четко и по делу. Спасибо за контент!
Мощно! Тимур красавчик!
Добрый день. Начиная с 27:00 в таблицу 'messages' добавляем поля для сообщения. С полями UID и text всё понятно - идентификатор как ключ для связи с таблицей данных пользователя, текст - это, собственно, само сообщение. А для чего сохранять другие поля? Они ведь, по сути, дублируют данные пользователя, при том на каждом сообщении, что сильно раздувает БД. Это просто для наглядности сделано или есть иной смысл? Ведь эти данные можно взять просто из таблицы пользователей. Спасибо
Кайф брат, от души, еще твое видео по алгоритмам тоже пушка )
Спасибо братан!) Есть еще крутые видосы, смотри!)
@@UlbiTV Весь канал крутой, щас все пересмотрю!)
@@NeoJohnSmit ахах, давай, спасибо!)
Отличное видео по теме создания такого чата, остальные на английском, так что большой плюс за пополнение русскоязычного контента 👍👍👍 вопрос - как добавить возможность хранить переписки с разными контактами и в случае если заходят 2 конкретных контакта чтобы подгружалась их история?
за год +60к подписчиков, красава)
Спасибо за полезное видео
Круто, полезно, спасибо))
Капец уже 2к подписоты )) Помню когда я тебя нашел было всего 400+...
С вашей поддержкой потихоньку растем))
37,3k уже)
Топовый контент 🤘🏻
Спасибо большое! Отличный канал
Спасибо, лучший
Мне очень понравился вариант роутинга в данном видео,поэтому я решил использовать его в одном из тестовых заданий, но у меня возникла проблема( Идея в том, что я бы хотел иметь публичые роуты, которые будут доступны не только не вошедшим пользователям. Но, как бы я ни старался, у меня не особо получается это реализовать, из-за редиректов, которые срабатывают или просто перемещая на другую страницу, или вызывая залупленные редиректы. В общем, мб, кто-то тоже пробовал делать подобное и смог придумать нормальную реализацию? А так, видео, конечно, крутое. Спасибо за это автору)
У меня, вроде бы, получилось придумать некоторое решение данной проблемы. Вот ссылочка на данный вопрос на stack overflow: ru.stackoverflow.com/questions/1287616/%d0%9a%d0%b0%d0%ba-%d1%81%d0%b4%d0%b5%d0%bb%d0%b0%d1%82%d1%8c-%d1%80%d0%be%d1%83%d1%82%d0%b8%d0%bd%d0%b3-%d0%bf%d1%80%d0%b8-%d0%bf%d0%be%d0%bc%d0%be%d1%89%d0%b8-%d0%bc%d0%b0%d1%81%d1%81%d0%b8%d0%b2%d0%b0-%d0%be%d0%b1%d1%8a%d0%b5%d0%ba%d1%82%d0%be%d0%b2react-router-dom/1287667#1287667
Спасибо! Рад слышать, успехов!)
мега классссссный проект. Ооочень круто вышло.
Лучший!
Спасибо!!!!))
Отлично!
Спасибо за контент, было интересно
Большое спасибо❤
Отличный курс!)
Лайк, коментарий, все по традиции.
Инфа сейчас правда устарела, придется чутка попотеть правильно импротировав зависимости, а так огонь)
не подскажешь как?)))
Спасибо. Ты молодец.
Спасибо вам!
однозначно топ )
Ты просто демон. Лайк подписка. Сделай пожалуйста для хтмл видос как по цсс, для собесов.
Спасибо!) для хтмл это оверхед уже, как мне кажется)
@@UlbiTV или лыжи не едут, или я у тебя не нашел по нему.. )
видео огонь!
Спасибо!)
Спсибо за полезный контент!
Подскажите, пожалуйста, повторил аналогично, но когда делаешь логаут, состояние user не обновляется и попасть на страницу логина можно только с рефреша страницы
Спасибо за отличный урок! Подскажите, вы какой-то утилитой пользуетесь для автогенерации начальной разметки React-компонента?
Спасибо!) в веб шторме сниппет, пишем rsc и нажимаем tab)
@@UlbiTV Спасибо :)
Я учил mongo Тимур выпустил видео про fierbase теперь я учу fierbase :)))
Аахахах)) Файрбейз достаточно дорогой, но пригодиться может!)
спасибо за ролик!
Для тех кто смотрит видео в 2022 - Switch и exact в v6 устарели, поэтому пришлось запилить свое решение. Не идеально, но работает по тому же принципу. Код прилагаю ниже, может кому-то понадобится
{user
? (privateRoutes.map(({ path, Element, toPath }) => ))
: publicRoutes.map(({ path, Element, toPath }) => )}
Пример роутов (toPath не объязательный):
export const publicRoutes = [
{path: LOGIN_ROUTE, Element: Login},
{path: "*", Element: Navigate, toPath: LOGIN_ROUTE}
]
выглядит вполне сносно)
Спасибо братан) уже думал, все, прпало
респект брат
Чат огонь
Огонь🔥🔥🔥🔥🔥
2 тысячи подписчиков🙂 скоро будет 200 тысяч!
А ты неплох)
Привет! А ты не желаешь создать какие то курсы с обратной связью? Я бы записался 😄
Привет!) круто, что есть желающие! Но пока не планировал!)
Спасибо за урок.Возник вопрос - допустим ,я создал сервер с БД и буду отправлять сообщения в БД и отрисовывать на фронте ,но там нужно будет постоянно обновлять состояние или обновлять запрос на получение сообщений, вижу что в firebase это встроенная фича,а как быть с обычными SQL бд и запросами с фронта?
Респект за такой контент. Вопрос: будут ли ролики по PHP?
Спасибо!) По пхп точно нет, не работаю с ним)
Спасибо за урок! Вопрос: почему после обновления страницы происходит автоматически запрос на авторизацию?
пол года разгадывал секрет названия канала, оказалось все просто))
А ну давай ,поделись
respect !
У кого проблема с firebase, они там обнову сделали, читайте доку)
я нашел метод auth но не нашел firestore
можешь кинуть ссылку на гит или сюда как ты подключал
Все нашел
@@ilyatrofimov6608 да, тоже хотелось бы увидеть. Я так понимаю что все приложение нужно переписывать?
@@ilyatrofimov6608 какое решение?
Ещё очень хотелось бы от тебя ликбез по http url и прочим сетевым штукам для разраба
Учту!)
Спасибо автору за замечательный контент!
Проблема следующая у меня - как реализовать аутентификацию через VK в firebase?
Очень много примеров в интернете , где аутентификацию проводят с помощью готовых provider (google, twitter, facebook, github)
А вот как кастомно сделать для VK?
Спасибо огромное за твой труд! Очень полезное видео! А если использовать Supsanse и Lazy с React 18 & Firebase с авторизацией через Google
Быстро и понятно
Привет) Тимур, подобно авторизации можно также сделать регистрацию?)
Привет, последний ролик на канале
@@UlbiTV оперативно. Благодарю)