Cotes

• 

  Notebook Screen

• 

  Blank editor screen

• 

  Sample note

Inspiration

During the virtual learning in the Covid-19 pandemic, we experienced how difficult it was to learn how to code through a zoom meeting. This also carried forward for our in person classes where we often had to choose between writing notes in an IDE or writing notes in a basic text document. This is why we had the idea to create a note taking app to aid teachers and students keep track of a program (notes) and the execution of such programs simultaneously.

What it does

Cotes allows users to take notes in a simple organized format using headings and descriptions. But our crowning feature, that we allow users to add snippets of code into their notes and also be able to run the code within the notebook itself.

How we built it

Cotes was built using Next.js and React.js as a frontend and Firebase Cloudstore and Github Authentication as a backend. We built it by initially creating the text editor and then creating our backend to create a Google Drive/One Notes like file system.

Challenges we ran into

We ran into various challenges while coding. Our biggest problems were related to firebase and creating our own Next.js API to serve as the middleware. One of our biggest issues was the post request not sending any parameters to the backend. We solve this by using a different library to handle HTTP requests.

Accomplishments that we're proud of

We are really proud of being able to learn as much as we did in the short amount of time. We were able to style the pages using css and Google's Material UI framework for React. Implementing the code snippets and compiling was one of our main goals and biggest accomplishments.

What we learned

Being one of our first few hackathons, we learned a lot about full stack web development, with an integrated firebase backend and a front-end user interface using Google's Material UI.

What's next for Cotes

We hope to expand to be compatible with more languages. Furthermore, Cotes looks forward to bringing its usages to IOS and Android through Progressive Web Apps. Our end goal is to connect students from various universities, and allow them to express, share, and save their cotes together.

This project is using a domain.com .tech domain of https://www.cotesapp.tech/. For live demonstration purposes our backend authentication is linked to localhost.

Built With

• firebase
• next
• next.js
• react
• react.js