Обновить
3
0
Олег Бубнов@bubn0ff

Frontend-developer

Отправить сообщение

Как задеплоить сайт в облако. Инструкция для новичков

Уровень сложностиПростой
Время на прочтение6 мин
Охват и читатели16K

Опубликовать сайт можно разными способами. Например, если проект лежит в репозитории на GitHub, можно воспользоваться GitHub Pages. Но если вы не боитесь трудностей, советуем попробовать кое-что поинтересней — разместить сайт на облачном сервере.

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

Пайплайны в GitLab для микросервисов

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

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

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

Мегагайд: культура работы с Git

Уровень сложностиПростой
Время на прочтение16 мин
Охват и читатели55K

Привет всем! Меня зовут Юля, я фронтенд-разработчик, наставник на курсах по JS и React и организатор профессионального сообщества Tbilisi JS. В Практикуме я помогаю студентам на курсе «React-разработчик».

За время работы в разных компаниях и над разными проектами я поняла, что Git — это не только (и не столько!) знание самой технологии и конкретных команд, но и определённая культура взаимодействия, практики, подходы, договорённости. Всё это помогает участникам команды лучше понимать друг друга и работать быстрее и чётче.

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

Читать далее

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

Уровень сложностиСредний
Время на прочтение6 мин
Охват и читатели5.6K


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


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

  • какие скрытые проблемы с паттерном «visually-hidden» нас ждут;
  • в каких ситуациях кнопка «Закрыть» указывает на выход;
  • чем вредно значение contents у свойства display;
  • почему подсказка с помощью атрибута aria-label вызывает недоумение.

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

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

Как стать VPN провайдером за один вечер

Уровень сложностиСредний
Время на прочтение13 мин
Охват и читатели277K

Рассказываю о своём опыте использования Xray (с протоколом VLESS-Reality) - одного из лучших решений для преодоления интернет-цензуры на сегодняшний день. Я потратил много времени на то, чтобы разобраться с ним - теперь вам достаточно одного вечера, чтобы поднять свой сервер на несколько десятков пользователей, c xray на борту!

скрипт ex.sh для простой настройки и установки; есть поддержка Docker

легко добавлять пользователей; клиентские конфиги в форме url-ссылок

правильные конфиги: скрытность + удобство

трафик популярных российских сайтов идёт напрямую, a не через сервер

для xray есть приложения под все популярные ОС - делюсь инструкциями

только https, нет udp; торренты через сервер блокируются по возможности

мой проект на гитхабе: easy-xray

Интересны детали? Добро пожаловать под кат

Безопасность веб-приложений для самых маленьких фронтов

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели12K

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

Статья подготовлена по материалам внутреннего митапа по информационной безопасности.

Читать далее

REST API на котиках

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели39K

Привет любителям котиков! Меня зовут Юля, я backend‑разработчик компании CDEK. Я сама не так давно изучала все эти сложные понятия в программировании, поэтому решила помочь и вам разобраться с одним из них.

С какой стороны IT вы бы не пытались войти — в какой‑то момент столкнётесь с понятием REST API. Эта статья создана, чтобы смягчить данное столкновение. Новые темы всегда легче воспринимаются на простых примерах, ну а если это примеры с котиками, то варианта не разобраться просто нет. Хочется обойтись без сложных научных определений, а рассказать самым простым языком. Поэтому, если вы любите сухие и точные формулировки, то вам нужна другая статья :)

Читать далее

Вспомнить за майские: 20 шагов для апгрейда информационной безопасности

Уровень сложностиПростой
Время на прочтение4 мин
Охват и читатели9.5K

Каждый год растет количество взломов сервисов, хакерских атак, утечек персональных данных. Особенно это видно за 2023 год. Открываешь Tadviser — и волосы дыбом встают.

В этом тексте даем базовую информацию о том, как защитить инфраструктуру, не потерять данные клиентов, подготовиться к новым угрозам и эффективно им противодействовать. А еще — делимся чек-листом для повышения уровня безопасности. Подробности под катом!
Читать дальше →

Пошаговая шпаргалка по защите сервера от хакеров и другой нечисти

Уровень сложностиПростой
Время на прочтение7 мин
Охват и читатели57K

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

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

Привет! На связи Йети — самый йетический автор Vscale. Это моя первая статья на Хабре. В ней я расскажу, как защитить сервер от хактевистов и другой нечисти. Подробности под катом! :)
Читать дальше →

Best Practices по подключению к сторонним API в проекте

Уровень сложностиСредний
Время на прочтение6 мин
Охват и читатели20K

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

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

Узнать лучшие практики

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

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


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


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

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

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

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


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


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


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


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


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


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

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

Уровень сложностиСредний
Время на прочтение18 мин
Охват и читатели11K

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

Читать далее

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

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


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

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

Уровень сложностиПростой
Время на прочтение13 мин
Охват и читатели23K

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

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

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

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

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

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

Читать далее

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

Уровень сложностиПростой
Время на прочтение12 мин
Охват и читатели29K

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

Читать далее

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

Уровень сложностиСредний
Время на прочтение12 мин
Охват и читатели29K

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

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

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

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

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

Уровень сложностиСредний
Время на прочтение9 мин
Охват и читатели14K

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

Читать далее

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

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

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


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

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

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

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

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

Уровень сложностиПростой
Время на прочтение6 мин
Охват и читатели58K

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

Читать далее

Информация

В рейтинге
5 621-й
Откуда
Россия
Зарегистрирован
Активность

Специализация

Фронтенд разработчик, HTML-верстальщик
От 150 000 ₽
HTML
CSS
SCSS
JavaScript
TypeScript
React
Redux
Gulp
Webpack
Jest