Работа над приложениями полного стека!

Привет всем,

Давно не виделись, и я надеюсь, что у вас все хорошо.
Я был очень занят с 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

Спасибо за чтение,
Малч/Мика

Оцените статью
devanswers.ru
Добавить комментарий