WebCite

Introduction

Welcome to WebCite, a convenient and critical tool for research and convenience within academia. One of the most familiar processes for all academics is the insufferable grind of combing through citations. The solution is our website, WebCite (haha!) allows near-instant visualization and organization of the citation network near any scholarly paper.

What it does

WebCite accepts a DOI and an adjustable query limit - there are a few important restrictions:

Recency. The API we utilized to integrate this project does not update information regarding articles more than a decade old (though, frankly, good research keeps its sources recent!)
In order to yield an informational web, it is near-necessary to start with a paper that has a variety of valid citations. Validity necessitates (at least) a working and linked DOI, an author, and a readable title.

Once a valid DOI has been entered, the website produces a dynamic visualization of citations, illustrated through a simple graph. Hovering over a node gives further information about the article, and clicking on a node redirects the user directly to the article. We help academics quickly identify the most relevant work in their field, discover seminal papers, and trace the evolution of ideas through academic literature.

How we built it

WebCite was built utilizing a variety of tools, organized as such:

Backend: in order to integrate a Python-based backend, we utilized Flask, which suited our smaller application and allows for the possible integration of APIs (especially RESTFUL / GScholar API) for future expansions. We also integrated OpenAlex through the PyAlex, a Python library and wrapper. Finally, we utilized NetworkX for complex graph integration as well as ease of algorithm implementation - see below!

Frontend: the frontend was integrated utilizing React.js and Vite.

Misc.: Both the front & the backend of the website is hosted on Render. One of the most significant parts of this project was creating our network algorithm, which creates a dynamic reference-expansion limit based on a mathematical formula in order to ensure a balanced citation web.

Github: Linked.

Challenges we ran into

Due to this being our first time(!) ever completing a full web-dev project, we had to do a significant amount of research into both the backend/frontend as well as hosting. Despite originally utilizing Heroku & Netlify, our frontend hosting expereinced significant wait times as well as domain-name hijinx, causing us to opt for Render.

Writing the code for retrieving the required information from the OpenAlex API presented numerous challenges - the API returns a list of dictionaries, which we eventually decided to distill into an object for easy graph-oriented visualization (CS10 mention!). We had to develop robust error handling to account for rate limiting, network issues, and cases where papers had incomplete metadata.

Accomplishments that we're proud of

There were a lot of complexities in web-dev that we didn't expect! Difficult tasks that we accomplished included: the graph-network algorithm, frontend aesthetics, correctly wrapping & processing an API, and more!

What we learned

Introduction to full-stack (generally!), the value of using separate services for frontend & backend, deployment platforms, the importance of usability when thinking about the connections between backend and frontend, API integration, and the complexities of making API requests in the context of full-stack development.

What's next for WebCite

The biggest hurdle for the WebCite going forward is utilizing a better API / library than OpenAlex, which runs into issues with both recency and deciphering non-scholarly sources (books, literature citations, and fiction). Some options for that would be the Google Scholar API, perhaps supplemented by the Microsoft Academic Graph.

After greater functionality is achieved, WebCite would certainly benefit from a more diverse set of features. One of the most important goals is to expand its functionality to create a bidirectional graph, allowing visualization of both papers that cite the query as well as papers that the query cites. Further features would include: the ability to bookmark & store articles of interest, aesthetic fine-tuning, and grouping based off of topic and relevancy.