Насколько я был не амбициозен несколько месяцев назад, когда опубликовал Vulcan: 15 дней для приложения! 15 дней - это 3 недели работы. Если вы включите время зачатия, это будет месяц задержки. Что, если бы мы могли сократить его до недели? Что, если бы мы могли разработать готовые к эксплуатации приложения за дней? Вот как мы достигаем этой цели.

День 0: Немного контекста

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

Я управляю консалтинговой компанией LBKE. Мы глубоко интересуемся технологиями, которые помогают создавать высококачественные приложения за очень ограниченное время. Think React Native + Expo для мобильных устройств или Meteor для веб-приложений.

С годами ожидаемое качество минимально ценных продуктов (MVP) выросло. Людям надоели прототипы низкого качества, продаваемые как «продукты».

Теперь они хотят, чтобы их программное обеспечение было без ошибок (ни за что!), Им нужен хороший UX (какие они разборчивые!), Им нужны инструменты, которые действительно отвечают их потребностям (тьфу!). И, конечно же, они не хотят платить за это больше.

К приложению "4 дня"

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

Наша цель: создать приложение SaaS за 4 дня. Мы не имеем в виду одноразовое приложение, которое не подлежит дальнейшей разработке. Мы считаем, что хорошо спроектированные технологии должны обеспечивать как долгосрочную, так и очень быструю разработку: увеличение и уменьшение уменьшения. Для большинства проектов нет необходимости в технологиях прототипирования. За исключением случаев, когда вы строите космические корабли, а вы этого не делаете?

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

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

День 1: Выбираем наш космический корабль

Встречайте Vulcan.js, он же Метеор-на-стероидах

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

Vulcan.js - это, по сути, хорошие элементы Meteor, плюс хорошие элементы экосистемы JavaScript, в едином фреймворке. Он опирается на новейшие технологии: React для внешнего интерфейса и Apollo (GraphQL) для взаимодействия клиент / сервер.

В качестве бонуса он включает в себя множество пакетов и примеров для наиболее распространенных функций (отправка информационных бюллетеней, добавление форума и т. Д.). Vulcan является прямым потомком знаменитого приложения / фреймворка Meteor Telescope, созданного Сашей Грейфом. Таким образом, несмотря на современность, он извлекает выгоду из многолетнего опыта.

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

Итак, Vulcan.js определенно является надежным кандидатом на выполнение нашего добровольного 4-дневного срока!

Готовая система управления пользователями

Одна из самых любимых функций Vulcan - это система учетных записей, которую он унаследовал от Meteor. Он включает в себя регистрацию / вход / выход, управление разрешениями, рабочие процессы регистрации / забытого пароля (+ программная отправка электронной почты) и приятный пользовательский интерфейс. Да, и еще довольно легко добавить стороннюю аутентификацию с помощью таких сервисов, как Google Oauth.

Управление учетными записями - это действительно то, о чем вы НЕ хотите думать на ранних этапах жизненного цикла вашего приложения. Сколько часов было потеряно на настройку Passport.js! Количество платных сервисов аутентификации, таких как Auth0, показывает, что эта проблема еще не решена, так что это действительно очень хорошая функция.

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

День 2: Хостинг

Хостинг на AWS с Meteor Up

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

Meteor Up - замечательный инструмент для автоматического развертывания приложений Meteor (как и приложений Vulcan) на удаленном сервере. Он обрабатывает все, от контейнеризации приложения с помощью Docker до создания сертификатов SSL с помощью Let’s Encrypt. Установка проста, развертывание - это однострочная команда. У него почти нет недостатков.

Я выбрал AWS для хостинга. У него есть большое преимущество в том, что он предлагает бесплатные услуги в течение 12 месяцев. Я должен признать, что у меня были тяжелые времена при настройке моего первого экземпляра EC2. Однако в Интернете есть множество руководств, и это стоит первоначальных усилий. Кроме того, в настоящее время я пишу пакет для включения ежедневного резервного копирования базы данных MongoDB на AWS S3, чтобы ваши данные были в безопасности.

Промежуточное приложение на Zeit’s Now + Mongolab

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

Сервис Zeit’s Now хорошо подходит для этого использования. Предлагает бесплатный хостинг. Вы можете использовать mLab для базы данных, так как он также предоставляет бесплатную среду песочницы. Честно говоря, мне здесь особо нечего сказать, потому что настройка так же проста, как ABC, и полностью задокументирована здесь. Даже не ошибка. Какова моя цель как разработчика, если ошибок нет ???

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

День 3: Бизнес-логика

Приложение - это набор форм и списков

А теперь перейдем к делу. Большинство компонентов приложения можно разделить на 3 большие категории: Список, Форма и Детали. Эта модель применима к МНОЖЕСТВУ веб-сайтов.

См. Medium: домашняя страница содержит список статей. Эта страница является страницей «Подробности» статьи, которую вы читаете. Внизу вы найдете Список комментариев с формой комментариев. Даже кнопка «аплодисменты» слева (которую я предлагаю вам тщательно щелкнуть) представляет собой упрощенный компонент, подобный форме.

Хорошие новости: Vulcan включает в себя множество помощников для облегчения создания компонентов List, Form и Details. Он включает в себя хорошие резолверы GraphQL и React HOC. Вам почти не нужно писать собственное. Есть даже несколько компонентов React, которые работают «из коробки». Самым продвинутым из них является SmartForm, который автоматически генерирует настраиваемую форму создания / редактирования для любой коллекции.

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

Создание рецепта (или предложение приложения, или публикация статьи, или…)

В GestiResto две основные функции - создание и перечисление рецептов. Форма создания рецепта должна отображать статистику. Подробности конфиденциальны, поэтому вот скриншот эквивалентной формы, разработанной для Awesome Vulcan.

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

Список рецептов еще проще. Мы сосредоточились на создании красивой RecipeItem, которая позволяет пользователям быстро просматривать информацию о рецептах, а также запускать некоторые общие действия (экспорт, удаление…). Конечно, он включает в себя бесплатный ввод для поиска на основе текста.

День 4: Доставка!

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

В конце концов, наступил день 5. Клиент только что протестировал приложение, доставленное вчера вечером, и говорит вам: «Я тестировал приложение, оно классное! Я думаю о добавлении функции X на страницу Y, сколько времени, по вашему мнению, займет добавление компонента Z?… ». И тогда вы знаете, что хорошо поработали!

Хотите создать собственное приложение за 4 дня?

Взгляните на наше приложение с открытым исходным кодом Awesome Vulcan. Он обеспечивает многоразовую основу для профессиональных приложений с интерфейсом Material UI. Он также демонстрирует использование нескольких реализованных нами пакетов.

Надеюсь, это поможет вам на пути к подаче заявки на 4 дня!

Я соучредитель французской компании Lebrun Burel Knowledge Engineering (LBKE) - https://www.lebrun-burel.com

Всегда рады поговорить о коде, машинном обучении, инновациях и предпринимательстве!