NOTE: This repo only contains the front-end of our project. The API used can be found at RevatureRobert/2106Jun07RNCN-2-p2-be.
The front end for Chirper, a social media application for registered users to post "Chirps" as well as like and reply to other users' Chirps. The application can be run as a mobile app (iOS or Android) or as a web application.
This project is written in React Native intialized with Expo, written with unit tests using Jest and Enzyme.
- React Native in TypeScript
- React Redux
- Expo
- Jest (w/ Enzyme)
- AWS S3
- AWS CodePipeline
- AWS Cognito
- Users can signup and validate their own emails
- Users can login
- Users can logout of the application when finished
- Users can post new chirps
- Users can include photos in chirps
- Users can view all existing chirps
- Users can view all chirps by a single user
- Users can like chirps
- Users can comment on chirps
- Users can set their bio
- Users can change profile pictures
- Users can see others' bios
- Users can delete their chirps, comments, and accounts
To-do list:
- Users should be able to upload videos to chirps
- Users should be able to enter age/birthday
- Users should be able to have a separate display name from their username
- Users should be able to follow other users specifically instead of following all
To Run (assume all links are case-sensitive; links may not work after 20 August 2021):
- There is currently no way to run this app on iOS for those not on the development team
- A web version is available (as a beta) at https://bit.ly/Chirper
- On Android, there are two ways to get our app
- Download the
Expo
app from the Play Store and do ONE of the following- Go to https://expo.dev/@marcski55/React-Native-chirper on a different device and scan the QR code with your Android camera
- Paste
exp://exp.host/@marcski55/React-Native-chirper
into the Tools category
- Sideload an APK
- Using an emulator
- Download the APK from https://bit.ly/chirperAPK
- Download and install Android Studio from https://developer.android.com/studio
- Create a blank project or open an existing one
- Open the AVD (Android Virtual Device) Manager using the icon at the top right or selecting it from the
Tools
menu - Open a virtual device
- If there are none, one can be created using the botton on the bottom left
- The Pixel 3a would be a good template device
- Make sure to select an
R
release (shown in the left column) - Accept all defaults
- If there are none, one can be created using the botton on the bottom left
- Drag the APK from your Downloads folder (or wherever you saved it) onto the Emulator screen
- It will begin the install process automatically; follow any instructions on screen
- Using a physical device (not recommended as it requires sideloading)
- Enable sideloading if you haven't already
- Go to
Apps & notifications → Advanced → Special App Access → Install unknown apps
- Select your browser (probably Chrome)
- Go to
- Download the APK https://bit.ly/chriperAPK
- Install the app following the prompts on your screen
- Enable sideloading if you haven't already
- Using an emulator
- Download the
To Develop:
- Make sure you have NodeJS installed.
- Clone the repo:
git clone https://github.com/RevatureRobert/2106Jun07RNCN-2-p2-fe path-to-local-folder
. - Enter the directory of your folder on your terminal:
cd path-to-local-folder
. - Run
npm install
to get dependencies installed. You may need to add the--legacy-peer-deps
flag. - Run
expo start
to run the app in development mode. (This should NOT be used for deployment.)
To Deploy:
- Sign up for an Expo account if you don't already have one.
- Then run the appropriate command:
expo build:web
expo build:android -t apk --no-wait
- iOS should also be able to be build but we don't have Apple Developer licenses.
- Android build will be on expo's site (URL will be given once you run the command).
- Create a new user. Login using new username and password after verifying your email.
- View chirps on the home screen. Post a new chirp by using the floating "Add Chirp" (pencil) button.
- View a single user's chirps by tapping their profile pic.
- Reply to a chirp by tapping a chirp.
- Search by username or chirp with the magnifying glass.
- See all your chirps or logout by tapping the profile icon.
- Change your profile pic, bio, or delete your account on the settings screen.