Nexus

Home Page
File Upload
Connecting Path from Previous Knowledge
Knowledge Network
Timeline
Occurences
Ask AI about a Topic

Inspiration

We noticed that students often revisit complex concepts like “Fourier Transform” or “Eigenvalues” across multiple courses — but never realize how those ideas connect or evolve over time. Traditional note apps treat knowledge as isolated chunks. We wanted to change that by creating a living knowledge graph that shows how concepts interlink across lectures, notes, and subjects.

What it does

Nexus helps students (especially in STEM) visualize how their understanding of topics grows and connects over time.

Automatically identifies recurring concepts across different courses or notes.

Builds an interactive 3D knowledge graph showing relationships between topics.

Tracks when and where each concept first appeared — creating a personal learning timeline.

Highlights cross-disciplinary connections (like how Linear Algebra shows up in Machine Learning or Physics).

In short, Nexus helps you see your own learning as a network, not a notebook.

How we built it

Frontend: React + TypeScript + Three.js for the 3D visualization, styled with Tailwind CSS.

Backend: Node.js + Express server for secure API calls and note processing.

AI Layer: Google Gemini API to extract, summarize, and link related concepts from user-provided notes.

Database: Used SQLite to store user data and concept graphs.

Integration: The frontend fetches structured concept data via REST API, which the backend generates dynamically from user input.

Challenges we ran into

Integrating React Three Fiber with React Router while maintaining smooth 3D graph performance and state management.

Handling CORS and API security when sending data between the frontend, Express backend, and Gemini API.

Getting Gemini to output consistent, readable concept relationships and summaries from diverse student notes.

Balancing the density of the 3D knowledge graph — too many links made it overwhelming, too few made it meaningless.

Debugging graph layouts and ensuring stable performance even on lower-end devices.

Accomplishments that we're proud of

Built a fully functional AI-powered knowledge graph that identifies and connects related concepts across courses.

Designed a Personal Learning Timeline to visualize when and how each idea first appeared and evolved in a student’s notes.

Achieved real-time visualization updates as new notes are added, showing concept growth dynamically.

Created a clean, professional UI/UX that merges academic design with modern interactivity.

Successfully deployed a secure backend pipeline to handle Gemini’s generative output without exposing API keys.

What we learned

How to bridge front-end and back-end systems seamlessly — integrating React, Node.js, and AI APIs to communicate securely and efficiently.

Building interactive 3D visualizations using React Three Fiber and optimizing them for performance.

Managing generative AI outputs in real-time, from prompt tuning to response rendering.

The importance of team collaboration across multiple stacks, merging design, data visualization, and AI processing into a single cohesive experience.

Most importantly, how visualization can transform raw data (or notes) into meaningful insight — turning disconnected learning moments into a story of progress.