Skip to content

This is a React Js based project similar like airforshare. You can easily share files, images and text via this project to everywhere.

Notifications You must be signed in to change notification settings

Farooq85-dev/Sky-Share-App-Using-React-JS

Repository files navigation

Sky Share App

Sky Share App is a web application designed for seamless file sharing and collaboration. Built using React.js, Firebase Realtime Database, Ant Design, Material Tailwind, and Tailwind CSS, the application offers a modern and responsive user interface with robust real-time data handling.

Features

  • User Authentication (Sign Up, Sign In)
  • File Upload and Management
  • Real-time Data Synchronization
  • User-specific File Management
  • Multi-language Support
  • Dark Mode Toggle

Tech Stack

  • React.js: JavaScript library for building user interfaces.
  • Firebase Realtime Database: Real-time NoSQL database for storing and syncing data.
  • Ant Design: React UI library for building modern web applications.
  • Material Tailwind: Integration of Material Design with Tailwind CSS for styling.
  • Tailwind CSS: Utility-first CSS framework for rapid UI development.

Installation

  1. Clone the repository:

    git clone https://github.com/Farooq85-dev/Sky-Share-App-Using-React-JS
    cd sky-share-app
  2. Install dependencies: npm install

  3. Set up Firebase:

Create a Firebase project in the Firebase Console. Add your Firebase configuration to a .env file in the root directory:

VITE_APP_FIREBASE_API_KEY=your_api_key
VITE_APP_FIREBASE_AUTH_DOMAIN=your_auth_domain
VITE_APP_FIREBASE_DATABASE_URL=your_database_url
VITE_APP_FIREBASE_PROJECT_ID=your_project_id
VITE_APP_FIREBASE_STORAGE_BUCKET=your_storage_bucket
VITE_APP_FIREBASE_MESSAGING_SENDER_ID=your_messaging_sender_id
VITE_APP_FIREBASE_APP_ID=your_app_id
  1. Start the development server:

npm run dev

  1. Open your browser and navigate to http://localhost:3000.

Welcome Page

welcome

Share Text Page

text

Share Files Page

files

Download Page

files

How it works Page

How Works

Contatct Page

Contact

Feedback Page

Feedback

Account Page

account

Usage

User Authentication

  • Users can sign up and log in using email and password or Google authentication.
  • User-specific data is managed using Firebase Authentication and Realtime Database.

File Management

  • Users can upload files to the application, which are stored in Firebase Storage.
  • Uploaded files are associated with the user and can be managed (viewed, deleted) within the application.

Real-time Data Synchronization

  • Changes in the data are synchronized in real-time across all connected clients using Firebase Realtime Database.

Dark Mode and Multi-language Support

  • The application supports dark mode, which can be toggled using the ThemeToggle component.
  • Multi-language support is provided using react-i18next.

Contributing

  • Contributions are welcome! Please open an issue or submit a pull request if you have any improvements or new features to propose.

Made with 💙 Muhammad Farooq

About

This is a React Js based project similar like airforshare. You can easily share files, images and text via this project to everywhere.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published