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

Если вообще не соблюдать правила гигиены, быть токсичным, не последовательным, корыстным, обманывать других, то до первых денег вообще не добраться. Представим, что все хорошо, вы все молодцы и не за горами время, когда пойдет первая серьезная прибыль. Тут рушатся воздушные замки, которые были так скрупулезно выстроены каждым членом команды. Первый думал, что он главный и он заберет 80% прибыли, так как именно он продал машину и на его деньги жила первое время вся команда. Второй думал, что два основателя получат по 50%, так как он программист и создал то самое приложение, на котором все сейчас зарабатывают. Третий и четвертый думали, что они получат долю в бизнесе, как только пойдут деньги, ведь они работали почти круглосуточно и получали значительно меньше, чем могли бы в том же банке.

В итоге бизнес под угрозой развала. А ведь всего бы этого можно было бы избежать, правильно договорившись на берегу. Как?

Рендеринг текста: насколько сложным он может быть? Оказывается, невероятно сложным! Насколько мне известно, буквально ни одна система не выводит текст «идеально». Где-то лучше, где-то хуже.

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

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

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

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

Вообще говоря, пробел — это любое пустое место в рукописном, печатном или отображаемом на любом другом носителе тексте. Так что пробелы бывают разные:

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

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

База данных стран, регионов и городов под лицензией MIT. База данных представлена в виде sql скрипта для PostgreSQL. При запуске скрипт создает необходимые таблицы и заполняет их данными. База данных содержит:

Страны	218
Регионы	1611
Города	17287

Многим известно, что в мобильной версии Safari можно отсканировать свою банковскую карту. Но многие ли разработчики умеют создавать формы, поддерживающие эту возможность?

Готов поспорить, что немногие.

Дело осложняет полное отсутствие документации от Apple по работе этой функции. Но тут есть один момент. Функция сканирования банковских карт является подмножеством автозаполнения — браузерного функционала, давно игнорируемого веб-разработчиками. Понятно, почему они не уделяли ему должного внимания: когда регулярно заполняешь форму тестовыми данными, автозаполнение обычно мешает. Но для наших пользователей это важная функция. В Google выяснили, что при использовании автозаполнения пользователи на 30% быстрее заполняют формы. Так что давайте изучим работу автозаполнения, разберёмся, как создавать формы, поддерживающие кросс-браузерное автозаполнение, и воспользуемся преимуществами новых возможностей наподобие сканирования банковских карт.

Большинство создают внешние ссылки через target="_blank" и не знают одного интересного нюанса — страница, на которую мы попадем таким образом, получит частичный контроль над ссылающейся на нее страницей через js свойство window.opener.

Через window.opener.location мы сможем сделать редирект на, к примеру, фишинговую страницу. Это своего рода tabnabbing, только более продвинутый. Так как жертва меньше всего ожидает подмены страницы, в открытой ранее, доверенной вкладке браузера.

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

Я хочу представить 5 проектов с открытым исходным кодом, которые я изучаю сам и советую остальным.

Всем привет!

Две недели назад в Москве прошла очередная встреча CodeFreeze. Нашим гостем стал Евгений Кривошеев, признанный российский эксперт в области архитектуры программных систем, консультант из Scrumtrek/Skilltrek. Евгений прочитал офигеннейшую лекцию по архитектуре, как он любит и умеет.



В рамках этой встречи Евгений предложил обсудить последовательность решений, критичных для архитектуры любой системы. Выстраданная последовательность действий такова:

• Точки зрения на систему, или Почему мы слепнем при проектировании
• Адресация ключевых рисков, или Гордыня убивает
• Учитываем контекст, или Как не долбиться в закрытую дверь

Интро

Не так давно я выступал на конференции FrontendConf 2015 (РИТ++) с темой данной статьи. И при подготовке доклада начал искать информацию, а кто вообще выступал на данную тему и что есть в Сети на данный момент.

Оказалось, что информации совсем немного, более-менее можно было бы отметить доклад mikewest.org/2013/09/frontend-security-frontendconf-2013 от Mike West из компании Google, но какой-то «непентестерский» взгляд и уж совсем мало материала. И www.slideshare.net/eoftedal/web-application-security-in-front-end где тема раскрыта более детально, но выступление 2011 года. А за 4 года технологии и атаки на месте не стояли.

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

О чем вообще разговор?

А действительно, о чем тут вообще можно разговаривать? Говоря про взломы и безопасность невольно приходят в голову тезисы — слили базу, получили доступ к выполнению команд ОС на сервере, прочитали чужую переписку. Но это все — server side код. А что ж может «нагородить» фронтэндер? Главная опасность, конечно же, в обходе атакующим SOP — Same Origin Policy, главной политики безопасности браузеров, которая регулирует работу в разных Origin. Но не только, давайте разбираться.

От переводчика

Рад приветствовать тебя, %юзернейм%!

Я новичок в профессии дизайнера интерфейсов, и как-то давно, листая вакансии, меня заинтересовали требования к одной из них. Среди таких, как знание пакета Adobe, средств прототипирования и навыков в области ux/ui я прочитал, что соискателю именно на эту вакансию неплохо было бы уметь держать порядок в слоях, структуре и названиях файлов и папок, а так же знать и уметь применять на практике то, что называется pixel perfect. Меня это заинтересовало, так как на моей работе ни от меня, ни от других сотрудников этого не требуют, но я всегда старался этого придерживаться и даже пытался убедить в этом других, но мне почему-то не хватало аргументов, чтобы объяснить, для чего это нужно.

С понятием pixel perfect я вообще на тот момент не был знаком, только слышал где-то пару раз, и так как этот пункт стоял в конце списка требований «аккуратности», я понял, что это что-то вроде апогея, вершины айсберга в организации работы над макетами.

Я стал искать, но ничего, кроме статьи на Хабре из пары абзацев про Pixel perfect от программиста не нашёл. Потом я как-то услышал о Monument Valley, и даже наткнулся на справочник Pixel Perfect Precision, но времени изучать так много информации на английском как-то не было, и первый раз он меня не зацепил. Стало появляться время и вышли некоторые статьи, одна из которых, наполненная практическими советами по Pixel Perfect зацепила меня, и я решил не просто прочитать и понять, а ещё и перевести по возможности литературно, чтобы дать вопросу широкую известность, и распространить тему на Хабре.

Небольшой технический момент. Оригинальная статья с Tuts+ называется «How to Create Pixel Perfect Artwork Using Adobe Illustrator», при этом я могу вас уверить, что большая часть из предложенных в статье настроек присутствует и в Adobe Photoshop CS6, а уж в Adobe Photoshop CC вообще можно повторить всё это полностью.

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

Краткое содержание

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

Настройки Abobe Illustrator

1. Edit > Preferences > Units > General → Pixels
   Edit > Preferences > Units > Stroke → Pixels
2. Edit > Preferences > Guides & Grid > Gridline every → 1px
   Edit > Preferences > Guides & Grid > Subdivisions → 1px
3. Edit > Preferences > General > Keyboard Increment → 1px
4. View > Snap to Grid
   View > Snap to Point
5. View > Pixel Preview

Не благодарите.
Всех заинтересовавшихся прошу пройти под кат.

Как создавать pixel perfect изображения в Adobe Illustrator

Суффиксное дерево – мощная структура, позволяющая неожиданно эффективно решать мириады сложных поисковых задач на неструктурированных массивах данных. К сожалению, известные алгоритмы построения суффиксного дерева (главным образом алгоритм, предложенный Эско Укконеном (Esko Ukkonen)) достаточно сложны для понимания и трудоёмки в реализации. Лишь относительно недавно, в 2011 году, стараниями Дэни Бреслауэра (Dany Breslauer) и Джузеппе Италиано (Giuseppe Italiano) был придуман сравнительно несложный метод построения, который фактически является упрощённым вариантом алгоритма Питера Вейнера (Peter Weiner) – человека, придумавшего суффиксные деревья в 1973 году. Если вы не знаете, что такое суффиксное дерево или всегда его боялись, то это ваш шанс изучить его и заодно овладеть относительно простым способом построения.

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

ICEcoder

Это не просто песочница, а полноценный open source редактор в вашем браузере. Вообще существуют десктопные версии, но по-моему, наибольшие внимание разработчики уделают веб-версии. ICEcoder поддерживает HTML, CSS, LESS, SASS, JS, Coffee, PHP, RonR, Python, C/C++/C#, Java, Lua, Rust, SQL, Markdown, всего более 60 языков! Фичи: возможность совместной работы с кодом, Emmet, LiveReload, работа с БД, колопикер, diff tool, линтеры и еще целое множество удачных интерфейсных решений. Повторюсь — это все в вашем браузере!

Интернет 2.0: Введение

Интернет 2.0 — это эволюция существующего интернета, его продолжение, дарующее пользователям интернета возможности быть свободными, ответственными за свою свободу, и самостоятельно управлять своим временем. Кроме того Интернет 2.0 позволяет активно защищать свои права на свободу и управление временем, а также соблюдать права других людей. Одной из таких частностей можно назвать Авторское право и т.д. и т.п., но! делать это самостоятельно.

Цели и задачи Интернета 2.0

1. Свобода и безопасность пользователей интернета, защита личной жизни и личной информации от посягательств других лиц, как средствами программного обеспечения так и личным участием (например, защита своего авторского права в кругу знакомых лиц)
2. Управление своим Временем — самостоятельно: Вы следуете своим жизненным интересам — другие люди не нарушают их и Вы не нарушаете их жизненные интересы. Интернет 2.0 оказывает в этом помощь и поддержку Вам и всем другим людям одинаково(использующее соответствующее ПО).
3. Максимальная универсальная технологическая свобода и доступность для рядовых пользователей: им не нужно знать что в их компьютере находится (PCI, HDD, DDR, USB, CPU и т.д.); они просто втыкают один контакт в другой и пользуются, при этом не нужно покупать новый быстрый компьютер — эти технологические усовершенствования делаются на суперкомпьютерах
4. Максимально эффективная экономическая свобода и информационная обеспеченность: Вы оплачиваете не потенциальные возможности, а реально используемые, при этом владеете ситуацией Вы, а не компания, предоставившая сервис. При чем Вы оплачиваете расходы на содержание сервиса из своего кармана и компания обязана перед Вами и другими людьми прозрачно отчитываться о ведении своих дел и предоставляемом сервисе. Вы в праве, с помощью голосования, определять действия этой компании по своим потребностям и потребностям других людей на общее благо, а не в шкурных интересах этих компаний.

По результатам поста про замечательные свойства детской порнографии и последующего обсуждения в комментариях стало понятно, что значительная часть людей не представляет себе, сколько стоит создание музыки. Сами музыканты говорят, что дорого, но «дорого» — величина неизмеримая. Кто-то говорит наоборот, что кроме пчёл всё фигня, а авторам просто хочется на хлеб с маслом и икрой, когда, меж тем, артист должен быть голодным.

Поэтому я решил рассказать, сколько стоит создание музыки на самом деле. Безотносительно позиции в адрес копирайта, просто конкретные цифры. Чтобы не устраивать «испорченный телефон», я буду рассказывать о том, с чем мне приходится работать, а именно о рок-группе с составом в шесть человек: ударные, бас, ритм-гитара, соло-гитара, клавиши и вокал. Бэк-вокал также присутствует, но под него отдельный человек не выделен.

Интересно? Прошу под кат.

Осторожно, трафик! Но можно хотя бы посмотреть картинки )

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

OAuth — популярный протокол, который позволяет социальным сервисам интегрироваться между собой и дает безопасный способ обмена персональной информацией. OAuth может связать между собой 2 сервиса, каждый из которых имеет свою пользовательскую базу — именно их я в данном случае называю «социальными». Когда начинаешь работать с OAuth, первое ощущение — что протокол весьма сложен и избыточен. В этой статье я попытаюсь объяснить основы OAuth человеческим языком.

Пример кросс-авторизации

Вернемся в 2005-й год и представим, что мы пишем социальную сеть. В ней имеется форма импорта контактов из адресной книги GMail. Что нужно для доступа к контактам GMail? Конечно, логин и пароль от ящика. Но если мы попросим ввести их на нашем сайте, пользователь заподозрит неладное. Где гарантия, что мы не сохраняем на сервере введенные пароли? Поэтому нам хочется, чтобы пароль вводился только на сайте GMail, и после этого доступ к контактам через API GMail предоставлялся нашей социальной сети (возможно, на время).

А у вас есть визитка?

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

Креативные визитки

Программист

Обсуждая Facebook, многие вещи можно назвать впечатляющими, даже по стандартам Кремниевой Долины.

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

Поэтому нет ничего удивительного в том, что интеллектуальная мафия Facebook создала портфель из таких громких стартапов как Quora, Cloudera, Jumo, Asana, Path, а так же многих других. Все они появились на свет и достигли зрелости очень быстро, фактически — еще раньше чем случилось «самое главное» для Facebook. Как и большинство вещей которые делают Facebook уникальным местом в интернете, вышеперечисленные стартапы многим обязаны не только Цукербергу с его творением, но и времени, в котором они выросли.

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

К тому же, большинство технологических компаний очень любят инвестировать «в своих». Это со-инвестирование и поддержка друг-друга позволяет оставлять все богатство «в семье». И несмотря на то что огромное количество умных людей, предпринимателей и ангел-инвесторов вышло из Google, Yahoo, eBay, Amazon и Microsoft, их гигантский бизнес не позволяет внутри зародиться «мафии» о которой мы говорим, способной катализировать в один момент и привнести в мир много нового, разного и классного.