One Adventure

A social networking mobile application designed to allow users to find and invite friends to nearby outdoor adventures.

🎬 Video Walkthrough of the App:

Click here for a video of the app on YouTube!

Technologies Used

setup & configuration

frontend

backend

🚀 Getting Started

No matter the environment, first run npm install in the root directory.

1. Create a new Firebase project and initialize Firestore and Authentication via email and password.
2. npm run start in ROOTDIR
3. Use the corresponding keys to launch the app on your specified device.

The App

Landing Page

---

Login

• Authenticates users who have already created an account
• Redirects to "Home" page on successful login
• Nav Bar (bottom) is rendered upon succesful login

Sign Up

• Allows for creation of new account
• "Create Account" button directs new user to set up profile
• User Enters Basic Information
• Upon successful account creation, new user is redirected to "Home" page
• Nav Bar (bottom) is rendered

Adventure List

---

Main View

• Scroll to view adventures in your area
• Tap an event card for more information
• Tap the star on an event card to save the event to your list of interested events

Detail View

• Access by tapping the event card
• Shows additional information about the event and if any friends are attending
• Friends conditionally render if they have marked themselves attending that specific event

Adventure Map

---

Map View

• Scroll to view adventures in your area
• Click an event marker for more information
• Search for another location in the search bar
• Clicking search this area searches current area for events

Modal View

• Shows additional information about the event
• Tap the star on an event card to save the event to your list of interested events

Messaging

---

Browse Message Threads

• Shows a list of current and past conversations

Chat With Friends

• Real time chat with a friend of group of friends
• Send media easily via chat
• Tap on a message to add a reaction or choose from a list of actions

Profile

---

Changing Profile Photo

• Tapping the edit button just below the profile photo opens a modal
• The Choose Photo button lets user browse their phone for a photo
• Tap upload once a photo has been chosen

ChangePhoto.mov

Editing Profile Details

• Tapping the edit button to the right of a detail opens a modal
• When satitisfied with input tap the Submit button

EditDetail.mov

Following / Unfollow Friends

• To find friends to follow, tap the search button on the Friends List
• Tap a friend to follow them

FollowFriend.mov

Unfollowing Friends

• To unfollow a friend, tapping the X button opens a modal
• Tap Confirm to unfollow

UnfollowFriend.mov

The Team

Sasha Gordin (Project Manager)
Tyler O'Neill
Noah Beito
Jacqueline Kelly
Thang Nguyen
Keith!

Find your next adventure!