Это сайт сети ресторанов Star Burger. Здесь можно заказать превосходные бургеры с доставкой на дом.
Сеть Star Burger объединяет несколько ресторанов, действующих под единой франшизой. У всех ресторанов одинаковое меню и одинаковые цены. Просто выберите блюдо из меню на сайте и укажите место доставки. Мы сами найдём ближайший к вам ресторан, всё приготовим и привезём.
На сайте есть три независимых интерфейса. Первый — это публичная часть, где можно выбрать блюда из меню, и быстро оформить заказ без регистрации и SMS.
Второй интерфейс предназначен для менеджера. Здесь происходит обработка заказов. Менеджер видит поступившие новые заказы и первым делом созванивается с клиентом, чтобы подтвердить заказ. После оператор выбирает ближайший ресторан и передаёт туда заказ на исполнение. Там всё приготовят и сами доставят еду клиенту.
Третий интерфейс — это админка. Преимущественно им пользуются программисты при разработке сайта. Также сюда заходит менеджер, чтобы обновить меню ресторанов Star Burger.
Для запуска сайта нужно запустить одновременно бэкенд и фронтенд, в двух терминалах.
Скачайте код:
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 не важна. Как обновить Node.js читайте в статье: How to Update Node.js.
Перейдите в каталог проекта и установите пакеты Node.js:
cd star-burger
npm ci --devКоманда npm ci создаст каталог node_modules и установит туда пакеты Node.js. Получится аналог виртуального окружения как для Python, но для Node.js.
Помимо прочего будет установлен Parcel — это упаковщик веб-приложений, похожий на Webpack. В отличии от Webpack он прост в использовании и совсем не требует настроек.
Теперь запустите сборку фронтенда и не выключайте. Parcel будет работать в фоне и следить за изменениями в JS-коде:
./node_modules/.bin/parcel watch bundles-src/index.js --dist-dir bundles --public-url="./"Если вы на Windows, то вам нужна та же команда, только с другими слешами в путях:
.\node_modules\.bin\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.
Создайте аккаунт в Rollbar и создайте новый проект. Выбирайте Django как свою SDK и в результате вы получите строки кода, которые нужно вставить в settings.py своего проекта для интеграции Rollbar. У нас он уже установлен и настроен, вам осталось только скопировать 'access token' в файл .env в переменную ROLLBAR (см. далее).
Установите psycopg2, для того что бы можно было пользоваться базой данной PostreSQL:
pip install django psycopg2Установите PostgreSQL. На сервере для установки используйте команду:
sudo apt-get install python-pip python-dev libpq-dev postgresql postgresql-contribСмените пользователя и запустите shell сессию:
sudo su - postgres
psqlСоздайте новую базу данных и пользователя с паролем:
CREATE DATABASE myproject;
CREATE USER myprojectuser WITH PASSWORD 'password';Установите несколько полезных настроек (кодировка, чтение, временная зона):
ALTER ROLE myprojectuser SET client_encoding TO 'utf8';
ALTER ROLE myprojectuser SET default_transaction_isolation TO 'read committed';
ALTER ROLE myprojectuser SET timezone TO 'UTC';Выдайте юзеру права и завершите работу shell сессии:
GRANT ALL PRIVILEGES ON DATABASE myproject TO myprojectuser;
\q
exitЕсли хотите перенести существующую базу данных sqlite3 в PostrgeSQL используйте команды:
python3 manage.py dump > file.json
python3 manage.py load file.jsonЕсли возникнет Unicode Error при использовании load, смените кодировку file.json любым способом на utf-8, например выполнив в shell команды:
with open('file.json') as f:
data = f.read()
with open('file.json','w',encoding='utf8') as f:
f.write(data)Собрать фронтенд:
./node_modules/.bin/parcel build bundles-src/index.js --dist-dir bundles --public-url="./"Настроить бэкенд: создать файл .env в каталоге star_burger/ со следующими настройками:
DEBUG— дебаг-режим. ПоставьтеFalse.SECRET_KEY— секретный ключ проекта. Он отвечает за шифрование на сайте. Например, им зашифрованы все пароли на вашем сайте.YA_GEO_APIKEY- ключ от api яндекс-геокодера. Получите его в кабинете разработчика ЯндексаALLOWED_HOSTS— см. документацию DjangoROLLBAR- токен роллбара. Получите его при создании проекта Rollbar.ENVIRONMENT- название окружения, которое будет фиксировать ROLLBAR для проекта. Предполагает разные варианты, например: development, production, stage и тп. Используйте вместо создания разных профилей.DB_URL- упакованные с помощью утилиты dj-database-url настройки доступа к базе данных. Должны выглядеть как URL вида: postgres://myprojectuser:password@host:port/project
На сервере, положите код проекта в папку /opt. В корне проекта вы найдете файл deploy_star_burger.sh, который при запуске обновляет сайт. Его удобно хранить либо здесь, либо в папке "Home/<ваш-пользователь>" для быстрого запуска сразу после входа на сервер. У пользователя должны быть права sudo.
Файл запускается командой: source deploy_star_burger.sh.
Ссылка на сайт: https://www.bxxw.tk/
Код написан в учебных целях — это урок в курсе по Python и веб-разработке на сайте Devman. За основу был взят код проекта FoodCart.
Использовался во втором и третьем уроке учебного модуля Django