# Creating a Realtime Markdown Editor

### <img src="/files/-LO4Q4colzsEU5bq0Yz8" alt="" data-size="original">  <a href="#introduction" id="introduction"></a>

### Introduction <a href="#introduction" id="introduction"></a>

This hack again builds on the previous hack.

> <https://solid.gitbook.io/solid-hacks/section-1/hosting-a-web-page-on-your-pod>

This time we will create a realtime markdown editor.  This page is more complex and contains several files.  However there is a trick that will enable us to use the same one page pattern as before.  And that is to use the `<base>` tag.

### The Hack <a href="#the-hack" id="the-hack"></a>

Browse to your solid pod.  Within your `public` create a webpage called markdown.html with the databrowser.

Cut and paste the following file to your page.&#x20;

> <https://raw.githubusercontent.com/jbt/markdown-editor/master/index.html>

However we are going to add one additional line to mimic the base.  Beneath the HTML tag add.

`<base href="`[`https://jbt.github.io/markdown-editor/`](https://jbt.github.io/markdown-editor/)`">`

And we're done.  Congratulations, you have now made a useful app.  A realtime markdown editor!

### Demo <a href="#demo" id="demo"></a>

> <https://solidhacks.solid.community/public/demos/markdown.html>

### Exercises

As a step further try and create some of the markdown editors below.  See what issues come up.  Or try some other static apps.

### See Also

#### Realtime Markdown editors

> <https://github.com/joemccann/dillinger>
>
> <https://github.com/tylingsoft/markdown-plus>
>
> <https://github.com/jbt/markdown-editor>
>
> <https://github.com/benweet/stackedit>

#### Create a web page with Markdown

> <https://github.com/oscarmorrison/md-page>\
> \
> <https://casual-effects.com/markdeep/features.md.html>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://solid.gitbook.io/solid-hacks/static-pages/creating-a-realtime-markdown-editor.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
