Создание продукта SaaS — сложная задача. Есть много вещей, которые нужно учитывать, от бизнес-модели до стека технологий. В этой статье мы сосредоточимся на стеке технологий, который я использую, и узнаем, как я создаю свой продукт SaaS на AWS. Я опишу различные услуги и то, как они сочетаются друг с другом, чтобы обеспечить масштабируемый, безопасный и надежный продукт SaaS.

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

Диаграмма архитектуры

Картинка лучше тысячи слов, поэтому давайте начнем со схемы архитектуры продукта SaaS.

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

Вы можете увидеть живую демонстрацию сборки продукта SaaS с помощью моего React SaaS Boilerplate, полностью размещенного на AWS. Он включает в себя все, что вам нужно в SaaS, включая аутентификацию, многопользовательскую и групповую поддержку, панель управления пользователя, выставление счетов с помощью Stripe и многое другое.

Внешний интерфейс

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

Фронтенд написан на React с Next.js. Из соображений производительности все страницы генерируются статически. Хорошая новость в том, что они могут легко размещаться на любом статическом хостинге. Например, вы можете разместить интерфейс на S3 с помощью Cloudfont в качестве CDN. Но с современными инструментами я рекомендую использовать AWS Amplify Hosting. Это альтернативы Vercel и Netlify в экосистеме AWS.

AWS Amplify Hosting может автоматически развернуть ваше внешнее приложение из репозитория GitHub. Он также предоставляет такие функции, как собственный домен, SSL-сертификат и многое другое.

Пользовательский интерфейс оформлен с помощью Tailwind CSS. Таким образом, я могу легко стилизовать компоненты React непосредственно в JSX, не используя библиотеки вроде styled-components или эмоций.

Наконец, я использую SWR для получения данных из бэкенда. Это библиотека React Hooks для выборки данных, облегченная альтернатива React Query, простая в использовании и предлагающая такие функции, как кэширование, повторная проверка и многое другое.

Бэкенд

Серверный код размещается на AWS Lambda, сервисе бессерверных вычислений, который позволяет запускать код без управления серверами. Это идеально подходит для продукта SaaS, потому что я могу посвятить все свое время продукту, не беспокоясь об эксплуатации. Кроме того, он очень масштабируемый и дешевый.

Чтобы сделать AWS Lambda общедоступным, мне нужно использовать AWS API Gateway. Это полностью управляемый сервис, который позволяет легко создавать, публиковать, поддерживать, отслеживать и защищать API любого масштаба. Он предоставляет такие функции, как аутентификация, ограничение скорости и многое другое.

Я использую Serverless Framework для управления функциями шлюза API и AWS Lambda. Это платформа для создания и развертывания бессерверных приложений. Это очень удобно для пользователя, и все конфигурации обрабатываются в одном файле YAML.

Я также использую Zod для проверки входящих данных, он обеспечивает их достоверность перед обработкой бэкэндом. Это библиотека TypeScript, которая позволяет вам определять схему для ваших данных и проверять ее. Это легкая альтернатива Joi и Yup. Кроме того, это может предотвратить ошибки и проблемы с безопасностью.

Инфраструктура

Внешний и внутренний коды также должны работать с другими сервисами. Я использую AWS CDK для настройки и управления другими сервисами AWS. С помощью AWS CDK я могу использовать JavaScript и TypeScript для определения облачной инфраструктуры. Таким образом, мне не нужно настраивать вручную в консоли AWS, щелкая мышью.

Аутентификация

Я использую AWS Cognito для управления пользователями. С помощью Cognito вы можете ограничить доступ к своему приложению и предоставить пользователям возможность входа в систему. Только авторизованные пользователи могут получить доступ к панели управления и использовать SaaS.

Во внешнем интерфейсе я использую AWS Amplify для потока аутентификации. Этот JavaScript абстрагирует связь с Cognito и упрощает ее. С помощью нескольких строк кода я настроил регистрацию, вход в систему, вход через социальные сети и многое другое. Я не теряю время, внедряя аутентификацию с нуля.

База данных

Для хранения данных я использую AWS DynamoDB, полностью управляемую службу базы данных NoSQL, которая легко интегрируется в экосистему AWS и очень хорошо работает с AWS Lambda.

Одним из недостатков бессерверной архитектуры является сложность работы с базами данных SQL. Например, вам нужно настроить пул соединений для подключения к базе данных. В противном случае это истощит ресурсы вашего сервера. Хорошие новости с DynamoDB: мне не нужно об этом беспокоиться, потому что вам не нужно управлять ограничениями на количество подключений.

Ведение журнала

Приложение использует Pino.js в качестве библиотеки протоколирования. Это очень быстрый регистратор JSON для Node.js. С плагином pino-lambda Pino полностью совместим с AWS Lambda.

Журналы отправляются напрямую в CloudWatch, службу мониторинга и управления журналами. Это полностью управляемый сервис, который позволяет хранить, отслеживать и получать доступ к файлам журналов из сервисов AWS.

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

Электронная почта

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

Чтобы оставаться в экосистеме AWS, я использую AWS SES, полностью управляемый сервис отправки электронной почты. Я предпочитаю не полагаться на сторонние службы электронной почты, такие как SendGrid, Mailgun или Postmark.

Оплата подписки

Чтобы монетизировать свой продукт SaaS, вам необходимо взимать плату с пользователей. Я использую Stripe для обработки платежей. Это платформа обработки платежей, которая позволяет принимать платежи онлайн. В приложении пользователи могут выбрать свой план подписки, и оно перенаправит их на страницу оформления заказа Stripe. На странице оформления заказа они могут ввести данные своей кредитной карты и оплатить подписку.

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

Кроме того, нам необходимо предоставить пользователям возможность обновлять или отменять свои подписки. Для этого я использую клиентский портал Stripe. Это размещенная страница, на которой пользователи могут самостоятельно управлять своими подписками.

Заключение

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

Если вы в настоящее время создаете или планируете создать свой собственный продукт SaaS, вас должен заинтересовать мой Шаблон AWS SaaS. Это шаблон React SaaS, который включает в себя все, что вам нужно в продукте SaaS. Полностью размещенный на AWS, вы можете развернуть его за несколько минут с тем же стеком, который описан в этом посте. Таким образом, вы можете использовать его в качестве отправной точки для создания собственного продукта SaaS и заработать свой первый MRR.

Дополнительные материалы на PlainEnglish.io.

Подпишитесь на нашу бесплатную еженедельную рассылку новостей. Подпишитесь на нас в Twitter, LinkedIn, YouTube и Discord .

Заинтересованы в масштабировании запуска вашего программного обеспечения? Ознакомьтесь с разделом Схема.