Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/sebalp100/react-native-ai-videos

This app exhibits amazing design and functionality, facilitating the easy sharing of AI films across the community. It was built with React Native for smooth user experiences, Animatable for appealing animations, and coupled with the solid backend systems of Appwrite.
https://github.com/sebalp100/react-native-ai-videos

expo javascript react-native

Last synced: 17 days ago
JSON representation

This app exhibits amazing design and functionality, facilitating the easy sharing of AI films across the community. It was built with React Native for smooth user experiences, Animatable for appealing animations, and coupled with the solid backend systems of Appwrite.

Awesome Lists containing this project

README 

        






![flickfusion-high-resolution-logo-transparent](https://github.com/sebalp100/react-native-ai-videos/assets/111214189/c3ae068e-9a5e-4a12-8a35-559e76387e0e)







![ao](https://github.com/sebalp100/react-native-ai-videos/assets/111214189/4509b301-2915-4734-9fbe-97044aba6f59)













# 📗 Table of Contents



- [Table of Contents](#-table-of-contents)

  - [🛠 Built With ](#-built-with-)

    - [Tech Stack ](#tech-stack-)

    - [Key Features ](#key-features-)

  - [🚀 Live Demo ](#-live-demo-)

  - [💻 Getting Started ](#-getting-started-)

    - [Prerequisites](#prerequisites)

    - [Setup](#setup)

    - [Usage](#usage)

  - [👥 Authors ](#-authors-)

  - [🔭 Future Features ](#-future-features-)

  - [🤝 Contributing ](#-contributing-)

  - [⭐️ Show your support ](#️-show-your-support-)

  - [🙏 Acknowledgments ](#-acknowledgments-)

  - [📝 License ](#-license-)



# 📖 FlickFusion



This app exhibits amazing design and functionality, facilitating the easy sharing of AI films across the community. It was built with React Native for smooth user experiences, Animatable for appealing animations, and coupled with the solid backend systems of Appwrite.



## 🛠 Built With 



### Tech Stack 



  Client

  
    

        
  • React Native
    • 

      



  Bundle

  
    

        
  • NPM
    • 

        
  • Expo
    • 

      



  Server

  
    

        
  • Appwrite
    • 

      



### Key Features 



- Onboarding Screen:  Engaging graphics and clear instructions welcome users to the app.



- Robust Authentication & Authorization System:  Secure email login safeguards user accounts.



- Dynamic Home Screen with Animated Flat List:  Smoothly animated flat list showcases the latest videos for seamless browsing.



- Pull-to-Refresh Functionality:  Users can refresh content with a simple pull gesture for up-to-date information.



- Full-Text Search Capability:  Efficiently search through videos with real-time suggestions and instant results.



- Tab Navigation:  Navigate between sections like Home, Search, and Profile with ease using tab navigation.



- Post Creation Screen for Uploading Media:  Upload video and image posts directly from the app with integrated media selection.



- Profile Screen with Detailed Insights:  View account details and activity, including uploaded videos and follower count, for a personalized experience.



- Responsiveness:  Smooth performance and adaptability across various devices and screen sizes for a consistent user experience.



- Animations:  Dynamic animations using the Animatable library to enhance user interaction and engagement throughout the app's UI.



(back to top)



## 🚀 Live Demo 



Coming soon.



(back to top)



## 💻 Getting Started 



To get a local copy up and running, follow these steps.



### Prerequisites



To run this project you need:



- NPM

- Terminal

- Github account.

- Code editor (Visual Studio Code, Atom, etc.)



### Setup



Clone this repository to your desired folder:



cd my-folder

git clone https://github.com/sebalp100/react-native-ai-videos



### Usage



To run the project, execute the following commands in your terminal:



`npm install` to install all dependencies used.



Create a new project in Appwrite and add 2 collections: video and users.



Create an .env file on the root folder with the following keys and add your own values:



`EXPO_PUBLIC_endpoint=`

`EXPO_PUBLIC_platform=`

`EXPO_PUBLIC_projectId=`

`EXPO_PUBLIC_storageId=`

`EXPO_PUBLIC_databaseId=`

`EXPO_PUBLIC_userCollectionId=`

`EXPO_PUBLIC_videoCollectionId=`



`npx expo start -c` to run the server.



Scan the QR code to run with your Expo go mobile app.



(back to top)



## 👥 Authors 



👤 **Sebastian Martin**



- GitHub: [@sebalp100](https://github.com/sebalp100)

- LinkedIn: [Sebastian Martin](https://www.linkedin.com/in/sebastian-martin-956b2724a/)



(back to top)



## 🔭 Future Features 



- Add comment button

- Create video

- Add rating system



(back to top)



## 🤝 Contributing 



Contributions, issues, and feature requests are welcome!



Feel free to check the [issues page](../../issues/).



(back to top)



## ⭐️ Show your support 



Give a ⭐️ if you like this project!



(back to top)



## 🙏 Acknowledgments 



- Hat tip to anyone whose code was used

- JavaScript Mastery for his React Native tutorial



(back to top)



## 📝 License 



This project is [MIT](./LICENSE) licensed.



(back to top)