Inspiration

Our grouped wanted to make a social media app that was centric on building your own "website page." Many Social media applications lose sight on the "real" connections that can be made with just a follow and a like; PetrPages solves this issue by prioritizing connections with users from the schools in the communities that are put on their page through tags. Additionally, we wanted to make a social media application that allows full customization of the page that they decide to create, making it as wacky or as professional as they would like.

What it does

PetrPages is a social media application that enables users to create a completely personalized web page catered to them. Users can customize their pages with GIFS, memes, text boxes, to-do-lists, and headers to fully encapsulate their shining personality. To connect other users with similar interests, users can add "tags" to their page allowing for others who search those tags to see them. Moreover, search results are given to the user based on their tag and their school so users can foster a stronger connection in their community, a reason PetrPages was developed in the first place.

How we built it

The PetrPages frontend was build using the react library, editor.js, and chakraUI templates. The backend of the application was built on python using the sqlite3 library. We used the melissa email validation API to check for valid emails on account creation. Communication between the frontend and the backend was developed using the FastAPI library to develop the endpoints.

Challenges we ran into

We ran into many challenges with the frontend. In order to maximize the customization, our team ran into many bugs and glitches that would need to be resolved. Saving the page was also a challenge as saving information on the page would cause the page to reload with duplicates or put in the wrong location. Communication between the frontend and the backend was a challenge as the items being sent would be hard to keep track of leading to bugs.

Accomplishments that we're proud of

We were able to achieve the page saves and the ability to fully customize the page with GIFS/Images, bio, tags, and lists. We were also able to achieve a database that is able to store and search other profiles with certain tags that are in the search.

What we learned

The team gained a deeper understanding and comprehension of the react, chakraUI, and editor.js interface on the frontend of the project. Moreover, the team also gained valuable experience with APIs and setting up endpoints with the fastAPI library.

What's next for PetrPage

Add more customizability operation such as changing the font color and style in text as well as adding profile pictures would be in the next iteration of the project. Making a more colorful and lively interface since the interface, while clean, still seems very monotone.

Built With

Share this project:

Updates