Коктейль Skydive или как мы мы делали 2ГИС-Онлайн

Preview:

DESCRIPTION

Презентация с Codefest 2012 (31.03-01.04)Константин Лихтер (@likhter)Илья Таратухин (@darkilfa)

Citation preview

Коктейль Skydive или как мы делали

2ГИС-ОнлайнИлья Таратухин

2ГИСКонстантин Лихтер2ГИС

Что такое Skydive?

Что такое 2ГИС-Онлайн?

Что такое 2ГИС-Онлайн?

Что такое 2ГИС-Онлайн?

Что такое 2ГИС-Онлайн?

... миллионы пользователей в месяц

Что такое 2ГИС-Онлайн?

— ... миллионы пользователей в месяц ... сотни тысяч пользователей в день

Что такое 2ГИС-Онлайн?

— ... миллионы пользователей в месяц— ... сотни тысяч пользователей в день

... миллионы поисковых запросов в день

Что такое 2ГИС-Онлайн?

— ... миллионы пользователей в месяц— ... сотни тысяч пользоваталей в день— ... миллионы поисковых запросов в день

Что такое 2ГИС-Онлайн?

— ... миллионы пользователей в месяц— ... сотни тысяч пользоваталей в день— ... миллионы поисковых запросов в день

...монолитное приложение

Как выглядел 2ГИС Онлайн раньше

— монолитное приложение

...проксирование запросов к API

Как выглядел 2ГИС Онлайн раньше

— монолитное приложение— проксирование запросов к API ...рендеринг шаблонов на сервере

Как выглядел 2ГИС Онлайн раньше

— монолитное приложение— проксирование запросов к API— рендеринг шаблонов на сервере

...никакой масштабируемости

Как выглядел 2ГИС Онлайн раньше

— монолитное приложение— проксирование запросов к API— рендеринг шаблонов на сервере— никакой масштабируемости

Как выглядел 2ГИС Онлайн раньше

Что такое 2ГИС-Онлайн?

client-side

Что такое 2ГИС-Онлайн?

— client-side

3 API

Что такое 2ГИС-Онлайн?

— client-side— 3 API

видимый результат на лету

Что такое 2ГИС-Онлайн?

— client-side— 3 API— видимый результат на лету площадка для исследований API 2ГИС

Что такое 2ГИС-Онлайн?

— client-side— 3 API— видимый результат на лету— площадка для исследований API 2ГИС

low end server

Что такое 2ГИС-Онлайн?

— client-side— 3 API— видимый результат на лету— площадка для исследований API 2ГИС— low end server

горизонтальное масштабирование

Как выглядит 2ГИС Онлайн сегодня

Ингридиенты: слой данных

API 2ГИС

Слой пробок

Ингридиенты: front-end

API карт

Ингридиенты: front-end

API карт

150+ городов России

Ингридиенты: front-end

API карт

— 150+ городов России

тысячи маркеров на карте

Ингридиенты: front-end

API карт

— 150+ городов России— тысячи маркеров на карте

простой и понятный интерфейс

Ингридиенты: front-end

API карт

— 150+ городов России— тысячи маркеров на карте— простой и понятный интерфейс

инициализация карты в три строчки

Ингридиенты: front-end

API карт

— 150+ городов России— тысячи маркеров на карте— простой и понятный интерфейс— инициализация карты в три строчки

модульная система

Ингридиенты: front-end

API карт

knockout.js

Ингридиенты: front-end: knockout.js

MVVM

Ингридиенты: front-end: knockout.js— MVVM

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

данных

Ингридиенты: front-end: knockout.js— MVVM— автоматическое обновление представления при обновлении данных— декларативные биндинги: <div id=”firmsList”

data-bind=”visible: firmsLoaded,foreach: {

data: loadedFirms,template: ‘firmCard’

}”>

</div>

Ингридиенты: front-end: knockout.js— MVVM— автоматическое обновление представления при обновлении данных— декларативные биндинги— разделение представления и логики:

Ингридиенты: front-end: knockout.js— MVVM— автоматическое обновление представления при обновлении данных— декларативные биндинги— разделение представления и логики поддержка jQuery шаблонов

Ингридиенты: front-end: knockout.js— MVVM— автоматическое обновление представления при обновлении данных— декларативные биндинги— разделение представления и логики— поддержка jQuery шаблонов низкий уровень вхождения

Ингридиенты: front-end: knockout.js— MVVM— автоматическое обновление представления при обновлении данных— декларативные биндинги— разделение представления и логики— поддержка jQuery шаблонов— низкий уровень вхождения активное интернет-сообщество

Ингридиенты: back-end

nginx

memcached

Инструменты

phing

— YUI Compressor— Google CС

Yii

Инструменты

phing

— YUI Compressor— Google CС

— CSS: в 2 раза— JS: в 1.5 раза

Инструменты

phing

- YUI Compressor- Google Closure Compiler

Yii

Инструменты: локализация gettext

великое множество инструментов для работы с .po

Инструменты: локализация gettext

— великое множество инструментов для работы с .po нативная реализация для PHP

Инструменты: локализация gettext

— великое множество инструментов для работы с .po— нативная реализация для PHP собственная реализация для JS

Процесс разработки: git flow

master

develop

Tag 1.0Tag 1.1

Tag 2.0

Процесс разработки: git flow

master

develop

Tag 1.0Tag 1.1

Tag 2.0

feature*

Процесс разработки: git flow

master

develop

Tag 1.0Tag 1.1

Tag 2.0

release*

Процесс разработки: git flow

master

develop

Tag 1.0Tag 2.0

hotfix*

Команда разработки

Планы

поиск проезда общественного транспорта

Планы

— поиск проезда общественного транспорта

переход к глобальной карте

Планы

— поиск проезда общественного транспорта— переход к глобальной карте

совершенствование и совершествование поиска :)

Заключение

— client-side приложения — да!— экспериментируйте!— вы знаете, где взять свежие данные. — ходить на — круто! :)

Вопросы?

Константин Лихтерk.likhter@2gis.ru

Илья Таратухинi.taratuhin@2gis.ru

Изображения алкогольной продукции и прочих штук — www.inshaker.ru

Recommended