Inspiration

My goal was to build a simple web application with a database on the backend that I could deploy live onto the internet. I hoped to delve into the world of web development, since I am currently working on another (more complex) project at school where I take a frontend role. This little project would allow me to see the full picture. I also wanted to revisit the use of databases (I had done some SQL out of personal interest in a past summer).

What it does

Each page on NoteFly holds a list, such as a shopping list that one might find in a notepad. You can create a fresh list by appending a title to the end of the URL, which you can share, and anyone with the link can modify it (the familiar CRUD database operations are apparent, since users can add to the list and delete it). The lists are saved automatically as soon as you add or delete something.

How I built it

I used Javascript/EJS to build the frontend of the website. To ensure that the information entered by the users does not disappear when a server (perhaps my own computer) restarts, I connected my website to MongoDB Atlas (for storing the ever-changing data in the lists) as well as to Heroku (so that the website is live everywhere, not just on my own localhost:3000 port). Styling was done with a separate CSS file, a friendly cursive font from Google Fonts, a palette from ColorHunt and a "+" symbol from FontAwesome.

Challenges I ran into

It was a bit tricky setting up Mongo at first, since it seems like on newer versions we use the "mongo" command rather than "mongod" to enter the shell.

Accomplishments that I'm proud of

This is the first website I have deployed with a backend database with Mongo and Heroku, and while the website is not particularly complex, it is nice to have done some full-stack work.

What I learned

I learned about using MongoDB and Mongoose. Though I learned how to use these technologies this weekend (I had done virtually no backend stuff before this hackathon), Mongo wasn't too bad because I have some prior familiarity with MySQL.

What's next for NoteFly

It would be quite nice to take the idea and send it in a few possible different directions. You could take the lists and have them accessed via authentication, so that one can keep their lists private if they so wish. Alternatively, one could make a React.js component with much of the same list-making functionality.

Share this project:

Updates

Submission history