Пишу про разработку вообще и в частности про: JavaScript, HTML5, CSS3, AngularJS, ReactJS, Agile.

Старт проекта Ionic – Angularjs

Любой проект начинается с установки всех необходимых зависимостей и программ, которые будут помогать в разработке. Клиентская разработка подразумевает под сабой работу с комнадной строкой, так что если вы еще думаете, что “черного окошка” можно избежать, то подумайте снова ^_^

Первым делом ставим nodejs и npm – процесс установки зависит от вашей операционной системы.

Активируем npm проект в категории project_name/www:

Далее заполняем все пункты по-пордяку. По-сути можно там каждый раз нажать Enter и не заморачиваться, но излишний пофигизм ведет к разжижению сознания, поэтому я предпочитаю все заполнить.

В этом проекте я буду использовать grunt для организации всех необходимых задач:

Далее начинаем ставить наших роботов:

По порядку эти программы будут выполнять следующий задачи:
1) Прероцессор less файлов – конвертирует их в css
2) jshint будет слеадить за ошибками в коде и сообщять если что
3) uglify будет компрессовать код, делая файлы меньше, в принципе для гибридных приложений это не критично, однако является хорошей прктикой для сайтостроения.
4) watch будет все это проворачивать автоматически каждый раз как файлы изменяться
5) testem поможет нам все протестировать. Для самого тестирования я буду использовать Jasmine
6) jsdoc для автоматической документации проекта
7) concat сбор всех файлов в один

Кстати, все эти модули можно поставить одним махом:

Плюс к тому для тестирования потребуется PhantomJS – Это webkit движок для процессинга JavaScript’a так что все будет проходить в командной строке, браущер не будет требоваться.

Опять так понятно, что для каждого проекта требуется своф набор инструментов, просто это настолько правильный и нужные вещи, что стоит почти все начинать с их установки.

Теперь по поводу структуры файлов. У меня есть базовый каркас, который потом усложняется и выстраивается в зависимости от пректа. Я не люблю сразу начинать с чего-то многослойного. Поэтому структура у меня получается примерно следующая:

Как вы можете обратить внимание в каждом стандартном пректе есть набор стандартных файлов, которые я использую. Поскольку я постоянно работаю с контролем версий, то каждый проект я вкладываю .gitignore – он обычно содержит следующее:

Опять-так достаточно стандартная схема. Я не копирую в репозиторий то, что будет установлено после активации npm – вся необходимая информация по пакетам находится в package.js. Однако, я все равно включаю корневые библиотеки ionic, которые находятся в папке lib. Причина в том, что проект это постоянно развивается и я хочу быть уверен, что все рабочие файлы находятся в одном месте, тем более что они не через npm ставятся, так что пусть уж лучше в репозитории хранятся.

В этом посте я не коснулся содержания файла gruntfile.js – об этом в следующий раз.

Поделиться:
comments powered by Disqus