A react-native based tinder-like swipe experience for android and ios. The application pulls cards (images) from the imgur api and renders them via react-native. An user can vote on content by a tinder-like swipe animation.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
__tests__
android
ios
src
tools
.babelrc
.buckconfig
.flowconfig
.gitattributes
.gitignore
.watchmanconfig
README.md
index.android.js
index.ios.js
package.json

README.md

Swipe-Cards

A tinder-like swipe experience for android and ios. The application pulls cards (images) from the imgur api and renders them via react-native. An user can vote for content by a tinder-like swipe animation. Please reach out to become a beta tester.

Build

  • npm install
  • react-native run-ios or
  • react-native run-android

Checklist

  • react-native app for ios (index.io.js)
  • react-native app for android (index.android.js)
  • fetching images from imgur api; authorization based on clientId (src/config.js)
  • state management via Yomguithereal/baobab-react
  • swipe gesture based on meteor-factory/react-native-tinder-swipe-cards
  • buttons to trigger accept-card animation or reject-card animation
  • overlaying color buttons to indicate swipe gesture progress
  • prefetching images before they get rendered
  • image rendering thumbnails 320x320
  • fallback to original image if thumbnail is not available
  • styles calculated based on view port dimensions, support for multiple devices.
  • reloading of image stack ones all images have been swiped
  • handling of api failures such as rate-limiting with manual reload button
  • display locked to portrait mode
  • card render error handling
  • cards fetch error handling
  • unit tests

Test

npm test

Devices

The app has been tested on iphone6, iphone7 and iphone7+ and Nexus5.

Demo

Demo gif