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

Что уже сделали:

• провели подготовительную теоретическую работу: нашли пару идей 💡, которые не реализованы на рынке;
• провели бизнес анализ домена 🔮;
• сделали теоретическое проектирование системы 📌.
• посмотрели, кто есть на рынке и что предлагают конкуренты. Увидели, что идеи, которые мы хотим заложить в продукт, у конкурентов не реализованы 🧨🎇.
• написали подготовительную документацию, техническое задание 👨💻.
• сформировали ряд диаграмм, которые позволяют оперативно обновлять предметную область в голове разработчиков 🧷.
• написали прототип, чтобы можно было покликать 🐭
• провели тест mvp 🧲

Подробнее

Теоретическая подготовка и проектирование включает разработку технической документации, включая рад диаграмм, позволяющих разработчикам лучше представлять предметную область. Первая диаграмма представляет собой структуру сущностей предметной области и их взаимоотношений (ERD). Диаграмма не очень грамотно оформлена, но свою работу делает.

Одной структуры сущностей недостаточно для начала разработки. После этого мы сделали диаграмму вариантов использования (use-case diagram, UCD). Эти диаграммы мы выполнили в обычном онлайн редакторе диаграмм app.diagrams.net.

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

В дальнейшем в приложении websequencediagrams.com, каждый вариант использования (use-case) был описан в виде диаграммы последовательности действий (Sequence diagram, SD). Диаграммы последовательности используются для уточнения диаграммы вариантов использования для более детального описания логики. Отличное средство документирования проекта с точки зрения сценариев использования!

В общей сложности, в подготовительном этапе у нас получилось 26 готовых документов. В принципе, этих диаграмм было достаточно чтобы начать проектирование интерфейсов, которое мы делали в Axure RP с применением готовых наборов элементов интерфейса. Первые интерфейсы выглядят довольно примитивно. Это нормально.

Для первичной верстки достаточно. Чтобы хоть как-то прикинуть объем предполагаемой технической работы мы написали Техническое задание, опубликовать я его конечно не могу. Но могу сказать, что вышел достаточно увесистый труд на несколько сотен страниц. На этом этапе у нас в команде было 2 разработчика 🚣‍♂️ 😍.

Вот так примерно выглядит первый прототип журнала в Axure RP.

Технологический стек

Для реализации этого проекта мы выбрали наиболее развевающийся JS-стек MERN (mongoDB, Express, React, Node.js). Сам по себе стек идеально подходит:

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

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

MongoDb

MongoDB — это база данных NoSQL, которая ориентирована на использование документов и коллекций в отличие от использования строк и таблиц, как в стандартных базах данных. Базовой единицей данных в документах является пара ключ-значение. Принято выделять следующие достоинства:

• MongoDB использует JavaScript, что является самым большим преимуществом для стека MERN.
• Гибкие схемы документов. Модель документа MongoDB позволяет легко моделировать и манипулировать практически любой структурой данных
• Скорость. База данных легко индексирует документы, следовательно, дает более быстрый ответ серверу.
• Доступ к данным без кода. MongoDB хранит и представляет данные в формате документа. Это означает, что что можно получить к ним доступ с помощью родных структур данных для любого языка. Например, ассоциативные массивы в JavaScript.
• Данные хранятся в виде JSON. Синтаксис JSON очень прост и поддерживается практически любыми браузерами.

Express.js

Express — это фреймворк, созданный на базе платформы NodeJs. Его преимущества значительно упростят и укоротят внутренний код. В стеке Express играет немаловажную роль, так как с его помощью настраивается маршрутизация и создается API-сервер для взаимодействия между клиентской и серверной частью приложения. У технологии есть ряд преимуществ:

• Позволяет легко и быстро разрабатывать веб-приложение Node.js.
• Простой и легкий в настройке.
• Он позволяет определять маршруты приложения на основе методов HTTP и URL-адресов.
• Легко обрабатывает статические файлы и службы приложения.
• Позволяет создать сервер с REST API.
• Быстрое подключение к базам данных.

React.js

React — это самая популярная библиотека JavaScript. С помощью React можно разработать быстрый и стабильный пользовательский интерфейс. Больше достоинств:

• Легкий в обучении и использовании. React обладает хорошей документацией, а благодаря широкому сообществу имеется большое количество обучающих руководств, курсов и ресурсов.
• Высокая производительность — такие функции, как Virtual DOM, JSX и компоненты, делают его намного быстрее, чем остальные фреймворки.
• Компоненты для многократного использования. Каждый компонент имеет свою собственную логику и управляет собственным рендерингом. Поэтому его можно повторно использовать там, где нужно. Повторное использование кода помогает упростить разработку и поддержку приложения.

Node.js

Node.js — среда выполнения, позволяющая запускать код JavaScript на сервере, благодаря чему фронтенд-разработчик может создавать легко интегрируемые приложения. В отличие от других популярных серверных технологий:

• Основан на JavaScript, что позволяет использовать один язык программирования на всем проекте.
• Предлагает высокую производительность для приложений реального времени.
• Масштабируемость. С точки зрения разработки Node.js позволяет использовать микросервисы, которые в дальнейшем позволяют разделить приложение на более мелкие части.
• Быстрое выполнение кода.

MVP

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

P.s. 🧩😕

• Названия нет (но мы держимся 😁😂)
• В команде 2 человека (достаточно, чтобы обсуждать и писать 🐱👤, парное программирование оно такое)
• Один рабочий компонент - Журнал 📚