Pull to refresh
4
0.4
Олег Бубнов @bubn0ff

Frontend-developer

Send message

Отладка React-приложений в VS Code

Reading time4 min
Views47K


Прошли те дни, когда мне, в процессе разработки, приходилось тратить время, переключаясь между терминалом, браузером и редактором. Теперь всё делается иначе — быстрее и удобнее. Сегодня я расскажу об оптимизации повседневных дел React-разработчика. А именно, речь пойдёт о том, как связать Visual Studio Code и Google Chrome. Это даст возможность отлаживать браузерный код в редакторе.


Средства отладки VS Code и jest от Facebook
Читать дальше →

Типовые ситуации при непрерывной интеграции

Reading time19 min
Views5.8K

Вы изучили команды Git но хотите представлять, как непрерывная интеграция (Continuous Integration, CI) происходит в реальности? Или может вы хотите оптимизировать свои ежедневные действия? Этот курс даст вам практические навыки непрерывной интеграции с использованием репозитория на GitHub. Данный курс не задуман как некий визард, который можно просто прокликать, напротив, вы будете совершать те же действия, что люди на самом деле делают на работе, тем же способом, которым они это делают. Я буду объяснять теорию по мере прохождения вами имеющих к ней отношение шагов.


Что мы будем делать?


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


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


Шаги непрерывной интеграции


Вы пройдёте такие стандартные для CI сценарии:


  • Работа над фичей;
  • Применение автотестов для обеспечения качества;
  • Реализация приоритетной задачи;
  • Разрешение конфликта при слиянии ветвей (merge conflict);
  • Возникновение ошибки в продуктивной среде.
Читать дальше →

Создание библиотек и публикация в npm

Level of difficultyMedium
Reading time18 min
Views6K

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

Читать далее

Знакомство с Jest Mocks

Reading time6 min
Views5.9K


Мокинг — это техника изоляции объектов тестирования путем замены зависимостей объектами, которые можно проверять и контролировать. Зависимостью может быть всё, от чего зависит объект, но обычно это модуль, который объект импортирует.
Читать дальше →

Как выжить на первом испытательном сроке в IT и не только

Level of difficultyEasy
Reading time13 min
Views16K

Всем привет! Меня зовут Артём Харченков, и я руководитель подразделения разработки программных продуктов в компании Crosstech Solutions Group. Сегодня я расскажу, как успешно пройти свой первый испытательный срок, что нужно делать обязательно и чего лучше не делать. 

Для начала – кратко обо мне, чтобы было понятно, почему мне стоит доверять в таком вопросе.

/слайд обо мне/

Образование у меня ИБ-шное, в ИТ я работаю с 2012 года. За свою карьеру занимался внедрением, был разработчиком, инженером, главным техническим специалистом в группе разработчиков и даже делал проекты практически в одиночку :) В «Кросстех Солюшнс Групп» руковожу разработкой чуть более трех лет. Здесь мы создаем системы для обеспечения безопасности данных, сейчас импортозамещаем зарубежные продукты, ушедшие с российского рынка. К слову, активно нанимаем сотрудников: еще в прошлом году в компании было 50 человек, а в этом году стало уже больше 200.

В моем управлении четыре департамента: разработка, тестирование, системная аналитика и devops, суммарно нас на текущий момент уже 29 человек. За свою карьеру я сам прошел несколько испытательных сроков, а самое главное – повидал много работников, которые его проходили. 

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

Читать далее

Настраиваем CI/CD с GitHub Actions и werf: инструкция для новичков

Level of difficultyEasy
Reading time12 min
Views15K

В этой статье мы рассмотрим, как настроить пайплайн CI/CD в GitHub: подготовим репозиторий, зальём туда приложение, создадим файлы конфигурации GitHub Actions, в которых опишем, как собирать наше приложение и деплоить его в кластер Kubernetes, развёрнутый под управлением Deckhouse Kubernetes Platform. Деплоить будем с помощью Open Source CLI-утилиты werf. Она помогает организовать полный цикл доставки приложений в Kubernetes и рассматривает Git как единый источник истины для состояния развёрнутого приложения. Статья рассчитана на тех, кто только начинает свой путь в мире облаков и кластеризации.

Читать далее

Делаем код-ревью правильно

Level of difficultyMedium
Reading time12 min
Views23K

В начале своей карьеры я как-то работал над одним заказом, создавая платформу сентимент-анализа для социальных сетей. В то время Twitter ещё был Twitter’ом. Наша команда состояла из семи человек, среди которых я был джуниором. Мы были молоды и полны энтузиазма. Наш девиз можно было описать как: «Мы гибкие, быстрые и всё ломаем!». Да, мы действительно гордились своей скоростью. Код-ревью? Я вас умоляю. Мы считали эту практику бюрократическим пережитком корпоративного мира.

И что вы думаете? Через несколько месяцев наша база кода стала подобна минному полю. Причём баги нас волновали меньше всего, хотя их была уйма. Реальная проблема заключалась в том, что никто не мог понять код, написанный другими. У нас во многих местах дублировалась логика, и в модулях использовались разные стили кода. Всё было очень печально.

Тогда до нас дошло! Нужно взять всё под контроль. Код-ревью реально помогают сохранять код читаемым, обслуживаемым и масштабируемым.

Итак, в двух словах: если вы не проводите код-ревью, или делаете их «для галочки», то обрекаете себя на боль, пусть не сразу, но в конечном итоге однозначно. Это можно сравнить с возведением дома на фундаменте из песка. Какое-то время он, может, и простоит, но явно недолго. А в мире стартапов второго шанса у вас может уже не быть.
Читать дальше →

Продуктовый подход к pet-проекту или как я разработал музыкальное веб-приложение

Level of difficultyMedium
Reading time9 min
Views11K

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

Читать далее

HTML и CSS ошибки, влияющие на доступность. Мой опыт и моего незрячего знакомого Ильи. Часть 7

Level of difficultyEasy
Reading time7 min
Views4.5K

Хабр, я снова пришёл к вам с практическими советами про доступность вместе с Ильёй. Мы показываем, как HTML и CSS могут улучшить или ухудшить её. Напоминаю, что Илья — мой незрячий знакомый, который помогает мне найти наши косяки в вёрстке.


Сегодня мы рассмотрим следующие аспекты:

  • к чему приводят распространённые ошибки с элементом <label>;
  • лучший лайфхак с inputmode="numeric" улучшающий мою жизнь;
  • как пользователи скринридера понимают, что модальное окно открыто.

Давайте начнём!

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

«Кем я стану, когда вырасту?» Что делать, если вам 30+ и вы до сих пор не знаете, какое дело вам по душе

Level of difficultyEasy
Reading time6 min
Views48K

Есть счастливчики, которые с детства знают, кем станут, а есть люди, которые никак не могут определиться, кто они. Они находятся в вечном поиске себя, пробуют то одно, то другое, но никак не могут утвердиться в своем выборе, и это создает им кучу проблем. Что стоит за этим страхом самоопределения?

Читать далее

Современные команды и фичи Git, которыми стоит пользоваться

Level of difficultyEasy
Reading time5 min
Views40K

Мы, разработчики ПО, пользуемся git каждый день, однако большинство из нас применяет только самые основные команды, например, addcommitpush и pull, как будто на дворе по-прежнему 2005 год.

С тех пор в Git появилось множество фич, пользование которыми может сильно упросить вашу жизнь. Так давайте исследуем некоторые из недавно добавленных современных команд git, о которых вам стоит знать.

Читать далее

Как в git работает HEAD

Level of difficultyEasy
Reading time5 min
Views18K

Недавно я провела в Mastodon опрос о том, насколько мои читатели уверены в том, что они хорошо понимают работу HEAD в Git. Результаты (на основании примерно 1700 голосов) меня немного удивили:

10% — 100%

36% — достаточно сильно уверен

39% — уверен в некоторой степени

15% — представления не имею

Меня удивило, что люди не уверены в своём понимании: я-то считала, что HEAD — это довольно простая тема.

Обычно, когда остальные, в отличие от меня, считают какую-то тему запутанной, причина заключается в какой-то скрытой сложности, которую я не учитываю. И в дальнейших обсуждениях выяснилось, что HEAD действительно чуть сложнее, чем я считала!

Читать далее

Сборка мусора в V8

Reading time19 min
Views6.9K

В этой статье мы детально разберем процесс сборки мусора движком V8. Познакомимся с понятиями поколений, Minor и Major Garbage Collection, посмотрим, как аллоцируются, трассируются и маркируются объекты в памяти. Что происходит с пустыми областями после очистки, и как выполняется сборка мусора в фоновом режиме. 

Читать далее

Надежный обход блокировок в 2024: протоколы, клиенты и настройка сервера от простого к сложному

Level of difficultyMedium
Reading time46 min
Views307K

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

Вы, наверняка, помните отличный цикл статей на Хабре в прошлом году от пользователя MiraclePtr, который рассказывал о разных методах блокировок, о разных методах обхода блокировок, о разных клиентах и серверах для обходов блокировок, и о разных способах их настройки (раз, два, три, четыре, пять, шесть, семь, восемь, десять, десять, и вроде были еще другие), и можете спросить, а зачем еще одна? Есть две основные причины для этого.

Читать далее

Как я склеил картон и продал на маркетплейсах на 50 млн в год

Level of difficultyEasy
Reading time8 min
Views302K

В 2020-м мой работодатель начал прижимать меня по условиям, я забрал команду, снял склад и запустил свое производство когтеточек. Казалось бы, ничего сложного: закупаешь клей, картон, и находишь людей, которые 5 000 раз в день готовы повторять одни и ту же операцию. Но есть нюансы.

Читать далее

Как сверстать письмо, чтобы оно дошло до получателя таким, как задумано

Level of difficultyEasy
Reading time14 min
Views13K

Привет! Меня зовут Егор Стеблин, я фронтенд-разработчик отдела спецпроектов в KTS.

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

В конце — пример целого письма в HTML.

Читать далее

CSS для печати на бумаге

Reading time10 min
Views13K

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

В этой статье я объясню основы CSS, управляющие внешним видом веб-страниц при печати, и дам пару советов, которые могут вам помочь в этом.

Читать далее

Ловкость рук, четкость алгоритма и никакого мошенничества: чек-лист для дизайнеров интерфейсов и фронтенд-разработчиков

Reading time10 min
Views13K

Привет, Хабр! Меня зовут Даша, я проектировщик интерфейсов в Selectel.

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

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

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

Установка и настройка tor в Linux Mint

Level of difficultyEasy
Reading time4 min
Views26K

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

Читать далее

Автоматизируем сборку и деплой приложения в GitLab CI/CD: подробное руководство с примерами

Level of difficultyEasy
Reading time22 min
Views36K

При разработке приложений рано или поздно наступает момент, когда заниматься развёртыванием вручную становится затратно и неудобно. Как следствие на помощь приходит автоматизация этого процесса с помощью специально настроенных пайплайнов непрерывной интеграции и непрерывной доставки (Continuous Integration & Continuous Delivery — CI/CD). Для разных систем управления репозиториями исходного кода существуют свои способы настройки CI/CD.

В этой статье мы рассмотрим, как использовать GitLab для организации автоматической сборки и деплоя приложения в кластер Kubernetes. Сам кластер работает под управлением Deckhouse Kubernetes Platform, а автоматизировать процесс будем с помощью werf — Open Source CLI-утилиты, организующей полный цикл доставки приложения в Kubernetes и использующей Git как единый источник истины для состояния приложения, развёрнутого в кластере.

Читать далее

Information

Rating
2,228-th
Location
Россия
Registered
Activity