When I started to learn React, a JavaScript framework for web applications, creating a Markdown editor was one of the first projects I did. It helped me handle and understand some of React’s functions, such as DOM handling, communication between the DOM and our components, using the state, etc.

This is a fun and easy project to make. I like it because you can make it your own — and it can be useful too. I do not particularly like any Markdown editors that are available today. Webstorm has a good one, but this editor is not free unless you are a student.

The editor discussed in this article will run locally and update in real-time as you type. If there is nothing written in the editor, the placeholder text comes back.

In case you are wondering, this is the final output of our editor:

Screenshot by the author. The app is running locally.

Let’s dive into it.

#nodejs #reactjs #react #programming #javascript