DEV Community

Cover image for Gif Widget : "Markdown Meme Maker"
egfx
egfx

Posted on • Updated on

Gif Widget : "Markdown Meme Maker"

On Meme Monday's we're all accustom to laying down our memes & markdown & famously practice our craft. These memes are usually static images but they can also be animated gif's. We decided to make a meme maker for meme monday's to celebrate this !important (pun intended) holiday. We're giving this some good effort. Feel free to add to our creation with your own.

Presenting Markdown Meme Maker :


Get a live preview when writing Markdown.

Markdown Meme Maker presents your markdown in a live code interface. You can visualize your markdown as you type & it also deconstructs these elements into individual pieces in the canvas so you can modify them, use widgets on them, etc.

You can write standard Markdown but you should also reference the
Markdown docs from Showdown from which the editor is based. One thing we noticed is that the shorthand emoji syntax is broken. But you can copy and paste the emoji symbol directly into the markdown editor and that will work. You can even play with the size of the emoji by prepending # before the emoji symbol. (E.g. #😃)


Markdown transmits to live elements you can edit in the canvas.

If you're interested in making a meme maker of your own. In a future article we will dig deeper into how we made the app. And introduce canvas events, a new concept that allows you to do things like adding dynamic elements to the canvas through code.

Check out the "Markdown Meme Maker" template here.

Open template

Top comments (0)