Check out the live site!
Vidyodaya’s mission is to improve the quality of education received by underprivileged children in adivasi communities and to establish a culturally appropriate learning system with active participation of the community.
Our task is to create a website for Vidyodaya that is more appealing and user-friendly for new visitors.
- Modernize the current website
- Make the website more kid-friendly, yet contains tribal elements
- Improve the navigation to various web pages
- Create a login for admins, and allow new admins to be created
- Allow admins to add reports and articles to the site
- Create a contact form
What We Are Building: Front-End
We created an initial design in Figma which you can experience by clicking on the image below.
What We Are Building: Back-End
Below you can see our database table layout for the backend.
How We Built It
The frontend solution for Vidyodaya includes:
- Styled Components
The backend solution for Vidyodaya includes:
- OAuth 2.0
The project for Vidyodaya is hosted on:
- Netlify for the frontend
- Heroku for the database
Challenges We Ran Into
Initially we started out working on the Zuri's Circle project which we thought was a Website project. When we understood that it was supposed to be an Mobile App we looked for solutions to build it with our current skillsets. Ultimately we determined we were not currently up to the challenge of picking up new languages so quickly, and we ended up changing to the Vidyodaya project. This left us with only 4 days to complete the project instead of the original 7 days.
Accomplishments We Are Proud Of
We are extremely proud of our communication skills and quick work, considering how little time we had to pull this together. Our entire team was excellent to work with.
- Christian Bautista - Leader and Design Extraordinaire / Front-End, Design, Client Relations
- Emily Adams - Lady of Documentation / Front-End, Back-End, Database Design
- Marlon Del Rosario - Styling & Form Powerhouse / Front-End
- Harry Henry Gebel - Back End Sorcerer / Back-End
How We Addressed Each Of The Judging Critera:
CSV / FILE UPLOAD-DOWNLOAD
NPOs can easily download information about their volunteers in a CSV format which will be updated by the volunteer form on the website. There currently is no need for any other information to be downloaded, but it would be simple to add.
Our task was to create a website for Vidyodaya that is more appealing and user-friendly for new visitors. Their current website has many buried tabs and it is difficult for users to find what they are looking for. We modernized the current website and made it more kid-friendly, yet containing tribal elements that the NPO requested.
Since we paired down how many pages existed on the site, and improved the navigation to various web pages, this made it easy for both the admins and the visitors to find what they are looking for. In addition we prepared backend documentation for any future programmers working on this website.
We created a secure login for admins using OAuth2, and the ability for new admins to be created. Only Admins have the ability to add and remove files from the site.
The NPO could use this site as their own starting today. The backend is currently deployed with Heroku and the front end is deployed on Netlify. The main features of the site are fully functional. Some features we would still want to add are:
- News Letter sign up
- Chat Feature (to have more active engagement with visitors of the site)
- Visitor Login
- Donor Dashboard (so admins can track their interactions and donations, and send updates to those whom they have helped.)
- Volunteer Dashboard (so volunteers can see progress, future activities, current tasks, and comprehensive detail for their role as a volunteer.)
- For this website to be a progressive web app that will help the NGO manage and interact with people within and outside the organization.
- A form to add Committee members to the committee page
- Password recovery for admins
- A fully mobile responsive website