Как я учусь на курсе "Инфраструктура Frontend" (часть #1)



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



А тут буквально целый структурированный курс от Андрея Кобеца и Дмитрия Холстинина, от которых я уже проходила "Продвинутый Debug во фронтенде" (писала на него обзор), и пропускать решительно не хотелось.



Сегодня расскажу про первые несколько лекций: что проходили и как это было.



💚Что больше всего нравится



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



Каждая лекция - это 2+ часов материала, после которых остается стройная, внятная, упорядоченная картинка



📌 Что проходили



🟣 начали с маленькой базы NodeJS: основные либки, которые пригодятся в дальнейшем (node:fs, node:path, node:stream итд), две модульные системы (cjs и esm), поддержку тайпскрипта, альтернативы ноды и немножко потрогали YAML.



Было понятно даже мне, хотя ноду я ни разу трогала;



🟢 дальше пошли по пакетным менеджерам в общем: как жили до них, что там под капотом (алгоритмы выстраивания дерева зависимостей), версионирование, что такое регистри и зачем нужны, зачем нужны lock-файлы.



Поговорили про альтернативы npm, типы зависимостей, хуки и биндинги вокруг установки пакетов, git-зависимости и esm в браузере.



Из этого я не знала ничего, кроме самого первого: как жили до пакетных менеджеров (спойлер: плохо, все руками в папочку клали или CDN использовали). Открылся целый новый мир, о котором я раньше и не подозревала, и мне понравилось!



🔵 продолжили статическими проверками кода: что это и зачем это, что такое Abstract Syntax Tree, чем отличается лексический анализ от синтаксического, какие есть популярные инструменты (знакомые всем eslint, prettier, stylelint, typescript и не очень знакомый statoscope) b дополнительные полезности (JSDoc, Storybook).



Дальше - про то, как заставить эти инструменты работать автоматически: локально, на гит хуках и CI.



Часть из этого я знала, про те же гит хуки, но почти весь материал оказался новым, полезным и интересным;



🟡 и перешли к линтерам уже предметно и вглубь: как eslint, prettier, stylelint работают под капотом, примеры конфигов, как можно привнести в eslint и stylelint кастомные правила и как писать для них свои плагины на практике;



Резюмирую



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



Впереди еще 13 лекций и мастер-класс, и скоро я расскажу про следующие 4 занятия!