switch to mdx

content/blog/2013-06-12-community-roundup.md

@@ -12,7 +12,7 @@ It looks like [Sophie Alpert](http://sophiebits.com/) is the first person outsid
 > I just rewrote a 2000-line project in React and have now made a handful of pull requests to React. Everything about React I've seen so far seems really well thought-out and I'm proud to be the first non-FB/IG production user of React.
 >
 > The project that I rewrote in React (and am continuing to improve) is the Khan Academy question editor which content creators can use to enter questions and hints that will be presented to students:
-> <figure><a href="http://sophiebits.com/2013/06/09/using-react-to-speed-up-khan-academy.html"><img src="../images/blog/khan-academy-editor.png"></a></figure>
+> <figure><a href="http://sophiebits.com/2013/06/09/using-react-to-speed-up-khan-academy.html"><img src="../images/blog/khan-academy-editor.png" /></a></figure>
 >
 > [Read the full post...](http://sophiebits.com/2013/06/09/using-react-to-speed-up-khan-academy.html)
 

content/blog/2013-06-19-community-roundup-2.md

@@ -24,7 +24,7 @@ Since the launch we have received a lot of feedback and are actively working on
 [Danial Khosravi](https://danialk.github.io/) made a real-time chat application that interacts with the back-end using Socket.IO.
 
 > A week ago I was playing with AngularJS and [this little chat application](https://github.com/btford/angular-socket-io-im) which uses socket.io and nodejs for realtime communication. Yesterday I saw a post about ReactJS in [EchoJS](http://www.echojs.com/) and started playing with this UI library. After playing a bit with React, I decided to write and chat application using React and I used Bran Ford's Backend for server side of this little app.
-> <figure><a href="https://danialk.github.io/blog/2013/06/16/reactjs-and-socket-dot-io-chat-application/"><img src="../images/blog/chatapp.png"></a></figure>
+> <figure><a href="https://danialk.github.io/blog/2013/06/16/reactjs-and-socket-dot-io-chat-application/"><img src="../images/blog/chatapp.png" /></a></figure>
 >
 > [Read the full post...](https://danialk.github.io/blog/2013/06/16/reactjs-and-socket-dot-io-chat-application/)
 
@@ -45,7 +45,7 @@ In the same vein, [Markov Twain](https://twitter.com/markov_twain/status/3457029
 Mozilla and Google are actively working on Web Components. [Vjeux](http://blog.vjeux.com/) wrote a proof of concept that shows how to implement them using React.
 
 > Using [x-tags](http://www.x-tags.org/) from Mozilla, we can write custom tags within the DOM. This is a great opportunity to be able to write reusable components without being tied to a particular library. I wrote [x-react](https://github.com/vjeux/react-xtags/) to have them being rendered in React.
-> <figure><a href="http://blog.vjeux.com/2013/javascript/custom-components-react-x-tags.html"><img src="../images/blog/xreact.png"></a></figure>
+> <figure><a href="http://blog.vjeux.com/2013/javascript/custom-components-react-x-tags.html"><img src="../images/blog/xreact.png" /></a></figure>
 >
 > [Read the full post...](http://blog.vjeux.com/2013/javascript/custom-components-react-x-tags.html)
 
@@ -56,7 +56,7 @@ Mozilla and Google are actively working on Web Components. [Vjeux](http://blog.v
 > Developers these days are spoiled with choice when it comes to selecting an MV* framework for structuring and organizing their JavaScript web apps.
 >
 > To help solve this problem, we created TodoMVC - a project which offers the same Todo application implemented using MV* concepts in most of the popular JavaScript MV* frameworks of today.
-> <figure><a href="http://todomvc.com/labs/architecture-examples/react/"><img src="../images/blog/todomvc.png"></a></figure>
+> <figure><a href="http://todomvc.com/labs/architecture-examples/react/"><img src="../images/blog/todomvc.png" /></a></figure>
 >
 > [Read the source code...](https://github.com/tastejs/todomvc/tree/gh-pages/labs/architecture-examples/react)
 

content/blog/2013-07-03-community-roundup-4.md

@@ -55,4 +55,4 @@ Over the past several weeks, members of our team, [Pete Hunt](http://www.petehun
 [Tom Occhino](http://tomocchino.com/) implemented Snake in 150 lines with React.
 
 > [Check the source on GitHub](https://github.com/tomocchino/react-snake/blob/master/src/snake.js)
-> <figure><a href="https://tomocchino.github.io/react-snake/"><img src="../images/blog/snake.png"></a></figure>
+> <figure><a href="https://tomocchino.github.io/react-snake/"><img src="../images/blog/snake.png" /></a></figure>

content/blog/2013-08-05-community-roundup-6.md

@@ -8,7 +8,7 @@ This is the first Community Round-up where none of the items are from Facebook/I
 ## React Game Tutorial {#react-game-tutorial}
 
 [Caleb Cassel](https://twitter.com/CalebCassel) wrote a [step-by-step tutorial](https://rawgithub.com/calebcassel/react-demo/master/part1.html) about making a small game. It covers JSX, State and Events, Embedded Components and Integration with Backbone.
-<figure><a href="https://rawgithub.com/calebcassel/react-demo/master/part1.html"><img src="../images/blog/dog-tutorial.png"></a></figure>
+<figure><a href="https://rawgithub.com/calebcassel/react-demo/master/part1.html"><img src="../images/blog/dog-tutorial.png" /></a></figure>
 
 
 ## Reactify {#reactify}
@@ -74,6 +74,6 @@ este.demos.react.todoApp = este.react.create (`/** @lends {React.ReactComponent.
 > I'm the author of "[Land of Lisp](http://landoflisp.com/)" and I love your framework. I built a somewhat similar framework a year ago [WebFUI](https://github.com/drcode/webfui) aimed at ClojureScript. My framework also uses global event delegates, a global "render" function, DOM reconciliation, etc just like react.js. (Of course these ideas all have been floating around the ether for ages, always great to see more people building on them.)
 >
 > Your implementation is more robust, and so I think the next point release of webfui will simply delegate all the "hard work" to react.js and will only focus on the areas where it adds value (enabling purely functional UI programming in clojurescript, and some other stuff related to streamlining event handling)
-> <figure><a href="https://groups.google.com/forum/#!msg/reactjs/e3bYersyd64/qODfcuBR9LwJ"><img src="../images/blog/landoflisp.png"></a></figure>
+> <figure><a href="https://groups.google.com/forum/#!msg/reactjs/e3bYersyd64/qODfcuBR9LwJ"><img src="../images/blog/landoflisp.png" /></a></figure>
 >
 > [Read the full post...](https://groups.google.com/forum/#!msg/reactjs/e3bYersyd64/qODfcuBR9LwJ)

content/blog/2013-08-26-community-roundup-7.md

@@ -17,7 +17,7 @@ It's been three months since we open sourced React and it is going well. Some st
 ## Wolfenstein Rendering Engine Ported to React {#wolfenstein-rendering-engine-ported-to-react}
 
 [Pete Hunt](http://www.petehunt.net/) ported the render code of the web version of Wolfenstein 3D to React. Check out [the demo](http://www.petehunt.net/wolfenstein3D-react/wolf3d.html) and [render.js](https://github.com/petehunt/wolfenstein3D-react/blob/master/js/renderer.js#L183) file for the implementation.
-<figure><a href="http://www.petehunt.net/wolfenstein3D-react/wolf3d.html"><img src="../images/blog/wolfenstein_react.png"></a></figure>
+<figure><a href="http://www.petehunt.net/wolfenstein3D-react/wolf3d.html"><img src="../images/blog/wolfenstein_react.png" /></a></figure>
 
 
 ## React & Meteor {#react--meteor}
@@ -51,7 +51,7 @@ It's been three months since we open sourced React and it is going well. Some st
 [Jordan Walke](https://github.com/jordwalke) implemented a complete React project creator called [react-page](https://github.com/facebook/react-page/). It supports both server-side and client-side rendering, source transform and packaging JSX files using CommonJS modules, and instant reload.
 
 > Easy Application Development with React JavaScript
-> <figure><a href="https://github.com/facebook/react-page/"><img src="../images/blog/react-page.png"></a></figure>
+> <figure><a href="https://github.com/facebook/react-page/"><img src="../images/blog/react-page.png" /></a></figure>
 >
 > **Why Server Rendering?**
 >

content/blog/2013-09-24-community-roundup-8.md

@@ -52,13 +52,13 @@ While this is not going to work for all the attributes since they are camelCased
 ## Markdown in React {#markdown-in-react}
 
 [Sophie Alpert](http://sophiebits.com/) converted [marked](https://github.com/chjj/marked), a Markdown JavaScript implementation, in React: [marked-react](https://github.com/sophiebits/marked-react). Even without using JSX, the HTML generation is now a lot cleaner. It is also safer as forgetting a call to `escape` will not introduce an XSS vulnerability.
-<figure><a href="https://github.com/sophiebits/marked-react/commit/cb70c9df6542c7c34ede9efe16f9b6580692a457"><img src="../images/blog/markdown_refactor.png"></a></figure>
+<figure><a href="https://github.com/sophiebits/marked-react/commit/cb70c9df6542c7c34ede9efe16f9b6580692a457"><img src="../images/blog/markdown_refactor.png" /></a></figure>
 
 
 ## Unite from BugBusters {#unite-from-bugbusters}
 
 [Renault John Lecoultre](https://twitter.com/renajohn) wrote [Unite](https://www.bugbuster.com/), an interactive tool for analyzing code dynamically using React. It integrates with CodeMirror.
-<figure><a href="https://unite.bugbuster.com/"><img src="../images/blog/unite.png"></a></figure>
+<figure><a href="https://unite.bugbuster.com/"><img src="../images/blog/unite.png" /></a></figure>
 
 ## #reactjs IRC Logs {#reactjs-irc-logs}
 

content/blog/2013-10-3-community-roundup-9.md

@@ -15,7 +15,7 @@ We organized a React hackathon last week-end in the Facebook Seattle office. 50
 > The game itself is pretty simple. People join the "room" by going to [http://qu.izti.me](http://qu.izti.me/) on their device. Large displays will show a leaderboard along with the game, and small displays (such as phones) will act as personal gamepads. Users will see questions and a choice of answers. The faster you answer, the more points you earn.
 >
 > In my opinion, Socket.io and React go together like chocolate and peanut butter. The page was always an accurate representation of the game object.
-><figure><a href="http://bold-it.com/javascript/facebook-react-example/"><img src="../images/blog/quiztime.png"></a></figure>
+><figure><a href="http://bold-it.com/javascript/facebook-react-example/"><img src="../images/blog/quiztime.png" /></a></figure>
 >
 > [Read More...](http://bold-it.com/javascript/facebook-react-example/)
 
@@ -73,8 +73,8 @@ The video will be available soon on the [JSConf EU website](http://2013.jsconf.e
 >
 > The panel is rendered with a random panel- class on each request, and the progress bar gets a random widthX class.
 >
-> With Turbolinks alone, the entire <body> would be replaced, and transitions would not happen. In this little demo though, React adds and removes classes and text, and the attribute changes are animated with CSS transitions. The DOM is otherwise left intact.
-><figure><a href="https://turbo-react.herokuapp.com/"><img src="../images/blog/turboreact.png"></a></figure>
+> With Turbolinks alone, the entire `<body>` would be replaced, and transitions would not happen. In this little demo though, React adds and removes classes and text, and the attribute changes are animated with CSS transitions. The DOM is otherwise left intact.
+><figure><a href="https://turbo-react.herokuapp.com/"><img src="../images/blog/turboreact.png" /></a></figure>
 >
 > [Check out the demo...](https://turbo-react.herokuapp.com/)
 

content/blog/2013-11-06-community-roundup-10.md

@@ -47,7 +47,7 @@ The best part is that no drastic changes have been required to support all those
 > [**Read part 2 ...**](http://www.phpied.com/server-side-react-with-php-part-2/)
 >
 > Rendered markup on the server:
-> <figure><a href="http://www.phpied.com/server-side-react-with-php-part-2/"><img src="../images/blog/react-php.png"></a></figure>
+> <figure><a href="http://www.phpied.com/server-side-react-with-php-part-2/"><img src="../images/blog/react-php.png" /></a></figure>
 
 
 ## TodoMVC Benchmarks {#todomvc-benchmarks}
@@ -92,7 +92,7 @@ The fact that you can control when components are rendered is a very important c
 ## Guess the filter {#guess-the-filter}
 
 [Connor McSheffrey](http://conr.me) implemented a small game using React. The goal is to guess which filter has been used to create the Instagram photo.
-<figure><a href="http://guessthefilter.com/"><img src="../images/blog/guess_filter.jpg"></a></figure>
+<figure><a href="http://guessthefilter.com/"><img src="../images/blog/guess_filter.jpg" /></a></figure>
 
 
 ## React vs FruitMachine {#react-vs-fruitmachine}

content/blog/2013-11-18-community-roundup-11.md

@@ -35,7 +35,7 @@ This round-up is the proof that React has taken off from its Facebook's root: it
 [Pavan Podila](http://blog.pixelingene.com/) wrote an in-depth introduction to React on TutsPlus. This is definitively worth reading.
 
 > Within a component-tree, data should always flow down. A parent-component should set the props of a child-component to pass any data from the parent to the child. This is termed as the Owner-Owned pair. On the other hand user-events (mouse, keyboard, touches) will always bubble up from the child all the way to the root component, unless handled in between.
-<figure><a href="http://dev.tutsplus.com/tutorials/intro-to-the-react-framework--net-35660"><img src="../images/blog/tutsplus.png"></a></figure>
+<figure><a href="http://dev.tutsplus.com/tutorials/intro-to-the-react-framework--net-35660"><img src="../images/blog/tutsplus.png" /></a></figure>
 >
 > [Read the full article ...](http://dev.tutsplus.com/tutorials/intro-to-the-react-framework--net-35660)
 
@@ -51,7 +51,7 @@ This round-up is the proof that React has taken off from its Facebook's root: it
 ## Genesis Skeleton {#genesis-skeleton}
 
 [Eric Clemmons](https://ericclemmons.github.io/) is working on a "Modern, opinionated, full-stack starter kit for rapid, streamlined application development". The version 0.4.0 has just been released and has first-class support for React.
-<figure><a href="http://genesis-skeleton.com/"><img src="../images/blog/genesis_skeleton.png"></a>a></figure>
+<figure><a href="http://genesis-skeleton.com/"><img src="../images/blog/genesis_skeleton.png" /></a>a></figure>
 
 
 ## AgFlow Talk {#agflow-talk}
@@ -82,7 +82,7 @@ This round-up is the proof that React has taken off from its Facebook's root: it
 ## Photo Gallery {#photo-gallery}
 
 [Maykel Loomans](http://miekd.com/), designer at Instagram, wrote a gallery for photos he shot using React.
-<figure><a href="http://photos.miekd.com/xoxo2013/"><img src="../images/blog/xoxo2013.png"></a>a></figure>
+<figure><a href="http://photos.miekd.com/xoxo2013/"><img src="../images/blog/xoxo2013.png" /></a>a></figure>
 
 
 ## Random Tweet {#random-tweet}

content/blog/2013-12-23-community-roundup-12.md

@@ -14,7 +14,7 @@ React got featured on the front-page of Hacker News thanks to the Om library. If
 > Wait, wait, wait. What does the performance of persistent data structures have to do with the future of JavaScript MVCs?
 >
 > A whole lot.
-> <figure><a href="https://swannodette.github.io/2013/12/17/the-future-of-javascript-mvcs/"><img src="../images/blog/om-backbone.png"></a></figure>
+> <figure><a href="https://swannodette.github.io/2013/12/17/the-future-of-javascript-mvcs/"><img src="../images/blog/om-backbone.png" /></a></figure>
 >
 > [Read the full article...](https://swannodette.github.io/2013/12/17/the-future-of-javascript-mvcs/)
 
@@ -46,15 +46,15 @@ Managing the scroll position when new content is inserted is usually very tricky
 ## Lights Out {#lights-out}
 
 React declarative approach is well suited to write games. [Cheng Lou](https://github.com/chenglou) wrote the famous Lights Out game in React. It's a good example of use of [TransitionGroup](/docs/animation.html) to implement animations.
-<figure><a href="https://chenglou.github.io/react-lights-out/"><img src="../images/blog/lights-out.png"></a></figure>
+<figure><a href="https://chenglou.github.io/react-lights-out/"><img src="../images/blog/lights-out.png" /></a></figure>
 
 [Try it out!](https://chenglou.github.io/react-lights-out/)
 
 
 ## Reactive Table Bookmarklet {#reactive-table-bookmarklet}
 
 [Stoyan Stefanov](http://www.phpied.com/) wrote a bookmarklet to process tables on the internet. It adds a little "pop" button that expands to a full-screen view with sorting, editing and export to csv and json.
-<figure><a href="http://www.phpied.com/reactivetable-bookmarklet/"><img src="../images/blog/reactive-bookmarklet.png"></a></figure>
+<figure><a href="http://www.phpied.com/reactivetable-bookmarklet/"><img src="../images/blog/reactive-bookmarklet.png" /></a></figure>
 
 [Check out the blog post...](http://www.phpied.com/reactivetable-bookmarklet/)
 
@@ -91,7 +91,7 @@ hoodie new todomvc -t "hoodiehq/hoodie-react-todomvc"
 ## JSX Compiler {#jsx-compiler}
 
 Ever wanted to have a quick way to see what a JSX tag would be converted to? [Tim Yung](http://www.yungsters.com/) made a page for it.
-<figure><a href="/react/jsx-compiler.html"><img src="../images/blog/jsx-compiler.png"></a></figure>
+<figure><a href="/react/jsx-compiler.html"><img src="../images/blog/jsx-compiler.png" /></a></figure>
 
 [Try it out!](/jsx-compiler.html)
 

content/blog/2013-12-30-community-roundup-13.md

@@ -94,7 +94,7 @@ var MyComponent = React.createClass({
 [David Chang](http://davidandsuzi.com/) working at [HasOffer](http://www.hasoffers.com/) wanted to speed up his Angular app and replaced Angular primitives by React at different layers. When using React naively it is 67% faster, but when combining it with angular's transclusion it is 450% slower.
 
 > Rendering this takes 803ms for 10 iterations, hovering around 35 and 55ms for each data reload (that's 67% faster). You'll notice that the first load takes a little longer than successive loads, and the second load REALLY struggles - here, it's 433ms, which is more than half of the total time!
-> <figure><a href="http://davidandsuzi.com/ngreact-react-components-in-angular/"><img src="../images/blog/ngreact.png"></a></figure>
+> <figure><a href="http://davidandsuzi.com/ngreact-react-components-in-angular/"><img src="../images/blog/ngreact.png" /></a></figure>
 >
 > [Read the full article...](http://davidandsuzi.com/ngreact-react-components-in-angular/)
 

content/blog/2014-01-02-react-chrome-developer-tools.md

@@ -12,6 +12,6 @@ You will get a new tab titled "React" in your Chrome DevTools. This tab shows yo
 Selecting a Component in this tab allows you to view and edit its props and state in the panel on the right. In the breadcrumbs at the bottom, you can inspect the selected Component, the Component that created it, the Component that created that one, and so on.
 
 When you inspect a DOM element using the regular Elements tab, you can switch over to the React tab and the corresponding Component will be automatically selected. The Component will also be automatically selected if you have a breakpoint within its render phase. This allows you to step through the render tree and see how one Component affects another one.
-<figure><a href="https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi"><img src="../images/blog/react-dev-tools.jpg"></a></figure>
+<figure><a href="https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi"><img src="../images/blog/react-dev-tools.jpg" /></a></figure>
 
 We hope these tools will help your team better understand your component hierarchy and track down bugs. We're very excited about this initial launch and appreciate any feedback you may have. As always, we also accept [pull requests on GitHub](https://github.com/facebook/react-devtools).