Studythat ( ExpressJS version of Markednotes)


This web app allows users to create study notes using markdown


https://firebasestorage.googleapis.com/v0/b/alonzoaustin-8314b.appspot.com/o/studythat%2Fcardpage.jpeg?alt=media&token=2bc4484e-8670-425e-9647-b160a069c052https://firebasestorage.googleapis.com/v0/b/alonzoaustin-8314b.appspot.com/o/studythat%2Fcreationpage.gif?alt=media&token=37affa5c-dd48-4e64-8098-df06a8621256https://firebasestorage.googleapis.com/v0/b/alonzoaustin-8314b.appspot.com/o/studythat%2Feditpage.gif?alt=media&token=31fa6fa2-a735-4b3f-8ce0-3b156e5a2344https://firebasestorage.googleapis.com/v0/b/alonzoaustin-8314b.appspot.com/o/studythat%2Fmainpage.jpeg?alt=media&token=4f2cd6b6-1e10-4c79-ad7c-342cc3243fd2

This project took what I learned from creating my website and a personal project that I recently finished. This was built using ExpressJS (With EJS as the template engine) and MongoDB as the database.

Using the npm module Marked, I was able to use markdown to allow users to customize their notes, giving them the freedom to choose their own format instead of locking them down to a particular format.

The schema was simple as it only had two properties: topic and note as you can see below in the example.


  const Schema = mongoose.Schema;
  const cardSchema = new Schema({
      topic: String,
      note: String
  })
  const Card = mongoose.model("Topics", cardSchema)

Because of the simplicity of Studythat, I wanted to make sure that the ui was reflected in that. This led me to display cards with just two parts: the title being in a dark blue color, and the note being white. Reflecting on my years in highschool and my use of notes in general, I decided to put more emphasis on bullet points leading me to customize them by making them a different color and removing the bullet itself, allowing the points to stand out.