Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/jhonatanmizu/challenge-payment-flow
https://github.com/jhonatanmizu/challenge-payment-flow
Last synced: 20 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/jhonatanmizu/challenge-payment-flow
- Owner: Jhonatanmizu
- Created: 2024-11-19T20:37:28.000Z (about 1 month ago)
- Default Branch: main
- Last Pushed: 2024-11-19T21:29:05.000Z (about 1 month ago)
- Last Synced: 2024-11-19T21:32:59.384Z (about 1 month ago)
- Language: TypeScript
- Size: 0 Bytes
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# **Challenge: Payment Flow 💰**
## **Goal**
The purpose of this app is to solve a challenge involving the implementation of a payment flow. It demonstrates the handling of various stages of a payment process, including selecting a payment method, applying installments, and displaying the payment results.
---
## **Routes**
The app contains the following key routes:
- **Payment Resume**: Displays a summary of the payment details.
- **Payment Success**: Shows a success screen upon completing a payment.
- **Processing Payment**: Indicates that the payment is being processed.
---
## **Features**
- Select a payment method.
- Apply and configure installment options for payments.
---
### Core Libraries
- **React**: A library for building user interfaces.
- **React Native**: A framework for building native apps using React.
- **Expo**: A framework and platform for universal React applications.
### Navigation
- **@expo/router**: Navigation for bottom tab bars in React Native.
### State Management
- **Zustand**: A small, fast, and scalable state management library.
### UI Components and Animations
- **@expo/vector-icons**: Icons for React Native projects.
- **react-native-paper**: UI library with components adhering to the Material Design guidelines.
- **lottie-react-native**: For rendering Lottie animations.
- **react-native-animatable**: For creating animations.
### Styling
- **@shopify/restyle**: A utility library for styling React Native components.
### Localization
- **i18next**: Internationalization framework.
- **react-i18next**: React bindings for i18next.
- **expo-localization**: Provides localization information.
---
## **Screenshots**
![Payment Flow Screenshot]()
---
## **Getting Started**
### **Prerequisites**
To run this project, you will need:
- A drink (highly recommend coffee ☕ for best performance)
- [Node.js](https://nodejs.org/)
- A code editor (recommendation: [Visual Studio Code](https://code.visualstudio.com/))
- The Expo Go app installed on your mobile device for testing on a physical device.
- [Android Studio](https://developer.android.com/studio) (optional, if you want to test the app on an emulator).
---
### **How to Run the Project**
1. Clone this repository to your local machine.
2. Install the project dependencies:
```bash
yarn install
```
3. Start the project with Expo:
```bash
npx expo start
```
4. Use Expo Go on your mobile device or connect an emulator to test the app.
---
## **Contributing**
Want to contribute? Here's how you can help:
1. Create a new branch for your changes:
```bash
git checkout -b your-branch-name
```
2. Implement your changes and commit them with a meaningful message:
```bash
git commit -m ":sparkles: Your message here"
```
3. Push your branch to the remote repository:
```bash
git push
```
4. Open a pull request and request a code review.
---
## **Git Workflow**
### Common Commands:
- **Create a new branch**:
```bash
git checkout -b your-branch-name
```
- **Switch to a branch**:
```bash
git checkout branch-name
```
- **Commit your changes**:
```bash
git commit -m "Your commit message"
```
- **Push changes to remote**:
```bash
git push
```
- **Pull updates from remote**:
```bash
git pull
```
---
## **Development Setup**
Need help setting up your React Native environment? Check out [this guide](https://react-native.rocketseat.dev) for step-by-step instructions.
---
## **Starting a Pull Request**
1. Create a branch based on the `main` branch:
```bash
git checkout -b feature/your-feature-name
```
2. Make your changes and commit to your branch.
3. Push your branch to the remote repository.
4. Create a pull request and ensure it is reviewed before merging.
---