Любой, кто играл или наблюдал за игрой друзей, либо в принципе видел игры, которые были выпущены в 80-90-х годах, должны быть знакомы с техникой параллакс-скроллинга.

Вспомните такие игры, как Mario Bros, Streets of Rage, Mortal Kombat, Turtles in Time или оригинальную игру Moon Patrol. В этих играх техника параллакса наблюдается в тот момент, когда несколько фоновых слоев с различными текстурами двигаются с разной скоростью, что создает эффект трехмерного пространства.

Почему я начал говорить о ретро-играх в статье о веб-разработке? Самым простым ответом мог бы быть «потому что они клевые», но нет. Параллакс-скроллинг является классным дизайнерским концептом, который прокладывает свой путь в мир веб-дизайна. Nike были одними из первых, кто использовал эту технику с большим успехом, когда они наняли маркетинговых гигантов Weiden and Kennedy для разработки их оригинального сайта Nike Better World. Сайт Nike Better World с того времени был обновлен и заменен на новый, однако есть другой сайт, довольно похожий на то, как выглядел первый параллакс-дизайн от Nike — сайт о спортивных напитках Activate.

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

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

И было бы это неудивительно, если бы разработчики были совсем глупые. Но нет же, разработчики наизусть знали «Understanding and Solving Internet Explorer Leak Patterns». Циклические ссылки разрывали, замыкания не использовали, к событиям относились с должным почтением и удалять обработчики не забывали. Да вот только от утечек это не спасло.

Envision.js библиотека для создания быстрых динамических и интерактивных визуализаций данных на HTML5.


Возможности:

1) Визуализация в реальном времени.
2) Временная шкала
3) Визуализация валют ( как на яндексе прям )
4) Поддержка Ajax в интерактиве.
5) Можно побаловаться фракталами.

Некто Андрей Шевченко составил, структурировал и выпустил в виде бесплатной PDF книги список вопросов, которые всенепрменнно могут встретится(и чаще всего встречаются) любому PHP программисту на самом стандартном собеседовании. Более того — каждый вопрос снабжен достаточно подробным ответом.

Чтобы освоить азы Web программирования, я решил написать HTML5 игру — головоломку под названием Triplex (www.quadpuzzle.ru). Написать игру для себя и для друзей — полдела. Захотелось довести проект до ума, сделав из игры продукт для широкого круга пользователей. Насколько получилось — судить вам.

    Правила игры просты. На игровом поле разложены фигуры из квадратиков. Цель игры — уложить все фигуры в указанный прямоугольник. Вращать можно только одну фигуру, помеченную кружком, если она есть. Решение в каждой задаче существует и единственное.

                        

В предыдущей статье я рассказал о том, почему считаю неэффективной разработку с применением Content Management System. В этой статье, я расскажу о том, какой подход использую в построении веб-приложений.

В первую очередь опишу проблему, которая заставила в тысячный раз вернуться к обсосанному со всех сторон вопросу: бестолковые менеджеры — без консультации с программистами — пообещали заказчику загрузку данных на сайт из xls(x).

Все бы ничего, но хостер заказчика дает 64мб памяти под выполнение и плевать он хотел на то, что у клиента Exсel файлы вообще без форматирования весят по 10-15мб, что при загрузке его PHPExel съедает (на тест-сервере) что-то около 500мб памяти.
Решение под катом с трудом дотянуло до 5мб.

Здравствуйте!



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

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

Теория

В андроид-маркете лежит замечательная программа IpWebCam, которая позволяет превратить свой телефон в полноценную веб-камеру. Кроме того у нее есть api для получения фотографий с автофокусом. При запуске IpWebCam, на телефоне поднимается web-сервер, который позволяет с локальной машины по wi-fi получать текущий кадр с телефона по адресу вида 192.168.0.14:8080/shot.jpg

Идея была следующая:

1. Вставить в форму <img> с адресом фотографии со смартфона
2. Создать canvas и в него скопировать содержимое <img>
3. Сохранить данные при помощи canvas.toDataURL()
4. Отправить данные на сервер при помощи ajax

Адаптировать свой сайт под мобильные устройства уже пытаются очень многие. Используют новые возможности CSS3 и на простых сайтах и на куда более сложных. В процессе возникают некоторые сложности, причем одной из важнейших является поведение меню сайта при просмотре на маленьких экранах. Решают данную проблему, как выяснилось, несколькими способами. Для меня же данная задача недавно стала особенно актуальной, поэтому я слежу за материалами в сети, касающимися адаптивного дизайна. И недавно я наткнулся на хороший анализ существующих паттернов адаптивной навигации.

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

В жизни каждого разработчика наступает такой момент, когда ему нужно сделать форму. Вроде бы чего тут сложного — бери, бросай. А нет, форма то, она как живая. У неё есть своё настроение, свои привычки. Выбрал пол — “Ж”, она преобразилась, стала чуть другой, любопытной, спрашивает замужем ли, любимые духи, обувь с каблуком, или без? Но ты же мужик! И тут выбираешь пол “М”, и, как бы, вопросы должны быть другие — холост, любимый сорт пива, любимый спорт. Конечно, можно понаделать кучу формочек для каждого чиха, если “М”, то одна, если “Ж”, то другая. Но такой метод обернется катастрофой на этапе поддержки, да и вообще не в духе красивого кода. Поэтому форма должна быть умной. Очень умной. Она должна знать кто её трогает, чего он хочет, его потаённые желания. Например: есть форма ввода адреса в пять полей

• страна
• область
• город
• улица
• метро

Выбираю я город, и почему бы форме не додумать область и страну? Или выбрал Владимирскую область, зачем мне в списке городов “Москва”? Поле “метро” для Владимирской области тоже не актуально, а когда выбран город Струнино, так вообще издевательство. Занимаясь разработкой клиентской части в корпоративных WEB приложениях вот уже 5 лет я таки познал, как сделать форму умной. Надеюсь, мой опыт будет полезен и вам.

Как менеджер проектов в своё время я попытался интегрировать различные Agile/SCRUM методики в свою повседневную жизнь. Ведь она тоже в каком то смысле является долгосрочным и довольно динамичным проектом.

Неоднократно пробовал использовать популярные GTD инструменты, но в итоге именно Google календарь ввиду своей наглядности и привязке ко времени — оказался наиболее эффективным. Получается такой вот Self SCRUM Board с итерациями и планерками :)

Ура! Еще один, свеженький… чем он лучше других?



а) Новенький! Всегда, кто берется что-то делать, то обычно смотрит: есть ли в этом смысл, и если есть — делает это.
б) Красивенький! Можно не точить, а ставить из коробки. Основан на Bootstrap'е и иконках Glyphicons
в) Само собой мультиселект файлов, Drag&drop, прогрессбар и превьюшки фотографий.
г) Поддержка кросдоменного соединения, докачка и ресайз фоток на стороне клиента.
д) Готов для любой платформы сервера (PHP, Python, Ruby on Rails, Java, Node.js, и тому подобное.)

blueimp.github.com/jQuery-File-Upload

Поддержка браузеров:

github.com/blueimp/jQuery-File-Upload/wiki/Browser-support

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

Основная сложность при изучении объектно-ориентированного программирования (или любой другой парадигмы программирования) заключается в том, что весьма сложно подобрать формальные критерии, которые бы сказали: «ок, теперь я знаю ООП и стану писать более клевые (читай модульные, реюзабельные и легкие в сопровождении) программы». Например, при изучении языков программирования мы относительно быстро замечаем, опа, level-up, я, кажись, перешел на новый уровень понимания идиом и конструкций языка программирования и могу использовать его более интересным образом, да еще и другим рассказывать, где они не правы.

Сегодня что-то дернуло прикрутить к своему сайту авторизацию через Вконтакте. Покрутился по интернету, посмотрел на типовое решение на сайте Вконтакта. Решил проверить. И не получилось.

Более того — отправился на сайт великого и могучего. Но и там не получилось.

Поискал информацию на хабре, потом на гугле, потом начал тестировать.

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

Введение

Как-то я начал осваивать новый инструмент — JМeter — и не смог найти какого-то полноценного руководства как руководства к действию. Постепенно, разобравшись по некоторым довольно полезным статьям и блогам, пользовательской документации, я начал что-то понимать. И решил, что, возможно, я не один ищу то, с чего можно начать работать. Освоить некоторые принципы построения и логику самого инструмента. Так что вот — статья о том, как начать.
Так что в этой статье мы рассмотрим пример создания скрипта для 3 пользователей, которые хотят:
1. залогиниться;
2. добавить в какой-нибудь альбом новую фотографию;
3. поменять аватарку.
Как таковой — это обычный бизнес процесс для какой-нибудь социальной сети.

На Хабре уже упоминалась данная тулза, но как-то в контексте других тем.

What is Fiddler?
Fiddler is a Web Debugging Proxy which logs all HTTP(S) traffic between your computer and the Internet. Fiddler allows you to inspect traffic, set breakpoints, and «fiddle» with incoming or outgoing data. Fiddler includes a powerful event-based scripting subsystem, and can be extended using any .NET language.

Fiddler is freeware and can debug traffic from virtually any application that supports a proxy, including Internet Explorer, Google Chrome, Apple Safari, Mozilla Firefox, Opera, and thousands more. You can also debug traffic from popular devices like Windows Phone, iPod/iPad, and others.

To debug applications you've written in Java, .NET, or using WinHTTP, see this page.

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

Долгое время я удивлялся, что же такого ценного в Google+ для Google и почему они так сильно его продвигают. В конце концов, Google уже пробовала «социальность» до этого и многие говорили, что Google нужно сконцентрироваться на его основном бизнесе – поиске, и оставить «социальность» для других. Но что если у них не было выбора? Что если они в действительности нуждались в социальности и нуждались очень сильно?

Эта статья описывает гипотетическую возможность того, что Google+ может иметь крупное стратегическое значение для Google в его основном бизнесе – поиске.

Недавно я постил новость о том, что команда UALinux создала репозиторий с играми для Ubuntu. Согласно информации от UALinux, репозиторий стал очень популярным среди пользователей Ubuntu, и по статистике обращения к репозиторию ребята выстроили рейтинг десяти самых популярных игр из представленного списка (а он весьма немаленький).

Рано утром Хабр «выкатил» своё новое обновление, и я с чистой совестью достаю эту статью из черновиков.
Вчера у меня случился epic fail и этот топик частично, включая строчку об апдейте выше, попал в паблик на пару секунд. За эти секунды топик успело плюсануть несколько человек.
Ещё раз, теперь публично, прошу прощения у администрации!
Совет остальным — НИКОГДА не храните в черновиках информацию вроде этой.

В последнее время в сети Интернет можно найти очень много пособий для «Начинающих хакеров», в которых подробно описываются все основные методы взлома сайтов. Думаете, веб-разработчики стали от этого умнее и предприняли все возможные методы для защиты? Я так не думаю.

В настоящей статье я хочу ещё раз поведать разработчикам о том, как ломают сайты, а чтобы вам не было скучно, я попутно буду ломать Хабр и подробно описывать, как я это делал. Мы рассмотрим такие интересные штучки, как «Активная XSS в профиле», «Бесконечное обнуление кармы», «Публикация топиков со значком 'Из песочницы'», «CSRF через Flash и дыру в Internet Explorer 6» и многое другое.

Все уязвимости уже исправлены. Ну или почти все. Поэтому, если вы найдёте очередную дыру, то пишите на support@habrahabr.ru — миф о том, что эту почту никто не читает всего лишь миф.

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

Шпаргалка по электронным компонентам (PDF, 168Kb)
Шпаргалка по контроллерам AVR (ч.1) (PDF, 61Kb)
Шпаргалка по контроллерам AVR (ч.2) (PDF, 61Kb)

PS: Там же, на сайте, имеется любопытный блог с описанием эффектных электронных поделок. Культура исполнения на высоте, приведены ссылки на open source прошивки.