agilizt

• Читал много (3-4 книги одновременно по выбранной главе)
• Нагрузка была на работе, дома, приболел
• Внутреннее ощущение возникло, о понимании концепта в целом (модели)
• Нету хорошей практики (в основном идеалистическое понимание фич языка)
• Пауза в 1-2 дня

• Забить на JavaScript (хотя целевой фокус никуда не уходил, и общая мотивация есть)
• Желание заняться чем-то другим (почитать материал про другие вещи, технологии)
• Желание позаниматься другим не может быть подменяно на почитать следующую главу (что-то всё таки координально другое хочется)

• Самоуверенность по изученному/недоученному материалу
• Пелена интеллектуальной эйфории (могу со знанием дела флеймить на тему)
• Желание бросить, да и так всё знаю
• Повышенная узнаваемость материала

• Первым делом остановился. Отдал отчёт, что это эмоции (то есть что-то на биохимическом уровне в мозгу закоротило)
• Принять состояние, но отказаться реактивно действовать (перекинуться на чтение любовных романчиков)
• Начал правильно понимать состояние, что это, почему и что оно даёт. Куда оно приведёт и как это коррелирует с осознанными целями.
• Микро-вывод: делать паузы не нужно, нельзя останавливаться. Но! Попробовать совместить внутреннее состояние с последующим чтением материала. То есть перенести эмоциональное состояние на рабочую ситуацию. Посмотреть, как будет работать, или сдуется при нагрузке.

• Хорошо помогло остыть "отрезвление" реальностью - просто попробовал прочелленджить состояние на предмет объективности и полезности. Хорошо отрезвляет попытка что-нить практическое поделать по изученному или неизученному материалу. Сразу граница незнания начинает очерчиваться.
• Нужно держать в фокусе материализированный и визуализированный скоуп работы. Лучше таскбордом и бёрндауном. Чтобы меньше левых розовых очков
• Порции приёма информации должны быть маленькие и измеряемые, должна быть практика. Торопиться нам некуда.

• Объект - это ассоциированный массив - имя + значение, то есть объект - это массив свойств (properties), собственно объект и определяет сам тип
• Так как объект и тип вещи близкие, поэтому наследование реализовано шаблоном прототип
• Существуют get/set
• Существует метаинформация по объекту и его свойствам

1. Атрибуты свойств : изменяемый, перечисляемый, конфигурируемый (можно установить атрибут и свойства свойства изменятся)
2. Атрибуты объектов : ссылка на прототип (родителя), имя класса, расширяемость

• Варианты обращения к свойствам объекта:

• Существует целый вагон методов работы с метаинформацией объектов и их свойствами, добавления, удаления и т.п.

• object literal - некое аннонимное объявление объекта (без типа)
• new - объявление объекта из типа
• Object.create - вывести объект из прототипа

Одолел понятие функции в JavaScript. Приведу сногшибательные концепты.

Functions in JavaScript are objects.
JavaScript The Good Parts

Объявление полей функции (вообще функция в Java Script назвается first class)

var myObj = {

    innerFunction : function() {

        this.val = 100;

    }

}

myObj.innerFunction();

document.write(myObj.val);    // 100  круто? Да?

В общем динамизм прёт через все щели! И это придумали в 1995 году!

Видимость переменных определяется объявлением

var value = "Global";

function foo() {

    //var value = "Local";

    return value;

};

document.writeln(foo());  // Global

Перегрузка функций

function threeArguments(a, b, c) {

    return “We expect 3 arguments: “ + a + “, “ + b + “, “ + c;

}            

function threeArguments(a,b,c,d) {

    return “Now we expect 4 arguments: “ + a + “, “ + b + “, “ + c + “, “ + d;

}            

document.write( threeArguments(1, 2, 3) ); // “We expect 4 arguments: 1, 2, 3, undefined”

Closure - убойный эффект, во время определения функции запоминается контекст (тут нету стэка вызовов, здесь цепочка объектов).

function greetMe(name) {

  return function(greeting) {

    return greeting + “ “ + name;        <---- вот эта переменная запомнится ссылкой, залочится (closure) значением, с которым вызывали функцию

  }

}

var greetAlexei = greetMe(“Alexei”); <--- здесь сделали функцию-объект с определенной в ней переменной name = Alexei

document.write( greetAlexei(“Hello”) ); // “Hello Alexei” 

Несколько бузвордов для штудирования (дел не во всех книгах упоминаются)

• call, apply -  вызов функции по названию
• bind - добавление к объекту новой функции
• memorization - микропаттерн для запоминания состояния (особенно рекурсивных вызовов)
• curry - подход определения новой функции из базовой + параметров

Ссылки (в порядке полезности):

• David Flanagan - JavaScript The Definitive Guide 6th Edition (очень подробно описано, правда некоторые вещи лишние думаю, но для полноты составления картинки хорошо идёт)
• JavaScript Programmer's Reference by Alexei White (кратко с тучей примеров, быстро доходит)
• Christian Johansen - Test-Driven JavaScript Development (тесты на все концепты, покрыты все темы)
• JavaScript The Good Parts (просмотрелась быстро, после одоления двух предыдущих)
• M.Morrison - Head First JavaScript (очень скудно описано, переизбыток повторов и банальностей)

• разметка в блоге - вырви глаз
• читать один аспект по нескольким книгам - сразу в голове устаканивается хорошо
• прочитал главу - потом каждый пример запустить - очень помогает подумать за границы написаного

.Net разработчик умудрённый опытом горестно вздохнёт посмотрев на гавно-код, который порождает JavaScript… Нету разделения по слоям, всё падаёт в кучу, нету паттернов, шматернов. Как же в этом болоте жить? А жить нужно, ведь скоро Windows 8 и вообще всё скоро будет на JavaScript. Что же делать?

Оказывается уже есть решение - http://knockoutjs.com/

• Декларативное связывание (declarative Bindings) - связь объектов и DOM элементов
• Автоматическое обновление (two-way binding в терминах WPF)
• Отслеживание зависимостей - данные трекаются и комбинируются (плохо понял пока)
• Шаблоны - язык написания шаблонов (всякие репитеры и т.п.)

Приведу кусочек кода. Идея такая - никаких ручных обновлений полей и всякого такого. Меняем объект - он сам обновляется во вьюшке.

<!-- Это HTML код, View -->

<p>First name: <strong data-bind="text: firstName"></strong></p>

<p>Last name: <strong data-bind="text: lastName"></strong></p>

<p>First name: <input data-bind="value: firstName" /></p>

<p>Last name: <input data-bind="value: lastName" /></p>

<p>Full name: <strong data-bind="text: fullName"></strong></p>

<button data-bind="click: capitalizeLastName">Go caps</button>

// Это ViewModel

function AppViewModel() {

    this.firstName = ko.observable("Bert");

    this.lastName = ko.observable("Bertington");

    this.fullName = ko.computed(function() {

        return this.firstName() + " " + this.lastName();    

    }, this);

    this.capitalizeLastName = function() {

        var currentVal = this.lastName();        

        this.lastName(currentVal.toUpperCase());    };    

}

// Включение биндинга

ko.applyBindings(new AppViewModel());

Комментарии

• data-bind="text: firstName"  - так мы завязались на поле вьюмодели AppVeiwModel.fistName
• ko.applyBindings(new AppViewModel()) - в вот так мы знаем, что нужно завязываться именно на эту вьюмодель
• Кстати меняя <input... меняется и значение в <strong….
• Ну и когда нажимаем "Go caps" - значение пересчитывается и складывается в fullName поле.

Пощупать пример в реали можно здесь: http://learn.knockoutjs.com/#/?tutorial=intro

Вот и закончились выходные. За 2 дня я проделал погружение в мир web-технологий. Получил огромный обзор и расширил границы своего незнания до неприличия.  Но этот пост не о том. Последняя часть для получения базовых сведений о веб-разработке - JavaScript и библиотека jQuery. 

• JavaScript & Jquery: The Missing Manual (примеры кода) by David Sawyer McFarland: первая книга по теме. Обзор хороший, все основные фишки показаны. Наверное лучше идти на сайт jQuery и там смотреть библиотеки.
• JavaScript Patterns by Stoyan Stefanov Рихтер для JavaScript (Рихтер очень мощный автор, раскрывающий всю поднаготню языка C#).  Похоже эту книжку нужно внимательно перечитать попозже. И однозначно поставить в поток медленного чтения.
• jQuery Recipes: A Problem-Solution Approach (Expert's Voice in Web Development) by B.M. Harwani (примеры кода): У этой книги очень плохой рейтинг на амазоне. Просматривая книгу я отметил, что это не есть гут. Книга разбита на масенькие рецепты, точки аттракции, как сделать то или иное. Самые важные мелкие кирпичики. Иногда читая название совета я задавал себе вопрос - а я уже могу это? Если отвечал нет - с интересом читал решение. Думаю хорошее введение в тему, сразу с практических моментов. После этой книги нунжо читать что-нить классическое и медлено.
• JavaScript The Definitive Guide 6th Edition by David Flanagan (примеры кода) - всего понемногу. Очень плотно материал выдаётся, чтобы сами проверяли. Автор признанный авторитет в теме, но лучше кучи исполняемого кода нету лучшего учебного пособия. А чтобы его примеры кода запустить - нунжо делать танцы с бубном.
• jQuery Pocket Reference by David Flanagan: вообще не понимаю зачем выпускать такие недо-книги.
• Pro jQueryBy Adam Freeman (пример кода) - коллекция рецептов без много количества слов. Красивые картинки, хороший обзор различных UI библиотек.
• JavaScript The Good Parts - коллекция паттернов и анти-паттернов. Плюс основы языка.
• High Performance JavaScript by Nicholas C. Zakas - наверное интересное, уже сил нету листать книги. В конце обзор разных инструментов.
• Pro Javascript RIA Techniques - Best Practices, Performance and Presentation by Dennis Odell - тяжёлый метал наконец-то пошёл. Но похоже книга уже старовата.

Обнаружены интересные сайты

• http://ajaxpatterns.org
• http://www.apress.com/web-development/jquery
• http://search.oreilly.com/?q=jquery
• http://worldsbiggestpacman.com/
• http://worldofsolitaire.com/
• http://jslint.com/
• http://www.jspatterns.com/category/patterns/

По качеству кода совершенно мало книг, поэтому пошёл искать сайты:

• http://addyosmani.com/resources/essentialjsdesignpatterns/book/#wrapperpatternjquery
• http://addyosmani.com/largescalejavascript/
• http://www.slideshare.net/s.barysiuk/javascript-and-ui-architecture-best-practices-presentatiOn
• http://www.slideshare.net/nzakas/scalable-javascript-application-architecture
• http://codebrief.com/2012/01/the-top-10-javascript-mvc-frameworks-reviewed/
• http://paulirish.com/2009/perf/

По JavaScript и jQuery следующие шаги

• Выучить основы языка (очень дотошно)
• Выучить основы нотации jQuery, без библиотек

Выводы

• Гавно-код. Все книги, что просмотрел дают очень  стилизированные примеры. Куча кода в одном месте. Конечно сообразить можно быстро. Но это закрепляет неправильное в корне понимание качества кодирования. Похоже нужно брать знаменитые открытые проекты и учиться у них.
• Ссылки. В конце каждой книги ссылки на другие технологии! Их так же нужно просматривать в этом режиме. Делать список и ознакамливаться.
• Примеры или метод научного тыка. Примеры, примеры и ещё раз примеры. Вместо чтения главы, я открываю примеры главы - запускаю, просматриваю код, если всё понятно - читать главу даже не нужно :o) Очень быстро получается.
• Коллекция рецептов. В каждой книге много примеров - их нужно просто в свою копилку переносить. Например OneNote и классифицировать.
• Ежедневный план. Ежедневный план должен включать

1. Просмотр одной книги (это 30-60 минут в день)
2. Разбирать 5-10 примеров по интересующей технологии
3. Выбрать одну классическую книгу и потихоньку смаковать (30-60 мин в день)

• Общий план. Сделать карту знания технологий, чтобы понимать свои интересы, периодически просматривать книжные полки, подписаться на рсс лидеров индустрии и пресс-релизы сообществ. Нужно организовать два потока: поток медленного чтения (для шедевров), поток быстрого (сканировать книги в поисках и ознакомления с теми или иными технологиями)

Дальнейшие направления развития: SEO, производительность и мобильные устройства. Может быть нужно понять wiki или wordpress, где разные примеры собирать. Каждый пример должен содеражать исполняемый код: чтобы сразу проверить + исходный код.

Но самое лучшее - начать писать сайт и познавать глубину исходя из реальных задач!

Недавно прокачался я CSS, теперь принялся за HTML5 Canvas. Подход тот же самый: KWLS + подход мурзилки :o)

• HTML Tutorial: начальный просмотр фич языка HTML
• HTML5 Tutorial: всё самое важно с кучей примеров
• Programming HTML5 Applications Building Powerful Cross-Platform Environments in Javascript: простенький обзор последний идей и тулов для разработчиков (не всё многообразие, но для старта нормально)
• McLean I.- Creating HTML5 Animations with Flash and Wallaby: за книгу считать даже нельзя, длинная статья на компенсацию градниозного просчёта адобе под названием "Flash". В битве Apple (HTML5) и Adobe (Flash), победил стандарт разработанный Apple (HTML5)
• Pagella M. - Making Isometric Social Real-Time Games with HTML5, CSS3, and Javascript: тоже неплохой примерчик с написанием "игры", базовые концепты показаны. Конечно было бы неплохо простой найти сайты с играми и просто посмотреть их код. Внутри примеров у автора гавно-код.
• HTML5 Canvas for games & entertainment: хорошим простым языком написаны основные моменты. Подача информации идёт как бы "а вот", а "ещё можно вот", а тут вообще такой скандал был про это... Приятно было просмотреть, так как нету надоедливой банальщины. В конце книги много ссылок на приложения. И ещё я понял, что много игр можно найти в инете правильно задав критерии поиска :) Сайт автора с примерами: http://rawkes.com/lab
• HTML5 Canvas Cookbook by Eric Rowell. Очень много рецептов и тучей кода (примеры из книги - хорошо отсортированы).  В конце книги делает игру. Автор ресурса с множеством тутариалов: http://www.html5canvastutorials.com (а для игр можно использовать вот этот ресурс: http://www.spriters-resource.com/
• HTML5 Canvas by Steve Fulton: тоже неплохое объяснение основных моментов, но что-то пропущено по сравнению с предыдущими книгами. И ещё минус - слишком много кусков кода - всё это можно было на сайт загрузить и только сфокусироваться на дизайнерских/архитектурных моментах. Примеры из книги.
• Learning HTML5 Game Programming: A Hands-on Guide to Building Online Games Using Canvas, SVG, and WebGL by James L. Williams: хорошее интро для тучи технологий и различных библиотек. В первой главе показал все фичи HTML5.
• http://introducinghtml5.com  - куча простых примеров

Выводы:

1. Просмотрев кучу книг в голове осели основные фичи языков и продуктов.
2. Отлично, что есть код к книгам и его можно выкачать и посмотреть (хотя я его не очень то и смотрел)
3. Совершенно не освещён вопрос архитектуры и дизайна сложных приложений (похоже нунжо брать код проектов и смотреть). Где есть хорошие примеры и коллекции примеров сложных приложений?

Следующая серия книг: JavaScript и jQuery! Последняя технология для обзора.

Потихоньку решил делать свой сайт, а чтобы подкачаться знаниями прочитал сегодня несколько материалов (тут и тут и тут). Потом целый час думал с чего начать из серъёзных работ. Решил делать просто. Не заострять внимание на деталях, а главное понимать фичи (фичи языков) и основные смыслы. Мастером становится не нужно, да и стать им можно после только 10.000 часов кодирования, поэтому фокус на другом. А как можно хорошо фичи узнать? Видео-туториалы не подходят, уж слишком медлено. А вот книжки с большим количеством поясняющих картинк - это наш метод. Мурзилки для инженеров - это наше всё :o)

Где можно нахрапом обложиться книжками? Сейчас сущействует множество онлайн-библиотек (пример: http://my.safaribooksonline.com) и электронных вариантов книг  (Kindle Amazon, купил и тут же закачал). Выбор книг делал по отзывам и рейтингам с разных сайтов (amazon.com, stackoverflow и др.)

Работа с книгой в таком порядке

• KWLS схема (1-2 минуты)
• Пробегаю оглавление (W)
• Просматриваю книгу в поисках ответов на нюансы из колонки (W)
• Просматриваю полностью книгу с фокусом на фичи (код, картинки)
• Делаю выводы и добавляю в эту статью и делаю ретро "как лучше читать следующую книгу"

Поехали...

• HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтовID 5538877Автор: Владимир Дронов - Решил проверить популярного русского автора. Начал обзор с этой книги. Книга насыщена техничекими отрывками, легко отделить важное (в начале каждой главы), а потом идут детали. Много перепечаток со стандартов с небольшими примерами. HTML5 не охвачен полностью (под полным охватом я понимаю раскрытие тем, как минимум из wikipedia). Одну полезную ссылку увёл: https://developer.mozilla.org/en и узнал, что такое TR[ROWSPAN].
• CSS: The Missing Manual by David Sawyer McFarland (Большая книга CSS) - Может я уже перегрузился работой русского автора, но в англоязычной версии были замечены мысли получше. Во-первых, много картинок объясняющих разные эффекты. Код отделён от текста. Поэтому пролистывая книгу, я не смотрел описания - я смотрел код и картинки. Поэтому получилось книгу просмотреть с большим удовольствием. Во-вторых, интересные обнаруженные фичи: построение галлереи, нафигации (менюшечки разные), подготовка страницы к печати, несколько best-практик. И заметил функцию @import для повторного использования стилей. Сделал вывод - что смотреть картинки (метод мурзилки) - наше всё.  Из общих рассуждений понял, текст нету смысла читать: важно смотреть код в книге, и если его не понимаю, тогда читать прилагающийся текст. И ещё настигло чувство разочарование, я ждал большего. Например: такое или такое (Microsoft Test Drive) или такое (CSS3 Transition)
• ederholm D. - CSS3 for Web Designers - Шедевриально. Куча ссылок. Хорошие примеры. Хорошие темы: трансформация, анимация, круглые и крутые кнопки. Одолел книга за 10 мин: очень много интересного увидел! И обязательно подписался на RSS: http://www.css3.info/  и конечно же воспользовался тестом http://css3test.com
• The Zen of CSS Design: Visual Enlightenment for the Web by Dave Shea / Философия CSS - Эстетика верстки и дизайна. Как наводить красоту и законы веб-фен-шуя. Скучно, но для специалистов думаю очень полезна.
• Pro CSS and HTML Design Patterns by Michael Bowers - Отличная книга для старта. 1 эффект = 1 объяснение. Показаны ключевые элементы для верстки и работа с CSS. Никакой философии. Картинка, код, краткое объяснение. Наверное подходит как коллекция рецептов.
• http://htmlbook.ru - Лучшее начало. Практика, практика и ещё раз практик
• CSS Cookbook - Большая книга рецептов. Пролистал быстро. Все фичи уже знакомы
• CSS. 100 и 1 совет. Рейчел Эндрю - Ещё одна книга рецептов. Поменьше размером. Уже начинает приедаться CSS. Похоже крутых прорывов больше нету...
• Handcrafted CSS: More Bulletproof Web Design by Dan Cederholm - Очень ненапряжная книжка. Делается сайт и по частям раскрашивается. Хорошо код показан и тут же примеры отображения. Думаю, что как адвансед туторил для новичков самый то.

Загрузился я CSS, а сейчас перехожу к JavaScript и jQuery :o)

• 001. Что такое НЛП (youtube видео)

• Материал к тренингу (глаза)

• Введение: о чем этот курс и как с ним работать?
• Зачем в менеджеры: как понять зачем я работаю и стоит ли двигаться именно в менеджемент?
• Выбор компании: какие компании мы выбираем, по каким признакам... и какие нам нужны.
• Работа с начальником: типология начальников по перспективности для продвижения.
• Кем будем управлять: типология подчиненных и особенности управления.
• Начало работы менеджером: ожидания, страхи и опасения.
• Навыки менеджера: что ждут и что хотят компании и боссы?
• Саморазвитие: как, что и в каких областях прокачивать?