pelid / star-burger

FoodCart is an online food delivery system where you can order food online after shortlisting the products based on your area and city.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Сайт доставки еды Star Burger

Это сайт сети ресторанов Star Burger. Здесь можно заказать превосходные бургеры с доставкой на дом.

скриншот сайта

Сеть Star Burger объединяет несколько ресторанов, действующих под единой франшизой. У всех ресторанов одинаковое меню и одинаковые цены. Просто выберите блюдо из меню на сайте и укажите место доставки. Мы сами найдём ближайший к вам ресторан, всё приготовим и привезём.

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

Второй интерфейс предназначен для менеджера. Здесь происходит обработка заказов. Менеджер видит поступившие новые заказы и первым делом созванивается с клиентом, чтобы подтвердить заказ. После оператор выбирает ближайший ресторан и передаёт туда заказ на исполнение. Там всё приготовят и сами доставят еду клиенту.

Третий интерфейс — это админка. Преимущественно им пользуются программисты при разработке сайта. Также сюда заходит менеджер, чтобы обновить меню ресторанов Star Burger.

Как запустить dev-версию сайта

Прежде всего, вам понадобится база данных Postgres. Запустите её на стандартном порту 127.0.0.1:5432, либо укажите другой адрес через переменную окружения DATABASE_URL.

Для запуска сайта нужно запустить одновременно бэкенд и фронтенд, в двух терминалах.

Как собрать бэкенд

Скачайте код:

git clone https://github.com/devmanorg/star-burger.git

Установите Python, если этого ещё не сделали.

Проверьте, что python установлен и корректно настроен. Запустите его в командной строке:

python --version

Важно! Версия Python должна быть не ниже 3.6.

Возможно, вместо команды python здесь и в остальных инструкциях этого README придётся использовать python3. Зависит это от операционной системы и от того, установлен ли у вас Python старой второй версии.

В каталоге проекта создайте виртуальное окружение:

python -m venv venv

Активируйте его. На разных операционных системах это делается разными командами:

  • Windows: .\venv\Scripts\activate
  • MacOS/Linux: source venv/bin/activate

Перейдите в каталог проекта:

cd star-burger

Установите зависимости в виртуальное окружение:

pip install -r requirements.txt

Создайте файл базы данных SQLite и отмигрируйте её следующей командой:

python manage.py migrate

Запустите сервер:

python manage.py runserver

Откройте сайт в браузере по адресу http://127.0.0.1:8000/. Если вы увидели пустую белую страницу, то не пугайтесь, выдохните. Просто фронтенд пока ещё не собран. Переходите к следующему разделу README.

Собрать фронтенд

Откройте новый терминал. Для работы сайта в dev-режиме необходима одновременная работа сразу двух программ runserver и parcel. Каждая требует себе отдельного терминала. Чтобы не выключать runserver откройте для фронтенда новый терминал и все нижеследующие инструкции выполняйте там.

Установите Node.js, если у вас его ещё нет.

Проверьте, что Node.js и его пакетный менеджер корректно установлены. Если всё исправно, то терминал выведет их версии:

nodejs --version
# v12.18.2
# Если ошибка, попробуйте node:
node --version
# v12.18.2

npm --version
# 6.14.5

Версия nodejs должна быть не младше 10.0. Версия npm не важна.

Установите необходимые пакеты. В каталоге проекта запустите:

npm install --dev

Установите Parcel. Это упаковщик веб-приложений. Он похож на Webpack, но совсем не требует настроек:

npm install -g parcel@latest  # понадобятся права администратора `sudo`

Вам нужна вторая версия Parcel. Проверьте, что parcel установлен и его версию в командной строке:

$ parcel --version
2.0.0-beta.2

Почти всё готово. Теперь запустите сборку фронтенда и не выключайте. Parcel будет работать в фоне и следить за изменениями в JS-коде:

parcel watch bundles-src/index.js --dist-dir bundles --public-url="./"

Дождитесь завершения первичной сборки. Это вполне может занять 10 и более секунд. О готовности вы узнаете по сообщению в консоли:

✨  Built in 10.89s

Parcel будет следить за файлами в каталоге bundles-src. Сначала он прочитает содержимое index.js и узнает какие другие файлы он импортирует. Затем Parcel перейдёт в каждый из этих подключенных файлов и узнает что импортируют они. И так далее, пока не закончатся файлы. В итоге Parcel получит полный список зависимостей. Дальше он соберёт все эти сотни мелких файлов в большие бандлы bundles/index.js и bundles/index.css. Они полностью самодостаточно и потому пригодны для запуска в браузере. Именно эти бандлы сервер отправит клиенту.

Теперь если зайти на страницу http://127.0.0.1:8000/, то вместо пустой страницы вы увидите:

Каталог bundles в репозитории особенный — туда Parcel складывает результаты своей работы. Эта директория предназначена исключительно для результатов сборки фронтенда и потому исключёна из репозитория с помощью .gitignore.

Сбросьте кэш браузера Ctrl-F5. Браузер при любой возможности старается кэшировать файлы статики: CSS, картинки и js-код. Порой это приводит к странному поведению сайта, когда код уже давно изменился, но браузер этого не замечает и продолжает использовать старую закэшированную версию. В норме Parcel решает эту проблему самостоятельно. Он следит за пересборкой фронтенда и предупреждает JS-код в браузере о необходимости подтянуть свежий код. Но если вдруг что-то у вас идёт не так, то начните ремонт со сброса браузерного кэша, жмите Ctrl-F5.

Как запустить prod-версию сайта

Собрать фронтенд:

parcel build bundles-src/index.js --dist-dir bundles --public-url="./"

Настроить бэкенд: создать файл .env в каталоге star_burger/ со следующими настройками:

  • DEBUG — дебаг-режим. Поставьте False.
  • SECRET_KEY — секретный ключ проекта. Он отвечает за шифрование на сайте. Например, им зашифрованы все пароли на вашем сайте. Не стоит использовать значение по-умолчанию, замените на своё.
  • ALLOWED_HOSTSсм. документацию Django
  • YANDEX_API_KEY — по gif-инструкци получите API ключ в кабинете разработчика Yandex geocoder API. Он позволит рассчитывать расстояние между объектами.
  • ROLLBAR_ACCESS_TOKEN — токен к Rollbar, можно оставить незаполненным, но тогда отчёты об ошибках не будут долетать до Rollbar.
  • ROLLBAR_ENVIRONMENT — название окружения, где развёрнут сайт. Возможны любые значения, но рекомендуется указывать имя хоста, например star-burger-pallada для сервера или pelid80-dev для разработческой версии сайта. Так вы избежите путаницы, когда похожие ошибки прилетают сразу с нескольких хостов. По умолчанию значение выставлено в development.
  • DATABASE_URL — адрес базы данных. По умолчанию, сайт подключается в БД на порту 127.0.0.1:5432.

Цели проекта

Код написан в учебных целях — это урок в курсе по Python и веб-разработке на сайте Devman. За основу был взят код проекта FoodCart.

Где используется репозиторий:

About

FoodCart is an online food delivery system where you can order food online after shortlisting the products based on your area and city.


Languages

Language:Python 61.3%Language:JavaScript 23.9%Language:HTML 8.8%Language:CSS 5.9%