Skip to content

App to learn about React Native with expo, navigation and contextAPI

Notifications You must be signed in to change notification settings

Gabriel-Jesusvix/tracker-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

85 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Tracker App - Expense Tracking App

The Tracker App is an advanced and intuitive React Native application designed to empower users to track, manage, and analyze their personal expenses effortlessly. Developed with TypeScript for enhanced reliability and Firebase for real-time data synchronization, the app offers a seamless and modern user experience.

🌟 Key Features

  • Add Expenses: Quickly record expenses with descriptions, amounts, and dates.
  • View Expenses: Access a comprehensive view of all recorded expenses, complete with editing and deletion options.
  • Real-Time Data Sync: (New) Integrated with Firebase to store and sync expense data instantly across devices.
  • Expense Management: Edit or delete previously recorded expenses with ease.
  • Navigation: Enjoy smooth transitions between screens with React Navigation.
  • User-Friendly Interface: Intuitive design for effortless navigation and interaction.

Installation

Pre requisites

  • Node.js installed (version 16 or higher recommended).
  • npm or yarn as package manager.
  • React Native environment configured.

Steps

  1. Clone o repositório:

    git clone https://github.com/Gabriel-Jesusvix/tracker-app.git
    cd tracker-app
    
     npm install
     # or
     yarn
    
     - Started Project
     npm start
     # or
     yarn start
    

Screenshots

Screenshot 1 Screenshot 2 Screenshot 3 Screenshot 4

The Tracker App was developed with the following goals in mind:

React Navigation:

  • Implementation of navigation between screens with stack and bottom-tabs.
  • Smooth transitions and parameter passing between screens using params.

TypeScript:

  • Use static typing to increase code reliability and maintainability.

State Management:

  • Context API: Centralized and efficient state management for expenses.
  • CRUD Operations: Add, edit, and delete expenses effortlessly.
Modular Architecture:
  • Organization of code in a modular way to facilitate scalability and maintenance.
Real-Time Backend Integration (New)
  • Firebase: Live synchronization of user data for an optimized experience.

Continuous Improvement:

  • Commitment to incorporating best practices for better performance and usability.

Stack used

  • React Native: For building mobile applications.
  • React Navigation: For navigating between screens in the app.
  • TypeScript: Ensuring static typing and better code maintenance.
  • Styled Components: For styling app components.
  • Expo: A tool to facilitate development and testing in React Native.
  • React Native Gesture Handler: To improve gesture control and navigation.
  • React Native Safe Area Context: To ensure compatibility with different devices, respecting safe areas of the screen.
  • Firebase: (New): Backend for real-time data handling.

🔗 Contact

linkedin

Contributing

  1. Fork this repository.

  2. Create a new branch for your feature: git checkout -b feature-name.

  3. Make the necessary changes and commit: git commit -m 'Add new feature'.

  4. Push to your branch: git push origin feature-name.

  5. Open a pull request.

License

MIT

Releases

No releases published

Packages

No packages published