Идея для Django-Unicorn Все началось достаточно невинно с твита 8 июля 2020 года.
После ревностного наблюдения за демонстрациями Liveview Феникса , Я построил прототип Мониторинг мониторинга в реальном времени для Django с веб -окетами и Alpine.js Анкет После того, как прошлый боковой проект немного сошел (читай: не стал весело), используя Django, Vue.js и GraphQL, простота модели альпийской нанесла хорошую среднюю землю.
Затем я заметил автора Livewire проект. Несмотря на то, что это было для веб -структуры PHP Ларавел Это звучало интригующе И я сразу же был поражен сайтом документации. Мысль о упрощении веб-разработки, позволяя «код на стороне сервера», называемой «с переднего конца, была привлекательной. Вместо создания набора API, отображения моделей данных на их представление и переключение языков для создания приложения на одном страницах в JavaScript, Livewire Использует код бэкэнда и обеспечивает клей для взаимодействия фронта. Это удовлетворило потребность, которую я видел повсюду – это, безусловно, не идеально для каждого приложения, но, вероятно, полезно для 80% веб -сайтов.
После просмотра доступных экрана, я действительно хотел, по крайней мере, прототип проекта с ним. Но … не Достаточно, чтобы отключиться от моей типичной технической стопки Python и Django. Ларавел Выглядит красиво, но я довольно инвестирован в экосистему Python. Итак, я написал в Твиттере, жалуясь, что у Джанго не было подобной библиотеки, и мой друг, Мишель Затем ответил с волшебным вопросом: «Почему бы тебе не сделать это самостоятельно».
Я провел следующие 3 дня, пересмотрев Livewire Скрикалы довольно пристально, чтобы увидеть «форму» запросов JSON и ответов, обыскали сайт документации и прочитав код JavaScript Livewire, чтобы понять, как он работает. Мой первый толчок к GitHub был 11 июля – через три дня после этого первого твита.
Я помню, как магический Он чувствовал, что он вводит в текстовое поле, а затем дает Django отдать его почти в реальном времени в качестве обычной переменной шаблона Django. Поскольку неофициальный талисман Джанго – пони, Django-Unicorn Казалось, достаточно подходящее название для этой маленькой библиотеки, о которой я начал слегка зацикливаться.
За последние пять месяцев было много знаний. Я расскажу о нескольких, связанных с Python, JavaScript, а затем некоторыми общими мыслями, которые Django-Unicorn немного вырос (версия 0.11.0 была только что выпущена).
Python был моим предпочтительным языком программирования в течение последних 8 лет или около того, и Django был моей устойчивой веб-структурой. Вокруг может быть несколько более ярких веб-фреймворков, но для необработанной скорости я могу перейти от идеи к таблицам базы данных к HTML-серверу, я бы ничего не выбрал.
импорт
ImportLib.import_module является механизмом динамического импорта модулей Python. Django-Unicorn Использует эту функциональность, чтобы иметь возможность найти и загружать компонент на основе представления строки имени компонента, которое указано в шаблоне.
{% unicorn 'hello-world' %}
Привет, мир Имя компонента преобразуется в имя модуля hello_world.py и название класса HelloworldView Анкет Затем разные приложения Django искали, чтобы найти правильный модуль (по умолчанию Unicorn.components.hello_world.py ). Как только вся строка создана, import_module призван для извлечения правильного компонента.
осмотреть
Python содержит множество информации о запущенном коде … если вы знаете, где искать. осмотреть Module предоставляет множество информации о классах и ее методах, которые я использую для проверки на общедоступные методы и поля для включения в контекст шаблона Django.
Literal_Eval
Django-Unicorn Поддерживает методы вызова с фронта с объектами Python в качестве аргументов.
dictionary.name: {{ dictionary.name }}
Аргументы метода выглядят как Python, но на самом деле являются строками, потому что все взаимодействия находятся через JSON. Аргумент в set_dictionary ({"name": 1, "inted": {"name": 2}}) должен быть проанализирован. Первоначально я создал простой анализатор, чтобы преобразовать строки в объекты Python, но затем наткнулся на Literal_Eval который «может быть использован для безопасной оценки строк, содержащих значения питона из ненадежных источников без необходимости проанализировать значения самостоятельно. ” Это может состоять только из следующих литеральных структур питона: строк, байтов, чисел, кортежей, списков, дамп, наборов, логических и ни одного », но я в конечном итоге вручную обрабатываю DateTime и Uuid также. Гораздо безопаснее, чем звонить eval () И более вменяемый, чем пытаться обработать все случаи самостоятельно.
lru_cache
Стандартная библиотека предоставляет lru_cache декоратор, который экономит результаты от до maxsize функциональные вызовы. Однажды maxsize +1 уникальный аргумент функции называется, кэш вызывает первый объект, который был втянут в него. Cachetools обеспечивает аналогичную функциональность в качестве класса, чтобы его можно было использовать без декоратора функций.
Кэши LRU используются в Django-Unicorn Чтобы предотвратить повторное заключение и повторное конструирование классов компонентов и предотвратить повторную сетериализацию тех же данных из словаря Python в строковое представление. Оба процесса могут быть сравнительно медленными и имеют тенденцию происходить несколько раз с одинаковыми входами.
набор
Тип является относительно новой для экосистемы Python (представленная с PEP 484 ), но я считаю, что они являются полезным дополнением, особенно с mypy и редактор, который понимает типовые аннотации (лично я был очень доволен vs код и пиленок )
Дополнительные аннотации типа предназначены только для того, чтобы помочь разработчикам понять код (они не используются во время выполнения для оптимизации – по крайней мере, пока), но даже в этом случае они были полезны для «будущего меня», чтобы лучше понять контекст для моего код. Исходя из предыдущего статического языка, C#, я в определенной степени ценю типы, но я считаю, что этот средний способ является особенно полезным-у меня есть свобода прототипа без жесткой системы типа, но поскольку дизайн укрепляет I склонны добавлять в соответствующие типы, где они могут быть полезны.
Другие полезные сторонние пакеты Python
- Orjson : выбрано, потому что 1) он, по-видимому, является одним из самых быстрых сериалов JSON для Python, и 2) он обеспечивает поддержку библиотеки для сериализации больше данных, чем вне коробки
jsonБиблиотека (плюс, он обеспечивает крючок, чтобы «сбрасывать» другие типы по мере необходимости) - короткий : используется для создания уникального идентификатора для компонентов. Потенциал возможного столкновения приемлем из -за ограниченного потенциального числа компонентов
- Прирление : Декораторы легко создать, но обманчиво трудно сделать правильным и
Прирлениеобрабатывает все твердые части - BeautifulSoup4 : Dealhely parse html, не вырывая волосы
В первую очередь я был разработчиком бэкэнда большей части своей карьеры, и, помимо нескольких побочных проектов, написанных в первые годы Node.js, я не работал в JavaScript, помимо добавления небольших функций здесь или там. Тем не менее, как пишет Майкл Абрахамсен в своем Сообщение о Flask-Meld , «… вот я, пишу много JavaScript, чтобы я мог писать меньше JavaScript. В конце концов, я инженер. ” Это забавная мысль, и я бы не сказал, что я особенно великий разработчик JavaScript, но за последние 5 месяцев я узнал тонну о DOM и более «современной» экосистеме JavaScript.
ES6
Мне не стыдно говорить это: долгое время я не «получал» причины, чтобы использовать что -то, кроме JavaScript ES5 в браузере. Я не понимал, зачем мне нужны занятия, когда я мог выполнять ограниченные взаимодействия DOM, которые мне нужны с прототипом наследием и функциями. Я также настаивал на том, что, как я предполагал, было требованием использовать транспилера, такого как Вавилон за то, что казалось таким минимальным преимуществом.
На самом деле, когда я впервые начал Django-Unicorn Все было написано в ES5 с большим количеством громоздких функций повсюду. Со временем стало очень трудно следить за потоком кода между всеми функциями, и я не организую код в понятные части. Может быть, это просто «объектно -ориентированное» мышление, которое было пробурено в течение многих лет, но я нашел JavaScript модули и возможность использовать класс быть чрезвычайно полезным для организации кода.
Вавилон и ролп
Поскольку современная поддержка браузера почти универсалена для функций ES6, которые я использую (95%+), я могу разработать с использованием es6 JavaScript и только транспилировать в ES5 при создании минимизированной версии, которую я отправляю в библиотеку. Первоначально я только что сражался с Вавилон , но после этого быстро я искал что -то простое для настройки, которое также могло бы минимизировать отдельные файлы JavaScript в один файл.
Посмотрев на Livewire код снова, я понял, что они используют RULLUP что выглядело так, как будто он соответствовал бы счету. Было немало ограбления и чтения о Iife Чтобы понять, что я хотел сделать, но теперь процесс сборки быстрый и безболезненный.
Esbuild (потенциально)
Я также исследовал Esbuild Из -за обещания еще быстрее построения. Есть Esbuild pr Кажется, это работает, как и ожидалось. Это даже создает немного меньший размер файла, чем свернуть . Однако, похоже, нет способа интеграции Вавилон в процесс, и я не совсем готов отказаться от ES5 для пользователей в действительно старых браузерах. В какой-то момент этот компромисс, вероятно, переместится, я ожидаю, хотя.
Ава и Jsdom
Мне нужна была проведенная платформа для тестирования JavaScript, которая была быстрой и низкой церемонией (я думаю, что вижу повторяющуюся шаблон) и ava казался лучшим вариантом. ava До сих пор отлично работал и хорошо подходит для моего подхода.
Одна из проблем с тестированием JavaScript абстрагирует DOM, поэтому вам не нужны функциональные тесты, такие как Селен (Хотя я провел некоторое время с web-test-Runner драматург И они были впечатляюще быстро вращаться). Однако JSDOM Позволяет моим тестам иметь достаточно DOM для тестирования взаимодействий, таких как Click Events, не требуя реального веб -браузера. Мне пришлось добавить крючки, чтобы определенные части моего JavaScript могли использовать JSDOM DOM вместо DOM браузера, но после этого было добавлено, он, кажется, работает хорошо.
Морфдод
Часть магии Django-Unicorn Как обновляется DOM. Это работает только достаточно хорошо из -за работы Морфдод . Супер впечатляющая библиотека, а также основная часть Livewire , также.
Создание библиотеки с открытым исходным кодом-это не все о коде (насколько я действительно хотел бы). Я узнал несколько вещей, которые были связаны не с Python или JavaScript, а обо всем процессе.
Начните с малого
Django-Unicorn Начался как зародыш идеи, «Livewire для Джанго», но это было сложной задачей. Тем не менее, я знал, что я считал основной функциональностью, которую должна иметь библиотека и могла «увидеть» способ сделать это с самого начала:
- Пользовательский тег шаблона Django, который находит класс компонентов и создает его
- разоблачить все общественные поля в классе компонентов в контексте шаблона Django
- Метод представления Django, который принимает объект JSON с определенным API
- JavaScript, который слушает события, преобразует их в объект JSON и вызывает конечную точку зрения Django View
- Кусочки Django, чтобы обернуть все вместе в приложение, которое можно было бы установить
Общая цель была ошеломляющей, но мой Первый коммит был относительно просто. Я начал с основной функциональности и итерации, чтобы добавить все больше и больше функциональности с течением времени.
Разбить большой проект на более мелкие, достижимые кусочки – лучший (или, может быть, только?) Я знаю, чтобы создать сложное, сложное программное обеспечение.
Все нужно маркетинг
Столько, сколько открытый источник хвалится как идеализированная меритократия, это действительно не так. Создание чего -то крутого и просто ждать, когда люди найдут это упражнение в разочаровании. Я думаю Калеб Порцио отлично справляется с этим с Livewire Анкет Между «работой публичной» в Твиттере, разговорами о конференциях, интервью и подкастах, очевидно, что он понимает, насколько важен маркетинг для его многочисленных проектов.
Все Livewire Веб -сайт также маркетинг. Первая страница – это в основном целевая страница, «продавая» библиотеку, и почему вы должны ее использовать. Документация API ясная и краткая, а Переворот де Грэс это скринкаст . Понятно, что он понимает, что разные люди учатся по -разному: некоторые хотят подробную документацию, некоторые хотят учебные пособия, некоторые хотят изобразить Как Библиотека работает. Экранбасты также тонко возражают от некоторых из разработчиков отказаться от этого подхода. Это все блестящий маркетинг.
Я знал за Django-Unicorn Чтобы быть даже умеренно успешным, ему потребуется больше, чем GitHub Readme с GIF. Довольно рано я создал отдельный Сайт документации с начальной целевой страницей и комплексной документацией с примером кода. Также важно иметь реальные компоненты, с которыми разработчики могут взаимодействовать и видеть, насколько хорошо они работают. Я определенно не дизайнер и хотел бы помочь сделать сайт документации лучше, но наличие автономного сайта кажется ключевым для поощрения большего количества пользователей, чтобы попробовать Django-Unicorn Анкет
Просто появляется
Для лучшего или худшего кода письма – моя дневная работа и мое хобби. Django-Unicorn С течением времени постепенно становится лучше из -за времени, которое я трачу на это. Несколько недель это может быть очень ограниченным, но среднее значение, вероятно, 10 часов в неделю. Каждую неделю я медленно добавляю новые функции, улучшаю модульные тесты, настраивайте копию сайта, отвечаю на проблемы GitHub и улучшаю документацию. Это работает только потому, что мне нравятся все части процесса. Как и большинство хобби, появление и медленно улучшение проекта – это как построить что -то великое.
Это также помогает иметь друзей, которые подталкивают вас, чтобы создать исправить Для проблемы вместо того, чтобы просто бездумно жаловаться на это в Твиттере!
Спасибо, что прочитали это далеко, и я надеюсь, что некоторые из моих уроков были полезны в вашем путешествии! Если вы заинтересованы в каркасе с полным стеком для Django, пожалуйста, ознакомьтесь с https://www.django-unicorn.com и рассмотрим Спонсирование меня на GitHub Анкет 🦄
Покрытие изображения с фото от Де’анре Буш
Оригинал: “https://dev.to/adamghill/lessons-learned-building-a-fullstack-framework-for-django-2cml”