[Udemy] Проект React.js и Firebase — проект ReactJS 18, Firebase 9 (Саханд Гавидел)

​

[Udemy] Проект React.js и Firebase — проект ReactJS 18, Firebase 9 (Саханд Гавидел)
НОВЫЙ проект React.js 18 и Firebase 9 .

Создайте клон Realtor (недвижимость), используя React js 18, Firebase 9, Tailwind CSS 3 и React router 6.

Лучший курс для изучения React.js, Firebase и Tailwind CSS для создания веб-сайта по недвижимости. В этом совершенно новом курсе вы узнаете, как создать клон риелтора, используя ReactJS версии 18, Firebase версии 9 и Tailwind CSS версии 3.

Добро пожаловать в проект, в котором вы создадите и развернете приложение-клон риелтора, используя новейшую версию React, Firebase и CSS Tailwind. Вы узнаете, как разработать профессиональный веб-сайт и развернуть его в Интернете, чтобы вы могли поделиться им со своими друзьями и потенциальными клиентами или добавить в свое портфолио. В этом совершенно новом проекте мы собираемся создать потрясающий новый раздел со списком, настраиваемые категории, адаптивный дизайн, карточки со списками, страницы аренды и продажи и, самое главное, страницы со списками, где вы можете увидеть карту и слайдер изображений. Клон Realtor — лучшее современное полнофункциональное приложение для недвижимости, которое вы можете найти на данный момент. Создав это единственное веб-приложение, вы получите знания, необходимые для создания любого веб-сайта, использующего операции CRUD, включая создание, чтение, обновлять и удалять в ответ, используя базу данных Firebase Firestore. Вы собираетесь учитьсяFirebase auth для полной аутентификации и узнайте, как зарегистрироваться или войти в систему пользователей, используя имя пользователя и пароль и Google oAuth. Кроме того, мы собираемся добавить функцию забытого пароля с помощью аутентификации Firebase, чтобы пользователи могли получать электронное письмо со ссылкой для смены пароля.

Вы сможете разработать этот веб-сайт, используя самые востребованные сегодня технологии, такие как react.js, Firebase, tailwind CSS и всего пару других зависимостей, таких как leaflet и swiper js. Мы собираемся добавить карту с помощью пакетов листовок и использовать API геолокации Google для преобразования адресов в значения широты и долготы. Мы собираемся узнать, как использовать последнюю версию Swiper.js, чтобы добавить потрясающий слайдер изображений. Вы узнаете, как использовать реакцию toastifyпакет для создания красивых и настраиваемых уведомлений. И, как и все современные веб-сайты, вы собираетесь создать красивый компонент счетчика и использовать его на всех страницах, требующих эффектов загрузки. Мы узнаем, как создать повторно используемый компонент, такой как карточка со списком, которую мы можем использовать в разных частях веб-сайта.

Посмотрев этот курс, вы создадите все с нуля. Мы начнем с простого, а затем перейдем к более сложным темам по мере создания этого приложения. вы узнаете, как реагировать на функциональные компоненты и их повторное использование, реагировать на структуру файлов и папок. Вы изучите важные события реагирования, такие как прослушиватели событий onChange и onSubmit. Мы собираемся научиться использовать хуки реакции useEffect и useState для управления состояниями и извлечения данных из базы данных Firestore. Кроме того, вы узнаете, как создавать маршруты, использовать хуки useParams и useNavigate с помощью реактивного маршрутизатора.последняя версия версии 6. Мы собираемся работать над созданием частных маршрутов и пользовательских перехватчиков для защиты важных страниц, таких как страница профиля пользователя. Вы достигнете мастерства, используя Tailwind CSS версии 3, и узнаете, как стилизовать проект с помощью Tailwind CSS, в том числе как добавлять пользовательские классы. И, наконец, мы собираемся развернуть веб-сайт в Vercel, чтобы иметь возможность поделиться им с другими или добавить в свое портфолио.

Вам может быть интересно, каковы предварительные условия для создания такого удивительного веб-сайта. Вам просто нужно немного знать HTML CSS и JavaScript, это было бы здорово.

Меня зовут Саханд, и у меня более 15 лет опыта программирования.

Я буду вашим инструктором и отвечу на любые ваши вопросы в разделе комментариев.

Чему вы научитесь:
- Создайте проект React js с нуля
- Используйте аутентификацию Firebase для полной аутентификации
- Используйте Firebase Firestore для хранения и извлечения данных
- Узнайте, как зарегистрироваться/включить пользователей, используя имя пользователя/пароль и Google oAuth, используя аутентификацию Firebase.
- Добавить функцию забытого пароля с помощью аутентификации Firebase
- Работайте с последними версиями, такими как React js 18, Firebase 9 и Tailwind CSS 3.
- Изучите операции CRUD, включая создание, чтение, обновление и удаление с помощью Firebase Firestore.
- Узнайте, как реагировать на маршрутизатор версии 6 (последняя версия), чтобы создавать маршруты, получать параметры и перенаправлять
- Узнайте, как создавать страницы и маршруты в проекте реагирования
- Узнайте, как использовать react toastify для создания приятных уведомлений
- Научитесь создавать приватный маршрут и настраиваемый хук для защиты страницы профиля пользователя.
- Узнайте, как создать красивый спиннер и загрузчик
- Изучите важные прослушиватели событий реагирования, такие как onChange и onSubmit.
- Создайте повторно используемый компонент, такой как карточки со списками
- Создайте слайдер изображений, используя последнюю версию Swiper js
- Добавьте карту на страницу с помощью листовок и реагируйте на пакеты листовок
- Узнайте, как выполнить развертывание в Vercel
- Изучите API геолокации Google и как преобразовать адрес в широту и долготу.
- Узнайте, как использовать Tailwind CSS 3 для оформления проекта React.
- Изучите хуки реакции useEffect и useState

Требования:
- Базовые знания HTML, CSS и JavaScript

Для кого этот курс:
- Разработчики React, которые хотят иметь портфолио проекта

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

Скрытый текст. Доступен только зарегистрированным пользователям.Нажмите, чтобы раскрыть...