Penn Resources

Inspiration

Our website, Penn Resources, is designed to share supplemental learning resources that former and current students found helpful to their learning. The inspiration for our website came from MCITCentral, which is a website where students can post reviews of their experiences in completed courses. Many students in MCIT often share supplemental material through slack, but these resources can get buried in the chats. Our team created a MCIT-specific hub of study materials for students. We believe this tool can be valuable for those who want to reinforce content taught in lecture.

What it does

Penn Resources is a student-driven website for sharing study resources among the MCIT community. By student-driven, we mean that students can post supplemental learning material with a title, URL, and brief description of its usefulness for specific courses and modules. For example, student A comes across an article explaining the differences between an ArrayList and Linked List and decides to share it in hopes of helping their peers. Anyone with internet connection can search the website for such resources to illuminate a concept or topic covered in the course lectures. The post’s author can also edit (and delete) their posts in case they made a mistake in their original post. Lastly, students are allowed to upvote posts that were particularly helpful, thereby helping site visitors identify popular resources quickly. The site is also responsive so that students can use the site on their phone.

How we built it

We used React as our JavaScript framework to build our app. We also used RSuite JS for our component library. As for the backend, we use Firebase, a backend infrastructure service provided by Google, to store the resources shared by students and authenticate users’ identity as SEAS students via Google Sign-In.

Challenges we ran into

We ran into several design and technical challenges. To start, only one of us has prior experience with the tools used to build our website. Most of the group had to read online articles and watch YouTube tutorials to even begin writing simple lines of code in our project. Once we learned the fundamentals, we encountered the challenge of integrating Firebase functionalities, such as adding resource data, updating data, and querying data, into our site. This involved reading documentation and example code provided by Firebase. As we developed the website further, we encountered more design challenges. A particularly challenging feature was the upvote button. We needed a way to distinguish every user from each other, verify which user upvoted a resource, and update the collection of users who currently upvotes a resource. Selecting a proper data structure and implementing it in an unfamiliar language was difficult, Nevertheless, we managed to overcome these challenges in the end.

Accomplishments that we're proud of

One of the accomplishments we’re proud of is successful integration of Firebase as our backend infrastructure. None of us had experience with using it before this project, and we learned a lot about how to properly include Firebase features into our website.

What we learned

We definitely learned quite a bit from this experience. We learned the basics of HTML, CSS Javascript, and React JS for frontend development and the fundamentals of initializing a remote database and authenticator for backend setup. By building a fullstack app in a group, we improved our ability to read other people’s code and add layers of abstraction to it.

What's next for Penn Resources

This project can take on multiple directions from here on out. We could add more features, such as sorting resources by number of upvotes and allowing users to add comments about a resource. We can also focus on addressing performance issues, such as caching data locally to speed up runtime efficiency. Depending on how widely used Penn Resources will become, more features may be in store.