This project is an Instagram clone developed using React Native and TypeScript. It includes features such as user authentication, post sharing, account editing, user search, following/unfollowing other users, and liking/commenting on posts. The project also utilizes Redux for global state management and Firebase for backend services, including Firebase Storage for storing media files, Firestore for the database, and Firebase Authentication for user authentication.
- User Authentication: User Authentication: Secure login with email via firebase auth system
- Post Sharing: Share photos from device gallery.
- Account Management: Edit profile information and update profile picture.
- User Search: Discover and connect with other users.
- Follow/Unfollow Users: Stay updated with followed users' posts.
- Like/Comment on Posts: Interact with posts through likes and comments.
- UI Design: Modern UI with Ui Kitten, React Native Elements, and React Native Paper.
- State Management: Efficient state management with Redux.
- React Native: Popular open-source JavaScript framework for cross-platform mobile app development.
- Typescript: Superset of JavaScript with optional static typing for improved code quality and tooling.
- Redux: Predictable state container for managing application state in JavaScript apps.
- Git: Version control system for tracking code changes and facilitating collaboration.
- npm: JavaScript package manager for easy dependency management.
- Firebase: A comprehensive backend-as-a-service (BaaS) platform provided by Google.
- Visual Studio Code: Popular code editor with rich features for code editing and debugging.
- Figma: Web-based design tool for creating UI/UX designs and prototypes.
Before running the application, you need to configure Firebase services. Follow the steps below:
Create a Firebase project at https://firebase.google.com if you haven't already.
- Enable Firebase Authentication, Firestore, and Firebase Storage for your project.
- Obtain the Firebase configuration object from the Firebase console.
- Update the Firebase configuration in the project code.
- Create a file firebase.ts and replace the following lines with your Firebase configuration:
import firebase from "firebase/compat/app";
import "firebase/compat/auth";
import "firebase/compat/firestore";
import "firebase/compat/storage"
import "firebase/compat/database"
const firebaseConfig = {
//your config goes here
};
if (!firebase.apps.length) {
const app = firebase.initializeApp(firebaseConfig);
}
export { firebase };
To deploy this project run
npx expo start
- UI Kitten: A customizable UI library for React Native that provides various UI components.
- React Native Elements: A set of cross-platform UI components for React Native applications.
- React Native Paper: A material design implementation for React Native, providing UI components and theming options.
If you would like to contribute to the Instagram Clone, you are welcome to submit pull requests or open issues on the GitHub repository. Please make sure to follow the project's coding conventions and commit guidelines. We appreciate your contributions and feedback!
The Instagram Clone is open-source and released under the GNU General Public License
For any inquiries or questions regarding the Instagram Clone application, please contact Jurma Daniel at [email protected]