Предыстория: откуда взялась идея

Нас двое. Один из нас недавно искал работу и ходил по собеседованиям. Второй сам собеседует кандидатов и раз за разом видит одну картину, люди спотыкаются на одних и тех же задачах. Debounce, глубокое сравнение объектов, форма с валидацией. Задачи не сложные, но на собеседовании их надо написать руками, без автокомплита и без ChatGPT в соседней вкладке.

Copilot и Cursor сейчас пишут код быстрее, чем успеваешь сформулировать задачу. Но на собеседовании их нет. Есть вы, редактор и человек, который смотрит, как вы думаете.

И это касается не только фронтенда. JavaScript и TypeScript давно живут и на бэке, а фуллстек на Node и React для многих команд обычная история. Готовиться к таким собеседованиям приходится по кусочкам из разных мест.

Мы провели небольшой ресерч и поняли, что ниша полупустая:

GreatFrontEnd, BFE.dev — сильные задачи, но только по фронтенду, все на английском и самое полезное за подпиской. Про Node там ничего.

LeetCode и похожие — огромная база, но это алгоритмы. Ни React, ни DOM, ни Node там не потрогаешь.

Русские сборники вопросов — много и бесплатно, но это список вопросов без кода. Проверить себя нечем.

Русские курсы и тренажеры — на русском, но задачи слабые, а разбор часто в одну строку.

Читать разбор замыканий на английском за день до собеседования, когда голова и так забита, удовольствие ниже среднего.

Что внутри

Так родился ПаровоJSик, платформа для подготовки к собеседованиям на JavaScript и TypeScript. Фронтенд, бэкенд на Node и фуллстек в одном месте.

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

Медленно, потому что задача у нас это не «условие плюс ответ». В каждой есть условие с примерами, подсказки, которые открываются по одной (чтобы не подсмотреть все сразу), пошаговый разбор решения с альтернативным вариантом, частые ошибки и вопросы «Проверь себя». И тесты, на которых проверяется ваш код.

Тесты прямо в браузере

Код проверяется сразу, без сервера. Тесты запускаются в изолированном iframe, у него нет доступа к cookie и к странице сайта, общается он с ней только через postMessage. Для UI-задач рядом живет превью на React, а TypeScript проходит проверку типов в отдельном воркере.

Вот так выглядит тест из задачи про форму обратной связи:

await type($('#name'), 'Анна')
await type($('#email'), 'anna@mail')
await type($('#message'), 'Привет')
await submit($('#contact'))
expect(document.activeElement).toBe($('#email'))

На этой же задаче мы поймали забавный баг. Восемь тестов шли 40 секунд, и один падал по таймауту в 10 секунд. Сначала грешили на React. Потом заметили закономерность, каждый тест длился почти ровно столько секунд, сколько в нем await. Четыре шага — 4008 мс, пять шагов — 5013 мс.

Причина оказалась в хелпере, который ждал setTimeout(0). Chrome в фоновой вкладке и в скрытом cross-origin фрейме пускает таймеры раз в секунду. Заменили на MessageChannel, сообщения браузер не троттлит. Теперь тест идет миллисекунды.

Почему паровозик.

Подготовка к собеседованию похожа на поездку. Едешь от станции к станции, а в конце депо «Продакшн». На главной так и сделали, вы смотрите из кабины паровоза, за окном меняются локации, а на билбордах вдоль путей висят мемы. К подготовке это отношения не имеет, но делать было весело.

Планы и Roadmap

Сейчас все бесплатно. Дальше план такой:

В этом месяце — добавляем новые задачи в каталог.

В следующем — вопросы по теории: event loop, замыкания и прототипы, типы в TypeScript, браузер и Node.

Потом — обучающие блоки, чтобы можно было не только тренироваться, но и разобраться с нуля.

И системный дизайн — как спроектировать ленту, чат или API под нагрузкой, со стороны фронта и бэка.

Параллельно появятся задачи на бэкенд и фуллстек: Node, HTTP, работа с данными.

Ссылка на проект: ПаровоJSик

p.s. Если недавно ходили на собеседование по JS или TS, фронт это был или бэк, напишите в комментариях, какую задачу вам дали. Самые частые добавим в каталог первыми.