Skip to content

markohanesian/ReactSocial

Repository files navigation

ReactSocial

ReactSocial preview image

Links

Description

A social media app featuring the ability to post text and images, and comment on user posts

Instructions

Sign into the website with your Google account, and post a message and photo - think of it like a virtual social group where you can share your interests and recent life moments. If you're not happy with your post, you can delete it. Whatever you post, I'll be sure to leave a comment.

About

I developed ReactSocial as a custom social media platform to interact with friends and family by sharing images and posting about various topics for fun. The application is built using React for the frontend, with Firebase handling the backend, including authentication, Firestore for the database, and hosting. Material-UI is used extensively to ensure a modern and accessible UI/UX.

Process

Building ReactSocial involved several major steps. Initially, I set up the React frontend and integrated Firebase for authentication and database management. Upgrading Firebase required significant refactoring to align with the new APIs and features. Integrating Material-UI was another key step, which involved reworking the styling approach to leverage its theming and component library effectively. Additionally, ensuring seamless and secure user interactions required troubleshooting complex user state and authentication flows.

Built With

  • React
  • Firebase
  • React-Router
  • Material-Ui

Features + Issues

🚀 = New ✅ = fixed 🚧 = in progress

  • User posts page items now have thumbnail preview 🚀
  • Posts can't be made unless with a picture ✅
  • Posts can't be made with line breaks ✅
  • Comments not working ✅
  • User posts page links to entire post ✅
  • Delete your own posts! ✅
  • Persistant auth state so users stay signed in on page refresh ✅
  • Create post styled to be more visible and user-friendly ✅
  • Create post button disabled when no user text to clarify UX ✅
  • Update feed UI to be mobile responsive ✅
  • Material-UI library redesign ✅
  • Expand on project in about section✅

Authors

Acknowledgments

License

badmath GitHub release Maintenance