Получите средний символ

Вам будет дано слово. Ваша задача - вернуть средний символ слова. Если длина слова нечетная, верните средний символ. Если длина слова четная, верните 2 средних символа.

Пример:
getMiddle("testing") = "t"

👉 @seniorFront

Вышел TypeScript 5.6

В этой статье описаны последние изменения в TypeScript.

Краткий список изменений:
— Новые синтаксические проверки на нулевые/истинные значения
— Методы-помощники итератора и проверки на строгость
— Приоритетная проверка регионов в редакторах
— Гибкое поведение --build

👉 @seniorFront

​Зачем нужны сокеты ?

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

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

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

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

Гибкость и контроль
Предоставляют разработчикам большую гибкость и контроль над тем, как устанавливаются и управляются сетевые соединения. Разработчики могут определять, какие протоколы использовать (TCP, UDP и др.), как обрабатывать ошибки и потерю пакетов, а также как оптимизировать производительность для конкретных требований приложения.

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

👉 @seniorFront

Forest Encounter

Свёрстано и анимировано на чистых HTML и CSS.

👉 @seniorFront

​Калибровка Life Work Balance. Система планирования, которую я развиваю уже 14 лет

У вас бывает ощущение, что год прошел зря? Коллеги влетают на вершины карьерной лестницы, бизнес знакомых активно развивается, друзья объездили весь мир и покупают очередную квартиру? А у нас жопа в огне, мы тонем в рабочих задачах, едва успевая найти время на бытовую рутину, не оставляя время на себя?

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

Баланс между работой и жизнью
Моё окружение часто сетует на отсутствие баланса между работой и личной жизнью. И у меня есть простой ответ: баланса между работой и личной жизнью нет, потому что в их «оперативной памяти» существуют только рабочие задачи.

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

Как может быть баланс, если мы на самом деле ничего не планируем, кроме работы? Его физически не может существовать.

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

Бюджетирование
В корпоративном мире не надо никому объяснять, что нужно что-то бюджетировать — ты должен выделять бюджет и контролировать его.
Очень мало моих знакомых занимается вёрсткой персонального бюджета. Единицы умеют управлять своим капиталом. У меня, кстати, для этого есть прикольная табличка в google docs, которая позволяет управлять ежемесячным бюджетом и трекать динамику своего капитала в течение года в игровой форме.

Дневник — план на год
Впервые с дневником я столкнулся на Executive MBA LWB, где изучают инструменты управления бизнесом, корпоративные финансы, менеджмент и предпринимательство в целом.
Дневник на самом деле задаёт тебе достаточно простые вопросы, которые позволяют понять, что для тебя важно, что получается хорошо и к чему ты стремишься. Например, там просят описать ключевые достижения в жизни, или каким моментам ты радовался, а какие огорчали.
Даже если ты очень скромный и кажется, что никаких достижений нет, можно просто написать, какие моменты тебя радуют или огорчают и с чем это связано. Для начала этого хватит.

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

👉 @seniorFront

Платить деньги или есть еще секреты для достижения супер результатов команды?

В этой статье Senior Product Owner в одном крупном корпорате обсуждает мотивацию сотрудников, микроклимат в команде и счастливых коллег... это я про счастливую команду, которая помогает тебе расти по карьерной лестнице. Да-да, ты не в одиночку тянешь все с супер результатами :).

👉 @seniorFront

luminous rain

Генерация и анимация капли реализована в JS. Волна анимирована в CSS.

👉 @seniorFront

Steps

В этом видео создаётся анимация CSS свойства transform: rotate из четырех шагов.

👉 @seniorFront

За ту же зарплату...

👉 @seniorFront

Panels

Свёрстано на HTML и Less. Логика переключения сцен реализована на чистом JS.

👉 @seniorFront

Toggle

Переключатель, реализованный с использованием препроцессоров Pug и SCSS.

👉 @seniorFront

How to Create Card

В этом видео создается карточка с эффектами при наведении на Html и CSS.

👉 @seniorFront

Illustration brought to life

Создано и анимировано на HTML и CSS.

👉 @seniorFront

Shortest Word

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

Пример:

findShort("Let's travel abroad shall we") => 2

👉 @seniorFront

Ограничения в использовании иконок в Figma

Знаком ли вам случай, когда дизайнеры используют не совсем те иконки, которые вам хотелось бы? В одной части интерфейса, к примеру, могут использоваться только иконки типа stroke, в другой части — типа fill. В компоненте chip могут использоваться иконки размером 16px, а в кнопках — 24px и т. п. Но написать в мануале об этом будет недостаточно: кто-то не прочитает, кто-то забудет. Но что, если бы можно было ограничить их использование свойствами компонента? Такой способ есть. Давайте расскажу, как это сделать.

👉 @seniorFront

​Что такое контекст в функции ?

Контекст в функции определяет, как ссылка this будет доступна внутри этой функции. Он относится к объекту, в контексте которого выполняется текущий код, и может изменяться в зависимости от того, как и где вызывается функция.

Как работает this в разных ситуациях:
1. В глобальном контексте: Вне любой функции он ссылается на глобальный объект. В браузере это будет window, а в Node.js — global.

2. Внутри функции:
- При обычном вызове функции он также ссылается на глобальный объект (в строгом режиме this будет undefined, что предотвращает случайное изменение глобального объекта).
- В методе объекта он ссылается на объект, для которого вызывается метод.

3. При использовании конструктора (с new): Будет ссылаться на вновь созданный объект.

4. При использовании call(), apply(), bind(): Эти методы позволяют явно задать контекст для этой в функции.

Примеры:

Глобальный контекст

console.log(this === window); // true в браузере

Функция внутри объекта

const person = {
  name: 'Иван',
  sayName: function() {
    console.log(this.name);
  }
};

person.sayName(); // Вывод: Иван

В этом примере this внутри sayName ссылается на объект person.

Изменение контекста с bind()

const person = {
  name: 'Иван',
};

function sayName() {
  console.log(this.name);
}

const sayNameForPerson = sayName.bind(person);
sayNameForPerson(); // Вывод: Иван

Здесь мы явно задаем контекст для this с помощью bind(), чтобы функция sayName могла ссылаться на person.

Понимание его важно для эффективной работы с функциями и методами объектов, особенно когда требуется управление контекстом this. Оно позволяет более гибко использовать функции и методы в разных объектах, а также контролировать поведение программы более предсказуемым образом.

👉 @seniorFront

Recording Toggle

Реализовано на React и TypeScript. Стилизовано в SCSS.

👉 @seniorFront

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

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

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

👉 @seniorFront

​Где взять энергию? Эпидемия выгорания айтишников

Многие ИТ‑компании в скрытой или активной форме пропагандируют переработки. Связано это и с высокой стоимость айтишников, и с низкой квалификацией проектных менеджеров, и с ошибками на стадии пресейла, и с авралами при выполнении госконтрактов — когда деньги в бюджете нужно потратить до конца календарного года. Всё это приводит к работе за экраном по 10–14 часов и полному отсутствию физической активности.

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

Что делать?
Самый доступный спорт — это бег. Доступный не значит простой. Как в любом деле, в нем есть свои нюансы, и какие‑то знания приходят только с опытом. За четыре года любительских пробежек приобрел знания и опыт, новую фигуру. Сбросил лишний вес и улучшил социальный имидж. Цель этой статьи подсветить проблему и дать мотивацию к изменениям.

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

Как выйти на первую пробежку?
Правда жизни состоит в том, что для первой пробежки вам не нужны особые кроссовки или одежда. Нужно желание выйти и не спеша пробежать минут 10, перейти на шаг, восстановить дыхание и попробовать пробежать еще минут 5–10. Общее правило — бегите медленно. Чем меньше пульс и легче дыхание, тем лучше.

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

👉 @seniorFront

Interactive Polaroid Gallery

Генерация карточек и логика перемещения реализованы на чистом JS. Стилизовано в SCSS.

👉 @seniorFront