Solid Hacks
  • Solid Hacks
  • Chapter 1 - Static Pages
    • Hosting a Web Page On Your Pod
    • Hosting a One Page Game
    • URL Shortening
    • Creating a Realtime Markdown Editor
    • Saving a Markdown Document to Your Pod
    • Hosting Snippets
  • Chapter 2 - Working With Pods
    • Solid from the Console
    • Solid from the Command Line
    • Creating Group URIs
    • Hosting a pod on your own domain with CNAME
    • Interacting With Crawlers
    • Logging in with a Public Key
  • Chapter 3 - Working With Panes
    • Creating a Personal Diary
    • Creating a Slideshow
    • Creating an Audio playlist
    • Create a Presentation From Text
  • Chapter 4 - Integrations
    • Integrating Solid with Mastodon
    • Integrating with IPFS
    • Integrating Solid with Facebook
    • Integrating with Amazon S3
    • Integrating With Jitsi
  • Appendices
    • Appendix A : Solid Resources
    • Appendix B : Solid Communities
    • Appendix C : Utilities
Powered by GitBook
On this page
  • Introduction
  • The Hack
  • Demo
  • Exercises
  • See Also
  1. Chapter 1 - Static Pages

Creating a Realtime Markdown Editor

PreviousURL ShorteningNextSaving a Markdown Document to Your Pod

Last updated 6 years ago

Introduction

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

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.

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/">

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

Demo

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