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

Перевод статьи «Todo tutorials can be fun — but here’s how to build your own projects from scratch».

Почему стоит создавать собственные проекты

Есть много отличных руководств по созданию проектов – от простых todo-списков до полноценных рабочих веб-приложений. Но как создать собственный проект с нуля? Без поддержки туториала вы можете почувствовать некоторую растерянность и даже не знать, с чего начать.

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

Зачем строить собственные проекты, если можно просто следовать руководствам?

Хороший вопрос, о мой любопытный читатель! Руководства это отличная вещь в своем роде, но создание собственных проектов дает вам очень много преимуществ:

Это заставляет вас думать

Когда вы садитесь за создание нового проекта, вам нужно обдумать много всего.

  • С чего начать?
  • На что это будет похоже?
  • Какие технологии мне понадобятся?

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

Вы столкнетесь с проблемами, о которых даже не подозревали

Зачастую, когда вы создаете что-то, следуя указаниям руководства, вы проходите по изначально удачному пути. Он, в общем, сводится к следующему:

«Окей, мы создаем <вставить-нужное>. – Вот шаги, которые нужно пройти, чтобы это заработало. – Оно заработало. – Ура! Конец».

Это отличный план, если вы изучаете новую технологию. Кроме того, вы гарантированно получаете в конце рабочее приложение; если это не так, то у вас ужасный туториал.

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

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

Это интересно и всегда познавательно

Нас, разработчиков, можно назвать счастливчиками. Мы можем сесть за свой ноутбук и создать все, что захотим, используя какие угодно технологии. Мы также можем делать это более-менее бесплатно. Сомневаюсь, что инженер Aerospace получил бы согласие босса, если бы спросил, можно ли ему взять домой Boeing 747 на выходные, потому что он хочет испытать новый реактивный двигатель, который собрал дома.

Создавать собственные проекты это очень увлекательное занятие. Вы создаете что-то, что можете использовать, показывать друзьям и родственникам, а в процессе создания – учиться. И это довольно безопасное хобби. Ваше приложение может работать, а может и не работать. Результат вам может понравиться, а может оказаться, что вы все запороли. Но это не проблема, потому что можно просто выбросить файлы проекта в корзинку и начать сначала. Запросто!

Вернемся к нашим баранам…

Проекты, созданные по туториалам

Мы выяснили, что собственные проекты это отличный способ учиться и получать удовольствие. Давайте рассмотрим, как приступить к работе над своими проектами.

Можно расширить проекты, которые вы делали по руководствам

Начинать что-то совершенно новое может быть страшновато. Сесть, открыть новый файл и думать: «С чего начать?». Но есть способ получше – строить свои проекты на базе проектов, созданных по руководствам и в рамках упражнений в кодинге. Таким образом не придется начинать с нуля.

Итак, если вы прошли туториал по созданию todo-приложения (а если нет, то где вы были все это время?!), вы можете на его основе построить все, что захотите. Например, можно:

  • разрешить пользователю сохранять todo-список (в базу данных, localStorage и т. д.), чтобы он мог вернуться к нему позже;
  • дать пользователю некоторые возможности кастомизации (например, менять цвет пунктов списка);
  • добавить возможность логиниться в приложении.

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

Можно создавать вещи, которыми сами будете пользоваться

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

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

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

  • используйте GitHub API для создания собственной панели GitHub,
  • используйте Twitter API и сделайте собственную ленту Twitter,
  • создайте веб-приложение, позволяющее следить за бюджетом.

Начинайте с малого

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

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

Также такой подход позволяет вам понять, как создаются настоящие программы. Маленькие фичи часто разрабатываются, тестируются и разворачиваются постепенно, по нарастающей. Обычно это называется Agile-разработкой.

Помните о своей цели

Есть популярная цитата Леонардо да Винчи:

«Произведение искусства нельзя завершить, можно только прекратить работать над ним».

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

Что я имею в виду под словом «цель»? В данном случае цель это то, чего вы хотите добиться с помощью вашего проекта. Например, вы можете не просто заняться созданием панели GitHub, а сказать себе: «Я собираюсь создать панель, которая будет отображать, сколько коммитов я сделал в своих репозиториях за последний месяц».

Это даст вам четкое направление работы. Достигнув своей цели, вы сможете добавить в ваш проект побольше функционала или же перейти к следующему проекту. Целью может быть что угодно:

  • «Я хочу научиться писать чистый код».
  • «Я хочу изучить CSS Grid».
  • «Я хочу иметь возможность вызывать API, используя React».
  • «Я хочу научиться писать тесты на Python».

Бонусный совет: не забывайте размещать все создаваемое в вашем собственном репозитории на GitHub. При этом указывайте свою цель в описании проекта. Это покажет вашим потенциальным работодателям, что вам нравится учиться. Кроме того, оглядываясь на свои старые проекты, вы сможете подпитывать свою мотивацию.

Примеры проектов, которые можно создать

Собственные проекты

Вот несколько примеров, от которых можно отталкиваться.

Калькулятор (веб-приложение)

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

  • добавить больше функций,
  • улучшить пользовательский интерфейс (подсказка: здесь вам пригодится CSS Grid),
  • создать функционал отмены последних действий.

Панель GitHub

Используйте GitHub API, чтобы создать собственную панель. Она может представлять из себя все, что угодно. В качестве отправной точки можно использовать показ информации о вашем собственном GitHub-аккаунте:

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

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

Приложение с тестами

Создайте приложение, которое будет случайным образом выводить вопросы с несколькими вариантами ответа. Если пользователь выбирает правильный ответ, выводится сообщение «Ура!» и обновляется счет. В общем, вы поняли идею. Мне нравятся такие приложения, поскольку они открывают безграничные возможности для расширения функционала. Вы можете:

  • добавить категории,
  • добавить таблицу лучших результатов,
  • добавить отсчет времени,
  • разрешить играть нескольким игрокам одновременно (Подсказка: можно пойти и гораздо дальше – использовать Socket.io, чтобы дать возможность пользователям играть онлайн!).

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

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

Используйте что-то вроде Open Weather Map, чтобы создать приложение, которое будет показывать погоду в определенном регионе в режиме реального времени.

Подсказка: не давайте термину «реальное время» сбить себя с толку. На самом простом уровне можно прописать логику, где каждые 5 секунд будет вызываться API с последующим отображением данных.

Корзина для покупок

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

  • дать пользователю возможность добавлять товар со страницы с продуктами в его корзину,
  • показывать товары в корзине,
  • показывать общую стоимость всех товаров в корзине

Подсказка: на первоначальном этапе можно захардкодить товары, появляющиеся на странице продуктов.

Больше проектов!

Если ищете идеи для новых проектов, обратите внимание на этот репозиторий на GitHub. Там вы найдете проекты разных уровней сложности, которые займут ва сна некоторое время!

[customscript]techrocks_custom_after_post_html[/customscript]

[customscript]techrocks_custom_script[/customscript]

Оставьте комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Прокрутить вверх