SkillSwap

• 

  User dashboard, shows some analytics and user stats.

• 

  Landing page

• 

  Matches page, gives a 'match rating' based on AI personality and skills analysis.

• 

  Profile edit page, add/remove skills, with a short personality 'quiz'

• 

  Live chat using talk.js with users you've matched with.

• 

  Legacy graph, shows the connections you've made, and their connections. Shows how far your knowledge goes.

Inspiration

• We wanted to make it easier for people to share knowledge and leave behind their skills; a modern take on communal exchange.
  
• SkillSwap turns learning into a fun, gamified experience where you meet new people, mentors, and peers who share your curiosity.
  -“Knowledge is power.” - Francis Bacon
• At SkillSwap, we believe your legacy is the knowledge you leave behind.

What it does

• SkillSwap is a reciprocal bartering platform where learning and teaching go hand in hand.
  
• Trade skills - teach what you know, learn what you don’t.
  
• Example: I can teach Algebra and want to learn piano → matched with someone who can teach piano and wants to learn Algebra.
  
• Matches show a compatibility score (e.g. 87%) for the best fit.
  
• Each user has a Skill Exchange HQ to:
  
  • Schedule sessions
    
  • Track progress and highlights
    
  • View recent matches
    
  • Chat naturally with learners and teachers
    
• It’s not transactional; it’s genuine, human, and dynamic.
  

How we built it

• React for a smooth, responsive frontend
  
• JavaScript and Node.js + Express for backend logic
  
• Supabase and PostgreSQL for database management
  
• Gemini API for AI-powered reciprocal matching
  
• Tailwind CSS for sleek, consistent styling
  
• ForceGraph2D for the interactive “legacy graph”
  
• TalkJS for real-time chat functionality
  
• Built and optimized with Vite
  

Challenges we ran into

• Getting the Gemini algorithm to work seamlessly with the search and matching features
  
• Error handling and managing occasional API bugs
  
• Supabase setup issues, especially with real-time updates
  
• Version mismatches between Gemini API calls
  
• Complexities in the graph algorithm for skill mapping
  
• And, of course, the classic merge conflicts
  

Accomplishments that we're proud of

• The legacy graph turned out amazing: dynamic, interactive, and meaningful
  
• The frontend design feels smooth, modern, and cohesive
  
• Achieved a functional Gemini-based matching algorithm for reciprocal skill pairing
  
• Created a Skill Exchange HQ layout that’s intuitive and easy to navigate
  
• Consistent, unique color scheme and interface that stands out
  

What we learned

• New team members picked up a lot of Git and collaboration fundamentals
  
• Learned to build in React and style efficiently with Tailwind
  
• Realized development isn’t always streamlined, debugging is part of the journey :)
• Understood the logic behind backend matching systems
  
• Practiced MVP scoping: focusing on what really matters for a solid prototype
  
• Explored AI-powered matching using Gemini
  
• Gained experience in API integration and database structuring for real users
  

What's next for SkillSwap

• User retention features: analytics and deeper gamification to keep people engaged
  
• AI-assisted learning: dynamic lesson plans and support while maintaining human mentorship
  
• Improve legacy graph efficiency for larger user bases
  
• Add visual analytics to track progress and knowledge sharing
  
• Begin mobile app development : mobile-friendly now, but dedicated apps for accessibility and notifications are next
  

Built With

• express.js
• forcegraph2d
• gemini-api
• javascript
• node.js
• postgresql
• react
• supabase
• tailwind
• talkjs