How it goes, brah

Окончание предыдущей недели, да и вообще, последнее время я провожу занимаясь несколькими основными направлениями:

  • изучение HTML, CSS и вообще вёрстки;
  • JS;
  • работа над техническим заданием и прототипами проекта специального портала (веб-приложение), входящего в состав крупного программно-аппаратного комплекса.

Стоит рассмотреть каждое из этих направлений подробнее :)

Так верстают только …

Изучение вёрстки я решил начать с детального ознакомления с HMTL и CSS на сайте HTML Academy.

Урок курса “Знакомство с таблицами” сайта htmlacademy.ru

Бесплатная версия сайта предлагает ряд достаточно объёмных и детальных коротких курсов по определённым разделам такого понятия как вёрстка. Радует то что обучают не просто общим и теоретическим знаниям, а упоминают особенности, тонкости, и необходимость применения того или иного подхода в реальных проектах.

Сейчас я изучил более половины базовых курсов. На самом деле, изучение вёрстки отнимает много времени: много тегов, много особенностей и тонкостей.

В планах: добив все курсы на htmlacademy.ru, попытаться сверстать несколько макетов, и применить полученные знания для улучшения html-шаблонов демо-приложения SpiderSight. В случае, если полученных на хтмлкадеми знаний будет недостаточно, можно будет воспользоваться teamtreehouse.com, и их триальными 17ью днями.

Из касающегося вёрстки — необходимо изучить препроцессоры (SASS), и использовать их в демо-проекте. Мой добрый сенсей скинул сегодня ссылку на такой курс, думаю что с него и начну изучение препроцессоров.

Работа не волк

В качестве текущий задачи, передо мной сейчас стоит задача по проектированию веб-приложения. О специфике, и о особенностях самого приложения не следует упоминать — достаточно просто рассказать о том как я делаю это :)

Я уже писал о разработке технического задания, и о описанных в техническом задании моделях и коллекциях. Они не пригодились, и описания страниц, которое я предоставил, было недостаточно. Само ТЗ тоже оказалось не очень необходимым. Вероятно, при непосредственной разработке, программист будет уточнять какие-то моменты в ТЗ, но на данный момент, оно, к сожалению, не имеет большой ценности.

В итоге, после небольших правок технического задания, мне было поручено приступить к прототипированию приложения (разработке макетов). Прежде всего, нужно было зайти к начальнику отдела web-разработки, и перенять определённый опыт прототипирования :)

Этот опыт представлял из себя ссылку на приложение для создания макетов, а также сохранённый проект макета приложения, разрабатываемого ранее. Данным приложением был Pencil ( http://pencil.evolus.vn/ ). Сохранённый проект был детальнейшим и однозначным описанием десктопного приложения, отображающий все модальные окна, все варианты развития событий. Я решил что для проектируемого мной приложения (веб-приложения) не следует добиваться такой детализации, и что Pencil не очень сильно заточен под mockup’ы сайтов. Поэтому я обратился к google-гуру, нашёл ряд сайтов для прототипирования, и среди них выбрал бесплатный http://ninjamock.com/ .

Интерфейс, и предлагаемый инструментарий были достаточными для того чтобы создать нужные мне прототипы, и я потратив несколько часов справился с первой сырой версией большинства страниц приложения.

Пример страницы “Редактирование профиля” проектируемого приложения.

Хочется отметить, что имея в голове и на бумаге модели и коллекции, а также функционал, данная задача не была сложной, а скорее, была логическим продолжением написания технического задания. Какие-то вещи, всплывающие в процессе создания прототипов, сразу находили отражение в ТЗ.

После создания прототипов, было организовано небольшое совещание, в состав которого входил мой начальник, который имеет определённое видение и опыт разработки подобных приложений, и разработчик, который будет заниматься созданием приложения, и также обладает определённым опытом.

Таких совещаний на данный момент было уже два, и если на первом были внесены небольшие изменения, то второе внесло окончательную ясность и завершенность в процесс проектирования:

  • Существующие макеты — готовы, их можно передавать разработчику.
  • Необходимо описать все неоднозначные и сложные бизнес процессы в виде блок-схем (алгоритмов), для исключения неясностей в процессе разработки.
  • Имеющейся на данный момент информации недостаточно для полноценного и завершенного вида продукта, который получится “на выходе” — необходим полноценный дизайн (вероятно, если бы макеты создавались не мной, а сразу создавались дизайнером, совмещающим в себе и дизайнера интерфейсов, и графического дизайнера, данный пункт был-бы не актуальным). Помимо дизайна, т.к. приложение является частью большого комплекса, будут созданы определённые общие шины и API, появление и использование которых следует учесть при разработке.

На данный момент мне требуется описать не очевидные бизнес-процессы, некоторые — совместно с разработчиком, и учесть то что разрабатываемый портал — часть комплекса. На этом проектирование этого, на самом деле, простого веб-приложения будет закончено.

Хочу вернуться к тебе, о Джава, о Скрипт

На самом деле, занимаясь вёрсткой и разметкой, чувствуется насколько интересен процесс программирования :) Насколько интересно решать сложные, неизведанные задачи. Хочется скорее вернуться к разработке приложения, чтению книг по JS, но отсутствие знаний “языков разметки и стилей” слишком критично, на данный момент, так что придётся потерпеть.

Прочитал интересную статью, которая оказалась отчасти интересной, из-за того что был кое-с-чем знаком, из-за использования backbone. Решил небольшую, крошечную задачку в рамках данной статьи — понял, что нужно ежедневное решение, пусть даже самых малых задач :)

Код, который приводился в статье, был выложен на codepen, задача решалась там-же.

Также, есть необходимость в изучении повсеместно используемых bower, и gulp. Вот такой видео-курс скинул сегодня сенсей. Нужно будет потратить какой-нибудь из выходных дней на просмотр.

Кстати, заинтересовал также этот канал — много туториалов, по различным технологиям.

Наверное, на этом всё. Вернусь, как накоплю новую информацию, которую уже нельзя будет не написать :)