Coder Social home page Coder Social logo

anaam's Introduction

Anaam Social Media App by Sourav is a cutting-edge platform developed using Flutter and Firebase. It offers users a seamless and intuitive social networking experience, allowing them to connect, share, and interact effortlessly. With a user-friendly interface, Anaam enables posting multimedia content, following friends, and discovering trending topics. Powered by Firebase, the app ensures real-time updates, secure authentication, and reliable cloud storage.



Login/Auth Pages:


auth  pages

1. **Sign Up:**
When a new user opens the Anaam app for the first time, they are presented with a signup screen. The signup process typically involves the following steps:
- User enters their email address and creates a strong password.
- The app validates the email format and checks if the email is not already registered in the system.
- If the email is valid and unique, the user's credentials (email and password) are securely stored in Firebase Authentication.
- After successful signup, the user is redirected to their profile page or asked to complete their profile details.

2. **Login:**
Once a user has signed up and wants to log in to the app, they are taken to the login screen. The login process involves the following steps:
- User enters their registered email address and password.
- The app securely sends this information to Firebase Authentication for verification.
- Firebase compares the provided credentials with the stored ones and validates whether they match.
- If the login credentials are correct, the user is granted access to their account, and they are redirected to their home feed or personalized dashboard.

3. **Forgot Password:**
In case a user forgets their password and can't log in, the "Forgot Password" feature comes to the rescue. The steps are as follows:
- On the login screen, there is an option/link to "Forgot Password."
- When the user clicks on this option, they are taken to a password reset screen.
- Here, the user is prompted to enter their registered email address.
- After the user submits their email, Firebase sends a password reset email to that address.
- The email contains a password reset link with a unique token.
- Clicking on the link redirects the user to a secure page within the app, allowing them to set a new password.
- Once the new password is set and submitted, Firebase updates the user's password accordingly, and they can log in using the new credentials.



Post Feed/Add Post/Like Post Pages:



home pages


1. **Post Feed:**
The Post Feed is a central part of the Anaam app, where users can view and interact with posts from other users they follow. The Post Feed typically functions as follows:
- Upon logging in, users are directed to their personalized Post Feed, where they see a chronological list of posts from users they follow.
- Each post in the feed displays relevant information, such as the author's name, profile picture, timestamp, and the content of the post (text, image, video, etc.).
- Users can scroll through the feed to view older posts, and new posts automatically appear at the top of the feed as they are added by other users.
- The Post Feed fosters engagement and social interaction by allowing users to like and comment on posts directly from the feed.

2. **Add Post:**

The Add Post feature empowers users to create and share their own content with their followers. The process of adding a post typically involves the following steps:
- Users access the "Add Post" screen by clicking on a dedicated button, usually located in the app's navigation bar or menu.
- In the "Add Post" screen, users can compose their post by entering text, attaching images, videos, or any other multimedia content they want to share.
- After composing the post, users can choose to add relevant hashtags or tags to make their post more discoverable to others interested in similar topics.
- Once the user is satisfied with the content and details of the post, they can click the "Post" button to publish it on their profile and make it visible in their followers' Post Feeds.

3. **Like:**

The Like feature allows users to show appreciation and support for posts they find interesting or enjoyable. Here's how liking a post typically works:
- Within the Post Feed, each post is accompanied by a "Like" button (often represented by a heart icon).
- When a user comes across a post they want to like, they can tap the "Like" button associated with that specific post.
- The app then sends a request to the server, updating the post's like count and associating the user's account with the liked post.
- The heart icon may change color (e.g., from empty to filled) to indicate that the post has been liked successfully.
- Users can like as many posts as they want, and the like count of each post is visible to all users who can view the post.


Comments Page:



comment page

- On the Comment Page of a post, users can leave their thoughts and opinions by typing their comment in a text input box.
- After composing their comment, users can click the "Post" button to submit it.
- Once posted, the comment becomes visible to all users who can access the Comment Page.
- Users can also like and reply to comments left by others, fostering interactions and discussions on the post.



Follow/Unfollow System


follow unfolllow


- **Follow:**

When a user follows another user, they opt to receive updates and content from that user in their feed. By following someone, their posts and activities become visible in the follower's Post Feed, allowing them to stay up-to-date with the followed user's updates.

- **Unfollow:**

If a user no longer wishes to see content from someone they previously followed, they can choose to unfollow them. Unfollowing a user removes their posts and activities from the follower's Post Feed, providing a more personalized feed experience.



Chat System With Notifications


chat psages


1. **Chat System:**
- The Chat System allows users to have real-time conversations with other users one-on-one or in groups.
- Users can access their chats through a dedicated "Messages" section or a chat icon in the app's interface.

2. **Sending Messages:**

- Users can select a recipient or a group of recipients from their contacts or followers to start a chat.
- They can type their message in a text input box and click the "Send" button to deliver the message.

3. **Receiving Notifications:**
- When a user receives a new message in a chat, the app sends a notification to their device.
- Notifications alert the user about the incoming message, even when the app is not actively open.

4. **Chat Updates:**

- The chat interface updates in real-time, showing new messages as they arrive.
- New messages typically appear at the bottom of the chat, and the chat window automatically scrolls to display them.




View Code




Technologies I Used:

  • Flutter
  • Firebase
  • Firebase Firestore
  • Firebase Storage
  • Firebase auth (email,password)
  • Firebase Push Notification



anaam's People

Contributors

codexsourav avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.