AutoPayment Service

AutoPayment Service is a comprehensive solution that enables merchants to seamlessly offer automated recurring payments for their services. This project integrates both frontend and backend components to provide users with a user-friendly interface to create and manage subscriptions.

Tech Stacks

Smart Contract Integration: Wagmi Library

Smart Contract Deployment: Hardhat

Frontend: Next.js

Design: Shadcn

Features

Smart Contract Integration:

Utilizes the Wagmi library for seamless integration of smart contracts.

Smart Contract Deployment:

Smart contracts are deployed using Hardhat, ensuring a secure and efficient process.

Frontend Development:

Built with Next.js, a popular React framework, to create a responsive and dynamic user interface.

Design:

Styling and design elements are implemented using Shadcn.

Getting Started

Clone the repository:

git clone https://github.com/MugglePay/recurring-payments-fe.git

Navigate to the project directory:

cd recurring-payments-fe

Install dependencies:

npm install

Build the project:

npm run build

Start the local development server:

npm start

The project will be accessible at http://localhost:3000/.

Usage

Connect Web3 Wallet:

Users can connect their Web3 wallet (Metamask, Coinbase, TrustWallet, etc.) through the website interface.

Create Subscription:

Users can create subscriptions by providing the following details:

• Name: e.g., Music Subscription
• Description: e.g., Music Subscription from the merchant
• Payee
• Token address
• Subscription Cost
• Frequency
• Subscription Period

Wallet Interaction:

During the subscription creation process, users will encounter a wallet prompt where they can approve and confirm the payment.

Subscription List:

After creating a subscription, users can view a list of their subscriptions, including information such as token address, payment, and period.

Happy autopayments! 🚀