ladunjexa / expo-reactnative-aora

Aora is a social media platform that allows users to share AI-generated videos with the community and discover trending videos. 🤖

React Native Aora

📝 Description

Aora is a social media platform that allows users to share AI-generated videos with the community and discover trending videos.

Folder Structure

reactnative-aora/
├── .vscode/
├   └── settings.json
├── app/
├   ├── _layout.tsx
├   ├── index.tsx
├   ├── (auth)/
├   ├   ├── _layout.tsx
├   ├   ├── sign-in.tsx
├   ├   └── sign-up.tsx
├   ├── (tabs)/
├   ├   ├── layout.tsx
├   ├   ├── bookmark.tsx
├   ├   ├── create.tsx
├   ├   ├── home.tsx
├   ├   └── profile.tsx
├   └── search/
├       └── [query].tsx
├── components/
├   ├── atoms/
├   ├   ├── custom-button.tsx
├   ├   ├── empty-state.tsx
├   ├   └── info-box.tsx
├   ├── cards/
├   ├   └── video-card.tsx
├   ├── layout/
├   ├   └── tab-icon.tsx
├   ├── shared/
├   ├   ├── form-field.tsx
├   ├   └── search-input.tsx
├   └── trending/
├       ├── trending-item.tsx
├       └── index.tsx
├── constants/
├   ├── icons.ts
├   ├── images.ts
├   └── index.ts
├── context/
├   └── global-provider.tsx
├── hooks/
├   └── use-appwrite.ts
├── lib/
├   ├── appwrite.ts
├   ├── animations.ts
├   └── actions/
├       ├── post.action.ts
├       ├── user.action.ts
├       ├── file.action.ts
├       └── shared.types.d.ts
├── assets/
├   ├── adaptive-icon.png
├   ├── favicon.png
├   ├── icon.png
├   ├── splash.png
├   ├── fonts/[[...]].png
├   ├── icons/[[...]].ttf
├   └── images/[[...]].png
├── types/
├   └── index.d.ts
├── .env
├── .eslintignore
├── .eslintrc.js
├── .gitignore
├── .prettierignore
├── .prettierrc
├── app.json
├── babel.config.js
├── nativewind-env.d.ts
├── package.json
├── README.md
├── tailwind.config.ts
└── tsconfig.ts

📖 Table of Contents

Table of Contents

• Description
• Technologies Used
• Get Started
  • Prerequisites
  • Installation and Run Locally
  • Scripts
  • Launching
    • Launch on Expo Go (recommended)
    • Launch on Android
    • Launch on iOS
• Environment Variables
• Contributing
  • Bug / Feature Request
• Acknowledgements
• Contact Us
• License

✨ Technologies Used

Aora is built using the following technologies:

• TypeScript: TypeScript is a typed superset of JavaScript that compiles to plain JavaScript.
• Expo: Expo is an open-source platform for making universal native apps for Android, iOS, and the web with JavaScript and React.
• React Native: React Native is an open-source mobile application framework created by Facebook.
• Appwrite: Appwrite is an open-source backend server that helps you build modern applications much faster with real-time APIs for authentication, databases, files storage, and much more.
• NativeWind: NativeWind is a utility-first CSS framework for React Native based on Tailwind CSS.
• React Native Animatable: React Native Animatable is a library for React Native that provides animations for React Native components.
• Tailwind CSS: Tailwind CSS is a utility-first CSS framework for rapidly building custom user interfaces.
• ESLint: ESLint is a static code analysis tool for identifying problematic patterns found in JavaScript code.
• Prettier: Prettier is an opinionated code formatter.

🧰 Get Started

To get this project up and running in your development environment, follow these step-by-step instructions.

📋 Prerequisites

In order to install and run this project locally, you would need to have the following installed on your local machine.

• Node.js
• NPM
• Git

⚙️ Installation and Run Locally

Step 0:

Important

• the application uses Appwrite for Authentication and User Management, therefore, you need to create Appwrite account here and sets the environment variables in the .env file.

Step 1:

Download or clone this repo by using the link below:

git clone https://github.com/ladunjexa/expo-reactnative-aora.git

Step 2:

Execute the following command in the root directory of the downloaded repo in order to install dependencies:

npm install

Step 3:

Execute the following command in order to run the development server locally:

npm start

Step 4:

Open http://localhost:8081 with your browser to see the result.

🚀 Launching

Launch on Expo Go (recommended)

You can deploy this app on Expo Go by scanning the QR code generated by the Expo development server.

npx expo start

Launch on Android

You can deploy this app on Android by running the following command:

npm run android

Launch on iOS

You can deploy this app on iOS by running the following command:

npm run ios

📜 Scripts

All scripts are defined in the package.json file. Here is a list of all scripts:

Script	Action
npm install & npx expo install	Installs dependencies
npm run start	Start expo development server
npm run android	Start expo development server on Android
npm run ios	Start expo development server on iOS
npm run web	Start expo development server on Web
npm run ts:check	Check TypeScript types
npm run lint	Run ESLint

🔒 Environment Variables

Environment variables[^7] can be used for configuration. They must be set before running the app.

Environment variables are variables that are set in the operating system or shell, typically used to configure programs.

Aora uses Appwrite as a backend service. You need to create an account on Appwrite and get the required credentials to run the app.

Create a .env file in the root directory of the project and add the following environment variables:

EXPO_PUBLIC_APPWRITE_ENDPOINT=<APPWRITE_ENDPOINT>
EXPO_PUBLIC_APPWRITE_PLATFORM=<APPWRITE_PLATFORM>
EXPO_PUBLIC_APPWRITE_PROJECT_ID=<APPWRITE_PROJECT_ID>
EXPO_PUBLIC_APPWRITE_DATABASE_ID=<APPWRITE_DATABASE_ID>
EXPO_PUBLIC_APPWRITE_USER_COLLECTION_ID=<APPWRITE_USER_COLLECTION_ID>
EXPO_PUBLIC_APPWRITE_VIDEO_COLLECTION_ID=<APPWRITE_VIDEO_COLLECTION_ID>
EXPO_PUBLIC_APPWRITE_STORAGE_ID=<APPWRITE_STORAGE_ID>

🔧 Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

To fix a bug or enhance an existing module, follow these steps:

1. Fork the repo
2. Create a new branch (git checkout -b improve-feature)
3. Make the appropriate changes in the files
4. Commit your changes (git commit -am 'Improve feature')
5. Push to the branch (git push origin improve-feature)
6. Create a Pull Request 🎉

📩 Bug / Feature Request

If you find a bug (failure of a module to execute its intended function), kindly open an issue here by including the issue with a title and clear description.

If you'd like to request a new function, feel free to do so by opening an issue here. Please include sample queries and their corresponding results.

💎 Acknowledgements

I'd like to express my gratitude to the following people who helped me with this project and made it possible:

• Appwrite
• React Native
• Expo
• TypeScript
• NativeWind
• React Native Animatable
• ESLint
• Prettier
• JavaScript Mastery

📞 Contact Us

📋 License

Aora is open source software licensed as MIT and is free to use — See LICENSE for more details.