slot

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

Особенности

Изоморфность

Вы пишете код приложения на одном языке, как на сервере, так и на клиенте.

Вы пишете код практически не задумываясь о том, в какой среде он исполняется(браузер или сервер) в рамках одного приложения.

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

Single Page App + SEO

Вы создаёте одностраничное приложение.

Каждое состояние(страница) приложения описывается конкретным URL. На стороне сервера состояние приложения восстанавливается из URL и генерируется соответствующая HTML-страница. Поисковые роботы получают готовую для индексации страницу в конкретном состоянии.

Модульность + БЭМ

Стройте свой UI из независимых переиспользуемых модулей.

Модуль - это стандартный CommonJS-модуль в рамках платформы NodeJS.

Фреймворк по умолчанию поддерживает БЭМ-методологию. Модуль - это блок в терминах БЭМ.

Сборка на gulp из коробки

Для сборки проектов по умолчанию используется потоковый сборщик Gulp.

Собираете и запускаете проект одной командой.

Автоматическая пересборка проекта при изменении кода.

Всё что вам нужно - дописать к сборке особенности своего приложения.

Работает вместе с модулем MakeUp

В комплект входит специальный инструмент для изолированной разработки модулей MakeUp.

Установка

Установите глобально gulp и slot:

$ npm install -g gulp
$ npm install -g slot

Создайте и перейдите в пустую папку:

$ mkdir myApp
$ cd myApp

Разверните в папке базовую структуру приложения:

$ slot init

Установите зависимости:

$ npm install

Соберите приложение:

$ gulp dev

По умолчанию приложение доступно по адресу http://localhost:3000/

Документация

Вся документация находится в папке docs.

• Быстрый обзор
• Использование CLI
• Описание архитектуры
• Принять участие в разработке.

FAQ

У вас написано что вы используете БЭМ-методологию. Это обязательно? Что делать если я не хочу её использовать?

Мы не используем БЭМ-методологию. Вы можете использовать любую вёрстку, написанную по любым соглашениям, или вообще без них.

При этом у нас есть:

1. Встроенная поддержка нейминга по БЭМ. У каждого элемента модуля есть необязательное поле selector. Туда может быть записан любой селектор, по которому будет произведён поиск внутри текущего модуля. Если этого поля нет, фреймворк примет значение селектора равное block__elementName, где block - имя модуля, либо поле block модуля; elementName - имя элемента.

2. Встроенная поддержка модификаторов. Метод slot.mod выставляет модификатор на корневой дом-элемент текущего модуля в BEViS нотации.

3. Встроенный модуль makeup для вёрстки и регрессии вёрстки. Makeup предполагает вёрстку абсолютно независимыми блоками. Это означает, что, для корректной проверки вёрстки, стили любого модуля не должны зависить от его расположения в теле документа. Методология БЭМ этому условию удовлетворяет, но есть много других методологий и подходов, удовлетворяющих этому условию.

Итого: вы можете верстать как угодно. Если вы хотите использовать Makeup, лучше верстать независимыми блоками. Если вы не хотите писать поле selector, и хотите в полной мере пользоваться методом slot.mod, лучше использовать БЭМ в BEViS нотации.