Доступ к объемным файлам и различные внешние динамические данные часто являются очень важной частью децентрализованного приложения. При этом в самом по себе Ethereum механизма обращения наружу не предусмотрено — смарт контракты могут читать и писать только в рамках самого блокчейна. В этой статье рассмотрим Oraclize, который как раз дает возможность взаимодействия с внешним миром путем запросов к практически любым интернет-ресурсам. Смежной темой является IPFS, вкратце упомянем и о ней.

Библиотека puppeteer для Node.js позволяет автоматизировать работу с браузером Google Chrome. В частности, с помощью puppeteer можно создавать программы для автоматического сбора данных с веб-сайтов, так называемые веб-скраперы, имитирующие действия обычного пользователя. В подобных сценариях может применяться браузер без пользовательского интерфейса, так называемый «Headless Chrome». Используя puppeteer, можно управлять и браузером, который запущен в обычном режиме, что особенно полезно при отладке программ.

Сегодня мы поговорим о создании веб-скрапера на базе Node.js и puppeteer. Автор материала стремился к тому, чтобы статья была интересна как можно более широкой аудитории программистов, поэтому пользу из него извлекут как те веб-разработчики, которые уже имеют некоторый опыт работы с puppeteer, так и те, которые впервые сталкиваются с таким понятием, как «Headless Chrome».

Общая рыночная капитализация глобального рынка криптовалют за последний год выросла с $6 млрд (в январе 2016 года) до $28 млрд (на текущий момент). С начала 2017 года рынок криптовалют вырос примерно в полтора раза. На биржах торгуются уже больше сотни разных криптовалют. Крупные организации объединяются в консорциумы, чтобы выпускать свою валюту. Даже государства делают свои национальные криптовалюты. Технологии блокчейна дошли до такого уровня, что уже почти любой может запустить свою криптовалюту, чем мы в этой статье и займемся. Легче всего создать свои монеты на смарт контрактах на базе ethereum.

Предисловие переводчика

Предлагаю читателям Хабрахабра перевод статьи «The Blockchain Explained to Web Developers, Part 1: The Theory» за авторством Francois Zaninotto. Эту статью я нашел в блоге компании Marmelab. Статья представляет собой отличное введение в технологию блокчейн «с нуля», но может оказаться интересной и для тех, кто уже «в теме». Она касается не только того, как работает блокчейн, но и перспектив его развития, а также с чего начать, если вы хотите создать свой проект, использующий блокчейн.

Объяснение блокчейна для веб-разработчиков, Часть первая: Теория

Блокчейн – это новая популярная технология. Даже если вы не слышали о ней, вы, вероятнее всего, знаете о Bitcoin. Блокчейн — это одна из фундаментальных технологий на которых основан Bitcoin. Эксперты говорят, что блокчейн вызовет революцию схожую с той, которую некогда вызвал Интернет. Но что это на самом деле и как его можно использовать для создания приложений? Эта статья является первой в серии из трех, рассказывающей о феномене Блокчейна. Мы обсудим теорию, покажем фактический код и поделимся своим опытом, основанным на реальном проекте.

На протяжении своей карьеры я слышал множество аргументов о длине функции. Более глубокий вопрос — когда код нужно выносить в отдельную функцию? Иногда рекомендации основаны на размере, например, функция должна помещаться на экране. Другие основаны на повторном использовании — любой код, используемый больше одного раза, должен быть вынесен в отдельную функцию. Но если код используется лишь один раз, то можно его оставить на месте. Мне кажется, что большим смыслом обладает аргумент о разделении намерения и реализации. Если нужно потратить время на поиски фрагмента кода чтобы понять, что он делает, то нужно вынести его в функцию и дать ей такое имя, которое отвечает на вопрос "что". Тогда в следующий раз смысл функции сразу будет очевидным, и в большинстве случаев вас не будет волновать то, как функция выполняет свою работу. Иными словами — что происходит в теле функции.

Когда я стал применять такой принцип, я развил в себе привычку писать очень маленькие функции — обычно не больше нескольких строк. Любая функция длиннее шести строк уже попахивает. Вполне обычное дело для меня — иметь функцию с одной строчкой кода. Кент Бек показал мне когда-то пример из оригинальной системы Smalltalk, и это помогло мне по-настоящему понять, что размер — это не важно. Smalltalk в те годы работал на черно-белых машинах. Если нужно было подсветить текст или графику, то приходилось реверсировать видео. Класс в Smalltalk, отвечающий за графику, содержал метод 'highlight', и в его реализации была лишь одна строка — вызов метода 'reverse'. Название метода было длиннее реализации, но это не имело значения, потому что между намерением и реализацией этого кода — большое расстояние.

Эта статья о том, как написать универсальный JavaScript-компонент, который можно будет использовать

• как React-компонент;
• как Preact-компонент;
• как Angular-компонент;
• как Web Component;
• как jQuery функцию для рендеринга в DOMElement;
• как нативную функцию для рендеринга в DOMElement.

Зачем и кому это нужно

Мир JavaScript-разработки очень фрагментирован. Есть десятки популярных фреймворков, большая часть из которых абсолютно несовместима друг с другом. В таких условиях разработчики JavaScript-компонентов и библиотек, выбирая один конкретный фреймворк, автоматически отказываются от очень большой аудитории, которая данный фреймворк не использует. Это серьезная проблема, и в статье предложено ее решение.

Современная разработка веб-интерфейсов сосредоточена вокруг нескольких больших сообществ. На протяжении последних пяти лет React завоевывал симпатии программистов из самых разных отраслей. React – это одна-единственная библиотека, сделавшая MVC рудиментарным в программировании веб-интерфейсов. Сегодня React используется крупнейшими компаниями для разработки самых разнообразных продуктов — Facebook, Airbnb, BBC, Coursera, eBay, Expedia, IMDB, список можно продолжать.

Одной из уникальных особенностей мира React является крупнейшее и очень активное сообщество опенсорс-разработчиков вокруг него. Max Stoiber — один из людей, благодаря которым React стал тем, чем он является на сегодня как проект. На протяжении последних нескольких лет он работал над популярнейшим boilerplate проектом в сообществе и внедрял новейшие и лучшие технологии в массовое использование.

Мы поговорили с Максом о новых веяниях в сообществе, о статической типизации для разработки с React, о новом подходе стилизации компонентов и о snapshot-тестировании.

К секретам разработки на React можно приобщиться ниже в интервью.

Автоматизированные тесты – это хорошо. Проект, который на 100% покрыт тестами, преподносит покрытие как преимущество. Но…

Думаю, что в этом процессе нет осознанности. А она сильно облегчает жизнь. Возможно, что половина тестов в вашем проекте не только бесполезна, более того — несет вред. Ниже расскажу о том, какие тесты писать не нужно.

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

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

Реми Шарп — создатель таких сайтов, как сonfwall, jsbin.com, html5demos.com, responsivepx.com, nodemon, mit-license.org, snapbird.org, 5 minute fork и jsconsole.com. Предлагаю вашему вниманию перевод статьи Реми Шарпа «Почему я люблю работать с вебом».

«Легко значит скучно. Вот почему я люблю веб и браузеры» – автор

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

Круто, конечно, если посетитель использует современный и мощный настольный компьютер. Но так же вероятно и то, что он просматривает веб-сайт с рабочего компьютера, используя старый и встроенный браузер Internet Explorer 8.

Дуглас Крокфорд как-то сказал:

«Веб — это наиболее враждебная среда разработки, которую только можно представить».

И он чертовски прав. Это та враждебность, которая даёт мне доступ в мир. Это та «враждебность», которую я называю своим ежедневным вызовом.

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

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

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

Перевод Анастасии Грызуновой, Яны Щекотовой. Приведение текста в порядок — CaptainCrocus.

Оригинал — Hackers and Painters (May 2003)


Закончив аспирантуру по computer science, я пошел на художественный факультет изучать живопись. Многие удивились, что компьютерщик вдруг заинтересовался живописью. Эти люди, видимо, считали, что хакерство и художество — очень разные занятия: хакерство — холодное, точное и методичное, а художество — яростное выражение некого первобытного порыва.

Оба представления неверны. У хакерства и художества масса общего. Из множества различных типов людей хакеры и художники — едва ли не самые похожие.

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

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

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

Сравнительно недавно я решил перевести домашний компьютер с Windows на Linux. То есть идея такая бродила уже некоторое время, подогреваемая новостями с фронтов борьбы с добровольно-принудительной установкой Windows 10 и размышлениями о неизбежном устаревании «семерки» следом за XP, а вот поводом взяться за дело стал выход очередного LTS-релиза Ubuntu. При этом основным мотивом такого перехода я назову простое любопытство: домашний компьютер используется в основном для развлечений, ну а знакомство с новой ОС — развлечение не хуже прочих. Причем развлечение, как мне кажется, полезное в плане расширения кругозора. Дистрибутив же от Canonical был выбран просто как наиболее популярный: считаю при первом знакомстве с системой это немаловажным подспорьем.

Довольно быстро я на собственном опыте убедился, что для котиков и кино Ubuntu вполне подходит. Но, поскольку компьютер используется еще и для удаленной работы, для отказа от Windows не хватало настроенного подключения к Cisco VPN c авторизацией по eToken.

Набор программ

Было ясно, что для подключения понадобятся по меньшей мере драйвер токена и некий VPN-клиент. В результате поисков в сети получился такой список:

1. OpenConnect — VPN-клиент, «совершенно случайно» совместимый с серверами Cisco «AnyConnect»
2. GnuTLS — свободная реализация протоколов TLS и SSL. Что важно, в состав этой библиотеки входит утилита p11tool для работы со смарт-картами
3. SafeNet Authentication Client — набор драйверов и дополнительных утилит, обеспечивающий работу с электронными ключами eToken

Поскольку для установки соединения OpenConnect-у требуется URL сертификата клиента, который можно узнать с помощью утилиты p11tool, и обеим программам требуется драйвер для работы со смарт-картой — с установки этого драйвера и начнем.

(у учебника по Основам React вышло второе издание, Redux-учебник в процессе обновления)

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

Курс про Redux попал в официальную документацию.

Оба руководства бесплатны и выложены на gitbook (можно скачать PDF, ePub, mobi).

В текстах нарочно участвуют термины переведенные на русский (например, состояние), английские (state), либо английский термин написанный по-русски — стейт. Считаю это допустимым, и даже более того, удобным для читателя.

Нам в Хекслете нравится ReactJS и Flux. Нам кажется, что это правильное направления развития. Мы любим функциональное программирование и чистые функции, и когда сложные архитектуры упрощаются за счет подходов, связанных с ними — это круто. По Реакту уже есть немало ресурсов в интернете, в том числе наш практический курс по React JS. Последний урок в этом курсе называется «Однонаправленное распространение данных», и там мы подходим к интересной теме, которая лежит в основе архитектуры Flux.

Flux это паттерн распространения даных в приложении. Flux и React выросли в стенах Фейсбука вместе. Многие используют их одновременно, но ничто не мешает использовать их по отдельности. Они были созданы для решения конкретной проблемы в Фейсбуке.

Мы используем React и Flux в своей браузерной среде разработки Hexlet IDE (она в опен-сорсе), в которой учащиеся выполняют практические задания. Flux одновременно очень популярен и очень непонятен для многих в мире веба. Сегодняшний перевод — попытка объяснить Flux на пальцах (ну, то есть картинках).

Проблема

Вначале нужно понять, какую проблему решает Flux.

Итак, я знаю что ты любишь Todo списки, то есть, что тебе очень нравится писать Todo списки, поэтому мне хочется, чтобы ты создал один из них, используя новый, восхитительный и питательный («nutritious» прим. пер.) Flux фреймворк, Redux! Я желаю тебе только лучшего.

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

• Цельнозерновой рендеринг на сервере
• Расширенный роутинг, богатый Omega-3
• Маслянистая асинхронная загрузка данных
• Гладкое функциональное послевкусие

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

Как-то обошло Хабр стороной появление видеокурса по Redux, созданного Даниилом Абрамовым, автором библиотеки. В первых роликах рассказывается о принципах Redux, а затем поэтапно разбирается разработка веб-приложения на нем.

Вот он: egghead.io/series/getting-started-with-redux

Под катом — перевод введения с сайта курса, egghead.io.

2015 год выдался богатым на нововведения, связанные с улучшениями веб-платформы. Аксель Рошмайер рассматривает 6 технологий, которые ему кажутся наиболее интересными:

1. Electron;
2. React Native;
3. Прогрессивные веб-приложения;
4. Visual Studio Code;
5. Rollup;
6. WebAssembly.

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

Предлагаю вашему вниманию перевод статьи "Advanced Javascript Properties" с сайта jstips.co.

Можно настроить объекты в javascript так, чтобы, например, установить им свойства псевдо-private или readonly. Эта функция доступна начиная с ECMAScript 5.1, поэтому поддерживается всеми браузерами последних версий. Чтобы сделать это, вам необходимо использовать метод defineProperty для Object, например так: