Мой вклад в Доку
Сегодня мы запустили Доку — онлайн-энциклопедию о веб-разработке, написанную понятным и заботливым языком 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, доступность, а возможно она не станет ограничиваться только вебом. В общем, ожидаю, что будет интересно!
Если у вас есть идея для доки или статьи или вы хотите помочь нам закрыть материалами уже существующие плейсхолдеры — пишите нам! Встретимся в пул-реквестах на Гитхабе 👋