As university students, we used to socialize A LOT. Our friend group would have class, then go to the school bar several times a week, and on the weekend hang out and party together some more. For us, having to be apart due to social distancing made a huge impact. We wanted a way for our friends to easily share old memories that would never make it on to facebook or instagram. We wanted a social platform with no pressure and no judgement. A place where you can post nostalgic images of the events you attended together and just have a good time.

What it does

Users can make an account and log in, create a group, and anyone within that group can add pictures. Users can leave a group, invite other users to join the group, accept invites, view the list of group members, add pictures with a caption, view the pictures in a larger format, and add comments. We registered with and we will host this for our friends.

How we built it

Using Laragon as a developing environment with postgresql, we made a webapp using Laravel with php on the backend and react with javascript on the frontend. We used a bunch of react components with bootstrap, such as the navbar and the content cards. On the backend we used api.php and api.js to take care of all the routing and the database queries.

Challenges we ran into

Setting up the Laragon dev environment took hours! The installation and configuration was different from computer to computer just enough to cause us a few troubles early on. Learning react on the fly and working with php were also fairly new to us as a team. Things like not getting proper error messages and spending hours on a 2-second bug fix that was just missing the .bind() method was the worst! Struggling with placing buttons and how to deal with the react components was another nightmare that we dealt with.

Accomplishments that we are proud of

Being able to use the software almost perfectly! We hit our main targets: uploading images, viewing them, making users and groups. Battling and winning against CSS and also keeping a neat backend that makes sense. Participating in the hackathon challenges such as the #MyOctocat challenge and the Air force security challenge were also great accomplishments and lots of fun.

What we learned

React is difficult to work with sometimes, and is not very clear about errors its encounters. Using the inspect element was very helpful and saved us a lot of time. We also learned about domain hosting and more about CSS than we ever wanted to.

What's next for Scrappy

The next phase of Scrappy is implementing anonymous groups, the ability to remove posts, add a flag/report button for removing inappropriate content and adding tags to images so that we can filter by event. Besides the little stuff, we really do plan to host this for our friend group. There are so many pictures we never got to see, and we want those memories!

Share this project: