All Projects → stevenpersia → Tinder React Native

stevenpersia / Tinder React Native

Licence: mit
Tinder clone - React Native.

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Tinder React Native

Flutter Ui Showcase
FLUTTER UI Showcase
Stars: ✭ 68 (-89.71%)
Mutual labels:  mobile-app, app
Ionic Starter Template
Reinventing the wheel, again! Sorry Ionic Team... but there are many newbies learning on Youtube!
Stars: ✭ 208 (-68.53%)
Mutual labels:  mobile-app, app
Reactgym
Workout-Tracking app built in ES6 using react, flux and ImmutableJS
Stars: ✭ 36 (-94.55%)
Mutual labels:  mobile-app, app
Tinderclone
Tinder App Clone
Stars: ✭ 196 (-70.35%)
Mutual labels:  clone, tinder
Swiggyui
A Swiggy UI Clone Flutter App.
Stars: ✭ 258 (-60.97%)
Mutual labels:  clone, app
Fultter Example App
一个功能完整齐全的Bloc模式Flutter App项目。🍨更关注架构的SPA应用。,使用Node作为后台系统,使用了部分官方plugin,大体功能自己封装。🥰 有用请Star。
Stars: ✭ 248 (-62.48%)
Mutual labels:  mobile-app, app
Flutter parallax scroll
Flutter UI challenge- Parallax scroll effect
Stars: ✭ 172 (-73.98%)
Mutual labels:  mobile-app, app
Caffe Mobile
Optimized (for size and speed) Caffe lib for iOS and Android with out-of-the-box demo APP.
Stars: ✭ 316 (-52.19%)
Mutual labels:  mobile-app, app
tinder clone
For learning .
Stars: ✭ 151 (-77.16%)
Mutual labels:  clone, tinder
Flutter Osc
基于Google Flutter的开源中国客户端,支持Android和iOS。
Stars: ✭ 2,793 (+322.54%)
Mutual labels:  mobile-app, app
Wire Ios
📱 Wire for iOS (iPhone and iPad)
Stars: ✭ 3,079 (+365.81%)
Mutual labels:  mobile-app, app
Eeui
📱 使用 Vue.js 跨平台开发高质量原生(Android/iOS)应用。
Stars: ✭ 475 (-28.14%)
Mutual labels:  mobile-app, app
Textor
A plain text editor for iOS
Stars: ✭ 564 (-14.67%)
Mutual labels:  app
Rutracker Proxy
rutracker proxy based on electron
Stars: ✭ 620 (-6.2%)
Mutual labels:  app
Pup
The Ultimate Boilerplate for Products.
Stars: ✭ 563 (-14.83%)
Mutual labels:  app
Gdg Devfest App
An App Template For GDG DevFest
Stars: ✭ 559 (-15.43%)
Mutual labels:  app
Jspaint
🎨 Classic MS Paint, REVIVED + ✨Extras
Stars: ✭ 5,972 (+803.48%)
Mutual labels:  app
Clone Wars
100+ open-source clones of popular sites like Airbnb, Amazon, Instagram, Netflix, Tiktok, Spotify, Whatsapp, Youtube etc. See source code, demo links, tech stack, github stars.
Stars: ✭ 12,604 (+1806.81%)
Mutual labels:  clone
Appiconnamechanger
Library to change Android launcher App Icon and App Name programmatically !
Stars: ✭ 555 (-16.04%)
Mutual labels:  app
Flutter starter kit
A starter kit for beginner learns with Bloc pattern, RxDart, sqflite, Fluro and Dio to architect a flutter project. This starter kit build an App Store app as a example
Stars: ✭ 553 (-16.34%)
Mutual labels:  mobile-app

Tinder Clone - React Native

Tinder Clone - React Native

Last Commit Licence Star

Overview

⚠️ This repository is not maintain anymore. I've made another repository of this project on Expo (and with Typescript) : https://github.com/stevenpersia/tinder-expo.

👏 Thank you for your stars, your issues and your pull requests. I really love open source community. ❤️

Perfect to start an Tinder Clone app. 4 screens are availables : Explore, Matches, Messages and Profile. You'll find some components like Card Component to pass props and variant. No frameworks UI like Bootstrap or Material UI are used.

More features will be added to the project in the future.

This project was inspired by this amazing Kishore's work on Dribbble. Feel free to follow this guy because he does great stuff.

Screenshots

Capture 1 Capture 2 Capture 3 Capture 4

Installation and usage

Be sure, you have installed all dependencies and applications to run React Native project on your computer : Getting Started with React Native.

This project works fine for iOS but in Android version there are serious UI problems because I've only worked on iOS.

Running the project

Clone this repository :

git clone https://github.com/stevenpersia/tinder-react-native.git
cd tinder-react-native

Install packages :

npm install

When installation is complete, run with version of your choice :

react-native run-ios
# or
react-native run-android

Props

CardItem

Name Type Required Description Example
image string Yes Picture of member. image="https://..."
name string Yes Name of member. name="John Doe"
description string Yes Description of member. description="Full-time Traveller. Globe Trotter."
matches string Yes Match percentage. matches="95"
actions boolean No Display actions buttons (Like, Dislike, ...). actions
onPressLeft function No Swipe card to left. onPressLeft={() => this.swiper.swipeLeft()}
onPressRight function No Swipe card to right. onPressRight={() => this.swiper.swipeRight()}
status string No Display online or offline badge (Online and Offline). status="Online"
variant boolean No Display another style of card (used for Matches screen). variant

Message

Name Type Required Description Example
image string Yes Picture of member. image="https://..."
name string Yes Name of member. name="John Doe"
lastMessage string Yes Last message of member. lastMessage="You want order in Gotham. Batman must take off his mask and turn himself in."

ProfileItem

Name Type Required Description Example
name string Yes Name of member. name="John Doe"
matches string Yes Match percentage. matches="95"
age string No Age of member. age="25"
location string No Location of member. location="Paris, France"
info1 string No More information of member. info1="Straight, Single"
info2 string No More information of member. info2="Tea Totaller & Loves Photography"
info3 string No More information of member. info3="Beaches, Mountain & Coffee"
info4 string No More information of member. info4="Last seen: 23h ago"

Star, Fork, Clone & Contribute

Feel free to contribute on this repository. If my work helps you, please give me back with a star. This means a lot to me and keeps me going!

Contributors

Stephen Phillips
Stephen Phillips

💬
Anand Vasudevan
Anand Vasudevan

💻
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].