As students, even little discounts at our favorite local restaurants mean a lot. However, there is no means for us to have one membership to gives us access to all the restaurants. Additionally, a lot of restaurants wish to implement a membership scheme but avoid it due to the hassle involved with deploying a streamlined register-verify system. This inspired us to create a portal that allows restaurants/hotels to partner with us and enhance their sales through our big member base.
What it does
Visitt.Us is a comprehensive digital membership service that provides access to exclusive offers, and delightful experiences across partner restaurants and hotels.
The primary purpose of the website is to allow the partners (for instance - the servers in the restaurants) to verify a member's eligibility by scanning their membership QR codes on the fly (instead of going through an excel sheet of information keeping in mind how busy a partner restaurant can be)
Additionally, it allows people to purchase the Visitt.us membership directly from the website instead of going through a tiresome process of making a manual bank transfer and then communicating with us for the activation. Features such as the streamlined checkout system and the nodemailer's automatic mail enhance the user experience to a very great extent.
How we built it
We build the website using nodeJS, HTML, and CSS. The user experience and security have been enhanced through a number of libraries and APIs such as Google Recaptcha, Paypal Checkout System, Passport, ScanThng, etc.
We used the following technologies -
To deploy the website, we used Linode, Google Cloud, and Heroku.
Challenges we ran into
- Considering the fact that 75% of the team was new to Web Development, it was difficult to decide the tech stack that would not only make up a powerful website but also make the learning curve reasonable. We decided to go for nodeJS for the backend and HTML+CSS for the frontend. We used BootStrap to a very great extent to ease up learning.
- Being unaware that paypal-checkout-v2 had already been released, we wasted quite a lot of time trying to implement the deprecated paypal-checkout-v1. Our bad, we are not very good at reading documentation :/ joke's on us
- Deployment to Linode was one of the tasks which ate up quite a good amount of our time. Specifically, the deployment of a nodeJS app to port 80 of the nginx server was what we found really tiresome.
- Having tons of QR Scanner libraries available to choose from, it took us a great deal of time to find what exactly we were looking for (ScanThng).
- The async development had to be done at a very low pace for we really didn't want to kill each other's learning opportunities.
- Pointing the free heroku app to the custom domain snatched away our SSL access. We aimed at implementing CloudFare as the middle man to get us the SSL access for free, but more time eh?
Accomplishments that we're proud of
We really wanted to build a complete package app that could be deployed right away. Consequently, we focussed a lot on security and user experience. A few features that we're really proud of are as follows-
- Paypal Checkout System - Having successfully implemented a sandbox version of the Paypal checkout system, we are happy that our users are going to have a pacifying experience.
- Google Recaptchav2- Not lying, but we had never been fans of filling captchas on websites. However, the satisfaction that comes with being successful in implementing such a confusing API into the application is just immense. It really gives a ready-to-deploy-to-market feel.
- Nodemailer - Adding on to the Paypal checkout, the website sends out a professional email consisting of the order details. (**really adds to the User Experience)
- ScanThng QR Scanner - For us, it had always been abstract as to how do applications really handle the code to recognize and decode a QR code. Turns out, we have the amazing ScanThng API for that.
- Being successful in making the website mobile responsive
- Passport Login Local Strategy - Implementing a secure login/register functionality was one big task.
- Deploying the website to Linode, Heroku, and Google Cloud and also linking the domains.
- Last but not least, we're happy that we were able to build such a great application even during our exam period.
What we learned
- Considering 75% of our team was new to web development, we embarked on our journey of participating in hackathons.
- We saw how much fun and chill the environment at MLH is.
- We got introduced to a lot of powerful technologies and APIs a bit too much for beginners :p
- Not to mention the important process of deploying a website (which is what most people omit) through powerful tools such as Heroku, Linode, and Google Cloud.
- We saw Git works and allows us to version control our app.
- Most importantly, building this app boosted our confidence and encouraged us to continue building irrespective of whether we win or not.
What's next for Visitt.US
There is still a lot that can be implemented into this website-
- Fully automating the addition of a member's details to the database on SignUp instead of manual addition. (was omitted to ensure verification checks)
- Generalize the website to not just restaurants and hotels, but *streaming subscriptions, theatres, etc. *
- Add a more professional feel to the website by adding things like the list of restaurants, terms&conditions, partner benefits, etc.
- Add sessions and cookies to ensure persistent login
- Adding additional stats such as the number of times a particular member has redeemed a coupon at a partner.
See you all in the next hackathon!