Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
SlideShare a Scribd company logo
Как сэкономить время при
разработке мобильных
приложений
Intersog	
  
Mobile	
  Monday	
  
June,	
  25th-­‐2015	
  
Introduction
Oleg Timoshenko
Team Lead, Front End
Опыт в разработке – 6 лет
Технологии:
PHP: Zend, Phalcon,
CodeIgniter, Laravel
JS: Angular, BackBone, Chaplin,
PhoneGap
Дополнительно:
Java
Andrey Radilov
Team Lead, Back End
Опыт в разработке – 10 лет
Технологии:
PHP: Zend, Phalcon,
CodeIgniter, Laravel, Yii, Kohana
JS: Angular, BackBone, Chaplin
Дополнительно:
C++
2	
  
ПЛАН
Life - is a wonderful adventure,
worthy to suffer for the sake of
successes and failures.
“
R. Odilgton•  Рабочий процесс и эстимация проекта
•  Стандартизация взаимодействия BE и FE
•  Автогенерация документации
•  Актуальность документации API как фактор
оптимизации работы
•  Автоматизация сборки мобильных приложений
•  Примеры кейсов клиентских решений
“
3	
  
Проблематика
1.  Большинство	
  проектов	
  имеют	
  
схожую	
  архитектуру	
  и	
  часто	
  
приходится	
  делать	
  однотипные	
  
вещи.	
  	
  
2.  Поддержка	
  таких	
  проектов	
  очень	
  
затруднительное	
  дело.	
  	
  
3.  Отсутствие	
  макетов	
  на	
  
начальном	
  этапе	
  разработки	
  
приложения.	
  Задержки	
  их	
  со	
  
стороны	
  клиента.	
  
4.  Непонимание	
  команды	
  всей	
  
бизнес	
  логики	
  проекта	
  
4	
  
	
  
Часто	
  команда	
  даже	
  не	
  читает	
  
спецификацию	
  по	
  проекту,	
  а	
  
просто	
  начинает	
  выполнять	
  
задачи	
  по	
  спринту	
  в	
  JIRA-­‐e.	
  	
  
	
  
Такой	
  подход	
  обязательно	
  
будет	
  приводить	
  к	
  ситуациям:	
  
«А	
  я	
  себе	
  это	
  по	
  другому	
  видел"	
  	
  
«Ну	
  сейчас	
  быстренько	
  переделаю".	
  	
  
Хороший программист
никогда не выполнит лишнюю
работу, поэтому основа
успеха проекта – это его
структурированность с
самого начала разработки
ESTIMATION	
  
AND	
  
WORKFLOW	
  
5	
  
Проектирование и прототипирование
1.  ER	
  диаграмма	
  базы	
  данных	
  	
  
2.  Диграмма	
  последовательности,	
  	
  workflow	
  
диаграмма	
  	
  
3.  Диаграмма	
  потоков	
  данных,	
  DFD,	
  Data	
  
flow	
  Diagramm	
  	
  
4.  Спецификация	
  по	
  протоколу	
  
взаимодействия	
  приложения	
  с	
  сервером.	
  	
  
6	
  
Бэкенд
7	
  
1.  HMVC	
  
2.  Один	
  контроллер	
  на	
  одну	
  модель	
  
3.	
  Ограничение	
  доступа	
  через	
  ACL	
  
4.	
  Поддержка	
  связанных	
  объектов,	
  
фильтрация	
  	
  по	
  свойствам	
  модели	
  на	
  уровне	
  
логической	
  операции	
  AND	
  
5.	
  Генерация	
  документации	
  
ДОКУМЕНТАЦИЯ	
  API	
  
VideoMedicine
8	
  
Javascript
Javascript один из наиболее
гибких языков
программирования и он
позволяет сделать одну и ту же
вещь многими способами, как
ни один другой язык.
9	
  
var	
  array	
  =	
  [	
  ...	
  ];	
  
//способ	
  1	
  
var	
  shuffle	
  =	
  func‘on(array)	
  {	
  ...	
  }	
  
	
  
//способ	
  2	
  
func‘on	
  shuffle(array)	
  {	
  ...	
  }	
  
	
  
//способ	
  3	
  
func‘on	
  shuffle()	
  {	
  ...	
  }	
  
shuffle.call(array);	
  
	
  
//способ	
  4	
  
Array.prototype.shuffle	
  =	
  func‘on()	
  {	
  ...	
  }	
  
Balance	
  
	
  
Одним	
  из	
  важнейших	
  
признаков	
  хорошего	
  кода	
  
является	
  его	
  понятность.	
  
Понятность	
  же	
  –	
  это	
  понятие	
  
сугубо	
  человеческое.	
  
Компилятору	
  все	
  равно	
  как	
  
что	
  называется,	
  он	
  не	
  вникает	
  
в	
  суть;	
  только	
  человек	
  читает	
  
код.	
  Только	
  человек	
  может	
  из	
  
названия	
  метода	
  представить	
  
себе,	
  что	
  именно	
  метод	
  
делает.	
  
Javascript
10	
  
Tools
Grunt
Automa‘on,	
  performing	
  repe‘‘ve	
  tasks	
  like	
  
minifica‘on,	
  compila‘on.	
  
Build	
  system	
  automa‘ng	
  tasks:	
  minifica‘on	
  and	
  copying	
  
of	
  all	
  JS	
  files,	
  sta‘c	
  images,	
  capable	
  of	
  watching	
  files	
  	
  
Gulp
11	
  
Result
90	
  
30	
  
0	
  
10	
  
20	
  
30	
  
40	
  
50	
  
60	
  
70	
  
80	
  
90	
  
100	
  
Запросы
Исходный	
   Итоговый	
  
4	
  
1,5	
  
0	
  
0,5	
  
1	
  
1,5	
  
2	
  
2,5	
  
3	
  
3,5	
  
4	
  
4,5	
  
Загрузка
Исходный	
   Итоговый	
  
Сэкономлено 5 МБ траффика
12	
  
PhoneGap
Phonegap	
  (cordova)	
  позволяет	
  
существенно	
  экономить	
  время.	
  А	
  
именно,	
  пропадает	
  необходимость	
  
делать	
  это	
  все	
  вручную,	
  а	
  ведь	
  для	
  
phonegap	
  приложений	
  минификация	
  и	
  
оптимизация	
  кода	
  и	
  картинок	
  
необходима.	
  	
  
Без	
  нее	
  вы	
  получите	
  приложение	
  
весом	
  over	
  100500	
  мб	
  которое	
  будет	
  
на	
  более	
  старых	
  девайсах	
  задыхаться	
  
уже	
  на	
  запуске	
  с	
  огромным	
  
количеством	
  ненужной	
  подгрузки.	
  	
  
13	
  
Автоматическая сборка билдов
Что	
  происходило	
  на	
  самом	
  деле?	
  	
  
Мы	
  комитим	
  данные,	
  система	
  их	
  видит,	
  подтягивает	
  изменения	
  и	
  тут	
  же	
  запускает	
  сборщик,	
  будь	
  
то	
  gulp	
  или	
  grunt.	
  После	
  того	
  как	
  они	
  отработали,	
  мы	
  запускали	
  сборку	
  билдов	
  под	
  нужные	
  
платформы.	
  	
  
Возможно	
  получить	
  
автоматизированную	
  систему,	
  
которая	
  слушала	
  коммиты.	
  От	
  нас	
  
требовалось	
  внимание	
  только	
  в	
  
моменты	
  когда	
  билд	
  не	
  собирался	
  и	
  
была	
  ошибка.	
  	
  
14	
  
THANK YOU !

More Related Content

Mobile Monday Kiev#1 - How to save time in Mobile Apps Development

  • 1. Как сэкономить время при разработке мобильных приложений Intersog   Mobile  Monday   June,  25th-­‐2015  
  • 2. Introduction Oleg Timoshenko Team Lead, Front End Опыт в разработке – 6 лет Технологии: PHP: Zend, Phalcon, CodeIgniter, Laravel JS: Angular, BackBone, Chaplin, PhoneGap Дополнительно: Java Andrey Radilov Team Lead, Back End Опыт в разработке – 10 лет Технологии: PHP: Zend, Phalcon, CodeIgniter, Laravel, Yii, Kohana JS: Angular, BackBone, Chaplin Дополнительно: C++ 2  
  • 3. ПЛАН Life - is a wonderful adventure, worthy to suffer for the sake of successes and failures. “ R. Odilgton•  Рабочий процесс и эстимация проекта •  Стандартизация взаимодействия BE и FE •  Автогенерация документации •  Актуальность документации API как фактор оптимизации работы •  Автоматизация сборки мобильных приложений •  Примеры кейсов клиентских решений “ 3  
  • 4. Проблематика 1.  Большинство  проектов  имеют   схожую  архитектуру  и  часто   приходится  делать  однотипные   вещи.     2.  Поддержка  таких  проектов  очень   затруднительное  дело.     3.  Отсутствие  макетов  на   начальном  этапе  разработки   приложения.  Задержки  их  со   стороны  клиента.   4.  Непонимание  команды  всей   бизнес  логики  проекта   4     Часто  команда  даже  не  читает   спецификацию  по  проекту,  а   просто  начинает  выполнять   задачи  по  спринту  в  JIRA-­‐e.       Такой  подход  обязательно   будет  приводить  к  ситуациям:   «А  я  себе  это  по  другому  видел"     «Ну  сейчас  быстренько  переделаю".    
  • 5. Хороший программист никогда не выполнит лишнюю работу, поэтому основа успеха проекта – это его структурированность с самого начала разработки ESTIMATION   AND   WORKFLOW   5  
  • 6. Проектирование и прототипирование 1.  ER  диаграмма  базы  данных     2.  Диграмма  последовательности,    workflow   диаграмма     3.  Диаграмма  потоков  данных,  DFD,  Data   flow  Diagramm     4.  Спецификация  по  протоколу   взаимодействия  приложения  с  сервером.     6  
  • 7. Бэкенд 7   1.  HMVC   2.  Один  контроллер  на  одну  модель   3.  Ограничение  доступа  через  ACL   4.  Поддержка  связанных  объектов,   фильтрация    по  свойствам  модели  на  уровне   логической  операции  AND   5.  Генерация  документации  
  • 10. Javascript Javascript один из наиболее гибких языков программирования и он позволяет сделать одну и ту же вещь многими способами, как ни один другой язык. 9   var  array  =  [  ...  ];   //способ  1   var  shuffle  =  func‘on(array)  {  ...  }     //способ  2   func‘on  shuffle(array)  {  ...  }     //способ  3   func‘on  shuffle()  {  ...  }   shuffle.call(array);     //способ  4   Array.prototype.shuffle  =  func‘on()  {  ...  }  
  • 11. Balance     Одним  из  важнейших   признаков  хорошего  кода   является  его  понятность.   Понятность  же  –  это  понятие   сугубо  человеческое.   Компилятору  все  равно  как   что  называется,  он  не  вникает   в  суть;  только  человек  читает   код.  Только  человек  может  из   названия  метода  представить   себе,  что  именно  метод   делает.   Javascript 10  
  • 12. Tools Grunt Automa‘on,  performing  repe‘‘ve  tasks  like   minifica‘on,  compila‘on.   Build  system  automa‘ng  tasks:  minifica‘on  and  copying   of  all  JS  files,  sta‘c  images,  capable  of  watching  files     Gulp 11  
  • 13. Result 90   30   0   10   20   30   40   50   60   70   80   90   100   Запросы Исходный   Итоговый   4   1,5   0   0,5   1   1,5   2   2,5   3   3,5   4   4,5   Загрузка Исходный   Итоговый   Сэкономлено 5 МБ траффика 12  
  • 14. PhoneGap Phonegap  (cordova)  позволяет   существенно  экономить  время.  А   именно,  пропадает  необходимость   делать  это  все  вручную,  а  ведь  для   phonegap  приложений  минификация  и   оптимизация  кода  и  картинок   необходима.     Без  нее  вы  получите  приложение   весом  over  100500  мб  которое  будет   на  более  старых  девайсах  задыхаться   уже  на  запуске  с  огромным   количеством  ненужной  подгрузки.     13  
  • 15. Автоматическая сборка билдов Что  происходило  на  самом  деле?     Мы  комитим  данные,  система  их  видит,  подтягивает  изменения  и  тут  же  запускает  сборщик,  будь   то  gulp  или  grunt.  После  того  как  они  отработали,  мы  запускали  сборку  билдов  под  нужные   платформы.     Возможно  получить   автоматизированную  систему,   которая  слушала  коммиты.  От  нас   требовалось  внимание  только  в   моменты  когда  билд  не  собирался  и   была  ошибка.     14