🎄 Скоро Новый год, а это значит — время подарков! Антон Назаров и его канал ОМ запустили классный розыгрыш с крутыми призами. Участвовать легко, и шанс выиграть есть у каждого. Нужно всего подписаться на 3 канала. Если хотите попробовать, вот ссылка на участие: Розыгрыш. Удачи всем! 🚀 Может тоже запустить розыгрыш небольшой😅 Что разыграть?🤔

➕ Челендж до конца недели Этот челлендж поможет прокачать навыки в JavaScript разработчикам любого уровня. Задачи расположены по возрастанию сложности, так что каждый найдет для себя подходящее. Решайте задания и делитесь результатами для обратной связи. 1. Переменные и типы данных Напишите функцию greet(name), которая принимает имя и возвращает строку: "Привет, [Имя]!"

console.log(greet("Иван")); // Привет, Иван!

2. Массивы и циклы Дан массив чисел. Напишите функцию sumArray(arr), которая возвращает сумму всех чисел массива.

console.log(sumArray([1, 2, 3, 4])); // 10

3. Объекты Создайте объект user с полями name, age и методом introduce, который возвращает строку: "Привет, меня зовут [Имя], мне [Возраст] лет!"

const user = { name: "Иван", age: 30, introduce() { /* код */ } };
console.log(user.introduce()); // Привет, меня зовут Иван, мне 30 лет!

4. Функции высшего порядка Напишите функцию filterArray(arr, callback), которая принимает массив и функцию-условие, возвращает новый массив с элементами, которые прошли условие.

console.log(filterArray([1, 2, 3, 4], (num) => num % 2 === 0)); // [2, 4]

5. Замыкания Напишите функцию createCounter(start), которая возвращает объект с методами: - increment(): увеличивает значение на 1; - decrement(): уменьшает значение на 1; - value(): возвращает текущее значение.

const counter = createCounter(5);
counter.increment();
console.log(counter.value()); // 6
counter.decrement();
console.log(counter.value()); // 5

6. Работа с DOM Создайте страницу с кнопкой "Нажми меня". Напишите скрипт, который увеличивает счетчик кликов и отображает его на кнопке.

<button id="counter">Нажми меня</button>
<script>
  // код
</script>

7. Асинхронное программирование Напишите функцию fetchData(url), которая делает запрос на указанный URL и возвращает данные. Используйте fetch.

fetchData("https://jsonplaceholder.typicode.com/todos/1").then(console.log);

8. Работа с API Напишите функцию getPosts(), которая запрашивает список постов с того же API и выводит их на страницу в виде списка.

<ul id="posts"></ul>
<script>
  // код
</script>

9. TypeScript Напишите универсальную функцию fetchData<T>(url: string): Promise<T>, которая делает запрос на указанный URL и возвращает данные с типизацией через дженерик. - Получение списка постов:

fetchData<Post[]>("https://jsonplaceholder.typicode.com/posts").then(console.log);

- Получение списка пользователей:

fetchData<User[]>("https://jsonplaceholder.typicode.com/users").then(console.log);

💡 Как понять программирование, если вы не технарь? Недавно я выступал с докладом в ОМ на важную тему: как гуманитариям и людям без технического образования освоить программирование. В этом посте я собрал основные советы из своего доклада, которые помогут вам преодолеть барьеры и достичь цели. ➕ Развивайте навык обучения Умение учиться — ключ к освоению программирования. Экспериментируйте с подходами, чтобы найти свой эффективный стиль: - Читайте материал вслух, затем кратко перескажите своими словами. - Ведите конспекты, создавайте шпаргалки для быстрого повторения. - Изучайте темы через разные форматы: видео, книги, интерактивные задания. Это поможет понять материал с разных сторон. Составляйте план обучения, разбивайте его на этапы и фиксируйте прогресс. Регулярный анализ проделанной работы поддерживает мотивацию и помогает заметить улучшения. ➕ Определитесь с мотивацией и целями Перед началом обучения важно принять твёрдое решение двигаться вперёд. Постоянные сомнения и мысли вроде "вдруг я трачу время впустую?" могут сбить с пути. Для этого: - Выпишите причины, почему хотите стать разработчиком. - Определите плюсы и перспективы профессии. - Поставьте цели с конкретными дедлайнами. Уверенность в себе и чёткий план помогут не отвлекаться и эффективно использовать время. ➕ Регулярность — залог успеха Изучение программирования требует постоянства. Большие перерывы приводят к откатам: забываются концепции, снижается мотивация. Найдите комфортный ритм, чтобы занятия стали привычкой. Если чувствуете, что подходите к сложной теме, не откладывайте. Работайте над ней, пока материал свеж в голове. Это поможет быстрее преодолеть барьер и закрепить знания. ➕ Повторяйте, чтобы закрепить Программирование — это навык, который требует постоянного повторения. Возвращайтесь к изученным темам, рассматривайте их под разными углами. Например, попробуйте объяснить концепцию другому человеку или перескажите её своими словами. Регулярное повторение укрепляет память и делает сложные вещи более понятными. ➕ Практикуйтесь как можно больше Код — это не теория, а практика. Чем больше пишете, тем быстрее поймёте логику и начнёте мыслить алгоритмически. Начинайте с простых задач, чтобы набить руку, а затем переходите к сложным проектам. Практика помогает развить абстрактное мышление, умение по шагам решать задачи и преобразовывать код в конечный результат. ➕ Погружайтесь в среду Для эффективного обучения окружите себя программированием: - Общайтесь с единомышленниками, участвуйте в чатах и встречах. - Погружайтесь в профессиональную среду через участие в опенсорс-проектах или взаимодействие с более опытными разработчиками. - Читайте статьи, смотрите доклады, изучайте новые инструменты. Чем больше вы взаимодействуете с профессиональным сообществом, тем быстрее адаптируетесь и станете частью индустрии. ➕ Не забывайте об отдыхе Перерывы и смена активности важны для усвоения информации. Часто решение приходит не во время напряжённых размышлений, а после отдыха. Дайте себе время, чтобы «созреть». Иногда спустя неделю или даже месяц изучение знакомой темы может стать легче. Новые нейронные связи сформируются, а информация ляжет на уже усвоенные знания.

🌐 Экосистема YeaHub Сейчас мы активно развиваем экосистему YeaHub. Уже создали тематические Telegram-каналы, которые в будущем заменим полноценными сервисами на платформе. Планируем запустить агрегатор IT-мероприятий, сервис поиска работы и множество других решений. Уже сейчас начинаем продвигать каналы и привлекать работодателей, чтобы в будущем они размещали вакансии на нашей платформе. 🖥 YeaHub: Главные новости IT, обсуждения с экспертами и аналитика рынка. 👩‍💻 YeaHub Tech: Полезные гайды, статьи и материалы для развития ваших навыков. 🗓 YeaHub Events: Анонсы митапов, конференций, соревнований и вебинаров. 💵 YeaHub Job: Свежие вакансии, стажировки и лучшие карьерные советы. 🖥 YeaHub Frontend: Теория, задачи, тесты и вопросы для подготовки к собеседованиям.

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

#yeahub

❓ Куда пропал? Сейчас все мое свободное время посвящено развитию YeaHub и менторству. Мы уже запустили платформу, активно дорабатываем её функционал и разрабатываем новые сервисы. Моя цель — создать центральное место для всех IT-специалистов, сформировать активное сообщество, организовывать конференции, митапы и объединять единомышленников для реализации новых проектов и продвижения платформы. В планах — сформировать большое IT-сообщество, проводить профессиональные встречи и создать более 20 сервисов для обучения, развития, карьеры, досуга и работы. Работа идёт полным ходом, постепенно воплощаем эти идеи в жизнь. Менторство активно развивается: каждую неделю проводим 6–7 групповых занятий — лекции, митапы, собеседования и лайвкодинг. Создали полный курс по фронтенду, завершили курс по Webpack, подготовили материалы по линтерам и форматерам и другим технологиям и инструментам. Ученики трудоустраиваются. Практику расширяем на платформе YeaHub, приходит много новых ребят, заряженных на результат. С января планирую вернуться к съёмке видео на YouTube. Основные темы — материалы из обучения, такие как Webpack, архитектура приложений, инструменты и другие важные аспекты. Также хочу записать новые курсы по JavaScript и CSS на основе текущих материалов с менторства. Увольняюсь с текущей работы, чтобы больше времени уделять развитию проектов. Планирую снять офис в центре Краснодара, который станет мини-студией для записи видео и работы. На этих выходных выступаю с докладом «Как понять программирование, если вы не технарь?» в ОМ. А 16 декабря стартует мастермайнд, где вместе с IT-специалистами, блогерами, менторами и стартаперами будем обсуждать точки роста и возможности для развития. Веду активную айтишную жизнь Если среди моих подписчиков есть бэкендеры, владеющие Nest.js, и вы хотите принять участие в развитии YeaHub, обязательно пишите! Мы создаём платформу с огромными возможностями. Как у вас дела? Что нового происходит? Кстати, с наступающим Новым годом! 🎄 https://github.com/YeaHubTeam/yeahub-platform

🖥 CSS Houdini: Что это и зачем он нужен? CSS Houdini — это набор API, который открывает доступ к "внутренностям" браузера, позволяя разработчикам управлять процессом рендеринга CSS. С Houdini можно создавать кастомные свойства, работать с анимациями, управлять раскладкой элементов и даже разрабатывать свои типы CSS-процессоров. 📌 Custom Properties and Values API Позволяет задавать пользовательские свойства с типизацией.

CSS.registerProperty({
  name: '--main-color',
  syntax: '<color>',
  inherits: false,
  initialValue: 'black',
});

Теперь --main-color можно использовать как любое CSS-свойство, например, в анимациях. 📌 Paint API Используется для создания кастомных графических эффектов.

class MyPaintWorklet {
  paint(ctx, size, properties) {
    ctx.fillStyle = 'blue';
    ctx.fillRect(0, 0, size.width, size.height);
  }
}
registerPaint('my-paint', MyPaintWorklet);

// Затем в CSS:
.element {
  background: paint(my-paint);
}

📌 Animation Worklet API Упрощает создание сложных анимаций с минимальным воздействием на производительность. Например, плавные анимации, работающие на уровне композитора. 📌 Layout API Дает контроль над раскладкой элементов. С ним можно реализовать свои алгоритмы расположения, например, нестандартные сетки. 📌 Parser API Открывает доступ к разбору и интерпретации CSS-свойств.

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

// paint.js
class DotsWorklet {
  paint(ctx, size, props) {
    const radius = size.width / 10;
    ctx.fillStyle = props.get('--dot-color').toString();
    for (let y = radius; y < size.height; y += 2 * radius) {
      for (let x = radius; x < size.width; x += 2 * radius) {
        ctx.beginPath();
        ctx.arc(x, y, radius, 0, 2 * Math.PI);
        ctx.fill();
      }
    }
  }
}
registerPaint('dots', DotsWorklet);

// styles.css
:root {
  --dot-color: red;
}

.element {
  background: paint(dots);
}

CSS Houdini — это будущее веб-разработки, которое уже наступило. Если вы хотите выделяться и использовать передовые технологии, начинайте изучать Houdini прямо сейчас. 💡 #css #browser #frontend #houdini

❓ 5 вопросов к разработчику, который накрутил опыт и устроился в IT Сегодня мы беседуем с IT-специалистом, который честно поделился своим опытом накрутки профессионального опыта и трудоустройства в IT-сферу. В этом интервью наш гость расскажет о сложностях, с которыми он столкнулся на пути, методах подготовки и реальных вызовах, которые ждут тех, кто решится пойти этим путем. 1. Что побудило вас накрутить опыт? Считаете ли вы это оправданным шагом, и как вы оцениваете его последствия для себя и рынка IT?

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

2. Какие трудности возникли во время накрутки? Было ли что-то, что вас особенно удивило или оказалось сложнее, чем ожидалось?

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

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

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

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

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

5. Удалось ли устроиться? Насколько сложной оказалась работа на новом месте, и с какими трудностями вы сталкиваетесь в реальных задачах?

Устроился и работаю, справляюсь с задачами, первые 2 недели привыкал ко всему новому, потом стало гораздо спокойнее и стал просто работать размеренно. Даже за первые несколько рабочих недель прокачался значительно, привык выполнять ТЗ в большом проекте. Мне сильно помогли навыки, которые я приобрёл во время обучения у своего ментора так, что придя на работу я с первой же недели вклинился в проект и начал в нём выполнять задачи. Сейчас ещё просто хочется поскорее ещё понабраться опыта и поработать с разными рабочими задачами для большей уверенности. В целом задачи бывают разные, но решаемые, со временем приходит какое-то решение.

#interview

🥇 Топ 6 сложных вопросов в JavaScript (По версии YeaHub) 1. Объясните концепцию прототипного наследования в JavaScript. Для новичков это сложно, так как прототипное наследование отличается от классического, и требует понимания работы с prototype и цепочки прототипов. 2. Что такое __proto__ и prototype? Термины часто путают, и для их понимания нужно хорошо разобраться в механизме наследования JavaScript. 3. Какие есть способы оптимизации ресурсоемких операций в JavaScript для улучшения производительности рендеринга контента? Вопрос охватывает широкий круг тем: от дебаунсинга/троттлинга до работы с Web Workers и Virtual DOM. 4. Какие ключевые метрики используются для оценки производительности веб-сайта? Метрики вроде FCP, LCP, TTI и CLS требуют понимания принципов работы браузеров и инструментов анализа. 5. Что такое CSS Houdini? Вопрос сложен, так как Houdini относится к продвинутым возможностям CSS, с которыми новички редко сталкиваются. 6. Какие техники используются для критического CSS и ленивой загрузки стилей? Вопрос требует знания оптимизаций загрузки, которые выходят за рамки базового понимания JavaScript. ❗️ Почему эти вопросы сложны? - Неочевидные темы для новичков. Начинающие часто изучают основы: переменные, циклы, функции, но не погружаются в нюансы, как, например, прототипное наследование или CSS Houdini. - Широкий охват знаний. На собеседовании могут ожидать объяснений с примерами и понимания теории, что сложно освоить быстро. - Редкость на практике. Некоторые темы, как CSS Houdini или критический CSS, менее распространены и не всегда встречаются в повседневной работе. Не согласны с подборкой? Присоединяйтесь к YeaHub (@yeahub_community) и предлагайте свои вопросы или оценки! Вместе сделаем IT лучше и удобнее для всех 🚀 👍 @yeahub

🌈 Утилитарные классы Утилитарные классы — это классы, которые применяют одно конкретное стильовое свойство. Например, text-center, bg-blue, p-4 и другие. Каждый из этих классов отвечает за отдельную задачу, такую как выравнивание текста, установка фона или добавление отступов. Их основная цель — сделать разработку быстрее и проще, не создавая громоздкие и избыточные CSS-правила. Главная идея утилитарных классов заключается в том, что они являются "заготовками" для применения стилей, которые можно комбинировать для создания более сложных и уникальных дизайнов. Вместо того чтобы создавать новые стили для каждого элемента, можно использовать уже существующие классы, что снижает объем написанного кода и повышает гибкость. 👀 Пример использования утилитарных классов Допустим, вам нужно создать карточку с текстом и кнопкой. Вместо того чтобы писать отдельные CSS-правила для каждого элемента, вы можете использовать утилитарные классы:

<div class="bg-gray-100 p-6 rounded-lg shadow-md">
  <h2 class="text-xl font-bold text-center mb-4">Заголовок</h2>
  <p class="text-base text-gray-700">Некоторое описание...</p>
  <button class="bg-blue-500 text-white p-2 rounded mt-4">Кнопка</button>
</div>

bg-gray-100 — задает светло-серый фон для карточки. p-6 — добавляет отступы (padding) размером 1.5rem со всех сторон. rounded-lg — округляет углы элемента. shadow-md — добавляет тень. text-xl — увеличивает размер шрифта заголовка. font-bold — делает текст жирным. text-center — выравнивает текст по центру. mb-4 — добавляет отступ снизу у заголовка. bg-blue-500 — задает синий фон кнопке. text-white — делает текст кнопки белым. p-2 — добавляет отступы для кнопки. rounded — округляет углы кнопки. mt-4 — добавляет отступ сверху у кнопки.

Каждый класс отвечает за одно конкретное свойство, и все эти классы можно комбинировать для создания нужного внешнего вида элемента. 🎮 Утилитарные классы в Tailwind CSS Tailwind CSS — это фреймворк, который полностью построен на утилитарных классах. Вместо того чтобы создавать отдельные CSS-правила для каждого компонента, в Tailwind используются уже готовые утилитарные классы, которые можно применять прямо в HTML-разметке. Это позволяет ускорить разработку и уменьшить объем CSS-кода, так как вы не пишете одни и те же правила для разных элементов, а просто комбинируете готовые классы. Пример с использованием Tailwind CSS:

<div class="bg-blue-500 text-white p-4 rounded-lg shadow-lg">
  <h1 class="text-2xl font-semibold text-center">Привет, мир!</h1>
  <p class="mt-2 text-base">Это пример использования утилитарных классов в Tailwind CSS.</p>
</div>

В данном примере:

bg-blue-500 и text-white отвечают за цвета фона и текста. p-4 — отступы. rounded-lg — округление углов. shadow-lg — тень. text-2xl и font-semibold — стиль заголовка. text-center — выравнивание текста по центру. mt-2 — отступ сверху для параграфа.

Tailwind CSS предоставляет очень широкий набор таких классов, позволяя легко комбинировать их и создавать любые стили без необходимости писать сложные CSS-правила. Это делает Tailwind очень популярным инструментом для быстрой разработки интерфейсов. #css

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

когда я увольнялась, в моем резюме от компании красовался весь стек айосера и 6 мать их лет опыта!

ну я короче это, сеньор))) и недавно появилась такая вот забавная тенденция: теперь уже эти аутстаффы проверяют опыт кандидатов по трудовой, прежде чем человека на собес позвать, чтобы НЕ ТРАТИТЬ НА НЕГО ВРЕМЯ, а то вдруг он уже накрутил и мы ему еще если накрутим, то он ж не справятся, порвется, а мы на деньги перед заказчиком попадем!!!

короче, лохов без опыта не берём, возьмем только опытных))

эта тема давно заезженная, но почему-то с одной стороны сильно больше. и главное все делают вид, что это ок, бизнес же, если мы с улицы накрутчика возьмем — он плохой, а если из аутстаффа нанимаем пятилетнего мидла — то это же норм, он типо проверенный…ага я уже не говорю о том, как походы на собесы с накруткой от аутстаффа портят вам карьеру в дальнейшем, так как ваше СУПЕРНАКРУЧЕННОЕ резюме будет храниться в базах тех компаний, когда вы захотите уволиться из своего аутстаффа и выйти самостоятельно на рынок…но об этом в следующем посте ребят, если вас от накрутки останавливает этичность вопроса — перечитайте пост если останавливает незнание как это делать не спалившись и не выгореть от попыток — смотрите полный гайд ❗️помните, если вы попадете не к тому работодателю со своим реальным небольшим опытом — вам его все равно накрутят и воспользуются вами. если уж решили вкатываться, то играйте по правилам рынка расслабьтесь, ребятки, тут давно такие правила всех чмок всем пис 👍

Грейд: Мидл+/Сеньор Компания: Wildberries Опыт: 3.5 Этап: Финал Вилка: 250к - 300к Пример собеседования, на котором копают опыт и софты. Куча вопросов. Собеседование проходило недавно Вопросы: - Можешь рассказать, почему решил уйти с текущего проекта? - Что тебе больше всего нравится в твоей работе? - Приходилось ли тебе взаимодействовать с другими командами, и что обычно включало это взаимодействие? - Как вы получали задачи: был ли бэклог, кто их формировал? - Какую роль ты играл в декомпозиции задач? Какие подходы предлагал, по какому принципу действовал? - Можешь вспомнить задачу, которая была самой неопределенной? Как справлялся с ней? - Что, на твой взгляд, важнее — интересы бизнеса или интересы пользователя? - Продвигаешь ли ты свои идеи и новшества в команде? Как ты аргументируешь свои предложения? - По каким признакам или метрикам определяешь, что команда действительно продуктивна и приносит ценность? - Какой был состав команды, в которой ты работал? - Как у вас проходило код-ревью? Что для тебя в нем важно, и что бы не хотелось видеть? - Бывали ли сложности в общении с коллегами? Может, вспомнишь какой-то спорный случай? - Сталкивался ли ты с неэффективными процессами? Как к этому относишься? - Приходилось ли тебе принимать риски — продуктовые или технические? Как ты к ним подходил? - Были ли ситуации, когда горели сроки? Как ты считаешь, кто в этом виноват? - Как ты организуешь свое личное развитие, что читаешь? Какие видишь перспективы? - Интересно ли тебе попробовать себя в роли менеджера? - Был ли у тебя опыт самостоятельного ведения проектов? - Какая из задач была для тебя самой сложной? Почему? - Как ты организуешь работу над задачей? Используешь ли планирование? - Получал ли ты развивающий фидбек по своим софт-скиллам? Как на это реагировала? - Как оцениваешь задачи? Вспомни случай, когда пришлось работать с претензией или получать обратную связь — как действовал? - Какие у тебя ожидания от новой команды? - Какие ожидания у тебя к руководителю? - Как ты оцениваешь качество своей работы?

Какие претензии у айтишников к новичкам? Это дополнение к посту о Дедовщине в IT. Стрим про Гейткиперов) Залетайте на стрим 🔥 https://www.youtube.com/watch?v=fGl689uzDuY

🚀 [Версия 1.0.0] - Релиз платформы! Привет, друзья! 🎉 Мы рады сообщить, что первая версия нашей платформы готова и доступна! В этой версии: ✔️ Добавлен сервис подготовки к собеседованиям. Мы сделали первый шаг и теперь работаем над новыми фичами, чтобы помочь вам ещё быстрее и эффективнее подготовиться к важным этапам в карьере. Ваши отзывы очень важны для нас, пишите, что вам нравится и что можно улучшить! 💬 🔥 Что дальше? Следите за обновлениями – скоро будет ещё больше интересных возможностей! 👍 Обучайтесь, общайтесь, растите вместе с https://yeahub.ru #release #news #update #yeahub

👀 Контроль сотрудников на работе: история из личного опыта Когда я впервые столкнулся с системой тайм-трекинга, работая в аутсорсинговой компании, это стало для меня настоящим испытанием. Я тогда занимался разработкой криптокошелька для лондонской компании, и это был мой первый проект на европейском рынке. Рабочий день начинался с обязательного включения тайм-трекера. Программа фиксировала всё: время работы, активность на клавиатуре и мыши, а также записывала экран. Если активность снижалась, мог последовать вопрос от тимлида: "Почему у тебя так мало активности? Ты целый день ничего не делал?". Самое сложное заключалось в том, что после 10 минут бездействия таймер сбрасывался на 10 минут назад и останавливался. Нужно было набирать ровно 8 часов активности — ни минутой меньше. Представьте, как я бегал в туалет, делал чай или обедал! У меня не было ноутбука, поэтому я буквально каждые 8 минут возвращался к компьютеру, чтобы не сбился таймер. Работать в таких условиях было невероятно тяжело. Обычное чтение документации или размышления над задачей превращались в стресс: нельзя просто сидеть и думать, обязательно нужно было шевелить мышкой. Ты не сосредотачиваешься на задачах, а следишь за таймером. Этот опыт научил меня многому, но и вымотал колоссально. Теперь я с пониманием отношусь к людям, которые сталкиваются с подобными системами контроля. А у вас был подобный опыт? Делитесь в комментариях! Если интересна тема, рекомендую видео Антохи: https://youtu.be/3eMAc4Dc5sY. Флешбеки до сих пор... 😬

🤫 Почему ИИ не заменит программистов Ко мне часто приходят на консультации по фронтенд-разработке, и один из самых популярных вопросов звучит так: "А стоит ли вообще начинать учиться, если ИИ скоро заменит программистов? Я боюсь, что выучу всё, а работы не будет, потому что всё будут делать машины." Я решил поделиться своими мыслями на эту тему. Вот несколько причин, почему я уверен, что ИИ не заменит программистов: Понимание контекста Программисты учитывают бизнес-требования, цели продукта и реальные потребности пользователей. ИИ может следовать шаблонам, но не способен анализировать проект в полной мере и принимать осознанные решения в контексте конкретной задачи. Креативность и нестандартное мышление Программирование — это не просто написание кода. Это поиск новых решений, генерация идей и эксперименты. ИИ отлично справляется с рутиной, но творческий процесс, интуиция и способность мыслить "вне коробки" остаются человеческой прерогативой. Командная работа Разработка — это всегда коллективный процесс. Обсуждения, обмен мнениями, компромиссы и гибкость — ключевые элементы успешного проекта. Навыки общения и эмоциональный интеллект пока что неподвластны машинам. Работа с неопределенностью В программировании часто встречаются задачи, у которых нет очевидного решения. Здесь важно умение экспериментировать, анализировать результат и менять подход. ИИ действует строго в рамках заданных алгоритмов, а неопределённость для него — сложный барьер. Этические и моральные вопросы Иногда разработчикам приходится принимать решения, которые затрагивают моральные или социальные аспекты. Например, как обезопасить данные пользователей или избежать дискриминации в алгоритмах. Такие задачи требуют человеческой ответственности. Обучение и адаптация Технологии развиваются, и программисты постоянно учатся новому. Они экспериментируют с подходами, пробуют новые инструменты и следят за трендами. ИИ может обновляться только через человеческое вмешательство и не способен самостоятельно осваивать новые области. Недавно слышал мнение, что ИИ достиг своего "потолка эффективности". Увеличение мощностей больше не дает таких же резких улучшений, как раньше. Это отражает принцип Парето: 20% усилий дают 80% результата. Теперь улучшения требуют значительно больше ресурсов, а отдача от них становится всё менее заметной. Стоимость разработки и поддержки ИИ продолжает расти, а эффект от этого — уменьшается. Это делает дальнейший рост ИИ менее эффективным с точки зрения затрат. ❓ А что вы думаете? #ai

🥸 Дедовщина в IT Я давно вышел из всех чатов, где "помогают" новичкам. Почему? Из-за дедов, которые самоутверждаются на начинающих. Сколько раз я видел, как новичка прессуют: "это не твое", "иди обратно на завод", "ты тупой". Как только начинаешь говорить о курсах, сразу: "Какие курсы? Ты чего? Книги читай, и только на английском! Документацию учи!" IT — обычная сфера, как и все. Не надо делать из нее романтику или заставлять каждого изучать computer science, алгоритмы и т.п. Хороший фронтендер — это человек, который применяет технологии, справляется с задачами и умеет писать код. Если будет время, посмотрите это видео на досуге. База 💯. https://www.youtube.com/watch?v=MGWZP4OjCHM

🖥 Intersection Observer Intersection Observer — это интерфейс, позволяющий отслеживать, когда элемент появляется в зоне видимости, перекрывает другой элемент или выходит за границы видимой области (viewport). Он предоставляет эффективный способ наблюдения за видимостью элементов, чем старые методы вроде событий прокрутки и проверки getBoundingClientRect(), так как не вызывает перерисовку и работает асинхронно.

Intersection Observer полезен, если нужно: - отслеживать появление элементов на экране (например, для ленивой загрузки изображений); - анимировать элементы при их появлении в зоне видимости; - отслеживать видимость рекламы или элементов пользовательского интерфейса.

Создание Intersection Observer Создать Intersection Observer можно с помощью конструктора IntersectionObserver, в который передается колбэк-функция. Эта функция будет вызываться с массивом записей (IntersectionObserverEntry), описывающих пересечения.

const observer = new IntersectionObserver((entries) => {
  entries.forEach((entry) => {
    console.log(entry);
  });
});

Каждый объект entry в entries содержит информацию о пересечении, включая: - isIntersecting — флаг, указывающий, находится ли элемент в зоне видимости; - target — целевой элемент, для которого произошло пересечение; - intersectionRatio — процент видимой части элемента; - boundingClientRect — размеры и положение целевого элемента относительно видимой области.

Начало наблюдения Чтобы начать наблюдение, нужно использовать метод observe и указать целевой элемент:

const targetNode = document.getElementById('targetElement');
observer.observe(targetNode);

Остановка наблюдения Когда больше не нужно отслеживать пересечения, можно остановить наблюдение с помощью метода unobserve() или полностью прекратить работу с disconnect():

observer.unobserve(targetNode);
observer.disconnect();

Полезные параметры конфигурации

При создании IntersectionObserver можно указать дополнительные настройки, которые управляют его поведением: - root: элемент, который будет использоваться в качестве контейнера для отслеживания видимости. По умолчанию — null, то есть будет использоваться viewport. - rootMargin: отступы вокруг root, которые позволяют изменять зону видимости (например, rootMargin: "0px 0px -50% 0px"). - threshold: массив значений (от 0 до 1), задающий, какой процент видимости элемента должен быть достигнут, чтобы вызвался колбэк. Например, threshold: [0, 0.5, 1] вызовет колбэк при 0%, 50%, и 100% видимости.

#javascript #intersection_observer

🖥 DOM Mutation Observer Mutation Observer — это интерфейс, позволяющий отслеживать изменения в DOM, такие как добавление или удаление элементов, изменение атрибутов или текста. Он предоставляет более эффективный способ наблюдать за изменениями, чем старые методы вроде Mutation Events, так как не блокирует поток выполнения и может отслеживать сразу несколько изменений.

Mutation Observer полезен, если нужно: - отслеживать изменения в структуре DOM (например, добавление или удаление элементов); - реагировать на изменения атрибутов элементов; - мониторить текстовое содержимое элементов, например, для динамически обновляемых данных.

Создание Mutation Observer Создать Mutation Observer можно с помощью конструктора MutationObserver, в который передается колбэк-функция. Эта функция будет вызываться с массивом записей (`MutationRecord`), описывающих изменения.

const observer = new MutationObserver((mutationsList) => {
  mutationsList.forEach((mutation) => {
    console.log(mutation);
  });
});

Каждый объект `mutation` в `mutationsList` содержит информацию о произошедшем изменении, включая: - `type` — тип изменения (`childList`, `attributes`, или `characterData`); - `target` — целевой элемент, где произошло изменение; - `addedNodes` и `removedNodes` — список добавленных или удаленных узлов, если `type` — `childList`; - `attributeName` — имя измененного атрибута, если `type` — `attributes`.

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

const targetNode = document.getElementById('targetElement');
observer.observe(targetNode, {
  childList: true, // следить за добавлением и удалением дочерних элементов
  attributes: true, // следить за изменением атрибутов
  characterData: true, // следить за изменением текстового содержимого
  subtree: true // отслеживать изменения во всех потомках
});

Остановка наблюдения Когда больше не нужно отслеживать изменения, можно остановить наблюдение с помощью метода disconnect():

observer.disconnect();

Полезные параметры конфигурации - `childList`: отслеживает добавление и удаление дочерних элементов. - `attributes`: отслеживает изменения атрибутов у целевого элемента. - `characterData`: отслеживает изменения текстового содержимого. - `subtree`: если установлено в `true`, позволяет отслеживать изменения не только у целевого элемента, но и у всех его потомков.

#javascript #observer

👩‍💻 React Новости Приятно видеть, что этот практический курс помогает ребятам. Многие пишут слова благодарности в личку, спрашивают, когда будет продолжение. Тяжело сказать, я хотел бы продолжить, добавить кучу функциональностей. Но пока нет времени, занят менторством и YeaHub. Ставьте лукас, если смотрели React Новости 👍 🔗 Ссылка на видео

🥵 Стресс после трудоустройства Трудоустройство в IT — это всегда вызов. Независимо от уровня опыта, у большинства возникают одинаковые опасения: "Разберусь ли в проекте?", "Не разочарую ли команду?", "Смогу ли выполнить ожидания?" Эти вопросы сопровождают нас не только в начале карьеры, но и спустя годы работы. Новое место — это не просто новые задачи, но и новые процессы, технологии, подходы, и самое главное — ожидания. Даже опытные разработчики сталкиваются с внутренним страхом, что не подойдут по требованиям или что нагрузка окажется непосильной. Именно из-за этого многие специалисты годами остаются в одной компании, опасаясь перемен. Такой стресс и страх не редкость, и он знаком почти каждому, кто когда-либо сталкивался с переменами. Помните, что важно давать себе время на адаптацию, ведь никто не требует, чтобы вы стали экспертом за одну ночь. Спокойная уверенность и доверие к своим силам помогут снизить стресс и сделать адаптацию легче. 💡 Вот несколько советов для снижения стресса на новом месте: 1. Дайте себе время Не требуйте от себя всего сразу. Привыкание к проекту занимает время. 2. Задавайте вопросы Никто не ожидает, что вы всё знаете. Спрашивайте — это быстрее приведет к пониманию задач. 3. Осваивайте поэтапно Беритесь за одну задачу за раз, избегайте перегрузки. 4. Найдите коллег для поддержки Опытные сотрудники могут поделиться знаниями и упростить адаптацию. 5. Фиксируйте прогресс Записывайте успехи, чтобы видеть результаты и укреплять уверенность. 6. Снимите самокритику Ошибки неизбежны. Оценивайте свои усилия, а не только результаты. 7. Берегите здоровье Режим сна и питания помогут избежать выгорания. Антоха на стриме рассказал подробнее про трудоустройство и испытательный срок. Кстати, у него новый YouTube-канал — в ближайшее время он выпустит много годного контента 👍 https://www.youtube.com/live/KMsrfLvRLN0?si=TEFseo6--7wDmqGF&t=520