Swipe Cards

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

New
(39)
• Released: May 25, 2018, 02:36 PM

Swipe Cards

Author: hansman
Item was Featured Author was Featured
FREE
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. size
git clone https://github.com/hansman/swipe-cards.git