Skip to content

A carpooling app built with React Native, Pusher Channels, PHP, and Elasticsearch

Notifications You must be signed in to change notification settings

anchetaWern/Ridesharer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

12 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Ridesharer

A carpooling app built with React Native, Pusher Channels, PHP, and Elasticsearch.

Full tutorial is available on the Pusher tutorial hub:

Prerequisites

  • Docker
  • React Native development environment for Android or iOS (depending on where you want to deploy).
  • Git

Getting Started

Clone the repo and navigate inside it:

git clone https://github.com/anchetaWern/Ridesharer
cd Ridesharer

Setting up the server

  1. Clone laradock and navigate inside:
git clone https://github.com/Laradock/laradock.git
cd laradock
  1. Copy sample environment file:
cp env-example .env
  1. Open .env and set APPLICATION path:
APPLICATION=../laradock-projects
  1. Create laradock-projects directory outside the laradock folder:
mkdir laradock-projects
  1. Copy the contents of laradock/apache2/sites/default.apache.conf file from the Ridesharer/server directory and put it on your laradock/apache2/sites/default.apache.conf file.

  2. Open the docker-compose.yml file on your laradock folder (not the one from Ridesharer) and add the following under the environment config or elasticsearch (check the tutorial for more detailed instructions):

xpack.security.enabled=false
  1. Navigate inside the laradock-projects and create a ridesharer directory:
cd laradock-projects
mkdir ridesharer
  1. Copy the files from Ridesharer/server/files (from this repo) and paste it on the ridesharer directory which you just created.

  2. Update the .env file with your Pusher and Google config.

  3. Bring up the container:

docker-compose up -d apache2 php-fpm elasticsearch workspace
  1. Create an account at ngrok and download it.

  2. Navigate inside the directory where you downloaded ngrok and unzip it.

  3. Add your ngrok token (you can find this on the ngrok dashboard):

.\ngrok authtoken YOUR_AUTH_TOKEN
  1. Expose the server to the internet:
ngrok http -host-header=ridesharer.loc 80

Setting up the app

  1. Navigate inside the app directory:
cd app
  1. Copy android and ios folders somewhere else. These will only be used as a basis on what the following files should look like after all the React Native modules has been installed and set up:
# android-only
android/settings.gradle
android/app/build.gradle
android/app/src/main/AndroidManifest.xml
android/app/src/main/java/com/ridesharer/MainApplication.java

# ios-only
ios/Podfile
ios/Ridesharer/AppDelegate.m
ios/Ridesharer/Info.plist
  1. Install all dependencies:
npm install
  1. Set up the dependencies that needs additional setup. Open the README for the specific version you're using and read install instructions (instructions on how to do this is available on the tutorial):

  2. If you want to deploy to iOS, navigate inside the ios folder and execute pod install to install all the native dependencies.

  3. Update the config for Google, ngrok Base URL, and Pusher on app/screens/Map.js and app/screens/Home.js:

const google_api_key = 'YOUR GOOGLE PROJECT API KEY';
const base_url = 'YOUR NGROK URL';
const pusher_app_key = 'YOUR PUSHER APP KEY';
const pusher_app_cluster = 'YOUR PUSHER CLUSTER';
  1. Run the app:
react-native run-android
react-native run-ios # or open the .xcworkspace file with Xcode

Built With

Acknowledgments

Donation

If this project helped you reduce time to develop, please consider buying me a cup of coffee :)

Buy Me A Coffee

About

A carpooling app built with React Native, Pusher Channels, PHP, and Elasticsearch

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published