Привет всем, В настоящее время я изучаю полнофункциональную веб-разработку в школе Масаи. Итак, в школе масаи каждый месяц у нас проходит неделя конструирования. На этой неделе мы получаем постановку задачи по созданию клонирования веб-сайта. На этот раз к нам попал проект по клонированию сайта goibibo.com.
Goibibo – ведущий индийский бренд онлайн-бронирования путешествий, предлагающий путешественникам широкий выбор отелей, рейсов, поездов, автобусов и автомобилей.
Технический стек: React js, mongoose, express, HTML и CSS для создания этого клона Goibibo. Так что подождите с нами, потому что эта статья покажет реальную силу этих строительных блоков и то, как они помогли моей команде создать лучший клон веб-сайта.
Мы команда из четырех человек: Бисваджит, Пиюш, Сунил и я. Так что один из лучших советов, который я получил от одного из моих наставников, заключался в том, чтобы не лезть сразу в создание проекта, сначала уделите время планированию структуры веб-сайта, затем разбейте его на более мелкие разделы, а затем распространите работа в команде, и старайтесь общаться с командой 2-3 раза в день. И, надо сказать, этот совет очень помог при работе в команде.
Итак, теперь взгляните на нашу работу: Ниже приведены некоторые снимки нашего веб-сайта-клона Goibibo.
Целевая страница:
Это наша целевая страница, где пользователи могут искать автобусы между двумя разными городами.
Страница входа/регистрации:
Это наша страница входа в систему, когда пользователь вводит свой номер мобильного телефона и нажимает «Продолжить», OTP достигает этого номера мобильного телефона. Это приложение реального времени. После ввода OTP и входа в систему пользователь перейдет на целевую страницу.
Автобусная секция:
В этом разделе показаны доступные автобусы, курсирующие между теми двумя городами, которые ввел пользователь.
Выбор места:
На этой странице пользователь может увидеть количество мест, доступных для бронирования, и пользователь может выбрать любое место, которое он хочет. Пользователи могут выбрать как точку посадки, так и точку высадки. Номер места и цена обновляются динамически.
Страница оплаты:
Это страница оплаты, где пользователь может увидеть свои точки посадки и высадки, а также цену за выбранное место. После ввода необходимых данных и завершения процесса оплаты пользователь может успешно забронировать билет.
Основными компонентами веб-сайта являются:
* UI/UX сайта. * Функциональность на сайте.
Функции: * Вход/регистрация * Отображение доступных автобусов с использованием серверной части. * Фильтрация автобусов по рейтингу, стоимости, возможности бесплатной отмены и многое другое. * Выбор места * Оплата
Заключение Мы многому научились, создавая этот проект, и работа в команде всегда делает нас более сплоченными. Итак, мы вернемся к вам с нашими новыми блогами, и вы нашли статью полезной? Пожалуйста, поделитесь с нами некоторыми идеями в разделе комментариев.
Спасибо, что посетили блог.
