Привет, друзья! С вами Дмитрий Дементий, редактор блога Hexlet. У меня за плечами около 10 лет работы с текстами и контент-маркетингом, но совсем нет опыта в программировании. Проект Brain Games, который я прошел в мае 2019 года в рамках профессии «Фронтенд JavaScript», помог мне прокачать знания и умения и научил полезным приемам работы. Делюсь главными открытиями. Возможно, они помогут новичкам понять ценность стартового проекта.
Коротко о сабже: проект Brain Games знакомит с экосистемой языка
Brain Games — первый из четырех практических проектов во всех профессиях, кроме Java. Он знакомит курсантов с экосистемой языка. Вы самостоятельно настраиваете рабочее окружение, работаете с архитектурой приложения. В процессе работы над Brain Games нарабатываете навыки работы с системой контроля версий и сервисом GitHub.
Проект знакомит курсанта с инструментами контроля качества кода. С помощью внешних сервисов студент делает репозиторий на GitHub информативным и удобным для потенциальных пользователей приложения, менторов и контрибьюторов. Очень важный момент: Brain Games учит делать рабочий код самостоятельно, а потом совершенствовать его с ментором. Дальше рассказываю о конкретных открытиях, которые сделал благодаря работе над Brain Games.
Открытие № 1: архитектура приложения
До Brain Games я делал приложения только с помощью Create React App. Это шаблон, с помощью которого можно сделать проект на React без настройки среды. Во время работы над Brain Games каждый шаг был для меня новым. Руками создал все файлы, потрогал каждую директорию, подключил зависимости.
Откровением стали исполняемые файлы и Makefile. Разобрался с инициализацией npm-пакета. Долго бился с ошибкой в package.json, из-за которой не запускался код. Оказалось, что я неправильно указал название исполняемого файла.
С архитектурой работал на каждом шаге до утверждения проекта ментором. Наверное, это одна из двух важнейших частей работы над Brain Games. Важно набить шишки и пройти этот путь, чтобы усвоить теоретические знания.
Открытие № 2: работа с GitHub
До Brain Games я прошел курс «Системы контроля версий», создавал на GitHub репозитории и даже опубликовал простое веб-приложение. Но в процессе работы над проектом буквально нарабатывал навыки работы с GitHub. Для завершения проекта потребовалось 63 коммита в репозиторий. Это мелочи для опытных программистов, но для новичка это бесценный опыт работы с GitHub.
Открытие № 3: неудобства Windows
Я знал, что на Windows не очень удобно разрабатывать. Перед стартом Brain Games даже установил виртуальную ОС Linux из магазина приложений Microsoft. Во время работы над Brain Games почувствовал, почему на «винде» неудобно работать. Вот несколько моментов:
- Сервис для записи сессий в терминале Asciinema не работает под Windows, нормальных аналогов не нашел.
- При попытке запустить npm-скрипт build возникает проблема с переменными окружения. Чтобы программа работала, проблему нужно решить.
- Если команда запуска игры совпадает с именем файла, Windows открывает файл в редакторе, а не запускает игру.
Чтобы нормально завершить проект, пришлось пользоваться виртуальной ОС Linux. Но это полумеры. Кстати, если вы пользуетесь Windows, может пригодиться гайд по работе с Linux внутри Windows.
Открытие № 4: для новичков линтер лучше автоматического форматирования кода
Одним из заданий в Brain Games была установка и настройка линтера. Это инструмент контроля качества кода. Он проверят код на соответствие указанным в настройках стандартам. До проекта я пользовался установленным в редакторе инструментом автоматического форматирования кода Prettier. Теперь понял, что ESlint полезнее для новичков. Этот инструмент не только помогает правильно оформлять код. Он показывает неиспользуемые переменные, опасные мутации и другие проблемы, которые неопытный курсант самостоятельно может не заметить.
Открытие № 5: Asciinema — удобный инструмент для записи сессий в терминале
Asciinema удобно использовать для создания обучающего контента и пользовательских руководств. Во время работы над Brain Games освоил этот простой и удобный инструмент. Больше всего времени потратил на поиск аналога Asciinema для Windows. В мае 2019 года достойной альтернативы не нашел.
Открытие № 6: рефакторинг — точка роста в процессе работы над проектом
Рефакторинг кода приложения заставляет думать, искать информацию и проверять гипотезы. Уверен, каждого курсанта на этом этапе ждут свои открытия. Вот несколько моих:
- Деструктуризация (дестракчеринг). Чтобы получить данные игры, сначала я обращался к элементам массива по индексу. Задачу лучше решать с помощью деструктуризации.
- Разделение логики игры и движка. Это была самая сложная задача в проекте. А ее решение мне приснилось. Пришлось разбудить супругу и заставить записать код в смартфон.
- Хардкодить — это плохо. Я захардкодил прогрессию, которая должна формироваться динамически. Объяснения ментора запомню на всю жизнь.
- Магические числа. Понимание этой концепции важно для повышения читабельности кода.
- Функции-предикаты и вложенные определения. Их надо выносить на уровень модуля.
Код показывать не буду, чтобы не было спойлеров.
Открытие № 7: работа с ментором держит в тонусе и заставляет думать о качестве
Когда я выполнял задания проекта самостоятельно, кое-где халтурил ради скорости. Из-за этого в коде появились неинформативные названия переменных типа func. Из-за стремления быстрее пройти шаг отключал правила линтера, а не исправлял ошибки. Да и жестко прописал прогрессию, чтобы не тратить время на динамическую генерацию. Ментор не пропустил ни одной ошибки. Благодаря этому мне не стыдно за финальный код приложения.
Игры разума удались, чего и вам желаю
Проект заставил меня работать в полную силу. Он дал мне знания и первый практический опыт. Еще я узнал, что работа над кодом генерирует эмоции. Каждую решенную задачу я отмечал боевым кличем апачей. А когда ментор принял проект, бурно радовался и бил себя в грудь, как Кинг-Конг.
