В 19:50 отправим ссылку в боте)
Please open Telegram to view this post
VIEW IN TELEGRAM
❤10❤🔥3
Скоро перейдем за сотню 🥺
Может показаться, что это не так много, но представьте, что с каждым из 88 разработчиков вам нужно 3 месяца ежедневно работать, да еще так, чтобы по итогу получить средний оффер 250к.Или просто провести 2000+ созвонов)
Звучит уже интересно, и это именно то, что я делал последний год 😅
p.s. в воскресенье на стриме расскажу как до такого дошли, и что планируем делать дальше)
Может показаться, что это не так много, но представьте, что с каждым из 88 разработчиков вам нужно 3 месяца ежедневно работать, да еще так, чтобы по итогу получить средний оффер 250к.
Звучит уже интересно, и это именно то, что я делал последний год 😅
p.s. в воскресенье на стриме расскажу как до такого дошли, и что планируем делать дальше)
🔥17💯4🏆4
Поиграл в волейбол и сходили в бар с выпускниками на менторстве 🥹
Ребята в сообществе уже случайно встречают друг друга в метро, растем)
Несмотря на разный стек, все с офферами 250+ на интересные проекты
Заслуженный отдых в субботу, получается)
Ребята в сообществе уже случайно встречают друг друга в метро, растем)
Несмотря на разный стек, все с офферами 250+ на интересные проекты
Заслуженный отдых в субботу, получается)
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥22❤🔥5👍3🏆1
Подарил жене на день рождения фортепиано, и сам что-то снова стал играть иногда 🤓
Гимнастика для мозга конечно отличная) А как вы отдыхаете после рабочей недели?
p.s. осталось только подставку и педали дождаться)
p.s.s за несколько дней разучили ноты и уверенно идем по учебнику ДМШ 🧑🎓
Гимнастика для мозга конечно отличная) А как вы отдыхаете после рабочей недели?
p.s. осталось только подставку и педали дождаться)
p.s.s за несколько дней разучили ноты и уверенно идем по учебнику ДМШ 🧑🎓
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥22😍10❤🔥5💯1
Сегодня в 20:00 проведем стрим по решению задач с собеседований 🔥
Как проходит?
Будем решать задачи с прошедших собеседований в нашей группе на менторстве, в чате в канале. Затем разбираем + обсуждаем правильные решения и идем дальше.
Какие задачи будут?
Все, что можно решить в 1-2 строки: EventLoop, замыкания, контекст, react.
Призовой фонд🥹
Чтобы решение задач было не только полезным, но и веселым, мы решили выделить призовые 2 000 р для 5 победителей с наибольшим кол-вом правильно решенных задач.
Как записаться?
Просто подписаться на @codepunks_stream_bot, и в 19:00 и 19:45 отправлю ссылки на подключение)
p.s. также планируем разговорный стрим в воскресенье)
Как проходит?
Будем решать задачи с прошедших собеседований в нашей группе на менторстве, в чате в канале. Затем разбираем + обсуждаем правильные решения и идем дальше.
Какие задачи будут?
Все, что можно решить в 1-2 строки: EventLoop, замыкания, контекст, react.
Призовой фонд
Чтобы решение задач было не только полезным, но и веселым, мы решили выделить призовые 2 000 р для 5 победителей с наибольшим кол-вом правильно решенных задач.
Как записаться?
Просто подписаться на @codepunks_stream_bot, и в 19:00 и 19:45 отправлю ссылки на подключение)
p.s. также планируем разговорный стрим в воскресенье)
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥11❤6👍4🕊1🐳1
Через 2 часа начинаем)
Ссылку за 15 минут отправим в боте)
Тут будет чат🧃
p.s. общий счет:
Даня Рузин — 5
Мария — 3
Юрий — 3
Руфина — 3
Султан — 3
Влад — 2
Александр Паньков — 1
Максим Попов — 1
Ольга Стрекаловская — 1
Ильдар — 1
Павел — 1
Чингиз — 1
Всем спасибо за участие, вы лучшие)🫡
Ссылку за 15 минут отправим в боте)
Тут будет чат
p.s. общий счет:
Даня Рузин — 5
Мария — 3
Юрий — 3
Руфина — 3
Султан — 3
Влад — 2
Александр Паньков — 1
Максим Попов — 1
Ольга Стрекаловская — 1
Ильдар — 1
Павел — 1
Чингиз — 1
Всем спасибо за участие, вы лучшие)
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥13❤8😍4
🎯 5 метрик производительности, которые должен знать каждый фронтендер
Шпаргалка для работы и собеседований
Эти метрики спрашивают на собесах, по ним оценивают вашу работу, и они напрямую влияют на бизнес. Простым языком с примерами.
1. Скорость загрузки
FCP (First Contentful Paint) — когда на экране впервые появляется что-то (текст, лоадер).
LCP (Largest Contentful Paint) — когда прогружается самый крупный блок на странице (скелетоны, баннер).
2. Реакция на действия
FID (First Input Delay) — как быстро страница реагирует на первое действие (например, клик по кнопке).
- FID измеряет только первое взаимодействие и только задержку до начала выполнения callback, не включая отрисовку. В 2024–2025 его постепенно заменяет INP.
INP (Interaction to Next Paint) — измеряет, насколько быстро страница реагирует на взаимодействия пользователя — не только на первое, а на протяжении всей сессии.
3. Стабильность интерфейса
CLS (Cumulative Layout Shift) — измеряет «прыжки» элементов при загрузке.
- Шифты считаются только для видимых элементов и только пока страница активна.
- Поздние изменения (через секунды после загрузки) тоже учитываются, если это внезапные сдвиги.
- Анимации не считаются шифтом, если они предсказуемы (например, transition с фиксированным началом и концом).
Как замерять
Инструменты разработчика в Chrome (вкладка Lighthouse или Performance).
Аналитика в реальном времени: Google Analytics 4, Sentry, Datadog и др.
Почему всё это важно
- Google учитывает Core Web Vitals (LCP, INP, CLS) в SEO-рейтинге.
- Конверсия напрямую связана с перформансом (например, +100 мс к LCP может заметно уменьшить продажи).
- Легче проходить собеседования 😅
Вопрос на подумать, как думаете, FCP или LCP сильнее влияет на конверсию?)
Шпаргалка для работы и собеседований
Эти метрики спрашивают на собесах, по ним оценивают вашу работу, и они напрямую влияют на бизнес. Простым языком с примерами.
1. Скорость загрузки
FCP (First Contentful Paint) — когда на экране впервые появляется что-то (текст, лоадер).
LCP (Largest Contentful Paint) — когда прогружается самый крупный блок на странице (скелетоны, баннер).
2. Реакция на действия
FID (First Input Delay) — как быстро страница реагирует на первое действие (например, клик по кнопке).
- FID измеряет только первое взаимодействие и только задержку до начала выполнения callback, не включая отрисовку. В 2024–2025 его постепенно заменяет INP.
INP (Interaction to Next Paint) — измеряет, насколько быстро страница реагирует на взаимодействия пользователя — не только на первое, а на протяжении всей сессии.
3. Стабильность интерфейса
CLS (Cumulative Layout Shift) — измеряет «прыжки» элементов при загрузке.
- Шифты считаются только для видимых элементов и только пока страница активна.
- Поздние изменения (через секунды после загрузки) тоже учитываются, если это внезапные сдвиги.
- Анимации не считаются шифтом, если они предсказуемы (например, transition с фиксированным началом и концом).
Как замерять
Инструменты разработчика в Chrome (вкладка Lighthouse или Performance).
Аналитика в реальном времени: Google Analytics 4, Sentry, Datadog и др.
Почему всё это важно
- Google учитывает Core Web Vitals (LCP, INP, CLS) в SEO-рейтинге.
- Конверсия напрямую связана с перформансом (например, +100 мс к LCP может заметно уменьшить продажи).
- Легче проходить собеседования 😅
Вопрос на подумать, как думаете, FCP или LCP сильнее влияет на конверсию?)
❤18🔥8👍4
Пару месяцев назад проводили открытое мок-собеседование для одного из наших подписчиков, получилось очень весело и продуктивно)
На следующей неделе планируем еще несколько очень интересных форматов, с мок-собеседованием и не только🫶
Если хочешь стать участником следующих открытых моков - пиши @codepunks_bro
Также готов ответить на любые вопросы по менторству, ведь совсем недавно двоих подписчиков взяли после голосования, и нашли всем работу рассказывая о каждом шаге от резюме до оффера публично в канале)
На следующей неделе планируем еще несколько очень интересных форматов, с мок-собеседованием и не только🫶
Если хочешь стать участником следующих открытых моков - пиши @codepunks_bro
Также готов ответить на любые вопросы по менторству, ведь совсем недавно двоих подписчиков взяли после голосования, и нашли всем работу рассказывая о каждом шаге от резюме до оффера публично в канале)
YouTube
Мок интервью Frontend | Тренировка перед реальным собесом
#программист #айти #собес
Мой телеграм-канал: https://t.me/+PkvI8JmOd2U1ODFi
Таймкоды:
2:08 Типы данных JS
2:46 На что делятся типы данных
10:35 Как лучше задать контекст для стрелочной функции через call или apply?
16:23 Что такое статистические методы?…
Мой телеграм-канал: https://t.me/+PkvI8JmOd2U1ODFi
Таймкоды:
2:08 Типы данных JS
2:46 На что делятся типы данных
10:35 Как лучше задать контекст для стрелочной функции через call или apply?
16:23 Что такое статистические методы?…
🔥8❤🔥4❤2😍1💯1
Недавно подводил итоги месяца в группе, по итогу сентябрь по урожайности вышел примерно также как и август, 8-10 офферов.
Среди крупных в этом месяце Яндекс, РСХБ. В прошлом более-менее активно нанимал Сбер и Т-Банк.
Самая большая активность сейчас у Vue разработчиков, зовут как минимум на 10 собеседований в месяц по сравнению с ~8 у React.
Также много предложений у Fullstack разработчиков, хоть в глубину по части бэка как правило сильно не копают. Но не скупятся на математические и логические задачки почему-то😅
На сходке обсуждали топ задач: про скорость улитки, почему люк круглый, сколько монеток положить на весы чтобы найти более тяжелую за 2 взвешивания 😁 (никакого кодинга)
Средний оффер в сентябре держится на уровне ~260 т.р., что больше среднего по группе на 10 тысяч, так что в этом плане тенденция по рынку неплохая.
И финально, в этом месяце увидел идеальное собеседование среди огромного кол-ва стандартных теоретических и livecoding секций, которые не встречаются в работе)
p.s. в воскресенье в 20:00 на стриме все расскажу)
Среди крупных в этом месяце Яндекс, РСХБ. В прошлом более-менее активно нанимал Сбер и Т-Банк.
Самая большая активность сейчас у Vue разработчиков, зовут как минимум на 10 собеседований в месяц по сравнению с ~8 у React.
Также много предложений у Fullstack разработчиков, хоть в глубину по части бэка как правило сильно не копают. Но не скупятся на математические и логические задачки почему-то😅
На сходке обсуждали топ задач: про скорость улитки, почему люк круглый, сколько монеток положить на весы чтобы найти более тяжелую за 2 взвешивания 😁 (никакого кодинга)
Средний оффер в сентябре держится на уровне ~260 т.р., что больше среднего по группе на 10 тысяч, так что в этом плане тенденция по рынку неплохая.
И финально, в этом месяце увидел идеальное собеседование среди огромного кол-ва стандартных теоретических и livecoding секций, которые не встречаются в работе)
p.s. в воскресенье в 20:00 на стриме все расскажу)
🔥16❤7👍6
Готовим сразу 3 интересных события на этой/следующей неделе 🫡
В воскресенье 05.10 в 20:00: разговорный стрим, ответы на вопросы.
— Обсудим все то, что не успевали обсудить на предыдущих стримах: рынок, собеседования, вилки, поиск, либы и варианты для карьерного роста в 2025.
— Расскажу почему так сложно в этом году разработчикам менять работу, и как мы это обходим.
— Про синдром самозванца, который очень часто встречается у разработчиков.
— Просто поговорим на интересные темы, возможно поддам мотивации двигаться дальше в условиях неопределенности и рынка работодателя.
Во вторник 07.10 в 20:00: стрим с викториной по задачам с собеседований - самые часто встречаемые задачи на React.
— Все как на предыдущих стримах, учли все пожелания и готовим подборку React-задач, как всегда с подвохом)
Все ссылки на стримы будут в: @codepunks_stream_bot
Второй сезон в реалити🥹
Этим летом я взял двух подписчиков на менторство бесплатно, которых выбрали остальные подписчики) Олю и Кирилла 🫶
Все процесс от резюме до выхода на работу прошел довольно быстро, и поскольку это был пилотный раз, мы не так подробно успели раскрыть весь процесс подготовки, как хотелось бы.
Поэтому... мы решили повторить эксперимент и прокачать еще одного подписчика, с полным ведением от резюме до торгов за оффер вместе с нашей командой.(за кружочки)
На следующей неделе сделаю подробный анонс, а выбор финалиста за вами на голосовании)
Если давно хочешь сменить работу - возможно это идеальное время🫡
В воскресенье 05.10 в 20:00: разговорный стрим, ответы на вопросы.
— Обсудим все то, что не успевали обсудить на предыдущих стримах: рынок, собеседования, вилки, поиск, либы и варианты для карьерного роста в 2025.
— Расскажу почему так сложно в этом году разработчикам менять работу, и как мы это обходим.
— Про синдром самозванца, который очень часто встречается у разработчиков.
— Просто поговорим на интересные темы, возможно поддам мотивации двигаться дальше в условиях неопределенности и рынка работодателя.
Во вторник 07.10 в 20:00: стрим с викториной по задачам с собеседований - самые часто встречаемые задачи на React.
— Все как на предыдущих стримах, учли все пожелания и готовим подборку React-задач, как всегда с подвохом)
Все ссылки на стримы будут в: @codepunks_stream_bot
Второй сезон в реалити
Этим летом я взял двух подписчиков на менторство бесплатно, которых выбрали остальные подписчики) Олю и Кирилла 🫶
Все процесс от резюме до выхода на работу прошел довольно быстро, и поскольку это был пилотный раз, мы не так подробно успели раскрыть весь процесс подготовки, как хотелось бы.
Поэтому... мы решили повторить эксперимент и прокачать еще одного подписчика, с полным ведением от резюме до торгов за оффер вместе с нашей командой.
На следующей неделе сделаю подробный анонс, а выбор финалиста за вами на голосовании)
Если давно хочешь сменить работу - возможно это идеальное время
Please open Telegram to view this post
VIEW IN TELEGRAM
❤16🔥10👍5
Через 4 часа начинаем стрим)
Тут будет чат😉
Тут будет чат
Please open Telegram to view this post
VIEW IN TELEGRAM
❤5🤝3
Первый отзыв, который получил до трудоустройства) Очень радует что не только результат, но и процесс идет интересно)
🔥8❤7❤🔥2
Взяли самую горячую тему, так что готовьтесь вечер провести с пользой)
Приглашение на стрим отправим за 60 и 15 минут в @codepunks_stream_bot
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥15❤8❤🔥2
API браузера. Часть 1.
Многие из нас регулярно заходят в MDN что-бы подсмотреть что-то интересное, а на некоторых позициях часто в ежедневной верстке/типовых задачах забываешь, насколько много можно сделать с помощью браузера.
Этот пост пишу чтобы напомнить, и добавить живых примеров на описание API браузера в документации. В рамках одного поста сложно расписать все кейсы применения и интересных задач, которые могут быть связаны с каждым из API, поэтому ставил для себя задачу как минимум заинтересовать и, возможно подкинуть вдохновения на то что-бы попробовать что-то новое.🫡
Пост вдохновлен официальной докой MDN
Сеть и данные
Fetch API + AbortController (таймауты/отмена) (очень распростаненное API)
Streams API (постепенная обработка ответа)
WebSocket (RT-обновления) (встречается очень часто) (также можно почитать про SSE, Socket.io)
BroadcastChannel (синхронизация между вкладками)
Кэш, офлайн и PWA (pwa)
IndexedDB - пригодится если работаете с большими табличными, например, данными🫡
Производительность и планирование (Web Workers часто спрашивают на собеседованиях)
Многие из нас регулярно заходят в MDN что-бы подсмотреть что-то интересное, а на некоторых позициях часто в ежедневной верстке/типовых задачах забываешь, насколько много можно сделать с помощью браузера.
Этот пост пишу чтобы напомнить, и добавить живых примеров на описание API браузера в документации. В рамках одного поста сложно расписать все кейсы применения и интересных задач, которые могут быть связаны с каждым из API, поэтому ставил для себя задачу как минимум заинтересовать и, возможно подкинуть вдохновения на то что-бы попробовать что-то новое.
Пост вдохновлен официальной докой MDN
Сеть и данные
Fetch API + AbortController (таймауты/отмена) (очень распростаненное API)
const controller = new AbortController();
const timeout = setTimeout(() => controller.abort(), 8000); // 8s timeout
try {
const res = await fetch('/api/items', { signal: controller.signal });
if (!res.ok) throw new Error(`HTTP ${res.status}`);
const data = await res.json();
console.log(data);
} catch (e) {
console.error('Request failed:', e.name === 'AbortError' ? 'timeout' : e);
} finally {
clearTimeout(timeout);
}
Streams API (постепенная обработка ответа)
const res = await fetch('/api/logs/stream');
const reader = res.body.getReader();
const decoder = new TextDecoder();
while (true) {
const { value, done } = await reader.read();
if (done) break;
console.log(decoder.decode(value, { stream: true }));
}
WebSocket (RT-обновления) (встречается очень часто) (также можно почитать про SSE, Socket.io)
const ws = new WebSocket('wss://example.com/ws');
ws.addEventListener('message', e => {
const msg = JSON.parse(e.data);
console.log('event:', msg);
});
ws.addEventListener('close', () => console.log('socket closed'));
BroadcastChannel (синхронизация между вкладками)
const ch = new BroadcastChannel('cart');
ch.onmessage = e => console.log('Cart updated in another tab:', e.data);
// где-то в другой вкладке:
new BroadcastChannel('cart').postMessage({ type: 'ADD', id: 123 });
Кэш, офлайн и PWA (pwa)
Service Worker регистрация + Cache Storage
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/sw.js').catch(console.error);
}
// sw.js (минимум кэша статики)
self.addEventListener('install', e => {
e.waitUntil(caches.open('app-v1').then(c =>
c.addAll(['/','/styles.css','/app.js','/logo.png'])
));
});
self.addEventListener('fetch', e => {
e.respondWith(
caches.match(e.request).then(r => r || fetch(e.request))
);
});
IndexedDB - пригодится если работаете с большими табличными, например, данными
function openDB(name, version = 1) {
return new Promise((resolve, reject) => {
const req = indexedDB.open(name, version);
req.onupgradeneeded = () => req.result.createObjectStore('items', { keyPath: 'id' });
req.onsuccess = () => resolve(req.result);
req.onerror = () => reject(req.error);
});
}
const db = await openDB('appdb');
const tx = db.transaction('items', 'readwrite');
tx.objectStore('items').put({ id: 1, title: 'Foo' });
await tx.complete?.(); // в некоторых браузерах не нужно
db.close();
Производительность и планирование (Web Workers часто спрашивают на собеседованиях)
Web Workers (не блокируем UI)
// worker.js
self.onmessage = ({ data }) => {
const result = heavyCompute(data);
self.postMessage(result);
};
// main
const worker = new Worker('/worker.js', { type: 'module' });
worker.postMessage({ n: 5e6 });
worker.onmessage = ({ data }) => console.log('Result:', data);
requestIdleCallback / Scheduler API (мягкая загрузка)
const schedule = cb =>
('scheduler' in window && scheduler.postTask)
? scheduler.postTask(cb, { priority: 'background' })
: (window.requestIdleCallback || setTimeout)(cb);
schedule(() => warmCachesOrPrecompute());
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥14❤🔥3🤩1