Let's discuss your "Markdown Previewer"

Let's discuss your "Markdown Previewer"


Greetings, Fellow Campers!

This topic is for listing and review of Markdown Previewer projects built as a part of FCC challenges. Please stick to these basic rules to keep the topic clean:-

  • Post your Codepen (or other) link to your project as a general reply to this topic.
  • For Codepen links use the following format to avoid embedding the pen:-
Project Link - [http://codepen.io/santakmishra/full/pgqOYq/](http://codepen.io/santakmishra/full/pgqOYq/)
  • Post reviews as a specific reply to the link which you are reviewing.


Please have a look at my Markdown Previewer

Project Link - https://codepen.io/d33con/full/reJKxj/

I used SCSS instead of Sass, does this matter?

This is my first project in React, any comments on the code or design appreciated!


SCSS and Sass are part of the same preprocessor so I suppose it’s OK.



This is my markdown previewer : http://codepen.io/David44/pen/gMraXY

I’m not too worried about the sass part but since I started react only a few days ago, it’s the best time to avoid taking bad habits.
So, if someone can have a look at it and tell me if it’s ok, or if I’ve done something wrong, please go for it.



Well, you shouldn’t render body.


That makes sense, thanks for the advice and the article.


http://codepen.io/jacobBogers/pen/ezJgJG check it out


I checked out your app. The theme looks really cool. :slight_smile:

It seems like bullet points aren’t displayed in the output box. Also, there’s no margin on the left of the output box so it’s a little hard to read.

The syntax highlighting is sweet, too.


Hey guys,

I made a real basic markdown app using skeleton framework. I’d love some feedback on my React code because my js is only 35 lines and it seems a little too simple. :slight_smile:

MarkdownApp - http://codepen.io/willgriffiths/pen/zBKPmw/


Yes, the standard markup of the html is cleaned out, (css reset) I need to add it back maybe someday when I have more time.


Codepen here


Project link - http://codepen.io/perlhax27/pen/vKjYwW


Project Link - https://codepen.io/bsandusky/full/WxJoOR/


Project Link - https://jenovs.github.io/fcc-markdown/


Project Link - https://codepen.io/FaizAhmadF/full/EyzZWP/


Project Link ─ FreeCodeCamp : Build a Markdown Previewer


My project link is - http://codepen.io/ubershibs/full/QKEYgw/ - It’s my first React project, so any feedback on approach would be great. I think it’s pretty much like the bulk of the others posted here, so that’s probably a good sign?


Nicely done! Better than my attempt.

A few minor items: It’s worth noting that createClass is superseded by ES6 Class keyword. In practice that means a few changes, most notably that you’ll need to define a constructor() wherein this.state is set directly, rather than getInitialState().

Also, you may wish to explore stateless function components in future challenges. OutputBox is then simply:

const OutputBox = ({value}) => {
    return (
      <div className="output">
        <div id="outputbox" dangerouslySetInnerHTML={{ __html: value }} />

And notice de-structuring in the function definition. A variable by the same name as the object passed in as an argument is created, eliminating the need to explicitly set a variable to props.value.


Thanks for the feedback! I really need to get my head wrapped around ES6… Any chance you (or anyone) knows a good place to get started with that?


Hello, Campers!
My Project Link - http://codepen.io/AleksandrSidorov/full/BLdqGQ/.
I used PostCSS instead of SASS. Higlight.js library for code snippets highligting with Solarized Dark style. Any feedback is welcome.