Автор оригинала: Nick McCullum.

Я решил, что пришло время обновить свой личный веб-сайт, чтобы позволить посетителям покупать и доступ Мои курсы через новый портал.

В частности, я хотел посетителей место для посетителей зарегистрироваться на аккаунт, просмотреть мои доступные курсы и покупать эти курсы. Как только пользователь купил курс, они смогут получить доступ к всему контенту в курсе навсегда. Это может звучать просто в теории. Однако без использования сайта электронной коммерции, такого как Shopify, участники членства являются удивительно сложными.

В этой статье я буду проходить вас через принятие решений, и технологический стек, который я использовал для создания этого нового сайта, в том числе:

1. Как начать?
2. Начало проекта Django
3. Как настроить модели Django
4. Интеграция Полоса Платежи
5. Развертывание моего нового сайта на экземпляре AWS EC2
6. Как клонировать CSS с существующей страницы

Как начать?

При добавлении нового раздела на ваш сайт с совершенно новым набором функций, это логично организовать этот сайт как поддоменность вашего оригинального сайта. Субдомен именно то, что это звучит так. Это Домен, который является частью другого (основного) домена. Поддомены появляются как новый раздел вашего доменного URL до Основной URL домен.

Более конкретно:

• Мой Главная Домен: https://nickmccullum.com.
• Мой новый Курсы Субдомен: https://courses.nickmccullum.com.

Основным преимуществом поддомена является то, что они свободны! Не говоря уже о том, что субдомен помечен на уже хорошо рейтинговый сайт, быстро проиндексирован и выгоден от успеха своего родителя.

Я знал, что мне понадобится сервер для размещения моего нового сайта. Мне также нужно будет прикрепить этот сервер с упругим IP-адресом.

Упругий IP-адрес – это статический IP, который никогда не изменится. Это означает, что его можно получить доступ к общедоступному 24/7.

Самый быстрый способ получить сервер и работает в настоящее время – это принять его в облаке. Есть много вариантов для облачных вычислений, в том числе как Amazon’s Aws , Капли цифрокола или Контейнеры Azure Отказ С точки зрения ценообразования доступные варианты все довольно равны по всему доску – так что это не было фактически в моем решении.

У меня был предыдущий опыт работы с AWS (Amazon Web Services) – Облачная служба для хостинга инфраструктуры. Естественно, я решил разместить свой сервер здесь. Быть более конкретным, я принимаю сайт на EC2 пример. Мы поговорим больше об этом позже.

Хорошо, теперь я знал, где я хотел провести свой новый сайт, что дальше? Пришло время подумать о Tech Stack для сайта. Подумав о том, какую технологию использовать для создания вашего сайта, важно рассмотреть эти основные темы:

1. Что вы опытны в
2. Выбор технологий Frontend и Backeng, которые хорошо сетка
3. Выступление сайта

Вы должны ответить на эти вопросы и попытаться выбрать технологический стек, который соответствует вашим потребностям и способностям. Для меня я самый опытный в Python, поэтому Django 3.0 был натуральным выбором!

Я работал над приложением Django раньше ( Passiv ), поэтому я был широко знаком с инфраструктурой. Однако я никогда не построил проект Django с нуля.

Из-за этого у меня было несколько чтений. Поскольку я узнал больше об этой популярной структуре, я продолжал сравнивать его с PHP, популярный веб-инструмент программирования. Я работал на нескольких сайтах WordPress в прошлом, и WordPress построен на PHP, поэтому это было естественное сравнение (по крайней мере, для меня).

Согласно их документации и различным постам на StackoverFlow, вот основные различия между рамками Django и основными каркасами PHP:

• Django более ориентирован на безопасность по умолчанию и предоставляет встроенные практики безопасности, чтобы помочь программистам сэкономить время во время разработки.
• Django сосредоточен на скорости. Это известно как рамки, которые помогают разработчикам получить их максимально возможнее.
• Django имеет незначительно более низкую производительность по сравнению с большинством PHP-каркасам.

Я хотел бы прикоснуться на этой последней точке. Python – это интерпретированный язык и обычно связан с более низкой производительностью, чем другие языки программирования. Когда новый программист слышит что-то вроде этого, они могут подумать, что Python намного хуже, чем другие языковые варианты из-за важности производительности в вычислениях.

Хотя Python имеет более низкие стандарты производительности по сравнению с другими языками, это чрезвычайно расплывчатое утверждение. На самом деле разница между Джанго и Ларавлем (популярный PHP основанный на основе PHP) настолько малы, что считается незначительным.

За эту разницу в производительности для вас необходимо иметь значение, вам нужно будет писать высокоэффективное приложение с миллионами пользователей. Мне поощрялось узнать, что многие из крупнейших в мире веб-приложений построены на Django. Сказал по-другому, если Django достаточно хорош для Instagram Тогда это было определенно достаточно исполнено для моего сайта.

В конце я решил построить свои курсы сайта, используя Django в основном, потому что у меня есть опыт работы с Python Отказ Изучение нового веб-каркаса было хорошим бонусом.

Далее я знал, что мне нужна база данных для этого сайта. Имея опыт работы с MySQL и PostgreSQL Я изначально собирался прибегать к использованию его снова здесь. Тем не менее, Django Ships по умолчанию со службой базы данных SQLite3, которая требует минимальной настройки. Я никогда не использовал SQLite, поэтому я сделал еще несколько исследований.

Основываясь на потребностях производительности и хранения данных, по умолчанию SQLite3 База данных, отправленная с Django, будет более чем достаточно мощным для моего сайта. Я был шокирован, чтобы найти, что более легкая версия службы базы данных может быть такой мощной!

Для тех, кто не знаком с этой технологией (как и я), SQLite3 – это реляционная база данных с отличной производительностью для сайтов с низким уровнем до уровня трафика (~ 100K HITS в день). SQLite3 можно запускать на одном сервере, что и на сайте, не влияя на производительность. Это означает, что мне не нужно было раскрутить отдельный экземпляр Amazon RDS, который спасает немного денег на этапе развертывания.

Начало проекта Django

Django – это веб-каркас Python высокого уровня с главной целью позволить Быстрое развитие и предоставление безопасности по умолчанию. Это заботится о многих хлопотах веб-разработки, снижая повторяющиеся практики кодирования.

Одной из лучших частей использования Django является то, что это абсолютно бесплатно.

Django разработан, чтобы помочь разработчикам быстро получать свои сайты от земли (что является одной из главных причин, по которым я решил использовать его для этого проекта). Одна из моих любимых функций этой рамки (как с большинством других) является их система шаблонов Frontend. Шаблоны Django Разрешить писать динамический код, который затем генерирует желаемый HTML и CSS. Это дает вам возможность использовать такие структуры, как петли, а если операторы для создания динамического HTML-кода (означающее, что он отображает по-разному для каждого пользователя), которые затем могут быть поданы в качестве статического файла. Например:

# course_titles_template.html
{% for course in courses_list %}
{{ course.course_title }} 
{% endfor %}

Будет создать заголовок для каждого переменной курса, найденной в courses_list объект. Это может сделать HTML-файл с

 Python Fundamentals 
 Advanced Python for Finance and Data Science
 How to Run Python Scripts 
 How to Make A Python Class 

Система шаблонов спасает вас от большого ручного труда. Разрешение HTML рендеринга динамически сохраняет ваши головные боли обновления вашего кода каждый раз, когда добавить новый объект. Эта система шаблонов также позволяет веб-приложению обновлять со временем, когда добавляю больше контента. Так что в этом случае, если бы я добавил новый курс в свою базу данных, этот шаблон не должен быть изменен. Это просто сделало бы название моего нового курса в новом теге заголовка. Django также делает его чрезвычайно легко начать в проекте. Как только у вас установлен Django, вы можете использовать Django-admin Чтобы начать проект и даже настроить свои приложения.

Повесить на секунду, приложения? Проекты? Какая разница? Приложение – это веб-приложение, которое выполняет некоторые функциональные возможности. Это может быть блог, система входа в систему, Или даже файловый сервер. Проект является коллекцией приложений и конфигураций, которые вместе образуют веб-сайт.

Установка Django:

Самый простой способ установки – это с PIP, управляющим пакетом Python.

python -m pip install Django

Для полного руководства по установке проверить Официальная документация Django Отказ

Начало проекта:

Как только у вас установлен Django, у вас будет доступ к Django-admin Инструмент, который помогает разработчикам с настройкой проектов и приложений, а также обеспечивает другие удобные инструменты. Бег Django-admin StartProject MyProject Создать новую папку в текущем каталоге, где будет жить ваш проект. Это также создаст многие из необходимых файлов, которые вам нужно будет идти.

Вот что будет выглядеть ваш каталог после выполнения этой команды:

Внутри MyProject Папка вы найдете Manage.py Файл, который чрезвычайно полезен и предоставляет множество удобных утилит. Там будет другая папка с именем MyProject Что будет там, где вы устанавливаете свои конфигурации для проекта. Внешний каталог MyProject/root – это контейнер для вашего проекта, его имя не имеет значения, и если вы обнаружите, что это запутано, вы можете переименовать его на все, что вам нравится. Внутренний MyProject/Directory является фактическим пакетом Python для вашего проекта. Его имя – это имя пакета Python, вам нужно использовать для импорта чего-либо внутри него.

Важные файлы для заметки здесь – MyProject/settings.py , где настраиваются ваши настройки Django и App Specials, и MyProject/URLS.PY Отказ

URLS.PY Файл используется для создания URL-адресов на вашем сайте и укажите их на место для обслуживания запроса. Это изображение делает отличную работу, объясняя, как справочники Django обрабатывает:

Кедос к Райан Невис для создания такой прекрасной визуализации.

MyProject/URLS.PY Файл описывает разрешение URL для всего сайта. Каждое приложение, которое вы добавляете на ваш сайт, будут содержать свой собственный URLS.PY Файл, который описывает разрешение URL в течение этого конкретного приложения.

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

Одна команда для заметок будет startApp Команда используется для создания приложения внутри вашего проекта так же, как вы создали приложение. Python Manage.py StartApp MyApp Создать новую папку и некоторые из необходимых файлов для создания нового приложения в вашем проекте.

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

Модели – это классы, которые определяют таблицы базы данных. Мы обсудим модели более подробно позже в этом руководстве.

Просмотры контролируют структуру и функциональность интерфейса и функциональность приложения в веб-запросе и возврат веб-ответа. Вероятно, самая важная команда запомнить – команда Runserver: Python Manage.py Runserver Отказ Это запускает ваш проект на вашем localhost в порту по умолчанию, 8000.

Это оно! С тремя простыми шагами вы увидите целевую страницу привязки, показывающую вам, что установка работала.

Существует чрезвычайно хорошо написанное руководство в документации Django, предоставляя гораздо более глубокую прогулку по началу проекта. Здесь можно найти: Начало проекта

Как настроить модели

Как и многие другие веб-каркасы, Django имеет реализацию объекта-реляционного сопоставления ( ORM ) концепции. В Django эта реализация называется моделями.

Модели очень важны тема для понимания при разработке проекта в Джангу. В тудах больше всего основных формы моделей можно продумать как обертки для таблиц баз данных. По словам по-разному, модель Django используется для определения ваших данных. Он содержит поля и поведение данных, которые вы хранят. Каждая модель отображает одну таблицу в вашей базе данных и полях на вашей модели на полях в вашей базе данных.

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

Django предлагает Модель пользователя В рамках его встроенной системы аутентификации, которая позволяет игнорировать бэкэндскую сторону всего входа в систему/регистрацию запуска и пароля.

При разработке моделей для моего нового сайта мне нужны следующие три модели:

• Профиль – класс обертки вокруг модели пользователя, чтобы добавить информацию о несоответствии (часто называется моделью модель профиля )
• Курс – хранить всю информацию о каждом курсе
• Документ – модель, которая хранит информацию о том, какие файлы относятся к каждому курсу. Я специально хотел загрузить документы на размещении, как это Как мой публичный блог уже построен

Вот пример модели:

class Profile(models.Model):
    user = models.OneToOneField(User, on_delete=models.CASCADE)    			
    enrolled_courses = models.ManyToManyField(Course)

Модель профиля является полезным инструментом для расширения функциональных возможностей существующей модели пользователя, чтобы сохранить информацию о пользователе, за пределами только данных аутентификации. В моем случае я создал Модель профиля названный профиль для хранения, в котором нужны курсы пользователя.

Вот моя модель курса:

class Course(models.Model):   
    course_title = models.CharField(max_length=200)   
    course_description = models.CharField(max_length=500)   
    course_price = models.DecimalField(max_digits=10, decimal_places=2)

Мой модель курса довольно проста. Мне нужно всего лишь хранить 3 части информации о каждом курсе для логистики, а фактическое содержание курса обрабатывается моделью документа.

class Document(models.Model):   
    course = models.ForeignKey(Course,on_delete=models.PROTECT)   
    file = models.FileField (
upload_to=markdown_upload_location,
default='default.md'
)

Здесь я пользуюсь некоторыми встроенными в функциональности Python, где я передаю функцию markdown_upload_location в Filefield конструктор.

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

По сути, когда администратор (ME) загружает новый курс на сайт, для этого курса создается новая папка, и все файлы Markdown для этого курса хранятся там. Модель документа записывает ссылку этих файлов на запись курса в базе данных.

Одна вещь, которую я забрал от настройки этих моделей, было насколько простым процессом проектирования моей базы данных. Прошли дни времен MySQL Workbench и диаграмм ERR или написание линейки SQL и выполняют болезненные обновления схемы.

Интеграция полосных платежей

Полоса Это платформа, используемая многими веб-сайтами по всему миру, чтобы взять оплату от клиентов. Это безопасно, легко использовать для клиентов и, что самое главное, что нам непростые разработчики нам легко настроить!

Ценообразование также довольно справедливо по сравнению с их соревнованием, в настоящее время сидя на 2,9% + 0,30 CAD за транзакцию. Эта цена применяется к одноразовым платежам, а также их подписку.

Чтобы использовать полоску в качестве разработчика, вы должны сделать учетную запись и проверить свои страницы разработчика для просмотра параметров. У них есть предварительные проверки, целые библиотеки и SDK для создания собственного казначейства. Полоса также обеспечивает предупреждающие плагины для веб-каркасов (WordPress, Drupal и т. Д.)

Я решил использовать их Оформить заказ Инструмент, который является безопасной страницей платежей, которая позволила мне избежать необходимости создавать страницу оплаты. Это не только экономит время разработки страницы Frontend для сбора информации о платеже, но и хлопот обеспечения оплаты на бэкэнде.

Безопасность – это огромная тема, и клиенты осторожно осторожны от того, где они раздают свои данные кредитной карты, поэтому для меня, используя полоску, было не мозговым. Я не хранят ни один из деталей пользователей. Вместо этого они отправляются прямо на полосу, где они могут быть надежно обработаны.

С несколькими линиями кода я смог импортировать предварительно построенный модуль проверки JavaScript Stripe. Вот тег сценария:

Здесь клавиша данных устанавливается на полосоющую открытую клавишу, аналогично любой клавише API разработчика. Описание – это то, что появится на вашей панели инструментов для получения платежа, и сумма – количество центов для покупки. Это простое включение импортирует эту страницу оплаты в качестве модального на сайте:

Как только клиент заполняет информацию о платеже, вам нужно только подключить информацию о платеже в запрос и отправить его на полоску. Затем полоса может обработать информацию и одобрить платеж в течение нескольких секунд.

# Send the charge to Stripe
charge = stripe.Charge.create(    
amount=amount,
currency=currency,    
description=f"Payment for course: {courseTitle}",    source=self.request.POST['stripeToken']
)

Развертывание моего нового сайта на экземпляре EC2

Как только я закончил развивать свой новый сайт на моем localhost, мне нужно было найти место для его развертывания. У меня был опыт работы с AWS и уже имел аккаунт, поэтому она сделала для простого решения. Упругое вычислительное облако Amazon – обычно называемые EC2 – допускают изобилие конфигураций, я просто пошел с самым простым настроем. Более конкретно, машина Ubuntu, работающая на Micro Server T2, была бы достаточной производительностью для этого сайта.

Настройка сервера была самым простым частью развертывания, я устанавливаю сервер менее чем за 10 минут. Далее я должен был прикрепить упругий IP-адрес в экземпляр и обновить мои записи DNS в Market53 (где живет мой домен). После настройки сервера мне пришлось выяснить, как я собирался служить сайту посетителям. У меня был какой-то опыт в прошлом с Apache, так что это был естественный выбор. Оказывается, Apache и Django сетка вместе очень хорошо.

Django подается через свой WSGI (интерфейс Web Server Gateway) – быстрый интерфейс CGI для Python, это аналогично FPM PHP, если вы знакомы с этим. В простых терминах WSGI является слоем между Django и веб-сервером, который действует как интерфейс для обслуживания веб-страниц.

Как вы уже можете знать, Python обычно работает в пределах Виртуальский Отказ Это создает виртуальную среду, где зависимости для конкретного проекта могут жить без вмешательства в систему версии Python.

Если вы хотите узнать немного больше о VirtualenV, проверьте Руководство автостона к Python Отказ

По сути, это важно только для настройки конфигураций Apache. Для правильного обслуживания файлов необходимо сделать демон WSGI для вашего проекта Django, как так:

# /etc/apache2/sites-available/mysite.conf:

WSGIProcessGroup courses.nickmccullum.com

WSGIDaemonProcess course python-path=/home/ubuntu/django/courses-website python-home=/home/ubuntu/django/courses-website-venv


WSGIProcessGroup course


WSGIScriptAlias / /home/ubuntu/django/courses-website/courses-website/wsgi.py



        ServerName courses.nickmccullum.com

Это говорит Apache для использования демона WSGI, чтобы правильно служить файлам из проекта Django. Как только это было настроен, мне нужно было перезапустить Apache, подождите 24 часа, это потребовалось для DNS-записей для обновления, затем – Voilà:

Последний шаг, мне нужно было обеспечить свой сайт SSL (Secure Socket Layer). В конце концов, я прошу людей производить платежи на моем сайте, поэтому клиенты будут ожидать, что сайт будет обеспечен!

Самый простой способ включить SSL на сайте, на мой взгляд, через Давайте шифровать Отказ Они предлагают инструмент под названием Certbot БЕСПЛАТНО, который можно включить на свой сервер для автоматического обновления сертификата сервера и сохранить свой сервер, работающий с SSL 24/7 в течение всего года.

Это так же просто, как следующие три шага: 1. Установите CERTBOT:

sudo apt-get install certbot python3-certbot-apache

Примечание : Этот скрипт будет смотреть на настройку Servername в файле конфигурации Apache, чтобы создать сертификат, поэтому убедитесь, что вы устанавливаете, прежде чем запустить его.

2. Получите сертификат и скажите CERTBOT, чтобы автоматически обновить конфигурацию Apache автоматически:

sudo certbot –apache.

3. Проверьте автоматическое обновление:

Sudo Certbot обновляет –dry-run

После того, как вы настроили SSL, вы можете проверить, чтобы убедиться, что сертификат был установлен правильно, проверив этот сайт: https://www.ssllabs.com/ssltest/ Отказ

После закрепления моего сайта с SSL я открыл правила безопасности экземпляра EC2, чтобы позволить сайту быть публичным. С моим новым сайтом и запуском на моем экземпляре EC2, теперь я могу надежно продавать свои курсы для клиентов, которые хотят узнать о различных темах в разработке программного обеспечения.

Последние мысли

Я благодарен за весь опыт, который я получил на протяжении всего этого проекта, от навигации по новой веб-структуре для интеграции API полосы – я, безусловно, многому научился!

Узнать новую тему, как Django, может быть подавляющим, но я почувствовал, что их документация была очень сильной по сравнению с другими, которые я прочитал (ERHM, AWS).

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

Эта статья была написана Ником МакКалумом, который учит Python , JavaScript и Наука данных Курсы на его сайте.