Team Members

[Hacker] Nathan Kirschner, [Hacker] Rishi Agarwal


Last year, we were sitting in our Fundies 2 class taking notes on the various design patterns. Our professor would use OneNote to draw out his code snippets but when we would write these down in the OneNote text boxes, they did not have any of the conventional code formatting that we would expect when writing code in an IDE. So when we would look back our notes it would be very difficult to interpret given the lack of formatting. Thus, we had idea for PseudoNote.

What it does

PsuedoNote allows users to transition seamlessly between text formatting and code formatting in a text area. The text formatting allows for bold, italicizing, underlining and highlighting words along with changing the font, font size, font color, and alignment of the text. Currently the code formatting provides a general code format that replicates what is seen in any popular IDE. In addition users can save files with a custom .psn extension, upload files of the same extension, and create and view multiple files in a singular window.

How we built it

The app was built with ReactJs and hosted on GitHub. The website is split into three components, a header, a file menu, and the text area. The header controls the formatting and allows the user to switch between 'code' and 'text' mode. The file menu lets the user choose which file to display and handles importing and exporting. The text area displays text boxes which the user can create, rearrange, and edit.

Challenges we ran into

The text boxes were particularly tricky to implement since they needed to handle a large amount of functionality. We were able to overcome this by experimenting with a number of attempts to find a working solution. Another challenge we faced was the limited time we had. Since there were only two of us on the team, we each had to code a large chunk of the project in a short amount of time.

Accomplishments that we're proud of

One accomplishment we are proud of is the large amount of functionality we were able to implement in a short amount of time. We were able to provide a number of formatting features in the text boxes, as well as importing and exporting files, which allows the website to be usable as a text editor. We are also proud to provide a finished product before the end of the hackathon. We spent a lot of time this weekend making this and are happy with the result.

What we learned

We learned a lot about ReactJs and web development. We also learned about the challenges of working under a short time constraint and were able to develop skills to overcome the challenge.

What's next for PseudoNote

We have a number of formatting styles and functionalities that we want to add to make PseudoNote a more complete text editor. These include additional code color schemes, languages, inserting tables, lists, and others. We also want to provide PseudoNote as a desktop application to accompany the existing website.

Share this project: