Что

Hint.css — библиотека, реализующая всплывающие подсказки, средствами CSS3 без применения JavaScript.

Библиотека использует атрибут data-*, псевдоэлементы, свойство content и CSS3 transitions для вывода всплывающих подсказок.

Мы рады сообщить, что вчера вышла новая версия интегрированной среды разработки для Ruby и Rails — RubyMine 5, которую можно загрузить с нашего сайта.

В новой версии мы постарались добавить новые возможности, которые позволят получить удовольствие от разработки на Ruby во всем ее многообразии. Уже хорошо зарекомендовавшие себя инструменты разработки теперь доступны для еще большего числа Ruby-приложений, в том числе и для iOS-приложений на базе технологии RubyMotion, быстро набирающей популярность. Для приложений RubyMotion стали доступны интеллектуальное автодополнение кода, тестирование и отладка с использованием графического интерфейса.

Более подробно о RubyMine 5 можно узнать на странице What’s new. Также мы рады представить демо-видео от технического евангелиста Джона Линдквиста (John Lindquist).

Весной 2012 г., Питер Тиль (Peter Thiel), один из основателей PayPal и первый инвестор FaceBook, провел курс в Стенфорде — «Стартап». Перед началом Тиль заявил: «Если я сделаю свою работу правильно, это будет последний предмет, который вам придется изучать».

Один из студентов лекции записывал и выложил транскипт. В данном хабратопике я перевожу деcятое занятие.

Занятие 1: Вызов будущего
Занятие 2: Снова как в 1999?
Занятие 3: Системы ценностей
Занятие 4: Преимущество последнего хода
Занятие 5: Механика мафии
Занятие 6: Закон Тиля
Занятие 7: Следуйте за деньгами
Занятие 8: Презентация идеи (питч)
Занятие 9: Все готово, а придут ли они?
Занятие 10: После Web 2.0
Занятие 11: Секреты
Занятие 12: Война и мир
Занятие 13: Вы — не лотерейный билет
Занятие 14: Экология как мировоззрение
Занятие 15: Назад в будущее
Занятие 16: Разбираясь в себе
Занятие 17: Глубокие мысли
Занятие 18: Основатель — жертва или бог
Занятие 19: Стагнация или сингулярность?

Каждый уважающий себя советский мальчишка должен был: знать, где найти карбид; быть влюблен в Алису Селезневу; хотеть стать космонавтом. Я в этом плане не исключение и, так сказать, полностью соответствовал. Со временем многое изменилось, но интерес к космосу остался. С января 2004 года я в течение полутора лет практически ежедневно заходил на специальную страничку НАСА и смотрел, что нового произошло с марсоходами. Так что документальный фильм «Смерть марсохода» (Death of a Mars Rover) был изначально обречен на ошеломительный успех среди меня.

К сожалению, единственная из существующих до недавнего времени озвучек этого фильма была… как бы это сказать… «не на твердую пятерку». Мне-то, в принципе, все равно — я могу и на английском посмотреть — но за державу других зрителей было обидно. Поэтому я решил самостоятельно перевести и озвучить этот интереснейший фильм с помощью подручных средств. Внести, так сказать, посильный вклад в дело распространения знаний среди населения. Думал, управлюсь быстро — всего-то 45 минут освоить! Но процесс занял гораздо больше времени — многословное, на грани логореи, описание подробностей читайте под катом.

"

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

Сразу скажу, что существуют такие web-приложения, которые лишены указанных ниже недостатков (например, Gmail, Хабрахабр). Но это — счастливые исключения, лишь подтверждающие правила.

1. Трудность навигации

Прежде всего, состояние. Тот, кто читал «Психбольницу в руках пациентов» Купера, знает, о чем речь. Складным ножом легко пользоваться потому, что у него всего два состояния: раскрыт и сложен. А в случае же с сайтом вы имеете очень большое количество состояний. И если к неопределенности в плане ссылок мозг еще привыкает со временем — пользователь знает, что он находится на одной странице, и всего его действия ограничены ею одной, что сказывается на относительной легкости моделировании различных состояний по страницам — то с аяксом такого не происходит.


Довольная Гаечка наконец-то нашла нормальный ajax-сайт!

Наверное каждый в начале работы с ROR был впечатлен возможностью Scaffolding'а, который позволяет одной командой создавать migrations, controllers, models и views.

Но что делать если в своем проекте вы используете не стандартные Rails утилиты: erb, Test::Unit, fixturies, а сторонние инструменты: Haml, Rspec, Cucumber, Factory Girl и более того, хотите добавить собственные шаблоны?

Интересно? GOTO next line.

Исходные данные:
Ruby on Rails; Rspec; will-paginate; Haml; Factory-girl

Задача:
% rails generate scaffold post post:string
Генерирует:

1. contoller's с поддержкой will_paginate, русскоязычными сообщениями
2. model's с поддержкой will_paginate
3. view's с заданным нами содержимым и в формате haml
4. Rspec тесты, вместо Test::Unit
5. Factory Girl factories вместо стандартных fixtures

Адаптивный веб-дизайн — значительное достижение для всего Интернета. Мы больше не скованы давно устаревшей моделью «печатной страницы» со статическим содержимым, разбитым на области фиксированного размера. Сегодня Интернет способен жить, дышать и приспосабливаться, заполняя всё пространство, доступное на экранах различных устройств, начиная от мобильных телефонов — и вплоть до огромных видеодисплеев. Это то, какой и предполагалась Глобальная сеть.

Но есть небольшая проблема. Веб-сайты зачастую содержат баннерную рекламу и традиционные баннеры, не обладающие особой гибкостью. Как flash-, так и GIF-баннеры имеют фиксированные размеры, из-за чего несовместимы с современной адаптивной вёрсткой. Нам необходим новый метод создания баннерной рекламы. Нам нужны «адаптивные» баннеры...

В этот пятничный день компания Google выпустила географический паззл Mercator в качестве примера использования Google Maps API. Нужно положить кусочки суши в соответствующие места на карте, учитывая развёртку сферы на плоскость — проекцию Меркатора. Как известно, в такой проекции масштаб на карте не является постоянным, а увеличивается от экватора к полюсам как обратный косинус широты. Соответствующим образом пересчитываются SVG для каждого элемента паззла.

Как то поздним вечерком мне пришла мысль изучить Backbone.js и привязать его к уже написанному на jQuery сервису. Сервис уже серьёзно расширился и меня достало это нагромождение обработчиков кликов, запросов и логики. Поэтому, я как усердный школьник полез в официальную документацию. Но либо я тупой, либо мой английский меня подкачал, либо то и другое вместе, но я не черта не понял. Я прочитал уже второй раз, внимательно, и для особо одарённых мест использовал google translate. Прочитал также и пример ToDo List. Всё показалось понятно, ровно до той поры пока я не стал писать. После чего я взял всё что нашел по этой библиотеке, как на английском так и переводы. Прочтя кипу документации я решил, что сейчас вроде всё понял. Я напрягся, но… Не вышел каменный цветок у мастера Данилы, т.е. вышло, но это явно был не цветок, и камень как то неправильно пах. Тогда, как прилежный ученик, я решил написать «Hello, KittyWorld» с нуля. Попутно комментируя и сохраняя шаги в hg, у меня получилось введение в backbone.js framework для таких как я, особо одарённых.

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

1. А сколько займет сделать этот раздел (дается ТЗ из одной строки)?

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

Менеджеру: поймите, что программист строит в голове модель будущей системы. По одному предложению нельзя смоделировать приложение. И только ваша вина, если вы не потрудились уточнить ТЗ (это ваша работа, кстати) у заказчика, а хотите сразу назвать ему срок (и цену). Потому что оценка с потолка невозможна — вроде как ответить на вопрос «сколько времени займет покрасить комнату неизвестной площади?».

2. Ты же ОБЕЩАЛ сделать за два дня, а прошла неделя! (моют мозг по сроку из пункта 1)

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

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

Я фрилансер со стажем 4 месяца, я никогда не был фрилансером до, я работал техническим директором и зарабатывал в пару раз больше до фрилансинга. Работаю только на зарубежных заказчиков в области системного администрирования около 10-20 часов в неделю. Я ни чуть не жалею что стал фрилансером так как живу на яркой стороне. Что же я делаю чтобы работать, а вернее хорошо работать.

1 )Разделяйте рабочее пространство и пространство для сна. Тут можно снимать более комнатную квартиру, работать в коворкинг центре или кафе, переоборудовать балкон в рабочий кабинет и многое другое. Кровать всегда тянет забросить работу и поваляться.

2) Пейте вкусный свежесваренный кофе. Нет ничего лучше чем чашечка эспрессо или капучино с утра.

3) Делайте зарядку с утра. За ночь в печени заканчиваются все запасы энергии и чтобы получить энергию из мышц в виде молочной кислоты организму нужна нагрузка на мышцы. Это даст вам энергии до завтрака.

4) Завтракайте, черт подери, организму нужна энергия чтобы двигаться и думать.

5) Живите на яркой стороне. Недостаток солнца и тепла существенно снижает продуктивность. Переезжайте в теплую страну. Снимайте жилье с солнечной стороны. Тайланд и Вьетнам вас ждет.

6) Хорошо питайтесь. Почаще но небольшими порциями, это позволит организму быть в тонусе и не накапливать лишние жиры(не люблю ожирение).

7) Не злоупотребляйте едой, наркотиками, сигаретами, алкоголем, беспорядочной половой жизнью. Когда ты фрилансер чувствуешь себя очень свободным, а че бы не забить ещё один косяк.

Почти год назад я стал фрилансером, устроился работать на американскую биржу odesk.com и начал потихоньку работать. Со временем росло количество и сложность заказов и сами собой у меня выработались пять методик работы.

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

Режимы или методики зависят от 7 факторов:

Я обожаю twitter bootstrap. Прост, местами логичен, достаточно красив, подходит для быстрого прототипирования веб-интерфейсов. Но этого оказалось недостаточно. Взяв twitter bootstrap в большой проект, мне пришлось целиком его разобрать и переосмыслить css-фреймворки как боевые единицы в веб-проектах. В результате переосмысления родились требования к любому css-фреймворку, удобному как верстальщику, так и frontent-разработчику.

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

Статья содержит перечень ресурсов для онлайн-обучения, представляющих интерес преимущественно для программистов.

thoughtbot (с маленькой буквы) — одна из ведущих американских консалтинговых фирм, ориентированных на веб разработку с помощью Ruby on Rails. thoughtbot эксплуатирует распространенную в этой среде бизнес-модель, и зарабатывает не только за счет консалтинга, но и за счет своих больших вкладов в Open Source, активного участия в жизни сообщества (например, подкаст Giant Robots Smashing into Other Giant Robots), образовательной деятельности (воркшопы, менторство), внутренних продуктов и литературы.

На их счету до сегодняшнего дня числилось две полноценных книги: The Playbook — исчерпывающий справочник по внутреннему распорядку и трудовым хитростям thoughtbot (бесплатна для изучения на их сайте), и Backbone.js on Rails — не менее исчерпывающее руководство по использованию JS фреймворка Backbone вместе с Ruby on Rails.

Интересна особенность их подхода к публикации книг. Это не статичный труд, написанный однажды, напечатанный на бумаге и устаревающий с годами, а продукт, поддерживающий версионность, развивающийся под влиянием читателей и сопровождающийся различными электронными плюшками, в том числе и готовым к использованию кодом примеров. «Исходники» книги хранятся на github, а это значит, что в любой момент читатель имеет возможность получить самый свежий релиз, сообщить о проблеме, обсудить какую-либо часть текста и т.п.

Сегодня они объявили о начале работы над новой книгой, под названием «Ruby Science. The reference for writing fantastic Rails applications». Более того, начать чтение книги и принять участие в её развитии можно уже сейчас.

Недавно был снова обновлен центр по Internet Explorer на MSDN. Были добавлены 76 статей и книг, посвященных следующим темам:

• HTML,CSS3 и DHTML
• JavaScript, AJAX, DOM и JQuery
• Расширения
• Производительность
• Совместимость

Полный список материалов со ссылками под катом

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


ДЕМО

Тот факт, что iPhone предлагает наиболее развитый мобильный браузер среди мобильных платформ, пожалуй, ни у кого не вызовет сомнений. Однако не все знают, что довольно небольшими усилиями можно сайт сделать еще более дружественным к тем, кто смотрят его на iPhone или iPod Touch.

Ниже предлагаются простые 5 шагов, с которых можно начать, на примере сайта WHOIS Digger.

Шаг 1. Аналог favicon.ico

Когда пользователь создает ссылку на ваш сайт в виде иконки в SpringBoard, iPhone автоматически формирует картинку из скриншота страницы. В результате почти всегда получается неразборчивая каша, которая на гордое звание «иконки для iPhone» никак не тянет. Пропишите этот тег в заголовке страницы:

<link rel="apple-touch-icon" href="res/iphone_icon.png" />

и добавьте соответствующую картинку res/iphone_icon.png размером 57х57 пикселов. iPhone сам добавит скругленные углы и полукруглый блик, сделав вашу иконку похожей на остальные.

Вот так выглядит исходная картинка и иконка на рабочем столе iPhone:

Вы PM. Как узнать – готова ли вёрстка к реальному использованию?
Вы заказчик. Как убедиться, что работа выполнена качественно?
Как оценить качество вёрстки?

Когда я стал тим-лидом, а позже PM, передо мной стала задача проверять вёрстку наших проектов. Нужно было выработать формальные, легкопроверяемые критерии, соответствие кода которым, должно было давать некую гарантию, что не будет факапов и ни клиент, ни программеры не сказажут потом “WTF?”.

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

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

Итак что же это за список?

Краткая версия теперь доступна на html5checklist.com (github), где можно вносить pull-request'ы.

История обновлений:

• 2015/08/11: Актуализировал рекомендации по оптимизации скорости загрузки. Добавил требование поддержки Retina. Дополнил «19. Мелочи» требованием что изображения должны масштабироваться в зависимости от размера окна.
• 2015/08/10: актуализирован список исключений для CSSLint
• 2015/07/29: актуализирован пункт №13 «плохо»/«хорошо»
• 2015/04/08: добавлено требование использования препроцессоров и рекомендация использования систем сборки
• 2013/04/25: добавлены анализаторами качества кода: CSSLint и JSHint, указан сайт подбора css font stack (спасибо @fliptheweb), мелкие уточнения (работу интерактивных элементов страницы, что не пропадает фон на высоких разрешениях, не должно быть пустых презентационных блоков, при проверках контента — пробовать удалять заголовки, менять местами блоки)
• 2013/04/24: добавил пункт об минимизации каскада (БЭМ-техники, MCSS, SMACSS), необходимости вписывания в экран моб. устройства, заменил ссылку на проверочный текст отображения стандартного html на код с normalize.css, поправил пример где в рекомендации встречался длинный каскад, упомянул про Opera на Presto и новый уровень семантики — в именах классов BEM.
• 2012/04/12: отсортировал пункты проверки в порядке важности, выделил главные, дополнил статью подробностями
• 2011/12/07: дополнил согласно доклада на WSD Минск'2011.
• 2011/07/19: добавлено про повышение надёжности вёрстки благодаря html5-тэгам, про необходимость favicon/apple-touch-icon, отсутствие багов при ресайзе textarea
• 2011/06/15: добавил пояснения какие ошибки валидации допустимы, рассказал про отсутствие официальной кнопки «HTML5 Valid» и про официальное лого HTML5 на сайте.

Доброго времени суток!

Предисловие

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

Введение

У меня за спиной огромный опыт работы с PHP, но сейчас я работаю Rails разработчиком. Огромную сложность для большинства людей, которые пытаются освоить что-то новое — это сам процесс обучения. Когда вы владеете каким-либо языком или фреймворком и знаете его вдоль и поперёк, переход на что-то новое не представляется необходимым.

Однако, изучение Ruby on Rails является достаточно простым занятием. Это невероятно мощный фреймворк, который имеет огромное сообщество, продвигающее его вперёд. Итак, у нас возникает вопрос: какой способ изучить Rails является лучшим? Вот он — план занятий.