Обновить
256K+

Веб-разработка *

Делаем веб лучше

325,61
Рейтинг
Сначала показывать
Порог рейтинга
Уровень сложности

Десять заповедей React компонентов

Время на прочтение11 мин
Охват и читатели12K

the-10-component-commandments


Написано Kristofer Selbekk, в сотрудничестве с Caroline Odden. Основано на лекции с таким же названием и с теми же людьми, состоявшейся на встрече ReactJS в Осло в июне 2019 года.

От переводчика — оригинальное название The 10 Component Commandments не упоминает React, но большинство примеров и рекомендаций относятся именно к реакту, к тому же статья выложена под react тэгом и написана реакт разработчиками.


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


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

Читать дальше →

Анонс митапа, плавно переходящего в BeerPHP дринкап (в Москве и онлайне)

Время на прочтение5 мин
Охват и читатели3.7K
Привет, в августе мы проведем в Москве митап с докладчиками из других городов, встречей BeerPHP и трансляцией официальной части для всех, кто не сможет присоединиться.

Сегодня начинаем представлять докладчиков. Сергей Жук приедет на митап из Брянска — в его городе нет тусовки, а ему есть что рассказать об асинхронном PHP: он написал об этом книги, серию статей и не только. Ниже — расшифровка недавнего подкаста об этом, ссылки на прослушивание и просмотр выпуска, а также детали о самом митапе.



Пётр Мязин aka PQR: Сегодня со мной на связи один из главных знатоков ReactPHP. Сергей, недавно я заходил на сайт reactphp.org и обнаружил тебя на главной странице. Ты достаточно много пишешь по теме, у тебя даже есть свой канал с видеороликами-инструкциями. Расскажи, как ты к этому пришел, что тебя зацепило в ReactPHP?
Читать дальше →

Обработка ошибок во Vue

Время на прочтение6 мин
Охват и читатели23K

Весь прошлый год я работал с моим любимым фреймворком, Vue.js, описывал и представлял его. И я понял, что ещё не разобрался с обработкой ошибок во Vue. Мне бы хотелось объяснить это тем, что я пишу идеальный код, но мы все знаем, как обстоит дело в действительности. В течение нескольких последних дней я экспериментировал с различными методами обработки ошибок, которые предоставляет Vue, и решил поделиться своими открытиями. Очевидно, что этот обзор не охватит все возможные сценарии, но я надеюсь, что он вам поможет!

Google заявляет, что «reCAPTCHA» не злоупотребляет данными о пользователях. Стоит ли этому верить?

Время на прочтение6 мин
Охват и читатели9.8K


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

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

Задания бывают разных видов: от расплывчатых букв, которые нужно распознать и вписать в поле, до фирменных слоганов вроде «Comfort Plus» на сайте Delta — как будто плачевное состояние современных авиаперевозок еще недостаточно антиутопично. Наиболее распространенным, однако, является принадлежащий компании Google сервис reCAPTCHA, третья версия которого была выпущена в конце 2018 года. Его задача — значительно сократить количество действий, требуемых от пользователя при входе на сайт, что достигается за счет присвоения пользователям неотображаемых оценок в зависимости от того, насколько «человеческим» является их поведение. В конце концов, изначальной задачей CAPTCHA было отсеять учетные записи ботов, которые заполоняют веб-сайты с не самыми честными целями.

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

Переведено в Alconost
Читать дальше →

Как UX-писатель помогает улучшить продукт

Время на прочтение10 мин
Охват и читатели11K
В сентябре прошлого года я завершил свой первый большой проект с интерфейсными текстами. Мне и раньше доводилось помогать коллегам-дизайнерам с формулировками, но обычно это были точечные изменения: придумать термин или фразу, сократить предложение, объяснить что-то простым языком. Здесь же я отредактировал тексты на 100+ экранах. Думаю, это хороший повод для статьи.

Предупрежу сразу: я не буду рассказывать, какие тексты нужны в заголовках и на кнопках — в интернете этого достаточно.

Эта статья — о UX-писательстве, организации работы и сложностях, с которыми мне пришлось столкнуться.



Читать дальше →

Что такое Deno и чем этот проект отличается от Node.js?

Время на прочтение6 мин
Охват и читатели29K
Райан Даль, создатель Node.js, потратил последние полтора года на работу над проектом Deno. Это — новая среда выполнения для JavaScript, которая должна исправить проблемы, присущие Node.js.

Не поймите меня неправильно. Платформа Node.js представляет собой замечательную серверную среду для выполнения JavaScript. Своей популярностью она обязана, преимущественно, огромной экосистеме, и, собственно, поддержке JavaScript. Однако Райан Даль признаёт, что кое-чему, касающемуся Node.js, ему стоило бы уделить больше внимания. Речь, в частности, идёт о безопасности, о модулях и об управлении зависимостями.


В его защиту можно сказать то, что он не мог знать о том, насколько популярной станет платформа Node.js за довольно короткий отрезок времени. Кроме того, в 2009 году JavaScript всё ещё выглядел как ограниченный и странный язык, над которым издевались все, кому не лень. Также надо отметить то, что в те времена многих возможностей JavaScript, привычных в наши дни, ещё не существовало.
Читать дальше →

А мишка-то, похоже, высоконагруженный

Время на прочтение11 мин
Охват и читатели7.5K
В конце июня Новосибирск второй раз принимал HighLoad++. Если в прошлом году эффект новинки сыграл свою немалую роль в том, что все всем были довольны, то в этот раз нам нужно было подготовиться гораздо тщательнее, чтобы сохранить и превзойти впечатление. В первую очередь с утроенной силой мы взялись за главное — программу. Теперь, когда выступления состоялись и даже уже выборочно пересмотрены по второму кругу, собраны и обработаны отзывы участников конференции, можно уверенно заявить, что удалась она на славу. 

Основу HighLoad++ Siberia составили 38 отличных докладов, полных опыта и глубочайшей экспертизы. Международные гиганты и региональные компании — все делились опытом работы с задачами, для решения которых стандартных средств просто не существует. А особенной конференцию сделали люди. Мы честно пытались понять, в чем дело, и как сделать настолько же душевные мероприятия в других местах, но нет — за непередаваемой дружественной атмосферой придется снова ехать в Сибирь, и мы только за. К тому же мы уже думаем над новинками.



Медведя привезли с собой, ни один представитель местной фауны не пострадал.

Эксплуатация cookie-based XSS | $2300 Bug Bounty story

Время на прочтение7 мин
Охват и читатели17K


Уже на протяжении довольно длительного времени я охочусь за уязвимостями на платформе HackerOne, выделяю некоторое количество времени вне основной работы, чтобы проверить любимые и новые программы. Бесчисленное количество раз приходилось натыкаться на cookie-based XSS уязвимость, которая и станет главной героиней этой статьи. Данный тип уязвимости возникает, когда значение параметра cookie рефлектится на страницу. По умолчанию они считаются self-XSS, если мы, в свою очередь, не докажем их опасность. Собственно, сегодня я расскажу, как эксплуатировать cookie-based XSS уязвимости, а также приведу пример из тестирования одной компании, от которой я получил $7300 в целом за исследование.
Читать дальше →

«Под капотом» Турбо-страниц: архитектура технологии быстрой загрузки веб-страниц

Время на прочтение7 мин
Охват и читатели14K
Привет, меня зовут Стас Макеев. В Яндексе я руковожу разработкой технологии Турбо-страниц, которая обеспечивает быструю загрузку контента даже при медленном соединении. Сегодня я расскажу читателям Хабра немного об архитектуре нашего проекта.

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

Средняя скорость загрузки в российских мобильных сетях составляет 16,26 Мбит/с — это довольно хороший показатель. Но скорость соединения неравномерна, мы всё ещё сталкиваемся с медленным интернетом — 3G, 2G, EDGE. Наверняка вы были в ситуации, когда в кафе или торговом центре, в дороге или на даче сильно снижается привычно высокая скорость: сайты загружаются десятки секунд, а то и дольше.

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


Читать дальше →

Серверный рендеринг в бессерверной среде

Время на прочтение11 мин
Охват и читатели6.8K
Автор материала, перевод которого мы публикуем, является одним из основателей проекта Webiny — бессерверной CMS, основанной на React, GraphQL и Node.js. Он говорит, что поддержка многоарендной бессерверной облачной платформы — это дело, которому свойственны особенные задачи. Написано уже много статей, в которых идёт речь о стандартных техниках оптимизации веб-проектов. Среди них — серверный рендеринг, использование технологий разработки прогрессивных веб-приложений, разные способы улучшения сборок приложений и многое другое. Эта статья, с одной стороны, похожа на другие, а с другой — от них отличается. Дело в том, что она посвящена оптимизации проектов, работающих в бессерверной среде.


Читать дальше →

WeakRef — предложение для добавления в стандарт ECMAScript

Время на прочтение2 мин
Охват и читатели5.2K

Написал небольшой пост в своём телеграм-канале. Подумал, что она может быть интересна читателям Хабра.


Недавно в блоге V8 появилась статья, посвящённая новому пропозалу WeakRef (Stage 3) — "Weak references and finalizers".


Попробую объяснить своими словами его суть на примере. Представьте, что у вас в браузере происходит какая-то обработка изображений, например, на них накладывается водяной знак (согласен, пример не очень реалистичный), а затем эти изображения как-то используются. Водяной знак накладывается функцией, которая интенсивно потребляет CPU. Изображения могут повторяться, поэтому, чтобы лишний раз не загружать процессор, мы создаём кеш изображений с водяным знаком в Map, ключом пусть выступает название файла изображения. Но тут возникает проблема, если какое-то изображение не будет нами использоваться, оно всё равно будет находиться в памяти, так как Map по ключу будет на него ссылаться (strong reference). Поэтому, чтобы наш Map не отжирал лишнюю память, необходимо как-то определять такие ситуации и руками чистить кеш. Это не очень удобно.

Читать дальше →

Stop the line или прокачай свой pipeline, йоу

Время на прочтение11 мин
Охват и читатели8.7K
Если ваши релизы быстры как молния, автоматизированы и надежны, можете не читать эту статью.

Раньше наш процесс релиза был ручным, медленным и напичканным ошибками.
Мы проваливали спринт за спринтом, потому что не успевали сделать и выложить фичи к следующему Sprint Review. Мы ненавидели наши релизы. Часто они длились по три-четыре дня.

В этой статье мы опишем практику Stop the Line, которая помогла нам сфокусироваться на устранении проблем конвейера выкладки. Всего за три месяца нам удалось увеличить скорость деплоя в 10 раз. Сегодня наш деплой полностью автоматизирован, а релиз монолита занимает всего 4-5 часов.

Читать дальше →

Из веба и банков в iOS-разработку: личный опыт программиста Apiqa

Время на прочтение5 мин
Охват и читатели7.2K

Команда Apiqa занимается продуктовой разработкой для специфической сферы ЖКХ. Найти опытных разработчиков в Екатеринбурге непросто — здесь за ними охотятся крупные IT-компании, многие кандидаты уезжают в столицы или покидают страну, а удалённое сотрудничество на текущем этапе нам не подходит. Мы выращиваем сотрудников внутри компании, идём им навстречу и стараемся обеспечивать комфортные условия работы. Так, один из наших веб-разработчиков в прошлом году решил попробовать себя в программировании для iOS. Мы помогли ему совершить этот переход плавно, сейчас он параллельно занимается и вебом, и мобильной разработкой. А теперь он готов поделиться своей историей от первого лица. Добро пожаловать под кат.

Читать дальше →

Ближайшие события

Quasar 1.0: новый полезный инструмент для Vue-разработчиков и не только для них

Время на прочтение6 мин
Охват и читатели27K
Автор материала, перевод которого мы публикуем сегодня, занимается работой над фреймворком Quasar. Это — полнофункциональный расширяемый опенсорсный инструмент для разработки современных приложений различного назначения. Он построен на базе популярного фронтенд-фреймворка Vue.js и использует возможности Node.js, Webpack и Babel. Совсем недавно, в начале июля сего года, вышел первый стабильный релиз Quasar.

Читать дальше →

Разработка под Docker. Локальное окружение. Часть 2 — Nginx+PHP+MySql+phpMyAdmin

Время на прочтение6 мин
Охват и читатели59K
Для лучшего понимания нижеследующего материала сначала рекомендуется ознакомится с Предыдушим постом

Рассмотрим пример развертки локального окружения состоящего из связки Nginx+PHP+MySql+phpMyAdmin. Данная связка очень популярна и может удовлетворить ряд стандартных потребностей рядового разработчика.

Как и в прошлом посте акцент будет смещен в сторону утилиты docker-compose, чем докера в чистом виде.

Итак, поехали!
Читать дальше →

OData сервис без написания кода

Время на прочтение4 мин
Охват и читатели7.4K

Одним из наиболее важных аспектов разработки программного обеспечения является быстрое создание прототипов. Для большинства служб необходимы по крайней мере некоторые операции CRUD, и большинство приложений можно описать как приложения, управляемые данными. API, которые я пишу, в основном берут данные из базы данных и возвращает их клиенту в виде JSON. OdataToEntity — это инструмент, который генерирует API из базы данных и устраняет необходимость в написании отдельного REST API.

Читать дальше →

Битрикс и обновление MariaDB до последней стабильной версии

Время на прочтение5 мин
Охват и читатели11K
Доброго времени суток, уважаемые Хабровчане! Разрешите представиться, Александр. Системный администратор одной маленькой но гордой WEB-студии. Мы очень хотим, чтобы все работало быстро, безопасно и со свежим софтом. Для этого даже подняли на внутриофисном компе связку nagios+PhantomJS и каждые 30 минут проверяем скорость загрузки страниц. По условиям обслуживания, мы так-же следим за обновлениями 1С-Битрикс и регулярно устанавливаем их. И вот однажды после очередного обновления видим сообщение в админке о том, что с лета 2019 1С-Битрикс перестает работать с MySQL 5.5 и надо обновляться. Ребята из ISPSystem красавцы и регулярно расширяют функционал панели за что им отдельное спасибо. Но в этот раз не получилось накликать все мышью. А вот о том, что получилось и сколько седых волос теперь в моей бороде можно узнать под катом.
Читать дальше →

PHP-Дайджест № 160 (1 – 15 июля 2019)

Время на прочтение3 мин
Охват и читатели15K

Свежая подборка со ссылками на новости и материалы. В выпуске: PHP 7.4.0 alpha 3, ReactPHP 1.0 LTS, порция полезных инструментов, видеозаписи с конференций, подкасты и многое другое.

Приятного чтения!


Читать дальше →

Инструменты Node.js разработчика. Удаленный вызов процедур на веб-сокетах

Время на прочтение7 мин
Охват и читатели6.8K
О технологии websocket часто рассказывают страшилки, например что она не поддерживается веб-браузерами, или что провайдеры/админы глушат трафик websocket — поэтому ее нельзя использовать в приложениях. С другой стороны, разработчики не всегда заранее представляют подводные камни, которые имеет технология websocket, как и любая другая технология. По поводу мнимых ограничений сразу скажу, что технологию websocket сегодня поддерживают 96.8% веб-браузеров. Вы можете сказать, что оставшиеся за бортом 3,2% — это много, это миллионы пользователей. Я с Вами вполне соглашусь. Только все познается в сравнении. Тот же XmlHttpRequest, который все и уже не первый год используют в технологии Ajax, поддерживается 97.17% веб-браузеров (не сильно больше, правда?), а fetch — вообще, 93.08% веб-браузеров. В отличие от websocket, такой процент (а раньше он был еще меньше) уже давно никого не останавливает при использовании технологии Ajax. Так что использовать в настоящее время fallback на long polling не имеет никакого смысла. Хотя бы потому, что веб-браузеры, которые не поддерживают websocket — это те же самые веб-браузеры, которые не поддерживают XmlHttpRequest, и в реальности никакого fallback не произойдет.

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

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

Разработка под Docker. Локальное окружение. Часть 1

Время на прочтение3 мин
Охват и читатели79K
Возможно, одна из самых основных причин почему мне нравится докер это то, что он позволяет избавиться от необходимости установки на компьютер различных сервисов. К их числу можно отнести и сам веб-сервер Apache или Nginx, базы данных и прочие компоненты инфраструктуры приложения. Вся инфраструктура прописана в конфигурационном файле docker-compose.yml и запускается одной командой вместе с вашим приложением. Все что нужно разработчику работающему с докером, это по сути сам докер и любимая среда разработки и ВСЕ!
Читать дальше →