Home
Softono
FinanceReactNative

FinanceReactNative

Open source MIT JavaScript
Website GitHub
2.1K
Stars
608
Forks
28
Issues
107
Watchers
3 years
Last Commit
Mobile Development Personal Finance

About FinanceReactNative

FinanceReactNative is a cross-platform mobile application demonstrating React Native development by replicating the core functionality of the iOS Stocks app. Available for both iOS and Android, this project serves as an educational reference for building financial tracking interfaces. The application retrieves real-time stock market data from Yahoo Finance and presents it through a familiar dashboard layout featuring price charts, watchlists, and detailed stock information. Key technical features include the integration of the Alt flux architecture for state management, Moment.js for date handling, and React Native Router Flux for navigation. It utilizes standard components such as ListView for efficient data rendering, RefreshControl for pull-to-refresh gestures, and Vector Icons for visual elements. While the app was previously distributed via the Google Play Store, it is now maintained as a deprecated repository to showcase specific React Native versions and plugin implementations rather than for active pr

Platforms

Web Self-hosted iOS Android

Languages

JavaScript

Links

Website Source Code
7
Published by
7kfpun
Visit View Profile

README.md

View on GitHub

FinanceReactNative

Dependency Status devDependency Status

iOS's Stocks App clone written in React Native for demo purpose (available both iOS and Android). Data is pulled from Yahoo Finance.

Demo

Play Store Button Apk Download Button

  • Rejected by Apple reviewer :smile:: "Your app is too similar to Apple Stock app, which creates a misleading association with Apple products."

App preview

Preview Preview

Screenshots

React and React Native version

Plugins used

  • alt - Isomorphic flux implementation.
  • moment - Parse, validate, manipulate, and display dates in javascript.
  • react-native-navbar - Navbar component for React Native.
  • react-native-router-flux - React Native Router based on new React Native Navigation API (0.26)
  • react-native-simple-store - A minimalistic wrapper around React Native's AsyncStorage.
  • react-native-vector-icons - 3000 Customizable Icons for React Native with support for NavBar/TabBar/ToolbarAndroid, image source and full stying.
  • rn-viewpager - ViewPager and Indicator component for react-native on both android and ios.

Components used

  • AppRegistry - The JS entry point to running all React Native apps.
  • Image - A React component for displaying different types of images, including network images, static resources, temporary local images, and images from local disk, such as the camera roll.
  • Linking - A general interface to interact with both incoming and outgoing app links.
  • ListView - A core component designed for efficient display of vertically scrolling lists of changing data.
  • Platform - A module is provided by React Native to detect what is the platform in which the app is running.
  • RefreshControl - This component is used inside a ScrollView or ListView to add pull to refresh functionality.
  • StatusBar - Component to control the app status bar.
  • StyleSheet - A StyleSheet is an abstraction similar to CSS StyleSheets.
  • Text - A React component for displaying text which supports nesting, styling, and touch handling.
  • TextInput - A foundational component for inputting text into the app via a keyboard.
  • ToolbarAndroid - React component that wraps the Android-only Toolbar widget.
  • TouchableHighlight - A wrapper for making views respond properly to touches.
  • View - The most fundamental component for building UI, View is a container that supports layout with flexbox, style, some touch handling, and accessibility controls, and is designed to be nested inside other views and to have 0 to many children of any type.

Additional

  • eslint: A fully pluggable tool for identifying and reporting on patterns in JavaScript.

Running

Clone & install

  • Clone this repo git clone [email protected]:7kfpun/FinanceReactNative.git
  • cd FinanceReactNative
  • run npm install

iOS

  • Run react-native run-ios

Android

  • Run android avd and start an emulator
  • Run react-native run-android

Related project

License

Released under the MIT License.