CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или...
description
Transcript of CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или...
![Page 1: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/1.jpg)
Коктейль Skydive или как мы делали
2ГИС-ОнлайнИлья Таратухин
2ГИСКонстантин Лихтер2ГИС
![Page 2: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/2.jpg)
Что такое Skydive?
![Page 3: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/3.jpg)
Что такое 2ГИС-Онлайн?
![Page 4: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/4.jpg)
Что такое 2ГИС-Онлайн?
![Page 5: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/5.jpg)
Что такое 2ГИС-Онлайн?
![Page 6: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/6.jpg)
Что такое 2ГИС-Онлайн?
... миллионы пользователей в месяц
![Page 7: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/7.jpg)
Что такое 2ГИС-Онлайн?
— ... миллионы пользователей в месяц ... сотни тысяч пользователей в день
![Page 8: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/8.jpg)
Что такое 2ГИС-Онлайн?
— ... миллионы пользователей в месяц— ... сотни тысяч пользователей в день
... миллионы поисковых запросов в день
![Page 9: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/9.jpg)
Что такое 2ГИС-Онлайн?
— ... миллионы пользователей в месяц— ... сотни тысяч пользоваталей в день— ... миллионы поисковых запросов в день
![Page 10: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/10.jpg)
Что такое 2ГИС-Онлайн?
— ... миллионы пользователей в месяц— ... сотни тысяч пользоваталей в день— ... миллионы поисковых запросов в день
![Page 11: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/11.jpg)
...монолитное приложение
Как выглядел 2ГИС Онлайн раньше
![Page 12: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/12.jpg)
— монолитное приложение
...проксирование запросов к API
Как выглядел 2ГИС Онлайн раньше
![Page 13: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/13.jpg)
— монолитное приложение— проксирование запросов к API ...рендеринг шаблонов на сервере
Как выглядел 2ГИС Онлайн раньше
![Page 14: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/14.jpg)
— монолитное приложение— проксирование запросов к API— рендеринг шаблонов на сервере
...никакой масштабируемости
Как выглядел 2ГИС Онлайн раньше
![Page 15: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/15.jpg)
— монолитное приложение— проксирование запросов к API— рендеринг шаблонов на сервере— никакой масштабируемости
Как выглядел 2ГИС Онлайн раньше
![Page 16: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/16.jpg)
Что такое 2ГИС-Онлайн?
client-side
![Page 17: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/17.jpg)
Что такое 2ГИС-Онлайн?
— client-side
3 API
![Page 18: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/18.jpg)
Что такое 2ГИС-Онлайн?
— client-side— 3 API
видимый результат на лету
![Page 19: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/19.jpg)
Что такое 2ГИС-Онлайн?
— client-side— 3 API— видимый результат на лету площадка для исследований API 2ГИС
![Page 20: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/20.jpg)
Что такое 2ГИС-Онлайн?
— client-side— 3 API— видимый результат на лету— площадка для исследований API 2ГИС
low end server
![Page 21: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/21.jpg)
Что такое 2ГИС-Онлайн?
— client-side— 3 API— видимый результат на лету— площадка для исследований API 2ГИС— low end server
горизонтальное масштабирование
![Page 22: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/22.jpg)
Как выглядит 2ГИС Онлайн сегодня
![Page 23: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/23.jpg)
Ингридиенты: слой данных
API 2ГИС
Слой пробок
![Page 24: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/24.jpg)
Ингридиенты: front-end
API карт
![Page 25: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/25.jpg)
Ингридиенты: front-end
API карт
150+ городов России
![Page 26: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/26.jpg)
Ингридиенты: front-end
API карт
— 150+ городов России
тысячи маркеров на карте
![Page 27: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/27.jpg)
Ингридиенты: front-end
API карт
— 150+ городов России— тысячи маркеров на карте
простой и понятный интерфейс
![Page 28: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/28.jpg)
Ингридиенты: front-end
API карт
— 150+ городов России— тысячи маркеров на карте— простой и понятный интерфейс
инициализация карты в три строчки
![Page 29: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/29.jpg)
Ингридиенты: front-end
API карт
— 150+ городов России— тысячи маркеров на карте— простой и понятный интерфейс— инициализация карты в три строчки
модульная система
![Page 30: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/30.jpg)
Ингридиенты: front-end
API карт
knockout.js
![Page 31: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/31.jpg)
Ингридиенты: front-end: knockout.js
MVVM
![Page 32: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/32.jpg)
Ингридиенты: front-end: knockout.js— MVVM
автоматическое обновление представления при обновлении
данных
![Page 33: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/33.jpg)
Ингридиенты: front-end: knockout.js— MVVM— автоматическое обновление представления при обновлении данных— декларативные биндинги: <div id=”firmsList”
data-bind=”visible: firmsLoaded,foreach: {
data: loadedFirms,template: ‘firmCard’
}”>
</div>
![Page 34: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/34.jpg)
Ингридиенты: front-end: knockout.js— MVVM— автоматическое обновление представления при обновлении данных— декларативные биндинги— разделение представления и логики:
![Page 35: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/35.jpg)
Ингридиенты: front-end: knockout.js— MVVM— автоматическое обновление представления при обновлении данных— декларативные биндинги— разделение представления и логики поддержка jQuery шаблонов
![Page 36: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/36.jpg)
Ингридиенты: front-end: knockout.js— MVVM— автоматическое обновление представления при обновлении данных— декларативные биндинги— разделение представления и логики— поддержка jQuery шаблонов низкий уровень вхождения
![Page 37: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/37.jpg)
Ингридиенты: front-end: knockout.js— MVVM— автоматическое обновление представления при обновлении данных— декларативные биндинги— разделение представления и логики— поддержка jQuery шаблонов— низкий уровень вхождения активное интернет-сообщество
![Page 38: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/38.jpg)
Ингридиенты: back-end
nginx
memcached
![Page 39: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/39.jpg)
Инструменты
phing
— YUI Compressor— Google CС
Yii
![Page 40: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/40.jpg)
Инструменты
phing
— YUI Compressor— Google CС
— CSS: в 2 раза— JS: в 1.5 раза
![Page 41: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/41.jpg)
Инструменты
phing
- YUI Compressor- Google Closure Compiler
Yii
![Page 42: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/42.jpg)
Инструменты: локализация gettext
великое множество инструментов для работы с .po
![Page 43: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/43.jpg)
Инструменты: локализация gettext
— великое множество инструментов для работы с .po нативная реализация для PHP
![Page 44: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/44.jpg)
Инструменты: локализация gettext
— великое множество инструментов для работы с .po— нативная реализация для PHP собственная реализация для JS
![Page 45: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/45.jpg)
Процесс разработки: git flow
master
develop
Tag 1.0Tag 1.1
Tag 2.0
![Page 46: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/46.jpg)
Процесс разработки: git flow
master
develop
Tag 1.0Tag 1.1
Tag 2.0
feature*
![Page 47: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/47.jpg)
Процесс разработки: git flow
master
develop
Tag 1.0Tag 1.1
Tag 2.0
release*
![Page 48: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/48.jpg)
Процесс разработки: git flow
master
develop
Tag 1.0Tag 2.0
hotfix*
![Page 49: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/49.jpg)
Команда разработки
![Page 50: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/50.jpg)
Планы
поиск проезда общественного транспорта
![Page 51: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/51.jpg)
Планы
— поиск проезда общественного транспорта
переход к глобальной карте
![Page 52: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/52.jpg)
Планы
— поиск проезда общественного транспорта— переход к глобальной карте
совершенствование и совершествование поиска :)
![Page 53: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/53.jpg)
Заключение
— client-side приложения — да!— экспериментируйте!— вы знаете, где взять свежие данные. — ходить на — круто! :)
![Page 54: CodeFest 2012. Лихтер К, Таратухин И. — Коктейль «Skydive» или как мы делали 2ГИС-Онлайн](https://reader034.fdocuments.net/reader034/viewer/2022042813/5478ea12b4af9fb9158b46fa/html5/thumbnails/54.jpg)
Вопросы?
Константин Лихтер[email protected]
Илья Таратухин[email protected]
Изображения алкогольной продукции и прочих штук — www.inshaker.ru