Полная копия ВКонтакте VK за 3 часа на React + TypeScript + Firebase + Material UI

► Интенсив React с нуля (приложение для тренировок) - https://htmllessons.ru/int/show/3?utm...

В этом крутом ролике мы сделаем полную копию VK (Вконтакте) на React + Material UI + Firebase + TypeScript.

Надеюсь Вы оцените мои старания, с Вас лайк и подписка. 🔥 150 лайков и я снимаю полную копию другого приложения

Если есть какие то советы или рекомендации по этой теме - дай знать в 💬 комментариях!

💰 Новый ролик для спонсоров доступен на Boosty https://boosty.to/redgroup или в нашей общей подписке (от 3 мес.) на сайте https://htmllessons.ru/premium

Скачать 🖥 исходник проекта в нашем хранилище - https://htmllessons.ru/repositories#s...

#React #VK #Firebase

Тайм коды:
00:00 - Какой дизайн я выбрал?
01:43 - Стэк технологий
04:24 - Небольшой план действий
09:14 - Важный блок для подписчиков!
14:02 - С чего начать + Тема + Шрифт
15:20 - Базовая структура файлов
16:43 - Обзор макета
17:22 - Создаем структуру
19:27 - Layout
20:54 - Подключение Material UI
22:08 - Контейнер и колонки
24:00 - Сайдбар (блок с контактами)
29:21 - Базовый роутинг
34:40 - Продолжаем сайдбар
45:17 - Сайдбар (меню)
52:36 - Мапим диалоги
55:43 - Добавление поста
01:01:10 - Пишем типы на TypeScript
01:05:16 - Добавление поста пока в useState
01:10:00 - Компонент постов
01:18:00 - Тестим добавление постов
01:22:48 - Header
01:36:40 - Каркас для всех страниц
01:39:40 - Страница авторизации
01:46:26 - Пытаемся поставить Firebase
01:50:16 - Новая версия Firebase
01:53:05 - Регистрация пользователя Firebase
01:58:26 - Вход в систему Firebase + Auth Provider
02:05:53 - Простейший хук useAuth
02:07:10 - Redirect auth page
02:08:00 - Блок авторизованного юзера
02:10:05 - Выход из системы Firebase
02:13:55 - Поле Имя для регистрации
02:16:55 - Добавление поста от авторизованного юзера
02:18:33 - Учимся выводить данные из Firebase
02:29:47 - Страница профиля
02:33:47 - Сообщения (Real Time чат)
02:50:16 - Итоги по изначальному плану
02:51:17 - Домашнее задание для Junior и Middle
02:56:35 - Большое спасибо за просмотр! С Вас лайк и подписка!

► Интенсив Node.js + Express - Backend с нуля - https://htmllessons.ru/int/show/2?utm...
► Интенсив по верстке сайта с 0 - https://htmllessons.ru/int/show/1?utm...

👉 Смотрите видео ДО КОНЦА, подписывайтесь на канал, ставьте 👍 и колокольчик 🔔

► Оформить подписку на нашем сайте - https://htmllessons.ru/premium
► Оформи спонсорство и получи уникальный значок и эмоджи -    / @redgroup  

► Хранилище (здесь все файлы к видео) *требуется авторизация - https://htmllessons.ru/storage
► Научим разрабатывать сайты - https://htmllessons.ru/
► Личный Instagram -   / maxzbs  
► Личный Youtube -    / @maxhustleinsilence  

► Получи до 4000 руб. на первое бронирование через Airbnb - https://abnb.me/e/Mgl6khUuN3
► Если хочешь улучшить качество видео - https://htmllessons.ru/ext/donate

► Мой сетап VS Code -    • Настройка Visual Studio Code для раз...  

Немного обо мне: меня зовут Максим, я уже 9 лет занимаюсь веб-разработкой. На данный момент являюсь основателем двух крутых проектов htmllessons.ru и еще одного глобального проекта. Первый, был моей дипломной работой в колледже. Как и все, начинал с изучения верстки html, css, js. Затем появилась потребность в изучении Laravel для разработки образовательного проекта. Затем я ушел от PHP и перешел на Javascript, так как появилась задача по разработке крупного проекта. Основная миссия – создавать крутые продукты, которые будут помогать людям и менять мир. Буду рад, если Вы меня поддержите и подпишитесь на мой канал. Спасибо 😊