I was originally inspired to make this project by how people shared important information during the 2020 George Floyd protests. Many people had and still have links in their social media bios leading to pages containing important resources they wanted to share. These pages had a bunch of Google Docs links that felt bloated and took a long time to load. Google Docs is great, but not for sharing some links and opinions. I even saw a link to a OneDrive folder containing a single Word document that took ~5 seconds to load!

With readlet, I attempt to solve this issue with an intuitive reading and writing system that takes just one button press to have your work hosted live on the internet.

What it does

Readlet's homepage features a lightweight reader and writer placed side by side with the user writing in Markdown. The reader is a live mirror of the writer that converts the writer's contents as each character is typed.

Once the user is happy with what they've written. They can publish it by clicking the upload button and they're done! Their page will be instantly hosted on the internet for them to quickly share with as many people they'd like.

How I built it

I built readlet using Django for the backend and React for the frontend. The backend was a Django RESTful API that can serve and have pages uploaded to it.

The frontend was much harder for me to make. I took HackOR as an opportunity for me to learn React which was very intimidating but immensely rewarding. I used multiple components for handling reading, writing and a dynamic theme modal. These themes could be set without reloading so the user could keep their work. Try them! I also learned how to make HTTP requests in React so the web app can interface with the backend properly.

Challenges I ran into

Since I was brand new to React, almost everything was a challenge when I started. I didn't know how components worked, I didn't understand what JSX was but the most significant challenge I ran into was asynchronous JavaScript HTTP requests. Asynchronous code can get confusing at times and it doesn't help if you're brand new to the language/framework you're writing it in.

Accomplishments that I'm proud of

I'm proud that I got theming to work. I'm proud that I gained some valuable experience in React. I'm proud I learned how to deploy a separate frontend and backend. However, the accomplishment I'm most proud of is that I completed something that people can actually use to share whatever writings they need to.

What I learned

As stated earlier, I learned React. But throughout the development of readlet I learned more about the history of markdown and exactly how frontends and backends interact with one another as I went through the entire process myself.

What's next for readlet

I'm seriously considering making readlet into its own website that people can use. In the near future I want to add logging in and registration so that people can make edits after finishing their project. There are also some minor issues that I noticed with the backend that would take too much time to fix during HackOR.

Thank you so much for reading this and I hope you enjoy readlet.

Fun fact: I wrote this using readlet! inception

Built With

Share this project: