Пишем UI автотесты на TypeScript используя Page Object + Page Factory, Playwright, Allure.
frontend developer
CSS-классы вредны
Если вы когда-нибудь заглядывали за кулисы пользовательских веб-интерфейсов, то знаете для чего нужно свойство
class
. Оно ведь нужно для связи HTML с CSS, правда? Сейчас я расскажу о том, почему настало время отказаться от него. Имена классов — это архаичная система, используемая как неудачный посредник для примитивов UI; ещё хуже то, что они создают ужасные сочетания, приводящие к комбинаторному взрыву странных пограничных случаев. Давайте изучим этот вопрос, начав со скучного урока истории, который вы уже слышали миллион раз.Полное краткое руководство по grammY — JS-библиотеке для создания Telegram-ботов
Привет! Меня зовут Арсений, я сеньор фронтенд-разработчик. В этой статье хочу рассказать про основные механизмы библиотеки grammY и разобрать стартовый набор файлов бота, обработку ошибок, виды обработчиков событий, контекст обновлений, работу с разными видами клавиатур и многое другое. И все это — на реальных примерах.
В конце покажу, как задеплоить готового бота на сервере, чтобы он работал автономно и был доступен в любое время. Поехали!
Написание слоя API в приложении — это прошлый век! Встречайте универсальный прокси
Перестаньте писать, генерировать и переписывать API слой для каждого приложения - создайте универсальный прокси с TypeScript единый для множества приложений и обновляйте только типы при изменениях API на сервере!
Ваш API слой всегда будет оставаться минимальным в размерах и не увеличится ни на байт с увеличением количества вызываемых методов! Это обеспечит стройность вашим бандлам и добавит удовольствие пользователю от быстрой загрузки вашего сайта
Скрытые возможности элемента <input>
Элемент
<input>
в HTML самый интересный.Большинство его собратьев вне зависимости от своих атрибутов ведут себя одинаково. При этом атрибут
type
элемента <input>
может принимать 22 разных значения, которые не только меняют его поведение, но и влияют на внешний вид (зачастую в ущерб стилистике).Элемент
<input>
отвечает за всё, начиная с текстового ввода и чекбоксов, заканчивая переключателями и кнопкой для сброса всех полей в форме. В этой статье я опишу не только различные типы <input>
, но и сопутствующие атрибуты, о которых вы могли не знать, и которые делают этот элемент более удобным и применимым в различных ситуациях. Приступим!Как создать веб-приложение на базе Telegram Mini Apps
Telegram Mini Apps — отличная возможность выйти за пределы обычных ботов и попробовать себя в создании более интересных интерфейсов приложений. На базе этого инструмента можно создать магазин или даже сервис для заказа шавермы.
В этой статье познакомимся с Telegram Mini Apps и попробуем создать простое приложение. Сделаем это с использованием обновленного Angular 17 и telegraf, а в конце — задеплоим проект на виртуальный сервер.
Мои советы после 20 лет в программировании
Сегодня ровно 20 лет, как я начал программировать профессионально. За эти годы я:
• Получил одобрение на петицию по грин‑карте за выдающиеся способности в науке.
• Стал Google Developer Expert.
• Стал IEEE Senior Member.
• Был операционным директором в компании со 100 сотрудниками.
• Написал код, который скачали 135 миллионов раз.
• Выступал перед аудиторией в 2000 человек, дважды.
• Стал самым честным человеком в России по версии НТВ.
Но упустил я гораздо больше и делал всё это слишком долго. Думаю, этот путь можно было бы пройти «на скорость» лет за 5 с теми подходами, принципами и приоритетами, которым я научился. Если вы только начинаете свой путь, этот текст может сэкономить вам 15 лет жизни.
Самый маленький Docker образ Rust приложения
Привет %username%, эта статья про то, как поместить Rust приложение в Docker и получить образ размером с бинарный файл (6 Мб). А также про причины, которые привели к переходу с NodeJS на Rust. Отдельная пара слов о проблемах вначале, переходе на Go, и том, как команда Rust устранила эти проблемы за пол года.
TL;DR Dockerfile в конце статьи и ссылка на example репозиторий
Управление техническим долгом
Технический долг в разработке по-разному воспринимают разработчики и бизнес. Для первых - это важная часть работы, которой нужно выделять время. Для вторых, как правило - нерациональная трата человеко-часов. Редко, когда управление техническим долгом ведется организованно и на регулярной основе. А именно здесь, на мой взгляд, и зарыт ключ к разрешению конфликта между бизнесом и разработкой. Именно об этом я сегодня и хочу поговорить.
Модель зрелости: как оценивать и растить инженерные команды
Мы продолжаем делиться внутренними документами Авито. Сегодня это будет модель зрелости. Она может пригодиться как трекер внедрения инженерных практик всем компаниям, где есть своя разработка. Чётко прописанная модель зрелости помогает быстро синхронизироваться и находить зоны роста команд.
Туториал: Todo веб-приложение на Internet Computer используя Rust и Create React App
В этом туториале мы подробно разберём, как именно происходит процесс разработки канистеров на Internet Computer. Мы пройдём полный путь от hello-world проекта, сгенерированного dfx автоматически до полноценного Todo-app с бекендом и фронтендом. Разберём какие файлы для чего нужны, какие команды использовать, как тестировать и дебажить приложение. Туториал расчитан на новичков в Internet Computer и блокчейн-сетях в целом, но мы ожидаем, что небольшой опыт Rust и React у читателя уже имеется. Полный код проекта из этого туториала можно найти здесь.
Самый детальный разбор закона об электронных повестках через Госуслуги. Как сняться с военного учета удаленно
Новый закон об электронных повестках потенциально касается практически всех российских мужчин от 18 до 70 лет. Я узнал у адвоката со специализацией в вопросах мобилизации, чем конкретно нам грозят эти нововведения, и можно ли как-то «выписаться из военкомата» удаленно.
Микросервис головного мозга
Когда нужно делить фронтенд-часть приложения на микросервисы? Какой стек использовать? И какие стандарты использовать, чтобы не выстрелить себе же в ногу при переходе на микрофронты? Михаил Трифонов (Lead Frontend в компании Cloud) ранее уже выступал с докладами о микросервисах, получил фидбек от сообщества и с его учётом сделал новый доклад на HolyJS. А теперь мы (организаторы HolyJS) сделали для Хабра текстовую версию этого выступления.
Странно было бы делать доклад про микросервисы монолитным. Поэтому каждая глава этого поста является изолированным, слабо связанным кусочком. Так что можете читать по отдельности, а можете — целиком.
Взлет и падение Vuetify. Некролог
Vuetify - один из самых популярных Material Design фреймворков для Vue, которому недавно исполнилось 6 лет. И 6 января 2023 года его основатель заявил, что проект Vuetify перестал окупаться и он ищет работу. Отсюда - некролог в названии статьи.
Статья состоит из шести небольших частей, в которых мы пробежимся от первой версии до третьей, посередине разобрав, как фреймворк обновлялся до Vue 3, будем вместе смотреть за поведением основателя движка, а также тем, как можно справиться с переходом на Vue 3, пожалуй, хуже, чем кто-либо еще, включая команду Nuxt.
В этом, надеюсь, преждевременном некрологе я расскажу, где Vuetify был 6 лет назад, почему он был так популярен, где он сейчас и как вошел в кризисное состояние.
Делаем документацию здорового человека в Git на примере Docs Ozon
Казалось бы, с документацией всё просто — пишешь, публикуешь, поддерживаешь актуальность. Например, вот у нас в Ozon есть пользовательские инструкции на docs.ozon.ru: выглядит просто как текст на сайтике, что ж необычного-то в его размещении и в целом в работе техписателей?
Если начать раскапывать, всплывёт ещё несколько вопросов:
• где хранить тексты и почему Confluence не подходит?
• как красиво оформить документацию с помощью статических генераторов сайтов
• зачем техписателям знать git и CI/CD?
• в какой момент пора искать разработчиков в команду и превращать документацию в платформу?
На связи Катя — руководитель отдела технических писателей в Ozon, и сегодня расскажу о платформе Docs Ozon изнутри.
Задачи на собеседованиях. Event loop. JS
Почти на каждом собеседовании бывает задачка на событийный цикл. И как я понял, не все до конца понимают как их решать. А решают их обычно в голове, а лучше используя бумажку и ручку. В статье я приведу способ решения через таблицу
Основной поток/Микрозадачи/Макрозадачи
Децентрализованный мир: как выглядит блокчейн-разработка и зачем ее сегодня изучать
За два года на Бали я успел убедиться, что это настоящая Мекка для людей, связанных с криптовалютой. Сюда стекаются инвесторы, трейдеры, разработчики и основатели стартапов, здесь постоянно запускаются новые проекты и проводятся свои форумы. Чем больше общаешься с представителями местного криптосообщества, тем лучше понимаешь, что число связанных с криптовалютой проектов растет огромными темпами. Мне как руководителю HR-агентства в сфере IT интересно за этим наблюдать с профессиональной точки зрения: сервисы, связанные с криптой, пишутся на блокчейне — так что увеличение их числа автоматически повышает спрос на блокчейн-разработчиков.
Впрочем, это не только мои наблюдения: на Indeed (крупнейшая международная площадка по поиску работы) число вакансий в области крипты и блокейна в прошлом году выросло на 118%. В США примерно за тот же период спрос на этих специалистов увеличился в 6 раз. Разработчиков на блокчейне ищут не только стартапы, но и крупные компании — например, банк JPMorgan.
Рынок труда
Оценивать спрос на блокчейн-разработчиков по вакансиям на рекрутинговых площадках не очень удобно: часто поиск ведется внутри криптосообщества или на специализированных ресурсах. Но даже если изучить Linkedin, только в Евросоюзе сейчас ищут более 2 тысяч специалистов по программированию на блокчейне, в Северной Америке — 6,8 тысяч, в Азиатско-Тихоокеанском регионе — 4,6 тысячи. Причем львиная доля компаний ищет сотрудников на удаленку — то есть эти предложения доступны и для соискателей из России, которые не хотят релоцироваться. Например, в Северной Америке удаленный формат предполагает почти половина вакансий.
Scrollbar в современном CSS
Начнем с того что scrollbar – это самый обыденный элемент, присутствующий на всех веб-сайтах и в каждом приложении. Исторически сложилось так, что стилизовать scrollbar-ы было очень сложно и многие из разработчиков помучились с ними и стараются избегать работы с ними, но все же, как мне кажется, мы должны уделять им немного больше внимания. Давайте посмотрим, что мы можем сделать в 2022 году, чтобы улучшить возможности прокрутки для наших пользователей.
Как создавать иконки сайтов в 2022 году — всё о favicon
Пришло время переосмыслить то, как мы создаем набор иконок для современных браузеров, и остановить безумные генераторы. Фронтенд-разработчики сейчас вынуждены создавать более 20 PNG-файлов, чтобы отобразить крошечный логотип веб-сайта на вкладке браузера или сенсорном экране. Статья расскажет, как использовать более разумный подход и создать минимальный набор иконок, соответствующий большинству современных потребностей.
Статья глубоко погружается в тему, поэтому в начале я даю два фрагмента кода для тех, кто уже достаточно настрадался и понимает, что делать. Тем не менее, я всем рекомендую читать статью целиком!
Continuous Testing в CI/CD: что это, зачем нужно и как работает
Тестирование — один из процессов, который может быть автоматизирован в рамках CI/CD. Надёжное и тщательное автоматизированное тестирование позволяет быть уверенным в новых сборках, снижает затраты на производство и повышает качество продукта. Но даже в крупных компаниях на больших проектах оно есть не всегда.
Обычно в тестирование начинают вкладываться, когда багов становится слишком много, недовольство клиентов растёт, и начинают «гореть» деньги бизнеса. Вместе с Александром Довнаром, Lead DevOps в Naviteq, мы разобрали, что такое непрерывное тестирование и какую роль оно занимает в CI/CD. А ещё рассмотрели кейс, как компании приходят к его внедрению, и что это внедрение даёт.
Information
- Rating
- 5,994-th
- Registered
- Activity