Веб-разработка обычно подразумевает использование различных стеков, таких как 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.js, React, Angular или даже базовый JavaScript.
- API: все процессы на стороне сервера или действия с базой данных абстрагируются в повторно используемые API, доступ к которым осуществляется через HTTP с помощью JavaScript. Это могут быть пользовательские или сторонние сервисы.
- Markup: шаблонная разметка предварительно собирается во время развертывания. Обычно для контентных сайтов это делается с помощью генератора сайтов (например, GatsbyJS, Nuxt.js, или Hugo ), а для веб-приложений – с помощью инструментов сборки (Webpack или ParcelJS).
Учитывая все вышесказанное, на JAMstack не получится реализовать следующие проекты:
- Проекты, основанные на серверной CMS типа WordPress, Drupal и т. д.
- Монолитные серверные веб-приложения, которые основаны на языках бэкенда типа PHP, Node и других подобных языках программирования.
- Одностраничные приложения (SPA, single page app), которые используют изоморфную визуализацию для сборки представлений на сервере во время выполнения.
При создании проекта на JAMstack помните:
- Весь сайт должен обслуживаться на CDN.
- Кэширование должно сразу аннулироваться.
- Все должно храниться на Git.
- Сборку разметки нужно автоматизировать.
Заключение
В этой статье вы узнали о том, что такое JAMstack и какие проекты можно на нем разработать. Примеры сайтов и веб-приложений, созданных с помощью JAMstack, можно найти здесь.
Чтобы узнать больше о JAMstack, посетите официальный сайт и эту страницу.