gigaamiridze / donation-app

Through the donation application, the user can log in, register, view the donation items, view their detailed information and, if desired, enter their own card details for donation and confirm payment.

Home Page:https://clipchamp.com/watch/S6FgBBOxxLH/embed

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Donation App

πŸ“± Through the donation application, the user can log in, register, view the donation items, view their detailed information and, if desired, enter their own card details for donation and confirm payment.

The secure donation payment system is integrated with server-side code that is developed using Node.js, TypeScript, Express.js, and Stripe. Server-side code uploaded to Firebase Functions for efficient processing.

πŸ”— Server-side source code: Here

🌟 Key Features:

βœ… User Authentication: Seamlessly register and log in using Firebase Authentication.

βœ… Secure Payments: Implemented a secure payment system using Node.js, TypeScript, Express.js, and Stripe.

βœ… Firebase Functions: Uploaded server-side code to Firebase Functions for efficient processing.

βœ… User-friendly Interface: Built with React Native to ensure a smooth and intuitive user experience.

βœ… Donation Items: Browse various donation items with detailed information.

App Video Review

Click here and view the video

App Image Review

Login

Fill Login

Register

Home

Home

Donation Item

Payment

Card Details

Successful Payment

Payment Error

This is a React Native project, bootstrapped using @react-native-community/cli.

Getting Started

Note: Make sure you have completed the React Native - Environment Setup instructions till "Creating a new application" step, before proceeding.

Step 1: Start the Metro Server

First, you will need to start Metro, the JavaScript bundler that ships with React Native.

To start Metro, run the following command from the root of your React Native project:

# using npm
npm start

# OR using Yarn
yarn start

Step 2: Start your Application

Let Metro Bundler run in its own terminal. Open a new terminal from the root of your React Native project. Run the following command to start your Android or iOS app:

For Android

# using npm
npm run android

# OR using Yarn
yarn android

For iOS

# using npm
npm run ios

# OR using Yarn
yarn ios

Step 3: Create Stripe.ts file

Inside the src/constants folder create Stripe.ts file with this content:

export enum Stripe {
  PUBLISHABLE_KEY = 'your_stripe_publishable_key',
}

If everything is set up correctly, you should see your new app running in your Android Emulator or iOS Simulator shortly provided you have set up your emulator/simulator correctly.

This is one way to run your app β€” you can also run it directly from within Android Studio and Xcode respectively.

About

Through the donation application, the user can log in, register, view the donation items, view their detailed information and, if desired, enter their own card details for donation and confirm payment.

https://clipchamp.com/watch/S6FgBBOxxLH/embed


Languages

Language:TypeScript 79.7%Language:Java 10.9%Language:Objective-C 3.4%Language:Ruby 3.4%Language:JavaScript 1.4%Language:Objective-C++ 1.1%