DEV Community

Medea
Medea

Posted on • Edited on

Creating a GuestBook in Next.js

To develop my Next.js and React skills, I decided to create a GuestBook.
This is what it looks like so far: https://vulcanwm-guestbook.vercel.app


I've learnt how to:

  • use loops in React/JSX
  • use if statements in React
  • connect Next.js to MongoDB
  • make an API in Next.js
  • set/get cookies in Next.js

The features I've added are:

  • seeing all the messages
  • messaging on the guestbook
  • seeing the timestamp of the message
  • censoring all the messages
  • ratelimiting a user so they can only message once an hour

Features to come:

  • Adding OAuth: GitHub/Google/Replit
  • Deleting your own comment
  • Admins for the board so they can delete all comments
  • Ratelimit on username as well as browser

The GitHub repo is here, so contribute to help me on my Next.js journey!

VulcanWM's GuestBook

Welcome to VulcanWM's Guestbook project! This is a simple web application that allows users to sign in and leave messages for VulcanWM.

Any user can view all the messages sent, but users can only leave messages if they have logged in with their GitHub Account.

Deployment

The Guestbook application is deployed using Vercel. You can access the deployed version of the application at VulcanWM's GuestBook.

Technologies Used

The Guestbook application was built using the following technologies:

License

The Guestbook project is licensed under the GNU AFFERO GENERAL PUBLIC LICENSE.




Top comments (8)

Collapse
 
vpgmackan profile image
Mackan

This is actually relly cool. For the rate limit mabey try to rate limit the users ip. Just a suggestion.

Collapse
 
vulcanwm profile image
Medea

this is a great suggestion! either create an issue on the github repo or ill do it tomorrow!

Collapse
 
stcollier profile image
Samuel Collier • Edited

Yeah I was about to say, add a ratelimit; someone mean could super easily copy the fetch request from the dev tools and throw it into a loop in the console to flood that page.

Collapse
 
devvsakib profile image
Sakib Ahmed

++

Collapse
 
swargarajbhowmik profile image
Swargaraj Bhowmik

You can also add a Edit Feature and a feature that can pin messages to top! Also verify the text fields whether they contain NULL values or Not :D

Collapse
 
vulcanwm profile image
Medea

Oh yea I’ll do that, thanks!

Collapse
 
sonicx180 profile image
sonicx180

nice!

Collapse
 
vulcanwm profile image
Medea

thanks!