Never build Authentication, Payment, and Automated Delivery Pipelines again! We have already done it!

The components which go into every software can be categorised either as foundation or functional use cases; with foundation being the ones you could reuse for your next software if built right.

Assuming your next software MVP would take 6 months to build, without a ready to use foundation you could potentially spend three months building the groundwork; things you would need but doesn’t contribute to the core of your business.

Thinking about the old question of build vs. buy, I believe one should build what’s key to their business in terms of IP and competitive advantage, and buy the rest strategically.

We had built many software applications, and out of all of them, we decided to pull out the common parts, the foundation, something you could use toward your next software which will save you months of product development and testing.

Including source code, below are the high level functions and technical elements you get out of the box from our foundation. You can then start building your core business from day 1 on top of it:

And on the Engineering side,

In building all the above components, we have followed the below directives:

1. Works Together as a Whole

All functions and components work together collectively to deliver a seamless SaaS experience. It includes Frontend and Backend APIs. Our Payment functions work with our Subscription API, and they also integrate with our Identity solution.

Although you could use them individually too, they are loosely coupled.

Set puzzle pieces. Texture mosaic infographic banner.

2- Micro-Services Architecture

We have had micro-services architecture at the heart of our solution. Services have been developed independent of each other when it comes down to deployment, although they still collaborate and use each other’s services. As an example, there are separate APIs for identity, subscription, location, etc, however your application might need to identity API before fetching location information.

3. Authentication and Authorisation

Our security is claims based, and we rely on JSON Web Token (JWT) to carry these claims between the required parties.

Also, our Authorisation is based on defining Policies at the API level, which will enforce request to have certain claims in their JWT in order to allow an end point to be called. As an example, if you have claims A, B, and C which belong to Admin groups, then you would be able to call certain endpoints of a particular API.

4. Open API compliance

Our APIs come with swagger enabled for different versions of the API, making it easy to host these API behind an API gateway. So as long your API gateway support Open API specs, then you would be able to set up your APIs and the portals associated with them in a matter of minutes.

5. User Interface (Web/Mobile)

As far as the user interface is concerned, we cover Mobile, and Web. The mobile experience is native in both iOS and Android as we leverage React Native in our implementation.

6. Payment

We rely on Stripe as our payment backend system, and the integration we provide enables you to set up with Stripe on day 1 when it down to the below functions:

  • Account registration
  • Capturing billing details
  • Securely capturing payment details
  • Plan selection
  • Plan switching
  • Once-off and recurring payments
  • Capturing key events such payment success and failure

7. DevOps and Cloud

All our APIs, Web and Mobile Apps are deployed to the Cloud with full automation. It build your apps, run the tests and deploys to Cloud (currently Azure) using automated pipelines.

8. Web, Mobile and API scaffolds

The scaffolds make it super easy and fast for your teams to get started developing your applications.

8.1 Microsoft .Net 5.0 based API scaffolds

It comes pre-configured with:

  • Layered architecture (API, Business, Data Access, Common)
  • Publish your API specification (Open API compliant) using Swagger
  • Protected endpoints using JSON Web Tokens and Policies
  • Connect to database of your choice using Entity Framework (easily replaceable)
  • Database migration management and auto upgrade using Entity Framework
  • GraphQL enabled (both Query and Mutations)
  • Google ReCaptcha backend verification
  • Support CORS policies (cross-origin request)
  • Automated build, test, and deployment to Cloud pipelines
  • Distributed caching across multiple databases
  • Configured HTTP response caching and compression
  • Model binders to support custom model bindings
  • Connectivity functions such as calling REST and GraphQL APIs
  • Logging using NLog
  • Central exception handling using Middlewares
  • Read secrets from Cloud based key vaults
  • Read configurations from settings files
  • API versioning (v1, v2, etc)
  • Model validation using Fluent
  • Object mapping using AutoMapper
  • Warm up for Singleton Services (+basic health check)

8.2 React Web App Scaffolds come pre-configured with:

  • Layered architecture (User Interface, Business, Data Access including API Connect/Browser Storage)
  • Global layouts including landing pages, headers and footers
  • Global navigation supporting Mobile and Tablet view (Hamburger Menu), and Protected Routes to hide/restrict unauthorised routes
  • Redux store for state management
  • Maintainable and scalable entity-based Redux store structure
  • Commonly used middleware functions such as API call, logging, notification and route management
  • Central API call function supporting automated JWT refresh using Axios
  • Persistent store across page refreshes / browser exits
  • Complete User Management eco-system, including Sign-up, Sign In, Reset Password, Email Activation, Phone Activation
  • Complete Subscription Management eco-system, including product packages, pricing, account creation, capturing payment and billing details, Switching Plans, and processing backend once-off and recurring payments
  • Global toaster to show notification through middleware chain
  • Loading indicator across long-running operations such backend API calls
  • Consistent state between URL and loaded components enabling back/forward browser buttons and proper SEO
  • Google Map component
  • Terms and Policies Pages
  • Abstracted Semantic-UI based component library (replaceable with library of your choice)
  • Central application setting management
  • Component and screen styling through locally configured Sass styles
  • Response caching and compression
  • Environment configuration for app settings

The React scaffold also contains the below functional components

  • Auto Complete
  • Image Carousel
  • Page Accordion
  • Breadcrumb
  • Spinner

8.3 React-Native Mobile Scaffold

  • Layered architecture (User Interface, Business, Data Access including API Connect/Browser Storage)
  • Location hook to manage user location including permissions
  • API hook to manage calls to backend services, including automated refresh tokens
  • Notification hook to manage registration and receive of push notification
  • Offline notice, to check network connectivity
  • Global navigation (consisting of multiple navigation between Application, and Authentication)
  • In app navigation consisting of Tab Navigation and Stacked Navigation.
  • User Management eco-system, including Sign-up and Sign In
  • Central app setting management
  • Loading indicator across long-running operations such backend API calls

Abstracted control library including:

  • App Text
  • Activity Indicator
  • App Card
  • Text Input
  • Date Picker

Data management forms based on https://formik.org/ which covers

  • Form Fields which include data validation
  • Form Date Picker
  • Form Image Picker

The React-Native scaffold also contains the below functional components:

  • File/Image upload screens
  • Welcome and Account Screens

Leave a Reply

%d bloggers like this: