Skip to content

Latest commit

 

History

History
364 lines (216 loc) · 20.2 KB

README.md

File metadata and controls

364 lines (216 loc) · 20.2 KB

Test Status

Build Status

PicConnect - Explore and connect through photography.

Pic Connect is a dynamic social networking app that empowers users to share their life's moments through captivating stories.

With a focus on multimedia content, users can post photos and videos, adding creative flair through tags and location data. The platform fosters a vibrant community, enabling likes, comments, and shares. Pic Connect isn't just about socializing; it's a canvas for visual storytelling.

Whether it's a dazzling sunset or an adrenaline-pumping adventure, every moment is brought to life. Join the Pic Connect community, where moments become memories and connections go beyond the screen.

This README provides a comprehensive overview of the project, its features, and the technology stack choices.


Features

PicConnect offers a wide range of features to enhance your social media experience:

  • User Authentication: Create an account or log in securely to access all features.

  • Profile Management: Customize your profile with a profile picture, bio, and contact information.

  • Content Sharing: Share your favorite photos and videos with your followers.

  • Engagement: Like, comment, and save posts. Follow other users and receive notifications.

  • Discovery: Explore and discover new content through the Explore tab.

  • Direct Messaging: Chat with your friends and followers through our built-in messaging system.

| Preview | Preview | Preview |

| Preview | Preview |

Technology Stack

PicConnect is built using the following technologies:

  • Flutter: We chose Flutter as the primary framework for developing PicConnect due to its cross-platform capabilities. With a single codebase, we can deploy our app on both Android and iOS, ensuring a consistent user experience across platforms.

  • Firebase: Firebase provides a robust backend-as-a-service (BaaS) platform, which powers PicConnect's user authentication, real-time database, and cloud storage. Firebase offers seamless integration with Flutter, making it an ideal choice for building real-time and interactive features in our app.

  • Dart: The Dart programming language is the backbone of Flutter, and we use it extensively to write clean and efficient code for our app.

| App Preview |

Why Flutter and Firebase

We chose Flutter and Firebase for PicConnect for the following reasons:

  • Cross-Platform Development: Flutter allows us to write a single codebase for both Android and iOS, reducing development time and maintenance efforts.

  • Rich User Interfaces: Flutter's widget-based architecture makes it easy to create beautiful and responsive user interfaces, ensuring an engaging user experience.

  • Real-Time Features: Firebase offers real-time database capabilities, making it perfect for features like real-time messaging and notifications in PicConnect.

  • Scalability: Firebase scales effortlessly with the growth of our user base, ensuring a seamless experience for all users.

Software Architecture

Clean Architecture

This project adheres to the principles of Clean Architecture, a design approach that promotes separation of concerns and independence of layers within an application. It offers advantages such as testability, scalability, and code maintainability.

The architecture is organized into the following layers:

1. Presentation Layer (UI)

  • Description: The presentation layer handles the user interface and user interactions. In this layer, we implement the BLoC pattern to manage UI state and user actions.

  • Technology: We leverage Flutter's capabilities to efficiently develop the presentation layer.

2. Business Layer (BLoC - Business Logic Component)

  • Description: The business layer contains application logic not directly tied to the user interface. Here, we define UseCases that encapsulate specific business requirements. These UseCases manage the application state and control data flow.

  • Technology: In Flutter, we utilize packages like flutter_bloc to effectively implement BLoCs and organize business logic.

3. Data Layer

  • Description: The data layer is responsible for accessing and managing application data. It interfaces with different data sources, abstracting their implementation details. Repositories act as bridges between UseCases and data sources.

  • Technology: We use packages like http for making HTTP requests and databases like SQLite or ORM packages for local storage. The use of data sources allows us to connect with Firestore and FireStorage.

4. Domain Layer

  • Description: The domain layer hosts pure business logic and application business rules. It should be isolated from specific data layer or presentation layer implementations. Here, we define the core business entities.

  • Technology: This layer is generally free from external libraries and should remain technology-agnostic.

UseCases, Repositories, and Data Sources

In this project, we've encapsulated business requirements in UseCases, which are responsible for orchestrating various operations. These UseCases interact with one or more repositories, injecting them via Inversion of Control (IoC) using GetIt.

  • UseCases: These are the heart of the application's business logic, serving as intermediaries between the presentation and data layers. They encapsulate specific use cases, such as creating a new post, fetching user data, or handling authentication.

  • Repositories: Repositories serve as interfaces between UseCases and data sources. They abstract the data layer's implementation, allowing us to switch between different data sources (Firestore, FireStorage, HTTP, local database) without affecting the business logic.

  • Data Sources: Data sources manage concrete aspects of data storage. In your project, Firestore and FireStorage are the primary data sources for handling persistence. These data sources are encapsulated within repositories and accessed through well-defined interfaces.

Advantages of Clean Architecture and Abstraction

  • Maintainability: Clean architecture promotes separation of concerns, making it easier to maintain and update different parts of the application independently.

  • Scalability: The architecture accommodates application growth, allowing you to extend functionality without causing major disruptions.

  • Testability: By isolating business logic in UseCases and abstracting data sources, the codebase becomes highly testable, enabling efficient unit testing.

  • Flexibility: The abstraction of data sources through repositories makes it possible to switch or add new data sources seamlessly, without extensive code modifications.

This architecture provides a robust foundation for your project, enabling efficient development, testing, and future expansion. It allows you to focus on implementing business logic while abstracting away the complexities of data storage and retrieval using Firestore and FireStorage.

App Screenshots

Here are some screenshots from our app to give you a glimpse of its design and functionality.

Onboarding Screens

| Onboarding 1 | Onboarding 2 | Onboarding 3 |

Login & Registration

| Login Screen | Registration Screen | Login Screen |

| Registration Screen | Registration Screen | Registration Screen |

Home

This section could display the main feed of posts and activities from the users you follow.

| Home Screen | Home Screen | Home Screen |

| Home Screen | Home Screen | Home Screen |

Explore (Discover)

Here, users can search for other users, explore new popular posts, or discover interesting content.

| Search Screen | Search Screen | Search Screen |

Explore Reels

Dive into the exciting world of Reels. Discover short and entertaining content created by people from around the world. From music videos and quick tutorials to comedy moments and more, Reels will keep you entertained for hours. Swipe up to uncover the hottest Reels and find inspiration with every scroll!

| Explore Reels Screen | Explore Reels Screen | Explore Reels Screen |

| Explore Reels Screen | Explore Reels Screen | Explore Reels Screen |

User Profile

The user profile section is where you can view and manage your own profile. You can customize your profile picture, update your bio, and see all your posts, including photos and videos. You can also view your followers, the people you're following, and any saved posts. It's your personal space to showcase your content and connect with others in the community.

| User Profile Screen | User Profile Screen | User Profile Screen |

| User Profile Screen | User Profile Screen | User Profile Screen |

| User Profile Screen | User Profile Screen | User Profile Screen

Create Posts

This section allows you to share your moments, photos, and experiences with your followers and friends. You can upload photos and videos, add descriptions, tags, and locations so that other users can discover your posts. Share your memories and special moments with the community and stay connected with your friends through your posts!

| Create Post Screen | Create Post Screen | Create Post Screen |

| Create Post Screen | Create Post Screen | Create Post Screen |

| Create Post Screen | Create Post Screen | Create Post Screen |

Engaging Photography Chat 📸: Explore a Conversation on Stunning Captures!

Explore an engaging conversation about photography on PicConnect. Users share their thoughts on stunning imagery, photography tips, and locations for capturing unforgettable moments. Join this inspiring chat about the art of moment-capture.

| Chat Screen | Chat Screen | Chat Screen |

| Chat Screen | Chat Screen | Chat Screen |

Dependencies

Flutter SDK

  • flutter: pub package
  • flutter_localizations: pub package
  • cupertino_icons: pub package

Firebase

  • cloud_firestore: pub package
  • firebase_auth: pub package
  • firebase_core: pub package
  • firebase_storage: pub package

UI

  • flutter_staggered_grid_view: pub package
  • flutter_svg: pub package
  • image_picker: pub package
  • intl: pub package
  • provider: pub package
  • uuid: pub package

State Management & Dependency Injection

  • get_it: pub package
  • equatable: pub package
  • flutter_bloc: pub package

Routing

  • go_router: pub package

Functional Programming

  • dartz: pub package

JSON Serialization

  • json_annotation: pub package
  • freezed_annotation: pub package

Splash Screen

  • flutter_native_splash: pub package

Camera

  • camera: pub package

Image Carousel

  • carousel_slider: pub package

Keyboard Visibility

  • flutter_keyboard_visibility: pub package

Video Player

  • video_player: pub package

Snackbar

  • awesome_snackbar_content: pub package

Loading Spinner

  • flutter_spinkit: pub package

Image Viewer

  • easy_image_viewer: pub package

Image Editing

  • image_editor_plus: pub package

Cached Network Images

  • cached_network_image: pub package

Stories

  • advstory: pub package

Social Sharing

  • share_plus: pub package

Video Player for Chat

  • chewie: pub package

Card Swiper

  • card_swiper: pub package

Camera Awesomeness

  • camerawesome: pub package

Geocoding

  • geocoding: pub package

Geolocation

  • geolocator: pub package

Country Picker

  • country_picker: pub package

Video Thumbnail

  • video_thumbnail: pub package

Path Provider

  • path_provider: pub package

Visibility Detector

  • visibility_detector: [pub package]

Getting Started

To get started with PicConnect, follow these steps:

  1. Clone the repository:
  git clone https://github.com/your-username/pic-connect.git
  1. Install dependencies:
  cd pic-connect
  flutter pub get
  1. Run the app:
  flutter run
  1. Configure Firebase:
  • Create a Firebase project: Firebase Console
  • Add your Android and iOS apps to the Firebase project and download the configuration files (google-services.json and GoogleService-Info.plist).
  • Place the configuration files in the android/app and ios/Runner directories.
  1. Set up your Firebase Realtime Database:
  • Define the database rules to secure your data.
  • Initialize Firebase in your app by following the FlutterFire documentation: FlutterFire

Usage

Once the app is running, you can:

  • Sign up or log in to your account.
  • Explore the feed to see posts from other users.
  • Upload your own photos and videos.
  • Follow and message other users.
  • Like, comment, and save your favorite posts.

Contributing

We welcome contributions from the community! If you'd like to contribute to PicConnect, please follow these steps:

  1. Fork the repository.
  2. Create a new branch for your feature or bug fix.
  3. Make your changes and write tests if necessary.
  4. Ensure your code passes all tests and linting rules.
  5. Commit your changes with clear commit messages.
  6. Push your branch to your forked repository.
  7. Create a pull request to the main branch of the original repository.

License

This project is licensed under the MIT License - see the LICENSE.md file for details.

Visitors Count

Please Share & Star the repository to keep me motivated.

Imagen de Freepik

Iconos diseñados por Freepik from www.flaticon.es'
Imagen de Freepik

Template mockup from https://previewed.app/template/AFC0B4CB