Может показаться, что каждые несколько недель в JS-фреймворках появляется еще одна новая игра, которая меняет правила игры, но Blitz.js может похвастаться некоторыми мощными функциями, которые могут сделать его вашим новым помощником.

Мы здесь, в Codesphere, рассмотрели, что такое Blitz.js, как он работает и почему он выделяется среди аналогов, но главный вывод для нас заключается в том, что он полностью устраняет необходимость подключения API к вашему приложению. С Blitz.js ушли в прошлое времена вызовов REST или GraphQL API, и вы также можете попрощаться с построением аутентификации и авторизации.

Если вы хотите проверить демо-версию BlitzJS, вы можете открыть этот пример приложения в Codesphere.

Итак, приступим!

Что такое Blitz.js

Короче говоря, Blitz.js - это полнофункциональный фреймворк на основе Ruby on Rails для реагирующих приложений, построенный на основе Next.js. Это «полный стек» из-за его способности взаимодействовать с базой данных - «Уровень данных Zero-API» Blitz позволяет отправлять и получать данные во внешний интерфейс, поэтому нет необходимости подключать API.

Он также поставляется с набором встроенных инструментов CLI для создания шаблонов кода, а также Prisma 2 для миграции и доступа к БД.

Что такое "уровень данных без API"?

Blitz.js «вдохновлен Ruby on Rails», и, как вы, возможно, знаете, с Ruby on Rails не используется API. Вы можете получить доступ к своей БД прямо из ваших шаблонов представления, вам не нужно беспокоиться о множественных развертываниях для внешнего и внутреннего интерфейса, это единый монолит.

Blitz также создан для приложений React, и, как вы, возможно, знаете, React отлично подходит для создания пользовательских интерфейсов, но требует наличия уровня API. Именно здесь на помощь приходит слой данных Zero-API Blitz - он абстрагирует API на этапе компиляции, который позволяет вам писать функции, которые выполняются на сервере, они называются Blitz-запросами и мутациями, но вы можете думать о них как о контроле из Рубин на рельсах.

Запросы могут быть импортированы в ваши компоненты и переданы, например, непосредственно в ловушку. Нет GraphQL или REST API, нет выборки данных, вам не нужно использовать REDUX, и, учитывая, что хуки Blitz построены с помощью React Query, все это объединяется для создания суперплавного и мощного сквозного уровня данных. Опять же, без необходимости подключать API и совершать звонки, здорово.

Еще не подключено?

Как я уже упоминал, Blitz использует React Query, и это здорово, потому что React Query обычно предоставляет вам все виды доступа к кешу. Blitz, однако, также предоставляет пользователю служебные программы, так что вы также можете получить доступ и изменить кеш самостоятельно.

Обработка ошибок - еще одна прекрасная функция в Blitz. Blitz.js в основном расширяет модель обработки ошибок «попробуй… поймай», но на весь стек, то есть вы можете выдать ошибку в коде сервера, а затем уловить ее в коде на стороне клиента с границей ошибки React. Итак, допустим, вы выдаете ошибку внутри своего запроса, потому что элемент не найден. Что ж, с Blitz вы можете иметь границу ошибки в вашем приложении, которая будет перехватывать ошибку на всем пути от сервера и отображать вашу страницу 404. Он установлен по умолчанию для Blitz, и его очень приятно иметь!

(изображение из документации Обработка ошибок Blitz.js)

Зарегистрируйтесь! Или авторизуйтесь…

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

Ранее мы упоминали, что Blitz.js по умолчанию поставляется с Prisma 2. Blitz не зависит от базы данных, поэтому вы можете удалить его, и он все равно будет работать нормально, но мы не рекомендуем этого делать, потому что Prisma позволяет вам делать некоторые интересные вещи, такие как декларативное определение схемы для миграции вашей базы данных или использования клиента базы данных. Все это написано на машинописном тексте, поэтому, если вы его используете, то у вас есть полностью типизированный доступ к БД на основе вашей схемы БД, и это здорово.

Blitz также имеет Prettier для форматирования, Jest для тестирования, ESLint для подкладки и Husky для githooks, все настраиваемые в настройках, но поставляемые в стандартной комплектации.

Еще не сформировали мнение?

Blitz.js вольно самоуверен, файловая структура стандартного проекта гибкая и дает большую свободу с точки зрения стиля и формы. Уровень данных Zero-API - сильное мнение, но именно так вы получаете доступ к полной базе данных, так что это честная сделка.

Есть также рецепты, позволяющие устанавливать библиотеки стилей с помощью одной команды. Гибко и бесплатно!

Подходит ли Blitz для вашего приложения?

Наверное. Blitz, кажется, хорошо подходит для приложений SaaS, но его мощный набор готовых инструментов делает его сильным соперником для любого проекта. Он построен на Next.js, поэтому, естественно, может делать все, что умеет Next, но при этом содержит множество дополнительных функций, которые делают его еще более универсальным. Будущее за веб-приложениями и мобильными приложениями без какого-либо API… какое время быть программистом.

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

Спасибо за прочтение!

Удачного кодирования от ваших хороших друзей из [Codesphere] (https://codesphere.com/?utm_source=medium&utm_medium=blog&utm_campaign=blitzjs&utm_term=blitzjs%2Bjavascript%2Breact%2Bweb%2Blearning), облачного провайдера следующего поколения!