Преимуществаразработки средствамиBEM + Python + node.jsАлексей СпиридоновЕвгений Генералов
Процесс разработкиОбщее время разработки
Процесс разработки (реальный)Общее время разработки
Мы решили все поменять● Технологии развивались● Сроки затягивались● Простои учащались● Масштабируемость отсутствовала
Постановкаи анализДизайнВерсткаПрограммированиеТестированиеНовый процесс разработкиОбщее время разработкиОбщее время разра...
Что мы получили● Снижение количества коллизий● Сокращение сроков разработки● Уменьшение времени простоев● Масштабируемость...
А как это все реализовать?И причем тут bem, node.js и python
Презентационная логика в Djangomytardis.readthedocs.org/en/latest/architecture.htmlДля верстки «по живымданным» необходима...
— Общая логика обработки запросаMiddleware— Представление ресурсовURL Mapper, View— Предметная областьModel, Business Logi...
БЭМ — верстка, которую легкоподдерживать и развивать● Методология http://ru.bem.info/● Node.JS https://github.com/joyent/n...
БЭМ— Единая предметная область:Блок, Элемент, Модификатор— Библиотеки bem-bl, bem-controls, ...— Шаблонизатор на JavaScrip...
Интерфейс стека технологий БЭМБЭМbemjsonHTMLCSSJSImages
Django как сервис JSON APIdef view(request):data = json.dumps({title, Hello, Dump!})return HttpResponse(data,content_type=...
bem-express — интеграция с BEMдля node.jsvar express = require(express), app = express();app.configure(function(){app.engi...
Просто PyV8bemjson = json.dumps({block: b-page, content: Hello, DUMP!,})bemhtml = readfile(./desktop.bundles/index/_index....
priv.js — преобразование данныхиз формата приложения в bemjsonБЭМApplicationDataHTMLCSSJSImages"priv.js"bemjson
python-bem# settings.pyBEM_ROOT = /path/www/# views.pyfrom pybem.shortcuts import renderdef view(request):data = {title: H...
PyV8python-bem — удобная поддержкаDjangobemhtml.jsView"priv.js"BEMJSONRequestContextHTML
Что из это вышло● Параллельность и асинхронность● Сроки● Качество● Масштабируемость
Алексей Спиридонов spiridon@jetstyle.ruЕвгений Генералов lucky@jetstyle.ruJetStyle http://jetstyle.ruhttp://github.com/jet...
Upcoming SlideShare
Loading in …5
×

DUMP-2013 Frontend - Преимущества разработки средствами BEM + Python + node.js - Генералов Евгений, Спиридонов Алексей

1,988 views

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,988
On SlideShare
0
From Embeds
0
Number of Embeds
1,115
Actions
Shares
0
Downloads
6
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

DUMP-2013 Frontend - Преимущества разработки средствами BEM + Python + node.js - Генералов Евгений, Спиридонов Алексей

  1. 1. Преимуществаразработки средствамиBEM + Python + node.jsАлексей СпиридоновЕвгений Генералов
  2. 2. Процесс разработкиОбщее время разработки
  3. 3. Процесс разработки (реальный)Общее время разработки
  4. 4. Мы решили все поменять● Технологии развивались● Сроки затягивались● Простои учащались● Масштабируемость отсутствовала
  5. 5. Постановкаи анализДизайнВерсткаПрограммированиеТестированиеНовый процесс разработкиОбщее время разработкиОбщее время разработки
  6. 6. Что мы получили● Снижение количества коллизий● Сокращение сроков разработки● Уменьшение времени простоев● Масштабируемость● Увеличение точности оценок
  7. 7. А как это все реализовать?И причем тут bem, node.js и python
  8. 8. Презентационная логика в Djangomytardis.readthedocs.org/en/latest/architecture.htmlДля верстки «по живымданным» необходимаработоспособностьвсего стекакомпонентов Django
  9. 9. — Общая логика обработки запросаMiddleware— Представление ресурсовURL Mapper, View— Предметная областьModel, Business Logic— Готовые решения Auth, Migrations,Logger, Cache, Geodata, …Специализация Django
  10. 10. БЭМ — верстка, которую легкоподдерживать и развивать● Методология http://ru.bem.info/● Node.JS https://github.com/joyent/node/wiki/Installing-Node.js-via-package-manager● БЭМ https://github.com/bem/project-stub
  11. 11. БЭМ— Единая предметная область:Блок, Элемент, Модификатор— Библиотеки bem-bl, bem-controls, ...— Шаблонизатор на JavaScript bemhtml— Сервер для разработки bem server— Сборщик ресурсов borschik— Менеджер зависимостей bem make— Возможности для кастомизации node.js
  12. 12. Интерфейс стека технологий БЭМБЭМbemjsonHTMLCSSJSImages
  13. 13. Django как сервис JSON APIdef view(request):data = json.dumps({title, Hello, Dump!})return HttpResponse(data,content_type=application/json)Backend(django)Frontend(node.js)JSON APIFrontend(node.js)Frontend(node.js)
  14. 14. bem-express — интеграция с BEMдля node.jsvar express = require(express), app = express();app.configure(function(){app.engine(.bemhtml.js, require(bem-express).__express);app.set(view engine, bemhtml.js);...app.get(/, function(req, res) {httpclient.get(http://django-server.local/index/).then(function(data) {res.render(index, {data: JSON.parse(data)}
  15. 15. Просто PyV8bemjson = json.dumps({block: b-page, content: Hello, DUMP!,})bemhtml = readfile(./desktop.bundles/index/_index.bemhtml.js)with PyV8.JSContext() as jsctx:jsctx.eval(bemhtml)jsctx.locals.bemjson = bemjsonhtml = jsctx.eval(BEMHTML.apply(JSON.parse(bemjson)))HTMLbemjsonbemhtml
  16. 16. priv.js — преобразование данныхиз формата приложения в bemjsonБЭМApplicationDataHTMLCSSJSImages"priv.js"bemjson
  17. 17. python-bem# settings.pyBEM_ROOT = /path/www/# views.pyfrom pybem.shortcuts import renderdef view(request):data = {title: Hello, DUMP!}return render(request, index, data)
  18. 18. PyV8python-bem — удобная поддержкаDjangobemhtml.jsView"priv.js"BEMJSONRequestContextHTML
  19. 19. Что из это вышло● Параллельность и асинхронность● Сроки● Качество● Масштабируемость
  20. 20. Алексей Спиридонов spiridon@jetstyle.ruЕвгений Генералов lucky@jetstyle.ruJetStyle http://jetstyle.ruhttp://github.com/jetstyle/ppa:jetstyle/pyv8Вопросы...— Кто делает так же?— Как сделать ещё лучше?— Как вы боретесь со сложностью?

×