Мой вклад в Доку

Сегодня мы запустили Доку — онлайн-энциклопедию о веб-разработке, написанную понятным и заботливым языком U•ᴥ•U

Дока — это открытая энциклопедия. Это значит, что любой, кто хочет поправить ошибку или написать новую статью, может открыть пул-реквест в репозитории проекта, и наша редакция поможет с публикацией материала.

Как я туда попал

Я попал в команду в апреле 2020 года. К тому моменту часть статей уже была написана. В основном были написаны небольшие справочные материалы — мы теперь их называем доками.

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

Что я успел написать

В основном я работал над темами из JavaScript. На HTML и CSS уже были авторы, да и последние статьи в своём блоге я писал тоже в основном про JS, так что это показалось разумным распределением сил.

За всё время, пока я был автором, я успел написать больше 30 статей. Здесь я привожу часть этих статей, сгруппированных по темам.

Возможности языка и браузерного окружения

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

Приведение типов — какие типы в JS есть, что такое явное и неявное приведение типов, как к нему относится равенство строгое и нестрогое.
Контекст выполнения и this — что такое this и на что он ссылается при разных условиях вызова функции: как функции, метода, конструктора.
Области видимости и замыкания — что такое область видимости, откуда и куда мы имеем доступ, как использовать замыкания для хранения и предоставления значений, для чего нужно IIFE и как работает хойстинг.
Асинхронность в JS — что такое в принципе асинхронный код, за счёт чего он работает в браузере, что такое цикл событий и стек вызовов, как мы от колбеков пришли к промисам и асинхронным функциям. Это одна из моих любимых статей.
Модули в JS — что такое модули, зачем нужны, как работают в Node.js и браузере.
Версии языка, транспайлеры и бандлеры — небольшой экскурс в историю по версиям JS, причём здесь ECMAScript, зачем нужны бандлеры и транспайлеры.
Браузерное окружение, BOM — обзорная статья о самых часто используемых браузерных API.
Как браузер рисует страницы — о DOM, CSSOM, этапах отрисовки страницы от получения данных от сервера и до перерисовки, производительности и композитинге.

Стандартные задачи

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

Debounce на примере формы поиска — как не бомбардировать сервер кучей запросов на каждый символ от пользователя в форме, а подождать до конца ввода.
Throttle на примере изменения страницы при прокрутке — как обрабатывать прокрутку и изменение размеров экрана, зачем использовать throttle, как его написать.
Подгрузка контента по скроллу — как загружать на страницу новый контент при подкрутке к низу страницы.
Работа с формами — как прогрессивно улучшить отправку формы, использовать FormData для сериализации, валидировать данные средствами браузера.
Позиционирование элементов с помощью JS — как использовать трансформации, зачем нужны матрицы, когда можно обойтись просто CSS-классами.

Частые понятия из программирования

Третья часть статей — о распространённых концепциях программирования.

Рекурсия — что такое рекурсия, для каких задач её использовать, в чём отличие от цикла.
API. Что это и зачем нужно — что такое API как концепт, какими API мы пользуемся каждый день, как проектировать API для общения сервера и клиента.

Работа веб-приложений

Ещё часть — о работе и устройстве современных веб-приложений.

Как работают веб-приложения — о клиент-серверной архитектуре, развитии приложений на фронтенде, том, что такое состояние и почему стейтфул-системы сложные.
Безопасность веб-приложений и распространённые атаки — от каких уязвимостей надо уметь защищаться и как. Ещё одна из любимых статей :–)

Парадигмы программирования

Немного — о парадигмах программирования, плюсах и минусах, том, как ими пользоваться.

Софтскилы и около того

Чуточку — о полусофтскиловых темах.

Что такое технический долг — почему «долг», как с ним управляться, к чему приводит, если запустить.
Стиль написания кода в команде — в чём смысл единого стиля, как его добиться, зачем появились Prettier, ESLint и прочие инструменты 😃

Тестирование кода

Серия статей — о тестировании кода:

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

Архитектура и проектирование

Серия статей об архитектуре программ и паттернах проектирования:

Архитектура и паттерны проектирования — обзорная статья о том, что такое архитектура, какие способы организации кода придумали, как ими пользоваться, какой и когда подходит.
Архитектурный паттерн MVC — как делить код в зависимости от роли модулей, какие у MVC есть проблемы и компромиссы.
Трёхслойная архитектура — о чистой архитектуре: как делить код на слои, куда направлять зависимости, как организовать взаимодействие между слоями.
Организация потоков данных — о том, что такое однонаправленный поток данных и двойное связывание данных, немного о реактивности.
Порождающие паттерны проектирования — о паттернах, которые помогают решать задачи с созданием сущностей или групп похожих сущностей, убирают лишнее дублирование, делают процесс создания объектов короче и прямолинейнее.
Структурные паттерны — о паттернах, которые помогают решать задачи с тем, как совмещать и сочетать сущности вместе, заботятся о том, как сущности могут использовать друг друга.
Поведенческие паттерны — о паттернах, которые распределяют ответственности между модулями и определяют, как именно будет происходить общение между модулями.

Что я делаю сейчас

Сейчас я отошёл от написания и переключился на ревью материалов. Так сказать, ушёл в редакцию 😃

Мы хотим, чтобы Дока развивалась не благодаря десятку человек, а чтобы её двигало и улучшало всё сообщество. Поэтому мы решили перестроить процессы и бросить силы на редактуру и проверку пул-реквестов.

Планы и будущее

У Доки в планах не только HTML, CSS и JS, но и другие разделы: SVG, доступность, а возможно она не станет ограничиваться только вебом. В общем, ожидаю, что будет интересно!

Если у вас есть идея для доки или статьи или вы хотите помочь нам закрыть материалами уже существующие плейсхолдеры — пишите нам! Встретимся в пул-реквестах на Гитхабе 👋