Build a Markdown Previewer

1

Hello, l have a issue with this project including the last question who ask us to have a default value in the textarea in page loading.

import { marked } from "https://cdnjs.cloudflare.com/ajax/libs/marked/12.0.2/lib/marked.esm.js";
console.log(marked);
const editor = document.getElementById("editor");
const preview = document.getElementById("preview");
const text = "# I love freecodecamp"
window.addEventListener("DOMContentLoaded",()=>{
 
  editor.value = `${text}`
  editor.addEventListener("input",(e)=>{
  preview.innerHTML = marked(e.target.value);
})
  
})
2

Hi @kakadhinio

What issue do you have with the textarea element?

Happy coding

3

when the page loads item in the textarea is there but not in the mardown preview. I am obligated to touch space key so that displays.

4

You have to add the initial markdown to the DOM outside the event handler on first load. If it only happens inside the event handler, it won’t run unless the handler does.

5

I don’t understand you when talking about the initial markdown.what is it specifically about?

6

Currently, this is your initial markdown.

const text = "# I love freecodecamp"

However, the requirements states what must be included in the initial markdown, which is more than just a h1. When you run the test, it will tell you what elements should be included in the initial markdown. You can also look at the example project.

The initial markdown should be added and rendered on first load.

7

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.