DEV Community

Edun Rilwan
Edun Rilwan

Posted on

Building SaaS Faster with Ercas for SaaS: A Template for Indie Hackers

Introduction

Indie hacking thrives on launching ideas quickly, but backend developers, especially in Nigeria, face significant challenges: limited resources, complex payment integrations, and the steep learning curve of building robust subscription systems. These issues slow down the journey from concept to execution.

Ercas for SaaS (EFS), a Reflex.dev template is designed to simplify subscription and payment management for SaaS applications. This template empowers developers with pre-built authentication, subscription logic, and payment integration with the ErcasPay API, reducing development time and enabling faster launches.

This article demonstrates how to use the template, highlighting its features and offering a step-by-step guide to help developers kick-start their SaaS projects.

Key features

  1. Subscription Management: The plug-in supports monthly plans with start and end dates, renewal logic, and plan expiry handling.

  2. Payment Integration: It also contains pre-configured payment handling using ErcasPay API for secure transactions.

  3. User Authentication: Ready-made sign-up and login functionality for user management.

  4. Customizable Pricing Pages: Functional pages that require minimal styling knowledge.

  5. Scalability: The best part is the modular design that allows you to add features and customize the project as your SaaS grows.

Project requirements

The following is required for this project:

  • Python 3.8+: It is required to run your Python code
  • reflex: A Python framework for building full-stack web apps using Python code (installation steps will be provided in the tutorial)
  • Basic knowledge of Python and usage of the reflex Python web framework.
  • Access to the ErcasPay API and API token. Create an account on ErcasPay to get an API token. You can also access the docs here.

How to install EFS

Follow the steps below to install EFS to your local environment:
a. Create a new folder using the terminal or command prompt with the command below:

mkdir saas_project
Enter fullscreen mode Exit fullscreen mode

b. Open this folder with the command below:

cd saas_project
Enter fullscreen mode Exit fullscreen mode

c. Clone the Ercas-for-saas repository on Github with the command below:

git clone https://github.com/Omotunde2005/Ercas-for-saas.git
Enter fullscreen mode Exit fullscreen mode

This will create a new folder named Ercas-for-saas in the saas_project folder. Open the Ercas-for-saas folder in a code editor like Vscode or Pycharm (Preferrably Vscode).

Understanding the project files

The Ercas-for-saas folder has a file structure like the one below:

assets/
   favicon.io
ercas_saas/
   components/
       __init__.py
       container.py
   pages/
       __init__.py
       dashboard.py
       home.py
       login.py
       pricing.py
       signup.py
   state/
       __init__.py
       app.py
       auth.py
       base.py
   __init__.py
   ercas_api.py
   ercas_saas.py
   models.py
.gitignore
ReadMe.md
requirements.txt
rxconfig.py
test.py
Enter fullscreen mode Exit fullscreen mode

These files are arranged according to the reflex app file structure. Read this guide to get a grasp of reflex file structure and an overview of the reflex framework. Each folder and their content are quite self-explanatory. But for clarity, let's explore the main folders and their files:

  • The ercas_saas folder is where you will work with the most. It contains your app pages, database models, styling, etc.
  • The components folder contains a reflex component that is used within the plug-in.
  • The pages folder contains the web templates frequently used in Saas applications (dashboard, home, login, pricing, signup). The code comments in each file will guide you on what each function or utility does.
  • The state folder contains the States used in the app. Read more about states in Reflex here.
  • The ercas_saas.py file is the main file for your app. You can add each page in your app directly in this file. This allows you to keep track of each web page in your app.
  • The ercas_api.py file is the API client for the ErcasPay API. It handles all requests to the ErcasPay API which allows you to receive payments from users and verify their subscriptions.
  • The models.py file contains information about the database model and schema.

How to run the EFS plug-in locally

Open the EFS project in the terminal. and follow the steps below to run the EFS plug-in locally:
a. Create a new virtual environment with virtualenv in Python (install virtualenv if you do not have it):

virtualenv env
Enter fullscreen mode Exit fullscreen mode

b. Activate the virtual environment:
Windows:

.env\Scripts\activate
Enter fullscreen mode Exit fullscreen mode

Linux/macOS

source/bin/activate
Enter fullscreen mode Exit fullscreen mode

c. Install the project requirements with the command below:

pip install -r requirements.txt
Enter fullscreen mode Exit fullscreen mode

d. Install passlib[bcrypt] package for password hashing with the command below (This was not included in the requirements.txt because it has a special installation process):

pip install passlib[bycrypt]
Enter fullscreen mode Exit fullscreen mode

e. Initialize reflex with the command below

reflex init
Enter fullscreen mode Exit fullscreen mode

This will create a new .web folder in the project. This folder will contain the frontend requirements for your app. In most cases, you won't have to work with this folder. Reflex handles the frontend for you.
f. Create a new database from the existing schema with the command below:

reflex db init
Enter fullscreen mode Exit fullscreen mode

This will also create a new saas.db file in your project.
g. Create a new .env file for environment variables like the ErcasPay API token. It is used within the app to authenticate with the API. For a start, get a test API token by setting up your account on ErcasPay.
h. Finally, run the project with the command below:

reflex run
Enter fullscreen mode Exit fullscreen mode

The project will run on port 3000 by default so you can access it at http://localhost:3000/ on your pc.

Editing and customization

The project contains ready-made templates which you can customize to your specific needs. Example customization includes, adding new pages, fonts, styling, etc. Checkout the reflex documentation for more ideas.

Conclusion

Ercas for SaaS is a powerful tool for indie hackers and developers looking to launch SaaS applications quickly. By leveraging the Reflex.dev template, you can bypass the complexities of authentication, payment, and subscription management. This tutorial has shown you how to install, run, and customize the project, empowering you to focus on building great software rather than reinventing the wheel.

Start using Ercas for SaaS today and accelerate your journey to SaaS success!

Top comments (0)