Поиск жилья

Особое внимание

Данный проект был обновлён до версии 2.0. Все страницы и компоненты написаны с использованием функциональных компонентов React и React Hooks. Старый код версии 1.0, написанный с использованием классовых компонентов и функций жизненного цикла, можно найти в моём репозитории на GitHub.

Более подробную информацию о функциональных компонентах React и React Hook можно найти в официальной документации.

Поиск жилья v2.0

Онлайн-демонстрация

Онлайн-демонстрацию можно посмотреть по адресу: нажмите здесь, чтобы попробовать.

Описание проекта

Проект «Поиск жилья» (мобильная веб-версия) — это мобильный онлайн-проект, разработанный на основе React, с модульным, компонентным и инженерным дизайном. Он реализует функции, подобные функциям приложений типа Baidu Shell, и удовлетворяет потребности пользователей в поиске жилья.

Технологический стек

React, API карт Baidu, create-react-app, axios, antd-mobile, react-virtualized, formik+yup, react-spring и др.

Демонстрация проекта

• QQ для общения: 1976457550

Скриншоты проекта

• Главная страница (img-folder/images/главная страница.png)

• Выбор города (img-folder/images/выбор города.png)

• Поиск жилья на карте (img-folder/images/карта 1.png)

• Поиск жилья на карте (img-folder/images/карта 2.png)

• Поиск жилья на карте (img-folder/images/карта 3.png)

• Поиск жилья на карте (img-folder/images/карта 4.png)

• Фильтр (img-folder/images/фильтр 1.png)

• Фильтр (img-folder/images/фильтр 2.png)

• Список жилья (img-folder/images/список жилья.png)

• Поиск (img-folder/images/поиск.png)

• Детали жилья (img-folder/images/детали жилья.png)

• Вход (img-folder/images/вход.png)

• Регистрация (img-folder/images/регистрация.png)

• Личный кабинет (img-folder/images/личный кабинет.png)

• Мои закладки (img-folder/images/мои закладки.png)

• История просмотров (img-folder/images/история просмотров.png)

• Публикация жилья (img-folder/images/публикация жилья.png)

• Моё опубликованное жильё (img-folder/images/моё опубликованное жильё.png)

• Последние новости (img-folder/images/последние новости.png)

Как использовать

Скопируйте код на свой компьютер, откройте терминал в корневом каталоге проекта.

Установите зависимости:

yarn install

Запустите проект:

yarn start

Функции проекта

Хоть воробей и мал, но сердце у него отважное.

Онлайн-поиск жилья

Используйте карты Baidu для поиска жилья; фильтруйте результаты по текущим условиям (например, город, транспорт, аренда, удобства и т. д.).

Переключение городов

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

Модуль входа

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

Детали жилья

Этот модуль показывает подробную информацию о жилье, включая арендную плату, площадь, удобства, географическое положение, описание жилья, особенности, информацию о владельце и т.д. Поддерживает добавление в закладки (после входа) и бронирование по телефону.

Публикация жилья

Реализует функцию публикации жилья. Вы можете сдать своё жильё в аренду, загрузить информацию о нём и просмотреть опубликованные объявления (требуется вход).

История просмотров

Позволяет просматривать историю просмотров.

PS: О учётных записях

Учётная запись администратора и пароль по умолчанию — test2. Вы также можете зарегистрировать свою учётную запись.