JS Dev Roadmap

1 Stage: Junior

1.1 Junior I

Technical skills

Инструменты разработки
  • Работа с консолью браузера
  • Работа с дебаггером
  • Простые git комманды (commit, pull, push), понимание модели распределенного хранения кода
Javascript
  • Умение сроить флоу программы (цыклы, ветвления, простые методы массивов) и создавать простейшие абстракции и писать программы в ООП стиле (понятия контекста и протипного наследования)
  • Понимание асинхронной модели и как можно создавать асинхронные операции
  • Простейшая работа с DOM (получение элемента, добавление элемента)
  • Стадии события при работе с DOM
  • Область видимости переменной
  • Работа с localStorage и cookies
Framework (Angular)
  • Понимание концепции компонентов и основные их возможности (input, output, порядок хуков)
  • Понимание концепции сервисов (+колличество сервисов в зависимости от того где вписан в провайдеры)
  • Простейшие RxJS операторы (map, filter, distinctUntilChanged)
  • Типы директив, встроенные структурные директивы
  • простая template-driven валидация форм
  • Работа с сетью

Mental model

  • Умение строить простые абстракции и декомпозиция задач
    • Решение простейших алгоритмических задач (поиск наименьшего элемента в массиве, фильтрация массива, умение оценить колличество проходов по исходному массиву)
    • Разложить исходную задачу в парадигме ООП
  • Умение гуглить перед тем как задавать вопросы лиду, старшем разработчику, ментору
  • Умение грамотно и вежливо общаться с коллегами по команде
  • Умение отчитываться о проделаной за день работе

1.2 Junior II

Technical skills

Инструменты разработки
  • Работа с дебаггером, переход по точкам останова и в глубину, переход назад
  • Работа с network панелью браузера
  • Простые git комманды, отделение веток под функционал
Javascript
  • Понимание концепции прототипов и умение построить наследование в этом стиле
  • Понимание замыканий и зачем они нужны
  • Понимание всех способов откуда берется контекст (глобальный, конструкторы, ручная привязка)
  • Умение рабоать с промисами (что возвращают методы, как их комбинировать и строить на них логику)
  • Умение правильно обрабатывать ошибки (try/catch)
  • DOM: Методы объекта ивент (остановка всплытия, остановка дефолтных операций), делегирование событий
  • ES6: Стрелочные функции, их ограничения и отличния от обычных
  • Методы массивов (splice, slice, shift, map, filter, изменяющие и не изменяющие массив)
  • Type conversion алгоритм
  • Сокращенные булевые вычисления
Framework (Angular)
  • Базовое понимание change detection
  • Понимание концепции smart и dumb компонентов
  • Умение настроить простой роутинг, понимание концепции guard, умение написать простейший guard
  • Понимание концепции view encapsulation
  • Пайпы, встроенные пайпы, понимание зачем это надо
  • Простая reactive-driven валидация форм
  • Умение кешировать данные в сервисах без дополнительного запроса к бэку
  • Умение пользоваться BehaviorSubject

Mental model

  • Умение грамотно и вежливо общаться с коллегами по команде, доносить свои мысли, обсуждать технические проблемы
  • Принятие ответственности за ту работу которую выполнил на протяжении дня
  • Умение пользоваться jira (или аналогичными системами)
  • Умение строить абстракции и декомпозиция задач
    • Решение непростых алгоритмических задач, умение кешировать частичные результаты вычислений, оценка сложности простых алгоритмов
    • Разложить исходную задачу в парадигме ООП, построить иерархию

1.3 Junior III

Technical skills

Инструменты разработки
  • Работа с network/ws панелью браузера, работа с application/storage панелью
  • git комманды, отмена комита и внесенных изменений
  • Понимание концепции пулл реквестов
Javascript
  • Понимание концепции прототипов и функционального наследования (плюсы и минусы каждого из подходов)
  • Умение написать полифилы на Object.create, bind
  • valueOf и задачи связанные с ним
  • деструктуризация, rest/spread операторы
  • DOM: отличие жывых и не жывых коллекций, как получить те или другие; documentFragment
  • Понимание концепции каррирования
  • Заголовки запросов, CORS
  • Понимание отличий cookies, localStorage, sessionStorage
Framework (Angular)
  • Хорошее понимание change detection на уровне стратегий, в чем отличие стратегий
  • Доступ в содержимому отображения компонента через декораторы
  • Понимание ng-container, ng-template
  • Умение написать валидатор для реактивной формы. Умение подписаться на поток значений из формы/поля
  • Понимание концепции data сервисов, умение хранить состояния через subject
  • Отличния hot/cold observable, умение из "холодного" сделать "горячий"
  • Умение отписаться от потоков не используя явный unsubscribe
  • Порождающие операторы RxJS
  • Понимание видов guard (onActivate, onDeactivate)
  • Умение написать простейший тест на сервис

Mental model

  • Умение строить абстракции
  • Решение непростых алгоритмических задач (intersection, sorting, find n-max elements, groupBy)
  • Разложить исходную задачу в парадигме ООП, построить иерархию, настоить связи между объектами и способы общения (напрямую или через хранилище данных)
  • Понимание концепции паттернов
  • Простые паттерны (файбрика, синглтон)
  • Принципы функционального программирования
  • Умение оценить сложность задачи (если с похожей сталкивался) и обосновать свою оценку
  • Понимание коцепции gitflow и паралелльной разработки
  • Понимание базовых agile практик (митинги, ретро, планирование)

2 Stage: Middle

2.1 Middle I

Technical skills

Инструменты разработки
  • Умение оценить производительность приложения используя панель разработчика
  • Умение чистить историю коммитов (локально и уделенно)
  • Понимание концепции githooks
Javascript
  • Умение сделать глубокую копию объекта, глубокую заморозку объекта
  • Понимания понятия property descriptor и как этим пользоваться
  • Умение пользоваться reduce для решения задач в функциональном стиле
  • Понимаение отличия статических св-тв класа и нестатических, умение определить когда какие нужны
  • Глобальные события документа и умение вручную бросать события. Понимание зачем это необходимо
  • Умение написать полифил на Promise.all
Framework (Angular)
  • Понимание концепции zone, как это используется в ангуляре, ручной запуск change detection
  • Умение строить приложение о организовавыть подписки через async без необходимости создания явных подписок
  • Понимание паттерна flux и знакомство с его реализацями в Angular
  • Умение пользоваться хост свойствами и обработчиками компонента, понимание когда это необходимо
  • Понимание концепции high order observable, отличие switchMap, mergeMap, concatMap
  • Умение организовать сотояние в зависимости от роутинга
  • Умение написать тест на асинхронный код

Mental model

  • Понимение концепции CI
  • Понимание важности тестов, концепции TDD
  • Умение строить хорошие абстракции на основе SOLID
  • Навыки декомпозиции на уровне классов и модулей
  • Навыки хорошей оценки задач и умение обосновать свою оценку
  • Активное участвие в agile церемониях. Умение вычленить проблемы на протяжении спринта и умение донести их до комманды
  • Умение находить code smells
  • Умение отличать паттерны на уровне фреймворка

2.2 Middle II

Technical skills

Инструменты разработки
  • Умение оценить затраты памяти в приложении, затраты вычислительных ресурсов (на скирпты, отрисовку, т.д.)
  • Понимание отличий rebase от merge, понимание необходимости тегов
  • Умение писать простые node скрипты для автоматизации рутины (прогон тестов, сборка, линтер, обновление по шаблону)
Javascript
  • Умение работать с new Function, и понимание когда это может быть необходимо
  • Понимание концепции autoboxing, понимание концепции одалживания метода
  • arguments и способы заменить его используя новые стандарты
  • Понимание async/await, плюсы и минусы работы с ними в отличии от цепочек промисов
  • Умение писать JS не нарушая принципы ООП и ФП
Framework (Angular)
  • Умение работать с зонами (генерация события вне angular зоны), понимание работы ngDoCheck, отличия detectChanges/markForCheck
  • Понимание внутреннего устройства async pipe
  • Понимание отличий pure/impure пайпов
  • Понимание работы структурных директив
  • DI: умение работать с токенами зависимостей, подменять зависимости, знание основных способов предоставить зависимость (useClass, useFactory, ...)
  • Понимание цикла событий в роутинге, виды guard и когда они применимы, router resolver
  • Хорошие навыки построения flow на основе операторов RxJS, понимание отличий сабжектов
  • Понимание цонцепции ленивой загрузки, умение базово настроить. Понимание отличий forRoot, forChild
  • Умение создать кастомный контрол на основе ControlValueAccessor, понимание преимуществ перед обычными компонентами
  • Умение вешать кросс-валидации на отдельные контролы и на всю форму в частности

Mental model

  • Понимание концепции CI/CD и всего цикла доставки фичи на стенд, понимание принципов разделения окружений testing, preprod, prod.
  • Понимание важности кодстайла, линтеров и автотестов на проекте. Умение базово настроить эти вещи самостоятельно
  • Умение вести простые agile церемонии (дейли, ретро, планирование)
  • Умение писать техническую спецификацию
  • Умение общаться как с коллегами по разработке так и с тестировщиками, аналитиками, овнерами. Умение донести свои мысли с учетом роли человека в комманде
  • Навыки декомпозиции на уровне модулей и всего приложения
  • Навыки несложного рефакторинга, знание основных техник исправления code smells
  • Полное понимание SOLID (с примерами), умение найти нарушение этих принципов и пути решения
  • Знание групп паттернов
  • Понимание пирамиды тестирования

3 Stage: Senior