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

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

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

Меня зовут Евгений Тупиков, я ведущий PHP-разработчик в Badoo и Bumble. У нас в команде более 200 бэкенд-разработчиков, которые работают над сотнями модулей и отдельных сервисов в наших приложениях. Но поначалу всё было не так масштабно. В 2006 году это был один проект, над которым работала небольшая команда. Каждый разработчик хорошо понимал, как всё устроено: легко ориентировался в коде, знал, какие есть сервисы и как они взаимодействуют между собой. Однако по мере роста проекта всё больше времени занимал поиск «хранителей знаний» — тех, кто отвечает за ту или иную функциональность и к кому можно обратиться с вопросом или предложением. 

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

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

Пообщаться на важные именно для нас темы не только между собой, но и с представителями лучших топовых компаний и проектов в мире PHP — одна из самых главных активностей на конференции. В онлайне это сложно реализовать. Именно поэтому  мы  собираем всех вас вместе 28 июня. Из-за ковидных переносов конференции часть программы  PHP Russia 2021 поменялась. У кого-то из докладчиков изменились планы, и  мы нашли равноценную замену, пришли новые спикеры с неожиданно крутыми темами. В итоге примерно половина докладов были заменены.

Глобальное отличие от прошлой конференции — гибридный формат: она пройдёт одновременно офлайн и онлайн. Онтико сейчас проводит все конференции. В офлайне будет всё, как обычно: четыре зала, общение всех со всеми, обед и бесконечный кофе-брейк, небольшой фуршет с пивом и соками, афтепати и активности на стендах партнеров. Стенды, кстати, будут прикольные. Все партнеры используют PHP, и с ними будет интересно. А афтепати собирают ребята из московского Beer PHP. 

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

- Саш, админы говорят, что у нас 400 полетели адово. Глянь, в чем проблема.
- Странно… все же было хорошо.

Пару часов спустя...

- Коллеги, и в очередной раз у нас изменены контракты без согласования и оповещения! Это уже не первый случай!

Резюме

• html-cleaner.com
• html-online.com/editor/
• html5-editor.net
• htmlg.com
• … и другие

Обнаружение подозрительного

Я продолжаю серию публикаций адаптированного и дополненного перевода "Карманной книги по TypeScript".

Другие части:

• Часть 1. Основы
• Часть 2. Типы на каждый день
• Часть 3. Сужение типов
• Часть 4. Подробнее о функциях
• Часть 5. Объектные типы
• Часть 6. Манипуляции с типами
• Часть 7. Классы
• Часть 8. Модули

Обратите внимание: для большого удобства в изучении книга была оформлена в виде прогрессивного веб-приложения.

Функции — это основные строительные блоки любого приложения, будь то функции, импортируемые из другого модуля, или методы класса. В TS существует несколько способов описания того, как фукнции вызываются.

Тип функции в форме выражения (function type expressions)

Простейшим способом описания типа функции является выражение. Такие типы похожи на стрелочные функции:

Буквально на днях пришел вопрос от одного из подписчиков касательно одного из постов моего telegram канала. Его смутил вот такой кусок кода:

usort($firstArray, static function($first, $second) { return $first <=> $second;
});

Вопрос звучал так:

"Зачем делать callback’и в функции сортировки (usort), статическими?"

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

Как известно, у YouTube отсутствует фича захвата RTSP потока, и мы постараемся заполнить этот пробел - помочь YouTube осчастливить пользователей.

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

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

Сайту PVS-Studio в этом году исполнится 15 лет. Это солидный возраст для любого интернет-ресурса. Далёкий 2006-й в России был признан годом гуманитарных наук. В июне появилась никому не знакомая тогда площадка "Хабрахабр". В ноябре Microsoft официально завершила разработку ОС Windows Vista. И в том же месяце был зарегистрирован домен viva64.com.

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

Настало время масштабных изменений!

В этом туториале мы реализуем ~~Real World App~~ — подписку на обновления с помощью гугл таблиц, бессерверных функций и реакта.

Основной функционал нашего приложения будет следующим:

• на главной странице отображается приветствие и предложение подписаться на обновления
• при нажатии на кнопку "Подписаться", пользователь попадает на страницу с формой, содержащей два поля: имя и адрес электронной почты
• для защиты от ботов используется гугл рекапча 2 версии
• при заполнении полей и прохождения проверки разблокируется кнопка "Подписаться"
• при нажатии этой кнопки данные пользователя отправляются в таблицу с помощью бессерверной функции

Дополнительный функционал:

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

В первой части туториала мы реализуем основной функционал, во второй — дополнительный.

Серьёзно и профессионально я начал заниматься вёрсткой в 2019 году, хотя до этого интересовался данной темой как любитель. Поэтому новичком мне себя назвать сложно, но и профессионалом с опытом 5+ лет я тоже не являюсь.Тем не менее, я успел познакомиться со сборщиком Gulp, его плагинами и сделал для себя хорошую, как по мне, сборку для работы. О её возможностях сегодня и расскажу.

Давным-давно в далекой Галактике, когда сестры Вачовски еще были братьями, искусственный разум в лице Архитектора поработил человечество и создал Матрицу… Всем привет, это снова Максим Кравец из Holyweb, и сегодня я хочу поговорить про Dependency Injection, то есть про внедрение зависимостей, или просто DI. Зачем? Возможно, просто хочется почувствовать себя Морфеусом, произнеся сакраментальное: «Я не могу объяснить тебе, что такое DI, я могу лишь показать тебе правду».  

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

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

Для создания формы мы будем использовать следующие инструменты:

1. Нативный JS
2. BinKing — вспомогательный сервис для создания платёжных форм: https://github.com/sdandteam/binking
3. IMask — инструмент для создания масок полей ввода: https://imask.js.org/

4. Tippy — инструмент для создания тултипов: https://atomiks.github.io/tippyjs/