10

SportsHub - A React Native mobile application that aims to connect athletes all...

 2 years ago
source link: https://reactnativeexample.com/sportshub-a-react-native-mobile-application-that-aims-to-connect-athletes-all-across-new-zealand/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

Apps

SportsHub - A React Native mobile application that aims to connect athletes all across New Zealand

Jun 15, 2022 3 min read

SportsHub

SportsHub is a React Native mobile application that aims to connect athletes all across New Zealand with each other through sporting events.This application allows users to create, join, and view user-created teams and sporting events.SportsHub enables users to communicate with each other in a public chatroom with real-time updates.Finding sporting events is made easy, by allowing users to filter events by sports preferences.The SportsHub application also provides a built-in dark / light mode toggle for both day and night usage.

Implementation:

  • Uses Firebase authentication to store accounts.
  • Uses Firebase’s firestore database to store data.
  • The application is developed using Javascript with the React Native framework.
  • The project is initialized using Expo.

How to build the project:

  • Download the “Expo Go” app from the app store, available both on Android Google Play Store and the IOS App store.
  • Type expo start into the terminal to build the project. This will open metro bundler and will provide a QR code to scan using either the camera app (IOS) or the Expo Go app (Android).
  • (In the case that dependencies are missing from the project upon build, type npm ci to perform a clean installation of dependencies).

Authors:

  • Ivan Czar
  • Kyle Francis
  • Cameron Graham
  • Aashish Kulkarni
  • Kealen Pillay

Dependencies:

  • “@react-native-community/datetimepicker”: “4.0.0”
  • “@react-native-community/masked-view”: “^0.1.11”
  • “@react-navigation/bottom-tabs”: “^6.3.1”
  • “@react-navigation/core”: “^6.2.1”
  • “@react-navigation/native”: “^6.0.10”
  • “@react-navigation/native-stack”: “^6.6.2”
  • “@react-navigation/stack”: “^6.2.1”
  • “@types/react-native”: “^0.67.5”
  • “expo”: “~44.0.0”
  • “expo-blur”: “~11.0.0”
  • “expo-clipboard”: “~2.1.0”
  • “expo-image-picker”: “~12.0.1”
  • “expo-linear-gradient”: “~11.0.3”
  • “expo-status-bar”: “~1.2.0”
  • “firebase”: “^9.6.10”
  • “native-base”: “^3.4.3”
  • “react”: “17.0.1”
  • “react-dom”: “17.0.1”
  • “react-native”: “0.64.3”
  • “react-native-chip”: “^2.1.8”
  • “react-native-element-dropdown”: “^1.8.10”
  • “react-native-flash-message”: “^0.2.1”
  • “react-native-gesture-handler”: “~2.1.0”
  • “react-native-get-random-values”: “^1.7.2”
  • “react-native-gifted-chat”: “^0.16.3”
  • “react-native-google-maps-directions”: “^2.1.1”
  • “react-native-google-places-autocomplete”: “^2.4.1”
  • “react-native-paper”: “^4.12.0”
  • “react-native-platform-searchbar”: “^1.2.3”
  • “react-native-ratings”: “^8.1.0”
  • “react-native-reanimated”: “~2.3.1”
  • “react-native-safe-area-context”: “3.3.2”
  • “react-native-screens”: “~3.10.1”
  • “react-native-toast-message”: “^2.1.5”
  • “react-native-web”: “0.17.1”

Example Usage:

smaller
myEvents
chat
newEvent
modal

GitHub

View Github


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK