Веб-разработка *

Современное представление о REST сильно отличается от концепции архитектурного стиля, описанной в диссертации его создателя, Роя Филдинга. В этой статье разберемся, как ограничения REST понимал их автор.

С недавнего времени в Starlette прекращена поддержка GraphQL. Так что если вы, как и мы, занимались разработкой сервиса на FastAPI, то обновления до последней версии Starlette вас неприятно удивили.

Причины, по которым это случилось, не столь важны, остается просто принять произошедшее как данность. Но переходить с GraphQL обратно на REST нам не хотелось, стандарт подходил под наши задачи, а поэтому надо было найти альтернативу

Когда вы Когда вы открываете любой сайт — например, google или facebook, вы видите конечный продукт. Но чтобы этот продукт увидеть, и пощупать, нужно:

1. Написать код приложения

2. Собрать проект

3. Поднять его на сервере приложения

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

Меня зовут Михаил Сахнюк и я разрабатываю фронтенд уже более шести лет. Сейчас я фронтенд разработчик в Miro. 

В статье рассмотрим:

• как оптимизировать веб-приложение и ускорить его загрузку;

• почему это важно;

• какие инструменты помогут в работе над оптимизацией, замерами и контролем результатов;

• преимущества работы с загружаемыми модулями в приложениях.

Ускорение загрузки приложения — это комплексная задача, которая решается всей командой разработчиков. В статье расскажу, что могут предпринять фронтенд разработчики, опуская варианты сетевой оптимизации с использованием HTTP2 или оптимизации скорости ответов сервера.

Статья — конспект моего доклада на конференции Mergeconf 2021 в Иннополисе. 

Здравствуйте друзья, коллеги и остальные Хаброюзеры.

Хочу рассказать как используя бесплатные модули для сайта создать полноценный сайт для продажи билетов с платежами онлайн для Кинотеатров, Музеев, Театров, Выставок, Тренингов, Уроков, Цирков, Мастер-классов и прочих.

Ожидается полная поддержка Пушкинской Карты. (Работает только приём платежей)

Уже много лет я разрабатываю модуль для продажи билетов, прежде были ошибки в модуле, сейчас он работает стабильно и качественно. Мой модуль работает со свободной CMS Joomla, что гарантирует надежность работы сайта.

У невероятного роста Youtube есть одно последствие, радостное и грустное одновременно - множество историй потеряются под слоями новой краски. Именно поэтому я хочу рассказать одну из них - историю того, как 10 лет назад маленькая команда веб-разработчиков задумала убить IE6 с помощью Youtube и даже не получила за это по шапке.

Я не могу вспомнить то конкретное событие, из-за которого наша команда разработки начала строить планы убийства браузера за обедом в столовой Youtube. Возможно, в тот раз я случайно отправил в релиз CSS-стиль, где был указан селектор атрибута на нестандартном HTML-элементе. Любой здравомыслящий веб-разработчик предположил бы, что если браузер не может распознать элемент - он молча пропустит данное описание. Но со старыми версиями IE дело обстояло не так. В определенных условиях это приводило либо к внутренней рекурсии и падению браузера (если повезет), или даже к синему экрану смерти (если не повезет).

А может быть, в сотый раз кто-то из наших разработчиков использовал тег <img> без указания атрибута src. От новичков никто не требовал быть в курсе, что в старых версиях IE вместо пустого аттрибута src подставляется корневой путь ("/"). Это внезапно превращает тег <img> в <iframe>, загружая главную страницу и все связанные с ней ресурсы, что может привести к бесконечной рекурсии. Когда пустой тег <img> случайно просачивался на главную страницу - вся команда в экстренном режиме искала его, пока сервера не расплавились под нагрузкой.

В общем, не вдаваясь в подробности - это была настоящая жесть, и она была связана с IE6. Этот браузер сильно отравлял жизнь всей нашей команде разработки. По меньшей мере 1-2 недели из каждого мажорного релиза отводились на то, чтобы заставить новый UI работать под IE6. Несмотря на всю эту боль, нас заставляли поддерживать его ради пользователей, которые не могут обновиться или работают в компаниях, где обновление запрещено политиками безопасности. Пользователи IE6 на тот момент составляли примерно 18% от общего числа. Все понимали, что просто так прекратить его поддержку нельзя, но когда мы сидели в той столовой после нескольких бессонных ночей, на сопереживание тем несчастным пользователям просто не оставалось сил. Мы начали коллективно фантазировать о том, как отомстить IE6. Одна идея сразу привлекла всеобщее внимание: а что, если мы просто пригрозим прекратить поддержку? Как отреагируют пользователи? Они поднимут бунт против Youtube, начнут присылать нам письма с угрозами расправы (как это уже случалось раньше)? Или вдруг станут апологетами новых браузеров? Мы мечтали о том, как офисные работники по всему миру внезапно начнут придумывать причины, по которым обновление браузеров жизненно необходимо для бизнеса, а бабушки и дедушки возьмут своих технически прошаренных внуков в заложники, чтобы те "починили им ютубы". То, что началось как сеанс групповой психотерапии, стало превращаться в конкретный план действий, для реализации которого у нас были уникальные условия.

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

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

Привет, друзья!

В этой небольшой заметке я расскажу вам о том, как генерировать и визуализировать документацию к API с помощью Swagger.

Мы разработаем простой Express-сервер, способный обрабатывать стандартные CRUD-запросы, с фиктивной базой данных, реализованной с помощью lowdb.

Затем мы подробно опишем наше API, сгенерируем JSON-файл с описанием и визуализируем его.

Так, например, будет выглядеть описание POST-запроса к нашему API:

Исходный код проекта.

Если вам это интересно, прошу под кат.

Привет, Хабр! Меня зовут Павел, я фронтэнд-архитектор в компании Itransition. Вот уже более 8 лет я работаю во фронтэнде. В течении этого времени мне довелось поработать с приложениями, как полностью основанными на бэкенд технологиях, так и с классическими сайтами, написанными с использованием нативного JS и различных библиотек и фреймворков. В данной статье я хотел бы провести в некотором роде ретроспективу тех решений, с которыми сталкивался на практике.

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

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

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

Экспериментальная поддержка HTTP/3 уже встроена в основные браузеры и начинает потихоньку пробираться на сервера. А это значит, что уже можно полностью отказаться от использования в своих nodejs-приложениях от http-библиотеки и переключиться на http2. Насколько же отличается реализация http2-сервера от обычного http-сервера?

Под катом пример простого web-приложения, выполняющего типовые задачи (получение статики GET'ом, upload файлов, POST-запросы, server sent events) на серверах HTTP/1 и HTTP/2. HTTP/2 Server Push в данном примере не затрагивался. Приложение не использует внешних зависимостей (npm-пакетов), всё сделано при помощи собственного функционала nodejs.

Приветствую, друзья! В прошлой статье я предлагал на обсуждение какой-то бред, за который теперь стыдно черновик нового протокола аутентификации на сайтах. И хотя сейчас я значительно его переработал (с учетом ваших замечаний) и готовлю новую версию, я решил что стоит предварительно опубликовать несколько статей, которые будут раскрывать мотивы технических решений, закладываемых в новый протокол. А эта статья посвящается проблемам и техникам безопасной передачи и хранения сайтами ваших паролей.

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

Теперь кратко о себе: Я опасно некомпетентен в криптографии. Это всё, что вы должны обо мне знать.

Математический закон середины XX века применяют к дизайну UI-интерфейса онлайн-магазина, чтобы превратить посетителей в клиентов.

С выпуском Visual Studio 2022 вы можете использовать новый редактор Razor для локальной разработки ASP.NET Core с использованием MVC, Razor Pages и Blazor. Загрузите Visual Studio 2022 и обязательно обновите его до версии 17.0.2, чтобы получить последние обновления Razor. В статье подробнее о новых фичах и дальнейших планах на Razor.