Untitled

For a long time, I kept wondering what kind of project I could build that would genuinely improve my coding skills. One day, while working in VS Code, I started paying attention to how convenient it is to write code and instantly see the results. I noticed how different colors highlighted functions and syntax, and how useful live feedback can be while coding. That got me thinking about Markdown and how developers often need to write documentation, notes, and README files. Normally, you have to switch between editing and previewing to see how your Markdown looks. After exploring a few ideas online, I decided to build my own Markdown Previewer from scratch. The application will feature: A split-pane layout with an Editor Pane and a Preview Pane Support for Markdown headings Bold and italic text formatting Links and images Code blocks for displaying code snippets Live preview updates as the user types. The semantic structure of the project is intentionally simple and consists mainly of a element for the toolbar and a element containing the editor and preview sections .For styling, I used fonts from /*https://fonts.googleapis.com*/ and referenced design inspiration from Pinterest and made it Stardance themed. Throughout this project, I have learned more about how Markdown works behind the scenes, including :Parsing block-level elements using regular expressions (Regex)Understanding Markdown syntax rules Structuring applications with semantic HTML Building responsive split-pane layouts Creating real-time content updates with JavaScript. This project has been a great learning experience because it combines HTML, CSS, and JavaScript while introducing me to text parsing and dynamic content rendering. More importantly, it has helped me understand how tools that developers use every day are built and how they work behind the scenes.