Как спланировать и создать собственный проект

0
636
views
Photo by Najla Cam on Unsplash

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

Эта статья не о том, как структурировать ваши папки или как настроить расширения VS Code, чтобы обеспечить чистоту кода при сборке. Моей целью было помочь начинающим программистам почувствовать себя более уверенно на пути из туториального ада, помочь им начать создавать свои собственные проекты.

Новичкам взяться за новый проект не так просто, как кажется. Когда вы не можете воспроизвести результаты только что просмотренного урока на YouTube, не пересмотрев его заново 30 раз, собственный проект представляется просто недостижимой вершиной.

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

Чтобы преодолеть эту проблему, я написал о ней в популярном сабреддите r/learnprogramming. Все комментаторы советовали мне сосредоточиться на создании моих собственных проектов.

На первый взгляд этот совет кажется прекрасным и правильным. Но моя проблема заключалась в том, что я даже не мог просмотреть руководство и затем самостоятельно воспроизвести то, что там делалось. Где уж мне самому осилить проект? Это в десять раз сложнее, чем повторить то, что увидел в туториале. Мне казалось, что мне это вообще не по силам. Я понятия не имел, с чего хотя бы начать, не говоря уже о том, как собрать потом все это воедино.

По сути, проблема заключалась в том, что я не знал, как добраться из пункта А в пункт Б.

Я часто встречаю посты на эту же тему на r/learnprogramming. Начинающие вроде меня расстраиваются из-за того, что не могут выбраться из ада туториалов, и поэтому обращаются за советом. Но всем, как и мне, просто бросают совет заняться собственными проектами. Люди не задумываются над тем, что если новичок не может даже воспроизвести учебник, создать свой собственный проект для него будет реальной проблемой.

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

Итак, перед вами статья о том, как создавать свои собственные проекты, чтобы улучшить навыки разработчика и закрепить изученное.

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

Шаг 1. Определение проекта

Первым шагом при планировании личного проекта является его определение.

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

Определяя проект, я задаю себе четыре вопроса:

  • Что собой представляет этот проект?
  • Что собой представляет MVP (минимально жизнеспособный продукт)?
  • Какая будет «посыпка»?
  • Когда проект можно считать законченным?

Сначала пончик (MVP), посыпка — потом

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

Нас всегда тянет сделать что-то фантастическое, добавить потрясающие функции, которые произведут впечатление на потенциального работодателя. Но если ваше приложение не выполняет свою основную функцию, все изюминки пропадут даром. У вас просто не будет в руках пончика, который можно покрыть посыпкой.

Поэтому обязательно определите минимально жизнеспособный продукт, создав который, вы сможете заняться посыпкой.

Пример определения проекта

Возьмем простой пример. Допустим, мы собираемся создать приложение-калькулятор. Тогда наше базовое определение проекта будет следующим.

Проект «Калькулятор»
  • Что собой представляет этот проект? «Калькулятор» — это проект по созданию калькулятора, доступного в браузере. Проект будет реализован с использованием HTML, CSS и JavaScript. Это позволит пользователям вводить числа и вычислять результаты выбранной ими арифметической операции.
  • Что собой представляет MVP? Минимальный жизнеспособный продукт — это калькулятор, который отображается в браузерах и может выполнять операции сложения, вычитания, умножения и деления на основе ввода пользователя и показывать пользователю результат вычислений.
  • Какая будет «посыпка»? В этом проекте «посыпка» — это стилизация калькулятора. Также к «посыпке» относится возможность для пользователя нажимать цифры и арифметические знаки на клавиатуре, а не только кликать по кнопкам на экране. Еще можно добавить операции более высокого порядка, такие как возведение в степень.
  • Когда проект можно считать законченным? Проект будет завершен после реализации всех функций MVP и оформления калькулятора.

Это определение простое и понятное. Если бы моя мама его прочла, она бы поняла, что это за проект. Здесь есть описание проекта, функционала MVP, необязательных функций, которые вы можно создать, а также указана «точка выхода» — описание завершенного проекта.

Определяя проект, вы делаете его менее устрашающим.

Когда у вас есть определение, можно приступить к следующему шагу.

Шаг 2. Создание рабочего процесса

Этот шаг самый простой. Обычно его можно объединить с шагом 3, но сейчас мы рассмотрим его отдельно. Проделав один раз, вы сделаете это шагом по умолчанию для всех ваших будущих проектов.

Для начала нужно использовать что-то вроде Trello — бесплатного инструмента для управления проектами.

От редакции Techrocks. Вам также могут быть интересны статьи «7 достойных альтернатив Trello» и «Топ-6 расширений VS Code для организации кода и процессов».

Trello позволяет нам использовать метод управления разработкой Kanban. Новичку не обязательно знать или понимать, что собой представляет Kanban, вы можете просто использовать его практики.

Чтобы настроить нашу канбан-доску, создаем 4 столбца:

  1. TODO (нужно сделать)
  2. DOING (в процессе)
  3. DONE (сделано)
  4. BUGS / NOT SURE HOW TO DO (баги / не уверен, как это сделать)

В эти столбцы мы будем добавлять карточки. Мы создаем карточку в столбце TODO, затем, взявшись за выполнение, перемещаем ее в столбец DOING, а покончив с ней — в столбец DONE. Если вы столкнулись с какой-то ошибкой, на которой застряли, или не знаете, как что-то сделать, можно переместить карточку в столбец BUGS / NOT SURE HOW TO DO.

Этот рабочий процесс представляет собой суперупрощенную версию Kanban. Когда устроитесь работать в качестве разработчика, у вас, скорее всего, будет больше столбцов. Там добавятся столбцы для тестирования, код-ревью, бэклога и другие. Но для ваших собственных проектов, особенно если вы новичок, вполне хватит и четырех.

Теперь, когда у нас настроен рабочий процесс, мы можем перейти к последнему шагу, который больше всего меня озадачил, когда я учился программировать.

Шаг 3. Разбивка проекта на более мелкие компоненты

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

Звучит достаточно просто, но когда я только начинал, я и не догадывался, что так можно. Я думал, что большинство разработчиков просто начинают писать код, и проект буквально вытекает из-под их пальцев, как в кино. И, конечно, я был уверен, что мне тоже надо этому научиться.

Однако теперь, работая в сфере разработки ПО, я знаю, что на самом деле все не так. На самом деле хороший разработчик разбивает проект на более мелкие задачи.

Тем не менее, новичку может быть трудно понять, как разбить проект. Если вы не знаете, с какого конца взяться за проект, как же вам его разбить?

Начальная разбивка

Ну, первое, что вам нужно сделать, это посмотреть на определение вашего проекта, а затем разбить его на более мелкие части.

Давайте продолжим использовать пример с калькулятором для создания карточек компонентов:

  1. Вычислительные функции — MVP
  2. Получение пользовательского ввода — MVP
  3. HTML пользовательского интерфейса — MVP
  4. Стилизация пользовательского интерфейса (CSS) — посыпка
  5. Слушатели событий JavaScript — MVP
  6. Добавление анимации для вычислений — посыпка

Обратите внимание, что каждой карточке мы присвоили метку MVP или «посыпка», чтобы было ясно видно, какие карточки являются наиболее важными. Над ними, естественно, нужно работать в первую очередь.

Самое большое преимущество карточек в том, что они упрощают план работ. Это делает проекты менее пугающими, поскольку вы не создаете большое сложное приложение-калькулятор, а делаете 6 небольших проектов, которые объединяются в один большой.

Работая над карточкой, вы перемещаете ее в столбец DOING. Не спешите. Прежде, чем браться за новую карточку, доведите начатое до рабочего состояния.

Но мы еще не закончили с разбивкой. Наш рабочий процесс можно еще больше упростить и улучшить, чтобы гарантировать, что размер проекта не блокирует нас при сборке.

Разбейте каждый компонент на более мелкие чеклисты

Создав высокоуровневые карточки, мы можем разбить эти компоненты на более мелкие задачи. При этом можно использовать чеклисты (контрольные списки), чтобы отслеживать наш прогресс.

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

Для примера дальнейшей разбивки компонента давайте воспользуемся карточкой «Вычислительные функции».

Поскольку это MVP-задача, а я определил MVP как базовые функции сложения, вычитания, умножения и деления, нам нужно добавить эти функции в чеклист.

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

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

Выполнив все четыре пункта, мы можем переместить эту карточку в столбец «DONE» и взяться за следующую.

С этого момента нам просто нужно повторить процесс для каждой карточки. Но вам не обязательно тратить кучу времени, стараясь завершить все задачи в каждой карточке. Это ошибка, которую я сам допустил в начале пути.

Не застряньте, доводя все до совершенства

Занимаясь карточками и задачами в них, не застряньте на бесконечном доведении до идеала каждой маленькой детали.

Из-за этого можно застрять еще на этапе планирования и так и не перейти к этапу программирования. Или же это сделает этап программирования слишком жестким. Вам нужно пространство для маневра в ваших проектах.

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

Например, при первоначальном планировании у вас может не быть карточки стилей. Но после того, как вы закончите карточку HTML, вы, вероятно, ее добавите.

Так что не зацикливайтесь на том, чтобы сделать план идеальным. Сделайте его достаточным, чтобы вы могли начать. По ходу дела вы всегда сможете внести коррективы.

Вы также можете использовать столбец BUGS / NOT SURE HOW TO DO, чтобы поместить туда карточки, которые вы еще не можете выполнить или на которых вы застряли. Это поможет вам продолжать двигаться.

Начните создавать собственный проект

Теперь у вас есть все, чтобы приступить к планированию и созданию своего проекта. Надеюсь, эта статья сделала концепцию создания проектов менее абстрактной и пугающей для вас.

Ключевыми моментами являются четкое определение проекта, настройка рабочего процесса, а затем разбиение проекта на более мелкие компоненты.

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

И если где-нибудь на r/learnprogramming вы натолкнетесь на просьбу о совете от человека, который пытается выбраться из туториального ада, не советуйте ему просто начать строить собственные проекты. Лучше расскажите, как их планировать и создавать.

Перевод статьи «How to Plan and Build a Programming Project — A Legitimate Guide for Beginners».

ОСТАВЬТЕ ОТВЕТ

Please enter your comment!
Please enter your name here