Inside Ads

Автоматическая монетизация каналов и чатов

Нужны подписчики в Telegram?

От 2₽, с фильтрами и лимитами

Создай группу с платными сообщениями

Берите плату за каждое сообщение в своей группе!

Статистика Избранное

Даня про Frontend👨🏻‍💻

Гео и язык канала: Беларусь, Русский

Категория: Технологии

📝 Заметки 📑 Статьи 📰 Новости 📚 Книги 📹 Видео из мира Frontend и не только
Связаться: @dananaprey

Связанные каналы

Гео и язык канала

Беларусь, Русский

Категория

Технологии

Статистика

Избранное

Фильтр публикаций

Скрывать удаленные

Скрывать репосты

Даня про Frontend👨🏻‍💻

21 Apr, 09:00

Подборка докладов с различных мероприятий 🎤👨🏻‍💻

1️⃣ Доклад Ильи Бирмана о том, как делать нормальные кнопки, поля ввода, селекты, чекбоксы, радиокнопки, слайдеры и прочие элементы пользовательского интерфейса

2️⃣ Доклад о переходе команды Т-Бизнес с Git Flow для сокращения релизного цикла

3️⃣ Доклад о том, как команда Альфа-Банка внедряла BDUI, с какими сложностями столкнулась и что в итоге получилось

#видео

8 0 0 1

Даня про Frontend👨🏻‍💻

18 Apr, 09:03

OLD’s cool UX паттерны 👵🏻

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

Руководитель группы Лента и рекомендаций в Одноклассники рассказала об особенностях такой аудитории, отработке её барьеров и сохранении баланса между бизнес-метриками и удовлетворением запросов

Читать

#статья #ux

23 0 0 3

Даня про Frontend👨🏻‍💻

15 Apr, 09:00

Отличия Идентификации, Аутентификации и Авторизации 🤯

🪪 Идентификация – процесс, при котором система понимает кто пытается войти (имя пользователя, email)

🔐 Аутентификация – процесс, при котором система понимает действительно ли тот, кто хочет войти является собой (пароль, биометрия, токен). Может быть однофакторной – проверка одного параметра и двухфакторной – проверка двух параметров

🔓 Авторизация – процесс, при котором система выдаёт разрешения на те или иные действия конкретному пользователю

#заметки

32 0 0 3

Даня про Frontend👨🏻‍💻

9 Apr, 09:03

«Безопасность веб-приложений. Разведка, защита, нападение», Эндрю Хоффман 📓

Очень познавательная книга, в которой рассмотрена краткая история защиты программного обеспечения и весь жизненный цикл уязвимостей 👨🏻‍💻

В разделе Разведка рассмотрены методы, с помощью которых хакеры изучают приложение на наличие уязвимостей для планирования векторов атак и рекомендации по тому, как вы можете усложнить этот анализ 🧐

В разделе Нападение рассмотрены все самые распространённые атаки с описанием алгоритма их работы (XSS, CSRF, XXE, SQLI, DoS и другие) 👻

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

🇷🇺 Скачать на русском

#книги #разработка

41 0 1 1 3

Даня про Frontend👨🏻‍💻

5 Apr, 10:22

Серия документальных мини-фильмов об известных технологиях 📹

Angular – история фреймворка, который начинался как эксперимент внутри компании Google

React – история библиотеки UI-компонентов, разработанной для внутренних нужд компании и вышедшей далеко за её пределы

Vue – история фреймворка, который начинался как сторонний проект разработчика из компании Google

Также на канале есть документальные мини-фильмы про другие технологии 👨🏻‍💻

Все видео на английском языке 🇬🇧

#видео

47 0 0 4

Даня про Frontend👨🏻‍💻

1 Apr, 09:06

Методы дополнения строки .padStart() и .padEnd() 👨🏻‍💻

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

Отличие заключается в том, что padStart дополняет строку в начале, а padEnd в конце

Методы принимают два параметра:
targetLength – длина итоговой строки после дополнения. Если передана строка длиной меньше текущей, то будет возвращена текущая строка
padString – строка для дополнения текущей строки. Если передана слишком длинная строка, она будет урезана справа. Значение по умолчанию – пробел

Практический пример:
Недавно мне пришлось использовать данный функционал для форматирования строк типа '0.4' и '0.35'. Они должны были превратиться в значения чисел, которые округлены до тысячных и метод padEnd отлично с этим справился
'0.5'.padEnd(5, '0'); // '0.500'
'0.83'.padEnd(5, '0'); // '0.830'
'0.623'.padEnd(5, '0'); // '0.623'

Документация (padStart, padEnd)

#заметки #javascript

45 0 0 1 3

Даня про Frontend👨🏻‍💻

28 Mar, 09:06

Полезные фичи Chrome DevTools 📑

Статья, в которой рассмотрены полезные возможности инструментов разработчика: от возможности просмотра страницы со стороны человека с отклонениями зрения до анализа неиспользуемого кода и цветовой палитры приложения 👨🏻‍💻

#статья

47 0 0 4

Даня про Frontend👨🏻‍💻

25 Mar, 09:03

Отличия offsetHeight, clientHeight, scrollHeight 📐

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

1️⃣ clientHeight - возвращает высоту элемента в пикселях, включая внутренние отступы (padding), но не включая границы (border) и внешние отступы (margin)

2️⃣ offsetHeight - возвращает высоту элемента в пикселях, включая внутренние отступы (padding) и границы (border), но не включая внешние отступы (margin)

3️⃣ scrollHeight - возвращает высоту содержимого элемента в пикселях, включая внутренние отступы (padding) и то содержимое, которое в данный момент скрыто из-за прокрутки, но не включая границы (border) и внешние отступы (margin)

Все три свойства существуют и для ширины элемента и работают идентично (clientWidth, offsetWidth, scrollWidth) 📏

#заметки

56 0 1 1 4

Даня про Frontend👨🏻‍💻

22 Mar, 10:05

Подборка докладов с различных мероприятий 🎤👨🏻‍💻

1️⃣ Доклад о том, как команда Газпромбанк проводила редизайн

2️⃣ Доклад от исследователей ВкусВилл про разработку интерфейсов касс самообслуживания

3️⃣ Доклад о том, что такое ретроспективы и как их правильно проводить, чтобы добиться максимального результата

#видео

45 0 0 3

Даня про Frontend👨🏻‍💻

20 Mar, 09:06

Будьте внимательны при форматировании даты с помощью Angular DatePipe ⚠️

2 января появился баг, связанный с тем, что при выборе дат с 29 по 31 декабря 2024 года в календаре, в таблице даты отображалась в 2025 году (2024-12-30 = 2025-12-30) 🤯

Причина оказалась очень неочевидной, дело в том, что в данной таблице использовалось форматирование даты с помощью механизма DatePipe с указанием формата YYYY-MM-dd

Вроде бы всё логично, откуда появился следующий год?

Ответ нашёлся в документации к DatePipe:
При указании формата года в виде YYYY, мы используем так называемый ISO week-numbering year, который имеет отклонения от привычного нам отсчёта и может выдавать не совсем ожидаемые даты, когда мы близки к 1 января

Конкретно наш кейс, оказался багом, исправленным с помощью данного Issue, но в любом случае, нужно быть аккуратнее с форматированием и в большинстве случаев использовать yyyy для указания формата года

#заметки #angular

43 0 0 3

Даня про Frontend👨🏻‍💻

17 Mar, 11:39

«Вы не знаете JS: ES6 и не только», Кайл Симпсон 📓

Четвёртая книга из серии "Вы не знаете JS", которую я хочу порекомендовать (первая, вторая, третья)

В этой части книги подробному разбору подвергаются все нововведения стандарта ES6. Стандарт уже довольно старый (2015 год), но именно он является одним из самых ярких обновлений языка и все его нововведения обязательны к изучению 🤓

🇷🇺 Скачать на русском

#книги #разработка

50 0 1 4

Даня про Frontend👨🏻‍💻

14 Mar, 09:04

TypeScript: настраиваем tsconfig.json правильно 📑

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

#статья #typescript

46 0 1 3

Даня про Frontend👨🏻‍💻

11 Mar, 09:04

CSS-свойство overscroll-behavior 🖥

Иногда возникают ситуации, когда у вас появляются элементы с прокруткой внутри страниц, которые тоже имеют прокрутку

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

Такое поведение часто не подходит и его можно изменить с помощью CSS-свойства overscroll-behavior 👨🏻‍💻

Значения:
auto – значение по умолчанию с цепочкой прокрутки
contain – при наличии данного значения не происходит цепочки прокрутки в соседних областях прокрутки
none – при наличии данного значения не происходит цепочки прокрутки в соседних областях прокрутки и предотвращается достижение границы области прокрутки (полезно, когда необходимо отключить эффект обновления страницы при достижении пределов верхней границы в мобильном браузере)

Документация

#заметки #css

44 0 0 3

Даня про Frontend👨🏻‍💻

7 Mar, 09:04

На страже качества кода ⚔️

Недавно со своими статьями я был отмечен в номинации «На страже качества кода» в годовом рейтинге авторов Хабр внутри компании 🏆

Если кто не читал, можно ознакомиться:

Давайте писать качественный код: важность статического анализа кода 📑

Статический анализ мультиязычности Angular приложения c помощью ngx-translate-lint 📑

#статья

55 0 0 5

Даня про Frontend👨🏻‍💻

5 Mar, 09:03

Вопрос с собеседования:
Что такое рекурсия?🤔

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

Рекурсия 🔄 - это способность функции вызывать себя до определённого момента для достижения некого результата

Каждая рекурсивная функция состоит из двух частей: базового и рекурсивного случая

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

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

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

Код решения с рекурсией в комментариях

#собеседование

58 0 0 1 4

Даня про Frontend👨🏻‍💻

2 Mar, 10:06

Подборка докладов с различных мероприятий 🎤👨🏻‍💻

1️⃣ Доклад о том, что такое Developer Experience и как он помогает бизнесу зарабатывать больше

2️⃣ Доклад про различные варианты миграции на новый стек или архитектуру

3️⃣ Доклад об опыте Росбанка в использовании GraphQL

#видео

70 0 0 2

Даня про Frontend👨🏻‍💻

26 Feb, 09:05

Декоратор @Injectable 👨🏻‍💻

Когда нам необходимо внедрить некоторый класс как зависимость, мы помечаем его с помощью декоратора @Injectable, для того чтобы компилятор сгенерировал все необходимые метаданные для внедрения

Декоратор принимает объект с одним свойством:
@Injectable({ providedIn: 'value' })

Доступные значения value:

platform - делает сервис доступным на уровне всех приложений, если их несколько. При этом существует только один его экземпляр (Singleton) и класс будет подвержен Tree Shaking

root - делает сервис доступным на уровне приложения. При этом существует только один его экземпляр (Singleton) и класс будет подвержен Tree Shaking

null / undefined - делает сервис доступным только при добавлении в массив providers (по умолчанию не относится ни к одной из областей видимости). При этом может существовать сколько угодно экземпляров и класс не будет подвержен Tree Shaking

Документация

#заметки #angular

69 0 0 3

Даня про Frontend👨🏻‍💻

24 Feb, 09:21

Навигация по каналу 🧭

Для удобного поиска интересующих постов можно воспользоваться хештегами 👨🏻‍💻

#статья - статьи, которые оказались полезными или интересными
#заметки - вещи, которые я хотел бы запомнить и поделиться ими с другими
#видео - записи докладов с различных мероприятий и тематические видео
#книги - краткие обзоры прочитанных книг со ссылками для скачивания
#собеседование - вопросы с собеседований с ответами
#новости - анонсы и новости
#советы - полезные советы, которые могут помочь на работе и в жизни
#непрограммирование - посты, не связанные с программированием
#computerscience #безопасность #процессы #разработка #надёжность #ux - посты, связанные с определённой тематикой
#angular #javascript #typescript #css #git #sonarqube #rxjs - посты, связанные с определёнными технологиями

#непрограммирование

65 0 0 4

Даня про Frontend👨🏻‍💻

22 Feb, 11:05

Менеджмент зависимостей в JavaScript 📑

Очень подробная и хорошая статья про развитие менеджеров пакетов

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

Статья большая, но очень увлекательная 👨🏻‍💻

#статья

57 0 0 4

Даня про Frontend👨🏻‍💻

19 Feb, 09:03

«Чистый Agile. Основы гибкости», Роберт Мартин 📓

Книга одного из создателей гибкой методологии Agile, из которой вы сможете узнать историю создания методологии, основные причины её возникновения и проблемы, которые она была призвана решить 🚀

В ней представлены все методы, которые подразумевает собой данная методология. Благодаря ей можно узнать практически всё, что вам нужно знать про Agile как разработчику 👨🏻‍💻

🇷🇺 Скачать на русском

#книги #разработка

63 0 0 3

Показано 20 последних публикаций.

47

подписчиков

Статистика канала

Популярное в канале

Отличия offsetHeight, clientHeight, scrollHeight 📐 При возникновении необходимости получить высо...

Полезные фичи Chrome DevTools 📑 Статья, в которой рассмотрены полезные возможности инструментов ...

Серия документальных мини-фильмов об известных технологиях 📹 Angular – история фреймворка, котор...

Подборка докладов с различных мероприятий 🎤👨🏻‍💻 1️⃣ Доклад о том, как команда Газпромбанк провод...

Методы дополнения строки .padStart() и .padEnd() 👨🏻‍💻 Данные методы дополняют текущую строку с п...