Skip to content

[docs] Use react-standalone #7668

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
zpao wants to merge 1 commit into from
Closed

[docs] Use react-standalone #7668

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions docs/Rakefile
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,11 @@ require('json')
require('yaml')
require('open-uri')

desc "download babel-browser"
desc "download babel-standalone"
task :fetch_remotes do
IO.copy_stream(
open('https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.34/browser.min.js'),
'js/babel-browser.min.js'
open('https://unpkg.com/babel-[email protected]/babel.min.js'),
'js/babel.min.js'
)
end

Expand Down
2 changes: 1 addition & 1 deletion docs/_layouts/default.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@
<script src="/react/js/jsx.js"></script>
<script src="/react/js/react.js"></script>
<script src="/react/js/react-dom.js"></script>
<script src="/react/js/babel-browser.min.js"></script>
<script src="/react/js/babel.min.js"></script>
<script src="/react/js/live_editor.js"></script>
</head>
<body>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/02-displaying-data.it-IT.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ Diamo un'occhiata ad un esempio davvero semplice. Creiamo un file dal nome `hell
<title>Hello React</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
Copy link
Member

@Daniel15 Daniel15 Sep 26, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Babel-standalone is on CDNJS and I've seen better perf with CDNJS compared to unpkg (also it has more users so it's more likely to hit the cache). Maybe use CDNJS instead?

</head>
<body>
<div id="example"></div>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/02-displaying-data.ja-JP.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ UIについて、最も基本的なことは、いくつかのデータを表示
<title>Hello React</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/02-displaying-data.ko-KR.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ UI를 가지고 할 수 있는 가장 기초적인 것은 데이터를 표시하
<title>Hello React</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/02-displaying-data.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ Let's look at a really simple example. Create a `hello-react.html` file with the
<title>Hello React</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/02-displaying-data.ru-RU.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ next: jsx-in-depth.html
<title>Hello React</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/02-displaying-data.zh-CN.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ next: jsx-in-depth-zh-CN.html
<title>Hello React</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/02-displaying-data.zh-TW.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ next: jsx-in-depth-zh-TW.html
<title>Hello React</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
Expand Down
4 changes: 1 addition & 3 deletions docs/docs/09.1-language-tooling.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ next: package-management.html

### In-browser JSX Transform

If you like using JSX, Babel 5 provided an in-browser ES2015 and JSX transformer for development called browser.js that can be included from [CDNJS](https://cdnjs.com/libraries/babel-core/5.8.34). Include a `<script type="text/babel">` tag to engage the JSX transformer.
If you like using JSX, there is an version of Babel that can be used in the browser. Babel uses this in their [online repl](https://babeljs.io/repl), and we use it for the tutorial and starter kit. `babel-standalone` can be used to directly transform & execute `<script type="text/babel">` content, supporting ES2015 and React features. It can also be used to transform more code via the API it exposes, along with access to all of the default Babel plugins. [Read more](https://github.com/Daniel15/babel-standalone#usage) about how to use this in your own projects.

> Note:
>
Expand Down Expand Up @@ -78,5 +78,3 @@ TypeScript is a type-checker and transpiler that supports type-checking React an
For more info, check out their guide on [getting started with React and Webpack](https://www.typescriptlang.org/docs/handbook/react-&-webpack.html), or learn more about [TypeScript's JSX support](https://www.typescriptlang.org/docs/handbook/jsx.html).

To learn more about TypeScript in general, visit the [TypeScript homepage](https://www.typescriptlang.org/).


2 changes: 1 addition & 1 deletion docs/docs/09.2-package-management.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -99,7 +99,7 @@ bower install --save react
<title>Hello React!</title>
<script src="bower_components/react/react.js"></script>
<script src="bower_components/react/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
Copy link
Member

@Daniel15 Daniel15 Sep 26, 2016

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In this one, you might want to use babel-standalone from Bower for consistency. Updating the install command to bower install --save react babel-standalone should work.

</head>
<body>
<div id="example"></div>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/getting-started.it-IT.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ Nella directory principale dello starter kit, crea `helloworld.html` con il segu
<meta charset="UTF-8" />
<title>Ciao React!</title>
<script src="build/react.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/getting-started.ja-JP.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ React でのハッキングを始めるにあたり、一番簡単なものと
<meta charset="UTF-8" />
<title>Hello React!</title>
<script src="build/react.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/getting-started.ko-KR.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ $ browserify -t [ babelify --presets [ react ] ] main.js -o bundle.js
<title>Hello React!</title>
<script src="build/react.js"></script>
<script src="build/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/getting-started.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,7 @@ In the root directory of the starter kit, create a `helloworld.html` with the fo
<title>Hello React!</title>
<script src="build/react.js"></script>
<script src="build/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/getting-started.zh-CN.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,7 @@ new webpack.DefinePlugin({
<title>Hello React!</title>
<script src="build/react.js"></script>
<script src="build/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
</head>
<body>
<div id="example"></div>
Expand Down
4 changes: 2 additions & 2 deletions docs/docs/tutorial.it-IT.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ Per questo tutorial renderemo il tutto il più semplice possibile. Incluso nel p
<title>React Tutorial</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/remarkable.min.js"></script>
</head>
Expand Down Expand Up @@ -230,7 +230,7 @@ Per prima cosa, aggiungiamo la libreria di terze parti **marked** alla tua appli
<title>React Tutorial</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/remarkable.min.js"></script>
</head>
Expand Down
4 changes: 2 additions & 2 deletions docs/docs/tutorial.ja-JP.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ next: thinking-in-react-ja-JP.html
<title>React Tutorial</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/remarkable.min.js"></script>

Expand Down Expand Up @@ -227,7 +227,7 @@ Markdown はインラインでテキストをフォーマットする簡単な
<title>Hello React</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/remarkable.min.js"></script>
</head>
Expand Down
4 changes: 2 additions & 2 deletions docs/docs/tutorial.ko-KR.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ next: thinking-in-react-ko-KR.html
<title>React Tutorial</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/remarkable.min.js"></script>
</head>
Expand Down Expand Up @@ -233,7 +233,7 @@ Markdown은 텍스트를 포맷팅하는 간단한 방식입니다. 예를 들
<title>React Tutorial</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/remarkable.min.js"></script>
</head>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/tutorial.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ For this tutorial, we're going to make it as easy as possible. Included in the s
<title>React Tutorial</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/remarkable.min.js"></script>
</head>
Expand Down
2 changes: 1 addition & 1 deletion docs/docs/tutorial.zh-CN.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ next: thinking-in-react-zh-CN.html
<title>React Tutorial</title>
<script src="https://unpkg.com/react@{{site.react_version}}/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@{{site.react_version}}/dist/react-dom.js"></script>
<script src="https://unpkg.com/babel-[email protected]/browser.min.js"></script>
<script src="https://unpkg.com/babel-[email protected]/babel.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/jquery.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/remarkable.min.js"></script>
</head>
Expand Down