{"files":[{"status":"A","path":"docs\/_posts\/2013-07-23-community-roundup-5.md"}],"commit":{"authorEmail":"vjeuxx@gmail.com","subject":"Community Round-up #5","authoredAt":"2013-07-21T00:36:38+02:00","authorName":"Vjeux","revision":"975b5d978f5a560ce0c85457f4979a60e2241334","shortRevision":"975b5d978f"},"body":"http:\/\/fooo.fr:4000\/react\/blog\/2013\/07\/20\/community-roundup-5.html","patch":"diff --git a\/docs\/_posts\/2013-07-23-community-roundup-5.md b\/docs\/_posts\/2013-07-23-community-roundup-5.md\nnew file mode 100644\nindex 0000000000..8d8a4e7ce6\n--- \/dev\/null\n+++ b\/docs\/_posts\/2013-07-23-community-roundup-5.md\n@@ -0,0 +1,99 @@\n+---\n+title: \"Community Round-up #5\"\n+layout: post\n+author: Vjeux\n+---\n+\n+We launched the [React Facebook Page](https:\/\/www.facebook.com\/react) along with the React v0.4 launch. 700 people already liked it to get updated on the project :)\n+\n+## Cross-browser onChange\n+\n+[Ben Alpert](http:\/\/benalpert.com\/) from [Khan Academy](https:\/\/www.khanacademy.org\/) worked on a cross-browser implementation of `onChange` event that landed in v0.4. He wrote a blog post explaining the various browser quirks he had to deal with.\n+\n+> First off, what is the input event? If you have an `` element and want to receive events whenever the value changes, the most obvious thing to do is to listen to the change event. Unfortunately, change fires only after the text field is defocused, rather than on each keystroke. The next obvious choice is the keyup event, which is triggered whenever a key is released. Unfortunately, keyup doesn't catch input that doesn't involve the keyboard (e.g., pasting from the clipboard using the mouse) and only fires once if a key is held down, rather than once per inserted character.\n+>\n+> Both keydown and keypress do fire repeatedly when a key is held down, but both fire immediately before the value changes, so to read the new value you have to defer the handler to the next event loop using `setTimeout(fn, 0)` or similar, which slows down your app. Of course, like keyup, neither keydown nor keypress fires for non-keyboard input events, and all three can fire in cases where the value doesn't change at all (such as when pressing the arrow keys).\n+>\n+> [Read the full post...](http:\/\/benalpert.com\/2013\/06\/18\/a-near-perfect-oninput-shim-for-ie-8-and-9.html)\n+\n+\n+## React Samples\n+\n+Learning a new library is always easier when you have working examples you can play with. [jwh](https:\/\/github.com\/jhw) put many of them on his [react-samples Github repo](https:\/\/github.com\/jhw\/react-samples).\n+\n+> Some simple examples with Facebook's React framework\n+>\n+> * Bootstrap action bar, modal and table [#1](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/actionbar.html),\n+> [#2](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/bootstrap_actionbar.html),\n+> [#3](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/bootstrap_modal.html),\n+> [#4](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/bootstrap_striped_table.html)\n+> * Comments [#1](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/comments1.html),\n+> [#2](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/comments2.html)\n+> * Data Table [#1](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/datatable.html),\n+> [#2](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/datatable2.html),\n+> [#3](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/datatable3.html),\n+> [#4](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/datatable4.html),\n+> [#5](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/datatable5.html)\n+> * Filter Bar [#1](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/filterbar.html),\n+> [#2](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/filterbar2.html),\n+> [#3](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/filterbar3.html),\n+> [#4](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/filterbar4.html),\n+> [#5](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/filterbar5.html)\n+> * Fundoo Rating [#1](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/fundoo.html)\n+> * Line Char: [#1](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/linechart.html),\n+> [#2](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/linechart2.html)\n+> * Multi tabs [#1](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/multitabs.html)\n+> * Select [#1](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/select.html)\n+> * Simple Tabs [#1](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/simpletabs.html),\n+> [#2](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/simpletabs2.html),\n+> [#3](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/simpletabs3.html),\n+> [#4](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/simpletabs4.html)\n+> * Toggle [#1](https:\/\/rawgithub.com\/jhw\/react-samples\/master\/html\/toggle.html)\n+\n+\n+## React Chosen Wrapper\n+\n+[Cheng Lou](https:\/\/github.com\/chenglou) wrote a wrapper for the [Chosen](http:\/\/harvesthq.github.io\/chosen\/) input library called [react-chosen](https:\/\/github.com\/chenglou\/react-chosen). It took just 25 lines to be able to use jQuery component as a React one.\n+\n+```javascript\n+React.renderComponent(\n+ \n+

dillon1000/react

Files changed