Women Bandari

• 

  This is the hero section of the homepage. First thing you see when you open up the website.

• 

  This is the services section services page

• 

  This is the welcome section of the homepage

• 

  This is the stories section of the homepage

• 

  This is the login page if you already have an account

• 

  This is the register page if you don't have an account.

• 

  This is the dashboard of the instructor when the authentication is successful.

• 

  This is the resources page of the instructor where she uploads the pdf resources for the students or mentees.

• 

  This is the resources page of the instructor where she uploads the video resources for the students or mentees.

• 

  This is the video resource on the resources page when played.

• 

  This is the progress page of the instructor whereby she uploads the progress of student or mentee.

• 

  This is the budget planner section with Gemini insights integrated into it.

• 

  This is the Leadership practice section for the student or mentee to practice leadership skills taught.

• 

  This is the chatbot Gemini Api integrated into the Api for the personalized learning and interaction with the student

• 

  This the contact page for instructor or student to reach out .

Our Journey in Building Women Bandari

Inspiration

The inspiration for this project came from our deep commitment to promoting women's economic equality and leadership. We wanted to create a digital space where women could access essential tools, resources, and mentorship opportunities that support financial independence and personal growth. Witnessing the challenges many women face in accessing these resources, we were driven to create a platform that would empower them to take control of their financial futures and thrive as leaders.

What We Learned

Throughout this journey, we gained invaluable insights and skills:

• UI/UX Design: We learned how to design an engaging, user-friendly interface tailored to the needs of our target audience. This involved researching design principles that would make the platform intuitive and accessible.
• React Development: Building the project in React deepened our understanding of component-based design, state management, and routing. We also learned how to integrate complex features, like interactive financial tools and a chatbot, to enhance user experience.
• Integration of APIs and Machine Learning: We explored how APIs and machine learning could personalize content and support tailored experiences, providing users with more relevant resources based on their engagement.
• Using MongoDB as a Database: Implementing MongoDB as the database for this project helped us gain a solid understanding of NoSQL databases and how to manage data in a non-relational structure. This experience strengthened our skills in handling user data efficiently, managing collections, and performing CRUD operations to store and retrieve user data for personalized experiences.
• Integrating the Gemini API: We integrated the Gemini API, which enhanced the platform by allowing more intelligent and responsive features, such as interactive chat and customized user suggestions. Working with this API taught us how to manage API authentication, optimize API requests for performance, and use Gemini’s capabilities to deliver conversational, context-aware interactions.

Building the Project

We started with the following steps:

1. Project Planning: We outlined the main features needed to support women's economic equality and leadership, including tools for financial management, access to resources, and a mentorship hub.
2. Frontend Development: Using React, we built each page component, ensuring a cohesive, responsive design. Some notable features included:
   • Budget Planner and Investment Calculator: To help users manage their finances, we implemented financial tools that visualize budgeting and savings growth.
   • Educational Resources: We curated articles and videos that covered topics such as financial literacy, leadership, and mental health.
   • Chatbot Integration: We used a chatbot feature (powered by Gemini) to answer user questions and provide guidance, creating an interactive and supportive experience.
   • Leadership Practice Skills Section: This section is designed to help users strengthen their leadership skills through practical exercises and challenges. It includes scenarios and tasks to practice communication, decision-making, and team management, allowing users to track their growth in real-time.
3. Backend Development: We developed a backend with RESTful APIs to manage user data, progress tracking, and content updates.
4. Testing and User Feedback: After building the core features, we conducted testing to ensure the platform was intuitive and responsive. Feedback from potential users helped refine the experience and prioritize features.

Challenges Faced

Building this project came with several challenges:

• Balancing Complexity with Usability: We needed to include powerful tools without overwhelming users. This meant making deliberate design choices to keep the interface simple and accessible.
• Data Management and Privacy: Since user data, including progress tracking and personalized resources, was central to the platform, we worked carefully on data handling to ensure privacy and security.
• Learning Curve with Machine Learning and APIs: Integrating machine learning and API functionality for personalized content took extra research and time, but it was ultimately rewarding to see how it enhanced user engagement.

Final Thoughts

Creating this platform has been a transformative experience. Not only have we built technical skills in React, APIs, and UI/UX design, but we’ve also gained a stronger appreciation for the importance of accessible resources and support networks for women. Our hope is that this project will be a valuable tool for women seeking to develop their economic independence and leadership skills.

Built With

• express.js
• figma
• gemini
• github
• jsx
• mongodb
• node.js
• react