Inspiration
We came into Hack on the Hill with this static webpage that could already append user input atop a list of other comments. The problem was that it was purely static, and the comments would not persist after refreshing the page. We wanted to go further, challenge ourselves, learn new technologies, and transform our existing page into a dynamic project that could store data into a database and pull from it when needed.
What it does
Users can demo our project and submit comments. These comments are inserted into a database of other comments, which are also displayed on the webpage. Users can also click on the comments already on the page in order to remove them from both the database and the page.
How we built it
We wanted to build this project purely out of the JS stack, particularly MongoDB, Express, and Node. We started off by converting our static webpage into an express application and made sure the express server properly served our static files. Moving forward, we set up a Mongo database and created the proper Express API in order to interact with it. After countless tests with Postman, we finally grew confident with our requests and moved onto connecting the front end to the middle ware. We eventually figured out how to use AJAX to send HTTP requests to Express, and from there, our whole project pretty much came together. The rest was jus working out kinks and making sure user actions triggered the correct response from out app.
Accomplishments that we're proud of
For all of us, it was our first hackathon ever, and there couldn't be a better feeling than accomplishing everything that we came here to do. We set reasonable goals including the technologies we wanted to learn and the functionalities we wanted to append onto our project. We completed all of those goals.
What we learned
For Jordan and Jeffrey, it was there first time building a full JS stack application that included a backend database like MongoDB. For Grand, it was his first venture into web development ever. He went all the way from vanilla HTML, CSS, JS all the way to creating a full stack application.
Log in or sign up for Devpost to join the conversation.