А какой Сурикат вы?🤔

С Сурикатом монтируем видео на понедельник.
Паттерн стратегия🚀
Всем хороших выходных💪🏻

Строитель в JS
https://youtu.be/LiLJLNxPRZs?si=zpBpLEXdhuCqSkTr

Фабричный метод в JS
https://youtu.be/gT_khIQ5rwE?si=YCWWXZJgiE7sbQoj

Проведите 30 минут выходных с пользой🚀

Дал себе передышку на день. Уехал за город без ноутбука. Учусь красиво говорить для выступлений в сообществе😄
Руки чешутся делать дела😬 уже кучу замёток в телефоне настрочил😅

Паттерн Стратегия в React. Продвинутый Frontend на реальных примерах

В этом видео мы рассмотрим Паттерн Стратегия (Strategy) в контексте React и Frontend разработки.

Для проекта Маркет используем Vite, FSD, TypeScript.

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

Видео уже на канале! Третий серия видеокурса
Я не оставляю ссылку, так как видео лучше продвигается, если заходить на него напрямую с YouTube. Это помогает улучшить его рейтинг и увеличить шансы на органическое продвижение.

Что такое Proxy?

Proxy в JavaScript — это специальный объект, который позволяет создать обёртку вокруг другого объекта и перехватывать или переопределять операции, выполняемые с этим объектом, такие как чтение/запись свойств, вызов функций и т.д. Proxy может быть использован для различных целей, включая реализацию реактивности, валидацию, логирование и многое другое.

Proxy создаётся с двумя аргументами: целевым объектом (`target`), вокруг которого строится обёртка, и объектом обработчика (`handler`), который содержит функции-ловушки (такие как get и set в примере выше).

Функции-ловушки в handler позволяют перехватывать и переопределять стандартное поведение операций над объектом

В будущем хочу записать видео с Proxy на реальном проекте, как JavaScript Паттерны💪

#proxy #javanoscript

Каррирование (currying)

Достаточно популярный вопрос для лайвкодинга. Реализуйте функцию curry.

Каррирование (currying) — это процесс преобразования функции с множеством аргументов в последовательность функций, каждая из которых принимает один аргумент.

#currying #javanoscript

Оптимизация приложений: Тришейкинг

Тришейкинг (Tree Shaking) – это процесс удаления неиспользуемого кода из вашего конечного бандла. В контексте JavaScript и фронтенд разработки, это означает, что сборщики модулей, такие как Webpack или Rollup, анализируют ваш код на предмет экспортов, которые нигде не используются, и не включают их в итоговый файл. Это позволяет существенно уменьшить размер бандла, что положительно сказывается на времени загрузки приложения. Например, если вы импортировали библиотеку, но использовали только одну функцию из нее, тришейкинг позволит исключить из бандла все остальные неиспользуемые функции.

Как работает тришейкинг:

1. Вы объявляете импорты и экспорты в каждом модуле.
2. Сборщик (Webpack, Rollup или другой) во время сборки анализирует дерево зависимостей.
3. Неиспользуемый код исключается из итогового бандла.

Порядок настройки (на примере Webpack):

1. Убедитесь, что используете версию Webpack, поддерживающую тришейкинг (обычно это версия 2 и выше).
2. В вашем webpack.config.js установите mode в значение production. Это автоматически включит тришейкинг.
3. Используйте ES6 модули (`import` и `export`), так как тришейкинг работает только с ними.

Бывают спрашивают вопрос на собеседовании. Вообще вопросы по оптимизации частенько задаю. Думаю расскажу вам о них в постах.

Задача с собеседования в Сбер. Вилка от 200к

console.log('start')

const fn = () => (new Promise((resolve, reject) => {
  console.log(1);
  resolve('success')
}))

console.log('middle')

fn().then(res => {
  console.log(res)
})

console.log('end')

Каким будет вывод этого фрагмента кода?

Выходным результатом будет start , middle, 1 , end и success.

Реализуйте функцию curry.

Каррирование (currying) — это процесс преобразования функции с множеством аргументов в последовательность функций, каждая из которых принимает один аргумент.

Вот такие задачки тоже на собесах бывают

function curry(func) {
  return function curried(...args) {
    if (args.length >= func.length) {
      return func.apply(this, args);
    } else {
      return function(...args2) {
        return curried.apply(this, args.concat(args2));
      }
    }
  };
}

function sum(a, b, c) {
  return a + b + c;
}

const curriedSum = curry(sum);

console.log(curriedSum(1, 2)(3)); // Также выведет 6
console.log(curriedSum(1)(2, 3)); // И это тоже выведет 6

Делюсь с вами достижениями.

Вот сколько у нас уже различных мероприятий было/будет в этом месяце 🤩

Скоро обо всём расскажу.

Если вы хотели бы выступить и у вас есть, о чём рассказать, или может быть вы хотите научиться выступать на публике, то напишите мне, устроим 😎

Всем привет, может кто сталкивался с рабством в IT? Поделитесь историями и как выходили из него?

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

Как такие ситуации решаются?

Кстати, ребята! Со следующей недели можно начать путь в новую жизнь. Если вам нравится разработка и вы хотите стать Frontend-разработчиком, грамотно пройти путь обучения, много практиковаться и готовиться к собеседованиям, то у меня есть для вас отличное предложение.

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

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

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

@ruslan_kuyanets

Подробности о менторстве

Мотивация.

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

Главное — уметь отбросить эти сомнения в важный день, потому что к этому моменту ты уже сделал все возможное.

Всем привет, недавно был на собеседовании😅

Вот такие вопросы были:
1. Расскажи про Event Loop. Макро- и Микротаски. К чему относятся eventListeners?
2. Что такое Promise? Какие есть методы? Async await.
3. setTimeut 3 секунды в Promise. Отработает ли? Через сколько?
4. Расскажи про мемоизацию. Про оптимизацию React приложений. Запросы на сервер. Рассуждаем по React.Memo. Debouncing. useCallback и useMemo. Ленивая загрузка + и -.
5. Ситуация: у тебя много данных, ты отрисовываешь компонент, но он подлагивает. Твое действия для разрешения ситуации.
6. Виртуализация. Расскажи как реализовать, для чего нужна?
7. Стейт менеджеры. Зачем такой зоопарк? Какие использовал? Redux vs MobX vs Signals. Рассуждаем по Стейт менеджерам.

Дальше лайвкодинг:
- Две алгозадачи с Leet Code
- Одна задача на реализацию React приложения.

Если интересно, выложу задачи на днях.

Собеседование прошло хорошо. Не готовился к самопрезентации и растерялся. Долго рассказывал и не по делу. По вопросам ответил все. Задачи решил все. Собеседование шло 2.5 часа😱

Атмосфера была топовая, очень приятно пообщались с собеседующим Алексеем. Много рассуждали, обсудили проблемы Redux. Собеседование не было душным, за это и спасибо🤝

Сообщество.

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

Сообщества — это группы людей, объединенных общими интересами, целями или ценностями. Такие объединения позволяют людям делиться опытом и развиваться вместе.

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

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

"Люди объединяются в сообщества, чтобы преодолевать трудности и достигать успеха." — Джон Ф. Кеннеди

Задача с собеседования №1

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

// Входные данные:
let str = "cbacbebabacd";
let substr = "abc";

// Выходные данные:
[0, 5]

Жду решения в комментариях 👍
Позже выложу как я решил эту задачу

Вообще, к собеседованиям помогает готовиться этот канал @frontend_questions. Его ведут ребята с YeaHub, я тоже периодически накидываю темы. Так что можете смело подписываться, канал из экосистемы Reactify & YeaHub 💪

Знаете, о чем я еще подумал? У меня никогда не было агрессивной рекламы менторства. Когда у меня появляется возможность взять учеников, я просто делаю пару нейтральных постов, и ко мне сразу приходят ребята. Пока все довольны. 😊 Так что если вдруг нужна помощь в обучении, обращайтесь. 🤝 Даже пару месяцев с ментором — огромный буст! А цены ниже некуда👌

https://react-mentor.notion.site/Frontend-a92c7b7d0d664e7297e2fa3d6acb2c26