Full-stack App Architecture

This is a live document and the log of our discussion related to the full-stack app development framework that we are building at GeekyAnts.

This is a part of the Productized Services that we want to offer to our clients and customers.

The tech stack

• design-system: A UI component library built for React Native and React. This library is a part of the design system for the brands that we work with. We will deploy one of these per brand.
• web:
• Next.js project that uses the UI component library defined above
• TypeScript (generated types for GraphQL layer)
• mobile:
• React Native mobile app that uses the UI component library
• TypeScript (generated types for GraphQL layer)
• api:
• APISIX as the API Gateway
• Hasura GraphQL with Postgres as the app persistent layer
• Dapr as the Distributed Runtime for the backend business logic
• n8n as the visual workflow manager

Date: 6th Oct 2022

• Express app for Authentication & Authorization as a service inside Dapr.
• Standarization of the Express app so that we can boot more microservices.
• Minimize the boilerplate with helper functions
• Use helper functions to rebuild the same express app in a moleculer.js style
• Introduce context-based data between microservices inside dapr (ctx.) similar to Moleculer.js
• Test out:
• PubSub for logging (pull strategy)
• PubSub for sending out emails (using Dapr Component: Binding SMTP Messaging)

• Use APISIX as the API Gateway
• Dynamically inject services/routes in APISIX (not from the dashboard)
• Allow Independently runnable service

• Definition of a Service:
• A service inside our backend project means a Standalone runnable application on a port number that can be mapped to a Dapr runtime.
• These services can use Dapr Components as and when needed (eg: Binding, PubSub…)

• Configurations
• We need a local env DX to run these projects and boot Dapr Components needed by that particular service.
• Dapr Services <> APISIX mapping in the code
• Hasura <> APISIX mapping in the code