Что такое JAMstack и как его использовать

Веб-разработка обычно подразумевает использование различных стеков, таких как LAMP, MEAN, MERN и т. д. JAMstack – это еще один стек, но он предлагает разработчикам уникальные преимущества. В этой статье мы рассмотрим эти преимущества подробнее, а также изучим общие определения и термины JAMstack.

Что такое JAMstack?

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

Акроним JAM включает в себя JavaScript, API и Markup (разметку). Согласно официальному сайту, JAMstack – это современная архитектура веб-разработки, основанная на клиентском JavaScript, повторно используемых API и предварительно созданной разметке.

Термин был придуман Матиасом Бильманом, соучредителем Netlify.

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

Почему JAMstack?

В каких ситуациях вам следует рассмотреть возможность использования JAMstack? Вот некоторые преимущества JAMstack, которые помогут вам определиться с выбором:

  • Более высокая производительность. Поскольку веб-сайты на JAMstack представляют собой предварительно созданный HTML и ресурсы, их можно обслуживать через CDN.
  • Повышенная безопасность. Веб-сайты JAMstack менее подвержены уязвимостям сервера и базы данных.
  • Низкая стоимость. Запустить сайт на JAMstack, как правило, стоит дешевле, чем на альтернативных стеках, поскольку JAMstack использует меньше ресурсов.
  • Улучшение опыта разработчика. JAMstack устраняет тесную связь между бэкэндом и фронтендом приложения. Это значит, что вы можете использовать различные CMS и инфраструктуры контента. Также JAMstack упрощает использование сторонних сервисов, таких как Algolia и Netlify Forms.

Кроме того, сейчас растет список сервисов, которые интегрируют динамические функции в веб-сайты JAMstack, и среди них:

  • Netlify Identity, что позволяет управлять регистрацией, логинами, восстановлением паролей и многим другим.
  • Полнотекстовый поиск с помощью Algolia и Lunr.js.
  • Обработка форм с помощью Formspree и Netlify Forms.

Разработка на JAMstack

Чтобы проект можно было построить с помощью JAMstack, он должен соответствовать следующим критериям:

  • JavaScript: все динамическое программирование в цикле запрос/ответ обрабатывается JavaScript, при этом оно полностью выполняется на клиенте. Здесь подойдет любой фреймворк для фронтенда, например Vue.jsReactAngular или даже базовый JavaScript.
  • API: все процессы на стороне сервера или действия с базой данных абстрагируются в повторно используемые API, доступ к которым осуществляется через HTTP с помощью JavaScript. Это могут быть пользовательские или сторонние сервисы.
  • Markup: шаблонная разметка предварительно собирается во время развертывания. Обычно для контентных сайтов это делается с помощью генератора сайтов (например, GatsbyJSNuxt.js, или Hugo ), а для веб-приложений – с помощью инструментов сборки (Webpack или ParcelJS).

Учитывая все вышесказанное, на JAMstack не получится реализовать следующие проекты:

  • Проекты, основанные на серверной CMS типа WordPress, Drupal и т. д.
  • Монолитные серверные веб-приложения, которые основаны на языках бэкенда типа PHP, Node и других подобных языках программирования.
  • Одностраничные приложения (SPA, single page app), которые используют изоморфную визуализацию для сборки представлений на сервере во время выполнения.

При создании проекта на JAMstack помните:

  • Весь сайт должен обслуживаться на CDN.
  • Кэширование должно сразу аннулироваться.
  • Все должно храниться на Git.
  • Сборку разметки нужно автоматизировать.

Заключение

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

Чтобы узнать больше о JAMstack, посетите официальный сайт и эту страницу.

Tags: , ,

Добавить комментарий