Markdown Previewer - Live Preview

A tool to preview your markdown in real-time.

Backstory

This tool is my first React project. It was confusing but fun since this was really different compared to most of my projects and it's really simple, yet really useful when it comes to writing markdowns. I bet you already noticed, the tool's style is heavily inspired by Google to approach that clean and simple look.

Development

This project was made with:

• ReactJs
• SCSS
• Google Material Symbols and Icones

Challenges:

• I had to make an improvement from the example given by freeCodeCamp by making the editor side by side with the preview.
• Though it's not much used, Framer motion helped create a simple fade-in when the page loads.
• I haven't succeeded at making a dark theme toggler.
• In the future, I need to make the editor sticky so it will stick to the top and users won't have to scroll back to edit if the preview's textbox is really long.

Go see the page!

See the page here.