GIF React Native Taxi App With Backend

React Native Taxi App With Backend

The ideal starter kit with all the needed UI elements and Backend Integration to build your iOS and Android Taxi app like Uber / Ola / Lyft.


6 Months Support

All the screens you want!

Fully customizable, ready-to-use screens for users, AND drivers along-with a rich collection of UI elements specifically for an ideal taxi booking / passenger app like Uber / Ola / Lyft

React Native Taxi App With Backend

Note

This starter kit is supported with backend. However, you can purchase just the UI part at $100.
View the Taxi App UI theme.

Demo Video

The app is running on two simulators; one is logged in with a driver account and another with a rider account.

React Native Taxi App With Backend

Passenger View + Driver View!

The app is integrated with passenger app view as well as driver app view.

Backed with Strong Backend

  • Node.js
  • Socket.io
  • MongoDB
  • REST API
  • JWT Login
  • ES6
  • Express
  • Passport for authentication
React Native Taxi App With Backend
React Native Taxi App With Backend

Fetching Features

  • Power-packed with Frontend (Redux, NativeBase, React Native Router Flux) and Backend (Express, Node, MongoDB and Socket.IO)
  • Integrated with CRNA and Expo
  • Single JavaScript code base for iOS & Android
  • Mass of theme specific UI elements, components and Backend integration
  • Fascinated blend of React Native, Node and ES6
  • Having native UI gives it an edge over frameworks like Ionic
  • Easy Routing, just like web

Functional Features

  • Nearby drivers shown on map
  • Ride request goes to nearby drivers only
  • Pickup location can be set on map
  • Ride request can be sent to multiple drivers incase one nearby driver rejects or does not respond to the request
  • Location updates of driver received when driver is moving
  • EnRoute / Arriving / Arrived status shown based on distance of assigned driver to rider
  • Driver moving car shown on rider's screen
  • Cancellation ability for both rider and driver
  • Contact info, name, rating etc. of driver shown to rider
  • Driver can start and end trip
  • Driver and rider can provide rating to each other after trips
  • Push notification: On no-nearby / enRoute / arriving / arrived notification showed on phone
  • Able to store and show trip history
  • Social Login via facebook

..And a web dashboard for admin!

React Native Taxi App With Backend

Roadmap

  • Integrate Stripe Payment Gateway
  • Email Integration
  • Add more payment modes
  • Fare calculation (based on air distance)
  • Eta of arrival of nearby driver.
  • Driver sidebar and settings page

Package

Taxi App FrontEnd

  • expo: 15.1.2
  • ● react: ~15.4.0
  • react-native: 0.42.0
  • ● color: ^0.11.3
  • ● lodash: ^4.13.1
  • ● moment: ^2.17.1
  • native-base: 2.1.0-rc.2
  • ● react-native-checkbox: ^1.1.0
  • ● react-native-country-picker-modal: ^0.2.10
  • ● react-native-drawer: ^2.3.0
  • ● react-native-easy-grid: 0.1.8
  • ● react-native-keyboard-aware-scroll-view: 0.2.7
  • ● react-native-modalbox: ^1.3.9
  • ● react-native-router-flux: 3.38.0
  • ● react-native-vector-icons: 4.0.0
  • ● react-redux: ^5.0.3
  • redux: ^3.6.0
  • ● redux-form: 6.5.0
  • ● redux-logger: ^2.8.2
  • ● redux-persist: ^4.4.2
  • ● redux-thunk: ^2.2.0
  • ● remote-redux-devtools: ^0.5.7
  • ● replace: 0.3.0
  • ● rx: ^4.1.0
  • ● socket.io-client: ^1.7.3
  • ● whatwg-fetch: ^2.0.3
  • ● react-native-scripts: 0.0.26
  • ● jest-expo: ^0.3.0
  • ● react-test-renderer: ~15.4.1
  • ● babel-eslint: ^6.1.2
  • ● babel-jest: 17.0.0
  • ● babel-preset-react-native: 1.9.0
  • ● chai: ^3.5.0
  • eslint: ^3.6.0
  • ● eslint-config-airbnb: 11.1.0
  • ● eslint-plugin-import: ^1.14.0
  • ● eslint-plugin-jsx-a11y: ^2.2.1
  • ● eslint-plugin-react: ^6.2.0
  • ● eslint-plugin-react-native: ^2.0.0
  • ● jest: 17.0.0
  • ● jest-react-native: 17.0.0
  • ● mocha: ^2.5.3
  • ● remote-redux-devtools-on-debugger: ^0.4.6

Taxi App Backend

  • ● asyncawait: ^1.0.6
  • ● bcrypt: ^0.8.7
  • ● bluebird: ^3.1.4
  • ● body-parser: ^1.14.2
  • ● compression: ^1.6.1
  • ● cookie-parser: ^1.4.1
  • ● cors: ^2.7.1
  • ● debug: ^2.2.0
  • ● deferred: ^0.7.5
  • ● expo-server-sdk: ^2.2.0
  • ● exponent-server-sdk: ^2.3.1
  • express: 4.14.0
  • ● express-jwt: 3.4.0
  • ● express-validation: 1.0.0
  • ● express-winston: ^1.2.0
  • ● gps-distance: 0.0.4
  • gulp: 3.9.1
  • ● gulp-babel: 6.1.2
  • ● gulp-load-plugins: ^1.2.0
  • ● helmet: 2.1.1
  • ● http-status: ^0.2.0
  • ● joi: 8.4.2
  • ● jsonwebtoken: 7.1.9
  • ● method-override: ^2.3.5
  • ● moment: ^2.14.1
  • mongoose: ^4.3.7
  • ● morgan: 1.7.0
  • ● passport: ^0.3.2
  • ● passport-jwt: ^2.1.0
  • socket.io: ^1.4.8
  • ● socketio-jwt: ^4.5.0
  • ● stripe: ^4.15.0
  • ● winston: ^2.1.1
  • ● babel-cli: 6.5.1
  • ● babel-core: ^6.9.1
  • ● babel-plugin-add-module-exports: 0.1.2
  • ● babel-preset-es2015: 6.5.0
  • ● babel-preset-stage-2: 6.5.0
  • ● chai: ^3.4.1
  • ● commitizen: ^2.8.2
  • ● coveralls: ^2.11.6
  • ● cz-conventional-changelog: 1.1.5
  • ● del: ^2.2.0
  • eslint: ^1.10.3
  • ● eslint-config-airbnb: 5.0.1
  • ● ghooks: ^1.2.4
  • ● gulp-env: ^0.4.0
  • ● gulp-eslint: ^1.1.1
  • ● gulp-istanbul: 1.0.0
  • ● gulp-mocha: ^2.2.0
  • ● gulp-newer: ^1.1.0
  • ● gulp-nodemon: ^2.0.6
  • ● gulp-plumber: ^1.0.1
  • ● gulp-sourcemaps: ^1.6.0
  • ● gulp-util: ^3.0.7
  • ● isparta: 4.0.0
  • ● mocha: 2.5.3
  • ● run-sequence: ^1.1.5
  • ● supertest: ^1.1.0
  • ● supertest-as-promised: 3.1.0
  • ● validate-commit-msg: ^2.6.1

Taxi App WebDashboard

  • ● babel-polyfill: 6.16.0
  • ● babel-runtime: 6.18.0
  • ● bluebird: 3.4.6
  • ● body-parser: 1.15.2
  • ● classnames: 2.2.5
  • ● cookie-parser: 1.4.3
  • ● core-js: 2.4.1
  • express: 4.14.0
  • ● express-jwt: 5.1.0
  • ● express-request-language: 1.1.8
  • ● fastclick: 1.0.6
  • ● fbjs: 0.8.5
  • ● front-matter: 2.1.0
  • ● history: 4.4.0
  • ● http-status: ^0.2.3
  • ● intl: 1.2.5
  • ● intl-locales-supported: 1.0.0
  • ● isomorphic-style-loader: 1.1.0
  • ● jquery: ^3.1.1
  • ● markdown-it: 8.1.0
  • ● moment: ^2.17.0
  • ● node-fetch: 1.6.3
  • ● node-sass: ^3.13.0
  • ● normalize.css: 5.0.0
  • ● pretty-error: 2.0.2
  • ● query-string: 4.2.3
  • ● react: 15.3.2
  • ● react-bootstrap: ^0.30.6
  • ● react-bootstrap-date-picker: ^4.0.0
  • ● react-dom: 15.3.2
  • ● react-intl: 2.1.5
  • ● react-redux: 4.4.5
  • ● recharts: ^0.18.0
  • redux: 3.6.0
  • ● redux-logger: 2.7.4
  • ● redux-persist: ^4.0.0-beta1
  • ● redux-thunk: 2.1.0
  • ● serialize-javascript: 1.3.0
  • ● source-map-support: 0.4.6
  • ● universal-router: 2.0.0
  • ● whatwg-fetch: 1.0.0
  • ● assets-webpack-plugin: ^3.5.0
  • ● autoprefixer: ^6.5.3
  • ● babel-cli: ^6.18.0
  • ● babel-core: ^6.18.2
  • ● babel-eslint: ^7.1.0
  • ● babel-loader: ^6.2.7
  • ● babel-plugin-react-intl: ^2.2.0
  • ● babel-plugin-rewire: ^1.0.0
  • ● babel-plugin-transform-runtime: ^6.15.0
  • ● babel-preset-latest: ^6.16.0
  • ● babel-preset-react: ^6.16.0
  • ● babel-preset-react-optimize: ^1.0.1
  • ● babel-preset-stage-0: ^6.16.0
  • ● babel-register: ^6.18.0
  • ● babel-template: ^6.16.0
  • ● babel-types: ^6.18.0
  • ● browser-sync: ^2.17.5
  • ● chai: ^3.5.0
  • ● css-loader: ^0.25.0
  • ● enzyme: ^2.6.0
  • eslint: ^3.9.1
  • ● eslint-config-airbnb: ^13.0.0
  • ● eslint-loader: ^1.6.1
  • ● eslint-plugin-import: ^2.2.0
  • ● eslint-plugin-jsx-a11y: ^2.2.3
  • ● eslint-plugin-react: ^6.6.0
  • ● extend: ^3.0.0
  • ● file-loader: ^0.9.0
  • ● gaze: ^1.1.2
  • ● git-repository: ^0.1.4
  • ● glob: ^7.1.1
  • ● json-loader: ^0.5.4
  • ● mkdirp: ^0.5.1
  • ● mocha: ^3.1.2
  • ● pixrem: ^3.0.2
  • ● pleeease-filters: ^3.0.0
  • ● postcss: ^5.2.5
  • ● postcss-calc: ^5.3.1
  • ● postcss-color-function: ^2.0.1
  • ● postcss-custom-media: ^5.0.1
  • ● postcss-custom-properties: ^5.0.1
  • ● postcss-custom-selectors: ^3.0.0
  • ● postcss-flexbugs-fixes: ^2.0.0
  • ● postcss-loader: ^1.1.1
  • ● postcss-media-minmax: ^2.1.2
  • ● postcss-nested: ^1.0.0
  • ● postcss-nesting: ^2.3.1
  • ● postcss-partial-import: ^2.1.0
  • ● postcss-pseudoelements: ^3.0.0
  • ● postcss-selector-matches: ^2.0.5
  • ● postcss-selector-not: ^2.0.0
  • ● postcss-url: ^5.1.2
  • ● raw-loader: ^0.5.1
  • ● react-addons-test-utils: 15.3.2
  • ● react-deep-force-update: ^2.0.1
  • ● react-hot-loader: ^3.0.0-beta.6
  • ● redbox-react: ^1.3.3
  • ● redux-mock-store: ^1.2.1
  • ● rimraf: ^2.5.4
  • ● sass-loader: ^4.0.2
  • ● sinon: ^2.0.0-pre.3
  • ● stylelint: ^7.5.0
  • ● stylelint-config-standard: ^14.0.0
  • ● url-loader: ^0.5.7
  • ● webpack: ^1.13.3
  • ● webpack-hot-middleware: ^2.13.2
  • ● webpack-middleware: ^1.5.1

BROUGHT TO YOU BY

Start building your app today!

Get Started