freeCodeCamp/guide/russian/miscellaneous/learn-how-to-plan-your-futu.../index.md

13 KiB
Raw Blame History

title localeTitle
Learn How to Plan Your Future Project Узнайте, как планировать свой будущий проект

Унция приготовления стоит фунта лечения. Это верно в медицине, и это определенно верно в разработке программного обеспечения.

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

Вместе мы планируем простое одноточечное веб-приложение «Делать». Мы также планируем использовать API-интерфейс для будущего мобильного приложения.

1) Создайте нашу доску Trello

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

Изображение платы Trello

Вот что будет выглядеть в наши дни совет Trello . Я предпочитаю разбивать свои задачи на 3 столбца (в зависимости от сложности проекта):

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

2) Пишите истории пользователей

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

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

3) Создайте нашу модель использования

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

! [Анонимная диаграмма случая пользователя

Диаграмма сценария аутентифицированного пользователя

4) Создайте нашу диаграмму деятельности

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

Изображение диаграммы операций

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

  • Если пользователь не войдет в систему, она увидит нашу страницу входа.

  • Если у нее уже есть учетная запись, она может войти в систему.

  • Если у нее есть учетная запись, но она забыла пароль, она может восстановить свой пароль.

  • Если у нее нет учетной записи, она может ее создать.

  • И «создать учетную запись», и «восстановить мой пароль» потребует проверки по электронной почте. Пользователь может войти в наше приложение только после подтверждения ее адреса электронной почты.

  • Если она войдет в систему, она увидит ее список дел (это может быть пустым, если она еще не добавила никаких досок).

  • Зарегистрированный пользователь:

    • может видеть список своих задач

    • может отметить задачу из своего списка как завершенную

    • может выполнять поиск в своем списке задач

    • может удалить задачу из своего списка

    • может выйти из системы.

  • Пользователь может выйти из приложения в любое время.

5) Создайте наши макеты

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

Макетная фотография

6) Выберите подходящие технологии для нашего проекта

Поскольку это одностраничное приложение, мы будем полагаться в значительной степени - или в этом случае исключительно - на JavaScript. Давайте используем один из самых популярных стеков JavaScript: стек MEAN. Одним из больших преимуществ стека MEAN является то, что все его компоненты являются свободными и с открытым исходным кодом. Существует также множество ресурсов, доступных для изучения стека MEAN, и для его отладки, когда вы неизбежно сталкиваетесь с ошибками.

Вы можете создать среду разработки стека MEAN и запустить ее в облаке менее чем за час бесплатно.

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

  1. MongoDB для нашей базы данных
  2. Node.js и Express.js для реализации нашего API
  3. AngularJS , наряду с HTML и CSS (и Bootstrap) для нашего клиентского приложения
  4. Mongoose для подключения нашего приложения к MongoDB

7) Разработка нашей схемы базы данных

Это стоит усилий для разработки схемы базы данных, даже для нашего простого приложения.

У нас будет две коллекции: в нашей коллекции «Пользователи» будут размещаться наши пользовательские данные, и наша коллекция «ToDo» будет содержать наши задачи, которые необходимо выполнить. Один пользователь может иметь нулевые, одно или многие задачи в своем списке дел, поэтому у нас будет соотношение «один ко многим» (1: m) между двумя нашими коллекциями.

Схема схемы базы данных

8) Определите наши варианты использования

  1. Что происходит с to-dos, связанным с пользователем, который удаляет ее учетную запись? Когда пользователь удаляет свою учетную запись, to-dos, связанный с этим пользователем, также должен быть удален.
  2. Нет необходимости делать это без привязки к подтвержденному пользователю.
  3. Хозяин может быть удален только его владельцем.
  4. Пользователь не может быть добавлен с пустым именем пользователя или паролем.
  5. Нечего делать с пустой задачей.

Что нужно помнить:

  1. Используйте промежуточное программное обеспечение Mongoose для удаления зависимых документов, таких как dos, когда пользователь удаляет свою учетную запись.
  2. Используйте правила проверки Mongoose для моделей, чтобы предотвратить добавление пустых полей в нашу базу данных.

9) Разработка и тестирование нашего API

Я использовал бесплатный продукт под названием Apiary для документирования нашего API .

Вот синтаксис, который я использовал для создания этого простого BluePrint .

Я рекомендую вам создать учетную запись и начать играть с ней. Если вы связываете свою учетную запись GitHub с Apiary, вы можете убедиться, что ваша документация всегда остается актуальной. Вы также сможете проверить свои данные визуально, не нажимая на конечные точки API. Если вы предпочитаете тестировать свой API из командной строки, вот пример того, как это сделать .

Позже, после того, как вы внедрили свой API с помощью Node.js и Express.js, вам просто нужно установить свой URL в Apiary. Затем вы можете начать тестирование своих звонков. Наш текущий URL-адрес хоста ( http://fcctodoapp.apiblueprint.org/ ) будет заменен URL вашего API.

Демо-версия приложения

10) Начните писать код!

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