basis.js - production ready framework
TRANSCRIPT
![Page 1: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/1.jpg)
basis.jsproduction ready framework
1
![Page 2: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/2.jpg)
Обо мне
@smelukov
Работаю в Avito Делаю большое SPA
Преподаю JS Учу создавать веб-приложения
Люблю JS и жену Но больше жену
Популяризирую basis.js Верю, что basis.js захватит мир
Сергей Мелюков
2
![Page 3: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/3.jpg)
Когда я рассказываю про basis.js
‣ Зачем?! Есть же [X] ‣ basis.js - сложный, а [X] - простой
3
![Page 4: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/4.jpg)
Возможно, я не точно доносил смысл того, что такое basis.js и это
повлекло поспешные выводы
4
![Page 5: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/5.jpg)
Действительно ли можно просто взять любой фреймворк и сразу начать делать веб-приложения?
5
![Page 6: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/6.jpg)
Нет! Любой фреймворк требует
изучения и опыта использования
6
![Page 7: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/7.jpg)
Поговорим о том, какие возможности дает basis.js из
коробки
7
![Page 8: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/8.jpg)
План‣Компоненты ‣Источники данных ‣Локализация ‣ Трекинг событий ‣Инструменты разработки ‣Заключение
8
![Page 9: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/9.jpg)
‣Компоненты ‣Источники данных ‣Локализация ‣ Трекинг событий ‣Инструменты разработки ‣Заключение
9
![Page 10: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/10.jpg)
basis.js - это компонентный подход
10
![Page 11: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/11.jpg)
OK
имя
фамилия
отчество
Отмена
11
![Page 12: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/12.jpg)
new Node({ template: ..., binding: { firstName: ..., lastName: ..., }});
12
![Page 13: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/13.jpg)
new Node({ template: ..., binding: { firstName: ..., lastName: ... }});
13
![Page 14: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/14.jpg)
basis.js - это шаблоны без логики
14
![Page 15: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/15.jpg)
<li *ngFor="let item of items; let i = index; trackBy: trackByFn">...</li> <li template="ngFor let item of items; let i = index; trackBy: trackByFn">...</li>
if (todos.length) { main = ( <section className="main"> <input className="toggle-all" type="checkbox" onChange={this.toggleAll} checked={activeTodoCount === 0} /> <ul className="todo-list"> {todoItems} </ul> </section> );}
15
![Page 16: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/16.jpg)
Логика в JS, шаблон в XHTML
16
![Page 17: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/17.jpg)
<b:style src="./person.css"/><div class="person"> <div>Имя: {firstName}</div> <div>Фамилия: {lastName}</div> </div>
17
![Page 18: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/18.jpg)
basis.js - это изоляция стилей и модульный CSS
18
![Page 19: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/19.jpg)
<b:style src="./person.css"/><b:isolate/> <div class="person"> <div class="photo"> ... </div> <div class="info"> ... </div> </div>
<style> ... </style> <div class="i1__person"> <div class="i1__photo"> ...</div> <div class="i1__info"> ...</div> </div>
19
![Page 20: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/20.jpg)
‣Компоненты ‣Источники данных ‣Локализация ‣ Трекинг событий ‣Инструменты разработки ‣Заключение
20
![Page 21: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/21.jpg)
basis.js - это гибкое взаимодействие с источниками
данных
21
![Page 22: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/22.jpg)
Источником данных может быть объект, коллекция объектов или
другой компонент
22
![Page 23: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/23.jpg)
new Node({ template: ..., binding: { ... }, dataSource: ... });
23
![Page 24: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/24.jpg)
childNodes
Component
items
Dataset (коллекция)
‣ model ‣ model ‣ model ‣ model ‣ model ‣ model
component component component component component component
24
![Page 25: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/25.jpg)
Контролировать источник данных можно при помощи состояний
25
![Page 26: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/26.jpg)
‣ processing - в состоянии синхронизации ‣ deprecated - данные устарели ‣ ready - готов к работе ‣ error - ошибка
26
![Page 27: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/27.jpg)
Примеры использования?
![Page 28: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/28.jpg)
Показываем спиннер, пока загружаются данные
![Page 29: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/29.jpg)
Обновляем устаревшие данные
![Page 30: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/30.jpg)
basis.js - это автоматические источники данных (индексы,
фильтры, etc…)
30
![Page 31: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/31.jpg)
31
![Page 32: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/32.jpg)
Выбранные друзья
items
Доступные друзья
items
‣ model ‣ model ‣ model???
32
![Page 33: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/33.jpg)
Исключим выбранных друзей из всех друзей и получим доступных
друзей
33
![Page 34: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/34.jpg)
allFriends = new Dataset();
favoriteFriends = new Dataset();availableFriends = new Subtract({ minuend: allFriends, subtrahend: favoriteFriends});
34
![Page 35: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/35.jpg)
allFriends = new Dataset();
favoriteFriends = new Dataset();availableFriends = new Subtract({ minuend: allFriends, subtrahend: favoriteFriends});
35
![Page 36: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/36.jpg)
allFriends = new Dataset();
favoriteFriends = new Dataset();availableFriends = new Subtract({ minuend: allFriends, subtrahend: favoriteFriends});
36
![Page 37: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/37.jpg)
Почему не for?
37
![Page 38: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/38.jpg)
Придется реализовать механизм отслеживания изменений
38
![Page 39: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/39.jpg)
Такой механизм уже встроен в наборы basis.js!
39
![Page 40: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/40.jpg)
allFriends = new Dataset();
favoriteFriends = new Dataset();availableFriends = new Subtract({ minuend: allFriends, subtrahend: favoriteFriends});
40
![Page 41: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/41.jpg)
А есть еще что-то, кроме Subtract?
41
![Page 42: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/42.jpg)
42
‣ Merge - объединение коллекций ‣ Filter - фильтрация элементов коллекции ‣ Slice - срез элементов коллекции ‣ Split - деление коллекции на подмножества ‣ etc…
![Page 43: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/43.jpg)
Для агрегации элементов коллекции используются индексы
43
![Page 44: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/44.jpg)
44
‣ Min - минимальное значение коллекции ‣ Max - максимальное значение коллекции ‣ Avg - среднее значение коллекции ‣ Sum - сумма элементов в коллекции ‣ etc…
![Page 45: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/45.jpg)
Манипуляция с данными, а не с DOM DOM - всего лишь отображение
45
![Page 46: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/46.jpg)
‣Компоненты ‣Источники данных ‣Локализация ‣ Трекинг событий ‣Инструменты разработки ‣Заключение
46
![Page 47: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/47.jpg)
basis.js - это удобные инструменты локализации
47
![Page 48: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/48.jpg)
Словарь - это JSON-файл
48
![Page 49: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/49.jpg)
{ "en-US": { "hello": "Hello!" }, "ru-RU": { "hello": "Привет!" }}
49
![Page 50: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/50.jpg)
{ "en-US": { "hello": "Hello!" }, "ru-RU": { "hello": "Привет!" } }
<div> {l10n:hello}</div>
50
![Page 51: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/51.jpg)
<div> Привет!</div>
51
![Page 52: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/52.jpg)
В словарях можно использовать биндинги и разметку
52
![Page 53: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/53.jpg)
new Node({ template: ... binding: { firstName: ..., lastName: ... }});
53
![Page 54: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/54.jpg)
{ "_meta": { "type": { "hello": "markup" } }, "ru-RU": { "hello": "Привет, <b>{firstName} {lastName}</b>" }}
![Page 55: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/55.jpg)
{ "_meta": { "type": { "hello": "markup" } }, "ru-RU": { "hello": "Привет, <b>{firstName} {lastName}</b>" }}
<div> {l10n:hello}</div>
55
![Page 56: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/56.jpg)
<div> Привет, <b>Иван Петров</b> </div>
56
![Page 57: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/57.jpg)
Грамматическое число поддерживается на уровне словаря
57
![Page 58: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/58.jpg)
new Node({ template: ... binding: { total: ... }});
58
![Page 59: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/59.jpg)
{ "_meta": { "type": { "offer": "plural" } }, "ru-RU": { "offer": [ "Всего {#} объявление", "Всего {#} объявления", "Всего {#} объявлений" ] }}
59
![Page 60: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/60.jpg)
{ "_meta": { "type": { "offer": "plural" } }, "ru-RU": { "offer": [ "Всего {#} объявление", "Всего {#} объявления", "Всего {#} объявлений" ] }}
<div> {l10n:offer.{total}} </div>
60
![Page 61: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/61.jpg)
<div> Всего 10 объявлений</div>
61
![Page 62: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/62.jpg)
‣Компоненты ‣Источники данных ‣Локализация ‣ Трекинг событий ‣Инструменты разработки ‣Заключение
62
![Page 63: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/63.jpg)
basis.js - это трекинг событий
63
![Page 64: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/64.jpg)
Разметим компоненты и шаблоны ролями
64
![Page 65: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/65.jpg)
<div b:role> <div> ... </div> <button b:role="ok">OK</button> <button b:role="cancel">Отмена</button> </div>
new Node({ template: ..., role: "popup"});
65
![Page 66: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/66.jpg)
<div role-marker="popup"> <div> ... </div> <button role-marker="popup/ok">OK</button> <button role-marker="popup/cancel">Отмена</button> </div>
66
![Page 67: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/67.jpg)
Создадим tracking-map и укажем за чем необходимо следить
67
![Page 68: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/68.jpg)
{ "popup/ok": { "click": { ... } }, "popup/cancel": { "click": { ... } }}
map.json
68
![Page 69: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/69.jpg)
{ "popup/ok": { "click": [ ... ] }, "popup/cancel": { "click": [ ... ] }}
map.json
69
![Page 70: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/70.jpg)
Соединяем воедино
70
![Page 71: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/71.jpg)
tracker.loadMap(require('./map.json'));tracker.attach(function(info) { // Google Analytics ga(info.data);});
71
![Page 72: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/72.jpg)
tracker.loadMap(require('./map.json'));tracker.attach(function(info) { // Google Analytics ga(info.data);});
72
![Page 73: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/73.jpg)
tracker.loadMap(require('./map.json'));tracker.attach(function(info) { // Google Analytics ga(info.data);});
73
![Page 74: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/74.jpg)
‣Компоненты ‣Источники данных ‣Локализация ‣ Трекинг событий ‣Инструменты разработки ‣Заключение
74
![Page 75: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/75.jpg)
basis.js - это удобные инструменты разработки
75
![Page 76: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/76.jpg)
Граф зависимостей - простое приложение
76
![Page 77: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/77.jpg)
Граф зависимостей - сложное приложение
77
![Page 78: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/78.jpg)
‣ выбраны услуги ‣достаточно средств ‣достаточно прав
78
![Page 79: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/79.jpg)
Почему кнопка неактивна?
79
![Page 80: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/80.jpg)
80
![Page 82: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/82.jpg)
‣ Прошлый опыт ‣ Компоненты ‣ Источники данных ‣ Локализация ‣ Трекинг событий ‣ Инструменты разработки ‣ Заключение
82
![Page 83: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/83.jpg)
И все таки… Почему мне нужно
использовать basis.js?
83
![Page 84: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/84.jpg)
basis.js уже сейчас активно используется в production
84
![Page 85: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/85.jpg)
Попробуйте basis.js и сделайте свои выводы
85
![Page 86: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/86.jpg)
Как попробовать?
86
![Page 87: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/87.jpg)
‣ npm i -g basisjs-tools basis create app basis server
87
![Page 88: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/88.jpg)
‣ npm i -g basisjs-tools ‣ basis create app
basis server
88
![Page 89: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/89.jpg)
‣ npm i -g basisjs-tools ‣ basis create app ‣ basis server
89
![Page 90: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/90.jpg)
90
![Page 91: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/91.jpg)
Отлично! А минусы тоже есть?
91
![Page 92: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/92.jpg)
‣ Документация ‣ Есть что улучшать ‣ Сообщество (есть gitter)
92
![Page 93: Basis.js - Production Ready Framework](https://reader031.vdocuments.mx/reader031/viewer/2022030306/5870057a1a28ab427f8b5ea9/html5/thumbnails/93.jpg)
Спасибо за внимание!
93