Live demo
How did you build it ?
I start building this project around the onset of COVID-19 ( circa spring of 2020 ). It was built primarily in the first 4 months where I learned to fit the business logic of the project with Next.js and Tailwind CSS.
I remember myself making React polls for the first time and doing all sorts of CRUD operations with MongoDB/Mongoose.
About authentication, I record hashed passwords in the DB and compare the input password with it. Then my cookies will record the JWT token of the account info once they are signed in.
How did you test your site ? And are there still bugs on your site ?
As far I as know, console logs are the most reliable way to get feedback from Next.js, but I'm curious to know how e2e testing tools like Cypress makes the project better.
ATM there aren't any majors bugs and mostly visual bugs here and there. For example the carousel looks ugly before it loads completely.
The project would be more complete if I have the resource to finish the all the use cases distinct to moderator users.
Why this project is important to you ?
At first I thought about making a clone of Google Trends to deepen my understanding of Tailwind CSS.But I thought it’s merrier to create a rating app where users can upvote things that they think are trendy.
In all seriousness, it’s not personally important to me, but I imagined how entertaining it’d be once the site is fully fledged. Keep in mind that this site is an MVP only.
What are the features that make it unique ? How is it compared to existing products ?
There’s nothing inherently unique about this project, given that I borrowed a huge deal of inspiration from Google Trends, ProductHunt and DEV to some extent.
In detail, I’d say it’s a combination of the leaderboard from Google Trends and upvoting scheme in ProductHunt. I'd say that mods are able to filter out bad poll submissions and trending items just like in DEV.
As for how it really works, the business logic of the app is as follows:
- Anyone can see the trending leaderboard and nomination poll for movies and games for each country but cannot cast votes
- A registered user can cast votes in the leaderboard but cannot cast vote for nomination polls unless they are from the country of the poll.
- A moderator has all the privileges of a normal user, plus the ability to remove inappropriate content from the polls and leaderboards ( still in the works )
What did the project teach you ?
The project taught me a great deal in Next.js, MongoDB and using Postman to test Next.js’ built in APIs.
Not only that, the project gave me ample amounts of time to familiar oneself with the CSS tool that would eventually become an essential styling tool in my portfolio site.