Pull to refresh
0
0
Роман @Alfinity

Front End Engineer

Send message

Web API для Angular

Level of difficulty Easy
Reading time 4 min
Views 4.5K

Веб — богатая экосистема с массой мощных API, которая только пополняется. В нашем распоряжении уже знакомые инструменты — Canvas или Intersection Observer, но в 2023 мы также имеем Web MIDI API, Speech Recognition и даже такие экзотические штуки, как геймпады и VR прямо в браузере. Естественно, эти API сложно использовать в Angular из-за разницы парадигм нативного JavaScript и декларативного Angular. Вот тут и появляемся мы!

Читать далее
Total votes 17: ↑17 and ↓0 +17
Comments 0

Детальный React. Реконсиляция, рендеры, Fiber, виртуальное дерево

Level of difficulty Hard
Reading time 19 min
Views 16K

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

На момент написания статьи, последняя стабильная версия React 18.2.0. За 10 лет разработчики Facebook проделали колосальный объем работы, было реализовано много фич и сделано не мало оптимизаций. За эти годы, так же, происходили и кардинальные архитектурные изменения. Очевидно, одной статьи мало, чтобы покрыть всю механику React, поэтому, данная публикация станет первой в серии статей о внутреннем устройстве React. Здесь мы познакомимся с основными сущностями и архитектурными решениями.

Читать далее
Total votes 18: ↑16 and ↓2 +14
Comments 9

Как оседлать бесконечный поток дел

Level of difficulty Easy
Reading time 11 min
Views 8.8K

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

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

Что же делать? Как снять эту боль?

Нужен простой советский…
Total votes 24: ↑21 and ↓3 +18
Comments 26

Проекция контента в Angular или затерянная документация по ng-content

Reading time 5 min
Views 41K
При изучении Angular очень часто упускают или уделяют недостаточное внимание такому понятию, как проекция контента. Это очень мощный инструмент для создания гибких и переиспользуемых компонентов. Но в документации о нем упоминается лишь пару абзацев в разделе Lifecycle hooks. Попробуем исправить данное упущение.


Читать дальше →
Total votes 14: ↑14 and ↓0 +14
Comments 14

Наблюдение за температурой: введение в холодные и горячие Observable в rxjs

Level of difficulty Easy
Reading time 4 min
Views 13K

По мере изучения RxJS разработчик рано или поздно сталкивается с такими понятиями, как cold и hot observable. А на технических собеседованиях в команды, которые используют RxJS, можно услышать вопросы по этой теме.

Например, чем горячий поток отличается от холодного? Можно ли холодный поток превратить в горячий и наоборот? И если да, то как это сделать?

В статье попробуем разобраться в теме и найти ответы.

Читать далее
Total votes 20: ↑20 and ↓0 +20
Comments 4

Запускаем PostgreSQL в Docker: от простого к сложному

Level of difficulty Easy
Reading time 12 min
Views 439K

О простых и продвинутых способах запуска PostgreSQL в Docker: добавляем healthcheck, ставим на мониторинг, настраиваем параметры.

Читать далее
Total votes 39: ↑37 and ↓2 +35
Comments 38

11 хитростей Chrome DevTools, которые помогут Вам стать Senior FrontEnd-разработчиком

Reading time 4 min
Views 56K

Я полагаю, вы знакомы с инструментами разработчика браузера Chrome. Мы можем использовать его для просмотра сетевых запросов, анализа производительности веб-страницы и отладки последних функций JavaScript.

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

Давайте посмотрим
Total votes 62: ↑56 and ↓6 +50
Comments 23

Разработка приложений на Typescript с использованием Nx

Reading time 11 min
Views 19K

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

Читать далее
Total votes 6: ↑6 and ↓0 +6
Comments 11

Burp Suite Tips

Reading time 6 min
Views 45K

Burp Suite – это платформа для выполнения тестирования по безопасности веб-приложений. В этой заметке я поделюсь несколькими приёмами, как использовать данный инструмент более эффективно.


Читать дальше →
Total votes 7: ↑7 and ↓0 +7
Comments 5

Все хуки и концепты React в одной статье

Reading time 10 min
Views 36K

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

Читать далее
Total votes 13: ↑12 and ↓1 +11
Comments 38

Атрибуты HTML, которыми вы никогда не пользовались

Reading time 10 min
Views 29K

В январе этого года Мэдисон Канна спросила у своих подписчиков в Twitter:

Какие языки/технологии вам бы хотелось изучить или узнать глубже в этом году?

Мой выбор: typescript, next.js, react, graphql, solidity, node — Мэдисон Канна (@Madisonkanna) January 3, 2022

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

Однако существует целая куча малоиспользуемых атрибутов, о которых я забыл, и, вероятно, целая куча атрибутов, о существовании которых я и не знал. Этот пост стал результатом моих исследований, и я надеюсь, что он окажется для вас полезным при создании страниц на HTML.
Читать дальше →
Total votes 75: ↑75 and ↓0 +75
Comments 9

Советы начинающим тимлидам: как работать с командой, выбраться из ловушки токсичного специалиста и не сойти с ума

Reading time 11 min
Views 15K

Привет, Хабр! Меня зовут Никита Пимошенко, я тимлид команды Billing API в Quadcode. Сегодня поделюсь советами и кейсами из практики, которые пригодятся начинающим тимлидам.

Читать далее
Total votes 26: ↑21 and ↓5 +16
Comments 23

Как устроены цикл событий и стек вызовов в JavaScript

Reading time 6 min
Views 53K

Цикл событий (event loop) — ключ к асинхронному программированию на JavaScript. Сам по себе язык однопоточный, но использование этого механизма позволяет создать дополнительные потоки, чтобы код работал быстрее. В этой статье разбираемся, как устроен стек вызовов и как они связаны с циклом событий.

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

Читать далее
Total votes 9: ↑8 and ↓1 +7
Comments 9

Интернет проект security.txt — знакомство с еще одним .well-known файлом

Reading time 1 min
Views 13K
Основная идея проекта — формализация взаимодействия между внутренней ИБ и внешними исследователями, давая четкое указание как и куда направлять информацию об уязвимостях или проблемах безопасности. Формализация взаимодействия — серьезная проблема, не все сайты имеют программы bug bounty, или даже просто указывают контакты специалистов по безопасности. А попытки достучаться через службу поддержки и твиттер зачастую заканчиваются уверениями что «Все так и должно быть», и последующим игнорированием.

Конечно, это будет работать только если компания, размещающая информацию в security.txt, готова проверять и своевременно реагировать на информацию, полученную через этот канал.


Читать дальше →
Total votes 32: ↑32 and ↓0 +32
Comments 1

Безопасность веб-приложений

Reading time 10 min
Views 19K

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

Читать далее
Total votes 10: ↑9 and ↓1 +8
Comments 7

Разворачиваем PostgreSQL, Redis и RabbitMQ в Kubernetes-кластере

Reading time 9 min
Views 26K

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

Читать далее
Total votes 49: ↑48 and ↓1 +47
Comments 13

Основы внутреннего устройства JavaScript

Reading time 6 min
Views 39K
image

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

Введение


Почти все уже слышали о концепции движка V8 и большинство людей знает, что язык JavaScript однопотоковый или что он использует очередь обратных вызовов.

В этом посте мы подробно разберём эти концепции и объясним, как же работает JavaScript. Благодаря знанию этих подробностей вы сможете писать более оптимальные приложения, надлежащим образом использующие API. Если вы работаете с JavaScript относительно недавно, этот пост поможет вам понять, почему JavaScript настолько «странный» по сравнению с другими языками. А если вы опытный разработчик на JavaScript, то он позволит вам по-новому взглянуть на внутреннее устройство JavaScript Runtime, с которым вы работаете каждый день.
Читать дальше →
Total votes 35: ↑32 and ↓3 +29
Comments 5

Как я перестал беспокоиться и полюбил тестирование React-компонентов

Reading time 12 min
Views 32K

Как тестировать React-компоненты? Какую библиотеку использовать? Как тестировать компоненты, которые берут данные из Redux, а не из пропсов? Как тестировать компоненты, в которых используется роутинг с помощью React-router-dom? Что делать, если в компоненте есть асинхронный код?

...Мои вопросы, когда на работе впервые попросили покрыть тестами компонент. Я, разумеется, стал гуглить тестирование React-компонентов в связке с Redux и React-router-dom, и понял, что в сети есть много ответов на вопрос, зачем нужно тестирование, но мало кто объясняет, как написать тесты. А если и объясняет, то в  общих чертах на абстрактных примерах. Мне не хватало статьи, вооружившись которой, начинающий разработчик мог бы выполнить тест на реальном продукте. Поэтому я решил написать ее сам.

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

Читать далее
Total votes 13: ↑12 and ↓1 +11
Comments 12

Мой опыт технического собеседования: как не превратить его в экзамен и найти профпригодного сотрудника

Reading time 21 min
Views 28K
image

Привет, Хабр! Меня зовут Леонид Титов, я бэкенд разработчик в #CloudMTS. Так уж сложилось, что я не только пишу код, но и иногда собеседую кандидатов. Мне нравится процесс, и, думаю, у меня это получается.

Начал я этим заниматься ещё на предыдущем месте работы, где мы с тимлидом собирали новую команду. С тех пор прошло уже N лет, практика продолжилась, и после очередного собеседования я решил упорядочить свои знания. Кто-то считает, что от собеседований вообще толку нет, а кто-то наоборот (не будем показывать пальцем) проводит их в 3-5 раундов. Я уверен, что собеседования нужны, но важно четко понимать, зачем именно.

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

Еще я поделюсь неожиданными впечатлениями от ситуации, когда оказался «по ту сторону», лайфхаками, фейлами и неплохо зарекомендовавшими себя практиками. Про soft skills тут ничего не будет — это отдельная важная тема. Прежде всего мы затронем вопрос профпригодности, определения ее наличия или отсутствия. Во второй половине статьи приведу собственный список вопросов, переведенный на русский, с комментариями.
Читать дальше →
Total votes 60: ↑48 and ↓12 +36
Comments 68

Как понять, что перед вами плохой разработчик

Reading time 12 min
Views 177K

Мало просто сменить свою сферу работы на IT, желательно еще и стать хорошим разработчиком. Бывший тимлид и консультант Александр Усков рассказывает, как понять, что перед вами плохой разработчик и что с ним вообще можно делать

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

Читать далее
Total votes 301: ↑197 and ↓104 +93
Comments 402

Information

Rating
Does not participate
Location
Киев, Киевская обл., Украина
Date of birth
Registered
Activity

Specialization

Frontend Developer
Senior
JavaScript
Git
React
TypeScript
Angular
CSS
HTML
SCSS
Web development
Node.js