kindly

Kindling Kindness

Comment

Inspiration

The epidemic wrecked chaos but it did teach us kindness and a very important lesson - We are stronger together. We all observed how individuals banded together to help family, neighbors, and even strangers. We saw communities come together to support people, whether it was with oxygen cylinders or information about beds or daily necessities. All of this was accomplished primarily through social media posts and tales. Nonetheless, many people were unable to send or receive information. Because there is no shared platform. So we came up with kindly. The web application serves as a forum for people to request assistance and for volunteers to locate persons in need of assistance. The experience is made more encouraging and exciting by the use of 'Zen points,' which not only help you achieve inner peace, but also allow you to buy coupons or give to organizations. This app is crucial and necessary to establish the 'volunteering inertia'. It will not only provide information, but will also help to make volunteering a habit with its user-friendly interface and compelling rewards.

What it does

There are three main components which make the core of the idea:

  • Request for volunteer
  • Volunteer for people
  • Get Reward (Zen Points) in exchange of helping others

Some features of the website include:

  • The app allows users to login or register. When users assist others, they receive Zen points. To begin, each user is granted 10 Zen points.
  • When users require assistance, they can place pins on maps and establish events. The points associated with a specific event are calculated automatically. These markers are also customized based on the type of activity :)
  • A volunteer can view the activities on a map or as a list. (Note: The user cannot see the events that they have created.)
  • A volunteer can filter events based on their nature or duration. Events can also be filtered on the basis of the vicinity of the event. Simply enter a distance and only events within that radius will be displayed.
  • The user can click on the marker to see more information about the event, such as the type, information of the requester, and location.
  • Route button redirects to the location on google map.
  • The Volunteer button takes you to a page with more information, including navigation instructions, distance, time required to reach the destination, and a map polyline outlining the path. The respective is then removed from the event list visible to the other users.
  • Volunteering for any event allows the user to gain Zen points that correspond to the task. These points, down the road, can be used to earn coupons or make donations.
  • Whenever a user volunteers, the requester is notified by email.
  • On the profile page, the users can see their
    • Current score,
    • The status of their requests - Pending or Fulfilled
    • Information about the people they've helped
    • A redeeming section to claim rewards

How we built it

For the backend, we used Node.js and Express.js. MongoDB served as our database. For the frontend, we used HTML, CSS, and Javascript. Bootstrap, Leaflet.js, and Axios.js were used for styling, map components, and transferring requests from client to server, respectively. Passport assisted us in incorporating authentication into our app. To establish authorization, the middleware function was utilized. Sweetalert.js assisted us in adding interactive notifications. Smtp.js was used to send emails to users indicating a Volunteer's acceptance of a request.

Challenges we ran into

We encountered difficulties retrieving data and then filtering it for presentation while creating filters. We started with server-side, however it slowed down queries and made the app slow. As a result, we migrated to client-side processing. Another problem was sending data from the server to the client. We learned more about ejs and how to destroy objects. We were initially unaware and unable to use MongoDB's populate function.

Accomplishments that we're proud of

We are quite happy to have created an application that can truly assist people. We are delighted to work with a variety of technologies, both frontend and backend. It was fascinating to explore libraries and study documentation, particularly for leaflet.js, which we have extensively used. Another challenge was to remove the leaflet marker from the map that was clicked on by the user to avoid redundant events being shown on the map.

What we learned

In MongoDB, we learned about Query Population. This API function relieved us of the burden of updating in various places to maintain consistency. We learned a lot about delivering data from client to server and vice versa, as well as the various methods available. It was great to experiment with and learn about leaflet.js, as well as to integrate it. Also, we initially planned to use Heroku for deployment. But faced issues related to credit card addition on the platform. So, we switched to Render and found it to be an amazing option for deployment.

(P.S - Since, we have used free tier plan in Render for deployment, the loading might be a little slow. Please bear with us.)

What's next for kindly

  • Zen points can be converted into unique 'Zen' cryptocurrency, to turn the app into a decentralized network and make transactions more reliable.
  • Add notifications for others around in the event of an emergency.
  • Work with local NGOs to expand the app's reach and support.
  • Implement background checks for anyone that registers on the app.
Share this project:

Updates