DEV Community

Cover image for Fint: When Finance Meets Fun
Ishaan
Ishaan

Posted on

Fint: When Finance Meets Fun

Project_Name:- Fint

Team Details

Description of Project

Fint is a gamified financial education platform designed to make learning about the stock market, fixed deposits, mutual funds, and other financial instruments entertaining and engaging. Users can embark on real-life-based challenges, learning valuable financial skills while having fun along the way.

Home Page

Learning Path

comic challenge

scenario gif
Leaderboard gif

Submission Track:

  • Open Innovation
  • Sustainability

Overview of My Submission

Our submission for the Dev.to hackathon is Fint a platform that combines financial education with gamification. Users can explore various aspects of personal finance through interactive challenges, quizzes, and simulations. We built the platform with the aim of making financial literacy accessible and enjoyable for users of all ages.

Code of our Learning Path

Tech Stack

  • Frontend: Next.js
  • Backend: Node.js and Next.js
  • Database: MongoDB
  • Authentication: Firebase Authentication
  • Hosting: Vercel

We chose Next.js for the frontend due to its component-based architecture and ease of use in building interactive user interfaces. For the backend, we opted for Node.js and Next.js for their simplicity and scalability. MongoDB was selected as our database solution for its flexibility and compatibility with Node.js. Firebase Authentication helped us implement secure user authentication quickly, while Vercel provided seamless deployment and hosting.


Few Code Snippets:

  const signInWithGoogle = async () => {
    const auth = getAuth(app);
    const provider = new GoogleAuthProvider();
    try {
      await signInWithPopup(auth, provider);
      router.push(`/Path/${user.displayName}`);
    } catch (error) {
      console.error("error signing in with google: ", error.message);
    }
Enter fullscreen mode Exit fullscreen mode
const { default: mongoose } = require("mongoose");


const usersModel= new mongoose.Schema({ 
    score:int,
    userName:String
});

export const usersSchema= mongoose.models.users
|| mongoose.model("users",usersModel);
Enter fullscreen mode Exit fullscreen mode

Challenges We Faced

One of the main challenges we faced during development was integrating real-time stock market data into our platform. We overcame this challenge by leveraging third-party APIs and implementing caching mechanisms to ensure smooth performance and minimize API calls.

Another challenge was designing an intuitive user interface that balanced educational content with gamified elements. We wanted our website to be more of Gamified than just theory-theory stuff so users don't get bored. We conducted extensive user testing and iteratively refined the interface based on feedback to create a seamless user experience.

Public Code Repo

GitHub Repo

Our Websites Link

fint

Demo Link

Demo Video

Additional Resources / Info

For best use of our website use your Laptop or Desktop on Dark mode!
Stay tuned for updates and additional features coming soon to Fint: When Finance Meets Fun!

Top comments (2)

Collapse
 
10xlearner profile image
10x learner

Really interesting project ! @ishaankkr @subby575

I am wondering, how did you got such knowledge on Finance ?

Collapse
 
ishaankkr profile image
Ishaan

Thanks man!