-
Notifications
You must be signed in to change notification settings - Fork 937
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
2 changed files
with
87 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
--- | ||
title: "ReactJS.NET 1.1 - Upgraded React and fixed a crash" | ||
layout: post | ||
author: Daniel Lo Nigro | ||
--- | ||
|
||
I'm happy to announce the release of ReactJS.NET 1.1! This is a minor release and includes a number of changes and fixes since version 1.1: | ||
|
||
* React version upgraded from 0.10.0 to 0.11.1. | ||
* Fixed an [access violation exception](https://github.com/reactjs/React.NET/issues/28) when running in Release mode. *Thanks to [Paul Irwin](https://github.com/paulirwin) for reporting and [jlchmura](https://github.com/jlchmura) for fixing*. | ||
* Always transform JSX in bundles, even when the very first file doesn't have the `/** @jsx React.DOM */` directive. *Thanks to [Rick Beerendonk](https://github.com/rickbeerendonk)*. | ||
* [ES6 transforms](/guides/es6.html) are now turned off by default since they can conflict with other ES6 transpilers like Traceur. [Check the documentation](/guides/es6.html) to see how to enable them. *Thanks to [Aleksander Heintz](https://github.com/Alxandr)*. | ||
|
||
Have fun, and as always, please feel free to send feedback or bug reports | ||
[on GitHub](https://github.com/reactjs/React.NET). | ||
|
||
— Daniel |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,70 @@ | ||
--- | ||
layout: docs | ||
title: ES6 Features | ||
--- | ||
|
||
React can optionally use some ECMAScript 6 features thanks to the bundled version of [JSTransform](https://github.com/facebook/jstransform). ECMAScript 6 (or "ES6" for short) is the next version of ECMAScript/JavaScript and contains several useful features: | ||
|
||
* **[Arrow functions](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/arrow_functions)** — A syntax for inline lambda functions similar to C#. These are very useful when combined with the `map` and `filter` methods of arrays: | ||
|
||
```javascript | ||
var numbers = [1, 2, 3, 4]; | ||
var doubled = numbers.map(number => number * 2); // [2, 4, 6, 8] | ||
``` | ||
|
||
Arrow functions also implicitly bind `this`, so you do not need to write `.bind(this)` when passing around a function as a callback. | ||
|
||
* **Concise methods** — You no longer need to write `: function` in your object literals: | ||
|
||
```javascript{13,16} | ||
// The old way | ||
var OldAndBusted = React.createClass({ | ||
render: function() { | ||
// ... | ||
}, | ||
doStuff: function() { | ||
// ... | ||
} | ||
}); | ||
// The new way | ||
var NewHotness = React.createClass({ | ||
render() { | ||
// ... | ||
}, | ||
doStuff() { | ||
// ... | ||
} | ||
}); | ||
``` | ||
|
||
* **[Classes](http://wiki.ecmascript.org/doku.php?id=strawman:maximally_minimal_classes)** — Similar to the class systems included in JavaScript frameworks such as Prototype and MooTools, but will (eventually) be native to JavaScript | ||
|
||
```javascript | ||
class AwesomeStuff { | ||
add(first, second) { | ||
return first + second; | ||
} | ||
} | ||
|
||
var foo = new AwesomeStuff(); | ||
foo.add(2, 3); // 5 | ||
``` | ||
|
||
* **[Short object notation](http://ariya.ofilabs.com/2013/02/es6-and-object-literal-property-value-shorthand.html)** | ||
* And more! See the [JSTransform source code](https://github.com/facebook/jstransform/tree/master/visitors), you never know what goodies you'll find. | ||
|
||
How to use | ||
---------- | ||
To use the ES6 transforms, you'll need to enable them. For ASP.NET MVC sites, this is done in your `ReactConfig.cs` by calling `.SetUseHarmony(true)`: | ||
|
||
```csharp{2} | ||
ReactSiteConfiguration.Configuration | ||
.SetUseHarmony(true) | ||
.AddScript("~/Content/Sample.jsx"); | ||
``` | ||
If you are using [MSBuild to precompile your JSX](/guide/msbuild.html), you also need to enable it in MSBuild via the `UseHarmony="true"` flag in your build script (`TransformJsx.proj` by default): | ||
|
||
```xml | ||
<TransformJsx SourceDir="$(MSBuildProjectDirectory)" UseHarmony="true" /> | ||
``` |