This project demonstrates the integration of multiple payment gateways, including Stripe, Razorpay, PayPal, and Coinbase, using Next.js 14. It showcases how to implement these popular payment solutions in a web application.
Check out the live demo here.
- Multiple Payment Gateways: Integration with Stripe, Razorpay, PayPal, and Coinbase.
- Next.js 14: Built with the latest features and capabilities of Next.js.
- User-Friendly UI: Simple and intuitive interface for making payments.
- Responsive Design: Optimized for all devices, including mobile and desktop.
To run this project locally, follow these steps:
-
Clone the repository:
git clone https://github.com/PremPrakashCodes/payment-gateways.git
-
Navigate to the project directory:
cd payment-gateways -
Install dependencies:
npm install
-
Set up environment variables:
Create a
.env.localfile in the root directory and add the necessary API keys and configuration settings for the payment gateways.NEXT_PUBLIC_BASE_URL=http://localhost:3000 NEXT_PUBLIC_STRIPE_PUBLIC_KEY= STRIPE_SECRET_KEY= STRIPE_WEBHOOK_SECRET= NEXT_PUBLIC_RAZORPAY_KEY_ID== RAZORPAY_KEY_SECRET= PAYPAL_CLIENT_ID= PAYPAL_CLIENT_SECRET= COINBASE_API_KEY= COINBASE_WEBHOOK_SECRET= -
Run the development server:
npm run dev
-
Open your browser: Visit http://localhost:3000 to see the app in action.
Select a payment gateway from the available options, enter the required payment details, and proceed with the payment. The demo showcases a straightforward integration process for each gateway.
Contributions are welcome! If you'd like to contribute, please fork the repository and create a pull request. For major changes, please open an issue to discuss what you'd like to change.
This project is licensed under the MIT License. See the LICENSE file for more details.
If you have any questions or feedback, feel free to reach out!
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent