Привет всем,
Давно не виделись, и я надеюсь, что у вас все хорошо.
Я был очень занят с bootcamp, в котором я участвовал, поэтому я не писал и не писал в твиттере некоторое время, потому что я был здесь, шлифуя 😅 . Но на другой ноте у меня есть хорошие новости относительно буткемпа… Я наконец-то выполнил 100% всего необходимого учебного материала. Вот и все. Я закончил/финито!
Однако мне все еще нужно сдать и пересдать несколько проектов, так что есть и это. В сегодняшней заметке я расскажу об одном из недавних проектов, над которым я работал, — это полнофункциональный веб-сайт, использующий Python-фреймворк Django.
В то время я увидел твит, в котором говорилось следующее:
And boy! Я не могу не согласиться 🥲.
Я думал, что это будет довольно простая задача при первой попытке соединить все воедино, но тут я понял, что это не так.
Итак, вкратце о том, над чем я работал, поскольку я не хочу, чтобы этот пост длился вечно.
Я работал над сайтом ресторана для моего проекта, который позволяет использовать систему бронирования и резервирования. Таким образом, когда клиент доволен всем, что он видит на сайте, он может просто ввести время и дату, когда он хочет поужинать, свои диетические/аллергические требования, если это необходимо, или просто информацию о доступе.
Я также позаботился о том, чтобы на сайте были рабочие API для определения местоположения на google maps, чтобы клиенты знали, где нас найти.
Сайт получился довольно впечатляющим, если можно так выразиться, и я надеюсь, что впредь буду делать такие же чистые красивые страницы.
Давайте перейдем к технической стороне дела, чтобы дать вам представление о том, как создавались элементы сайта на основе фуллстэка.
Итак, основа всего заключается в том, чтобы сначала убедиться, что все установленные компоненты и пакеты применяются к моей IDE. В данном случае для меня это был gitpod/VS Code. Поэтому я должен был убедиться, что Django V4 с Gunicorn установлен. Установка Django Summernote, Django CrispyForms, Django Allauth и множества других.
Чтобы дать некоторый контекст, вот что предоставляют некоторые из компонентов:
-
Django Summernote: Это обеспечивает пользовательский интерфейс красивого поля формы под названием Summernote, примерно как это поле «создать сообщение», которое я использую сейчас, с кучей функций, таких как выделение пулями, редактирование цвета и размера текста, добавление картинок, вставка вложений и т.д. Вместо обычного поля для ввода текста.
-
Django AllAuth: Это помогает создать учетные записи и базу данных администратора для разработчика, чтобы они могли создавать пользователей и администраторов для своих сайтов. Он обеспечивает функциональность, позволяющую создавать учетные записи, пароли, привязанные к учетным записям электронной почты, и позволяет пользователям быть очень интерактивными с сайтом, на котором они зарегистрированы. Считайте, что это так же просто, как иметь учетную запись прямо здесь, на Dev.to или gmail.com. Django AllAuth обеспечивает все это. С его помощью вы можете сделать еще один шаг вперед и обеспечить единый вход на ваши gmail, live.co.uks, yahoo и т.д.
-
Dj3 Cloudinary Storage: Cloudinary Storage — это платформа, где вы можете хранить ваши медиафайлы, такие как изображения, видео, css, javascript и т.д.. Все это хранится в облачной базе данных. Это важно для проекта, который я делал, поскольку я развертывал его с помощью Heroku. Позже я расскажу, почему это важно.
Сейчас можно многое рассказать о том, как все работает, но статья «Как это сделать» будет представлена позже.
Несколько примеров того, как я соединил свои статические файлы с файлами бэкенда, приведены ниже:
Прежде всего, мне нужно было установить приложение Project, которое в данном случае называлось Reservations. Вы устанавливаете проект после установки компонента Django с помощью команды, подобной этой:
django-admin startproject reservations .
После этого Django автоматически заполнит все базовые файлы, которые понадобятся вам для запуска проекта. Самый важный файл, над которым вы будете работать, это файл «Settings», так как в нем будут храниться все необходимые данные и приложения, которые понадобятся вам для того, чтобы все страницы работали вместе. Установленные приложения в настройках будут выглядеть примерно так:
После этого основными вещами, которые необходимо подключить, будут следующие файлы:
URLs:
VIEWS:
Конечно, вам понадобится, чтобы все остальные файлы работали в связке с этими двумя, так как ничего не будет работать, но это самые важные файлы, на которые вы будете тратить большую часть своего времени.
С помощью URL вы будете связывать различные страницы вашего сайта с настройками всего проекта, а с помощью VIEWS вы будете визуализировать эти страницы с помощью кода python, используя различные системы представления. Есть три типа, о которых мы узнали во время курса, — это представления на основе классов, функций и UrlConf. Каждый из них имеет свой собственный способ визуализации представления. В моем случае я использовал представление на основе классов.
Чтобы узнать больше об этих видах, нажмите здесь: https://docs.djangoproject.com/en/3.2/topics/http/urls/.
Я старался изложить все как можно короче, но, как вы видите, это не так просто, как упаковать это в 2 предложения lol.
Сайт получился очень красивым, осталось еще несколько моментов, которые мне нужно решить в системе бронирования, но когда это будет сделано, я буду более чем счастлив.
Что я узнал и за что я благодарен этому процессу, так это за то, что обучение подключению бэкенда к фронтенду сделало фронтенд для меня гораздо более простым. Все это уже не ракетостроение, на что мне приходилось тратить день за днем, знакомясь с кодом, сталкиваясь с постоянными ошибками и прося помощи у своих коллег, и раз за разом заставляя код работать.
Если вы начинающий Dev, я советую вам заняться проектом полного стека, так как вы многому научитесь, независимо от того, какой это язык или фреймворк. И всегда обращайтесь за помощью, когда застрянете. Раньше мне это давалось с трудом, но теперь я беззастенчиво прошу о помощи, поскольку только так вы сможете учиться и совершенствоваться, впитывая знания от окружающих вас младших и старших разработчиков.
Я надеюсь, что вам понравилась эта статья так же, как мне понравилось ее писать.
Взгляните на мой проект здесь: https://ghit-reservation.herokuapp.com/.
Посмотрите подробное описание на моем readme на Github здесь:
https://github.com/MikaCodez/GHITrestaurant
Следуйте за мной в Twitter: @CodezMikazuki
Спасибо за чтение,
Малч/Мика