diff --git a/_config.yml b/_config.yml index 59616b71e..9bcc0f5ca 100644 --- a/_config.yml +++ b/_config.yml @@ -1,7 +1,7 @@ --- name: React description: A JavaScript library for building user interfaces -url: http://facebook.github.io +url: https://facebook.github.io baseurl: "/react" permalink: "/blog/:year/:month/:day/:title.html" paginate_path: "/blog/page:num/" diff --git a/_data/nav_docs.yml b/_data/nav_docs.yml index 7dabd9236..71fd15cae 100644 --- a/_data/nav_docs.yml +++ b/_data/nav_docs.yml @@ -91,7 +91,7 @@ items: - id: flux-overview title: Flux Overview - href: http://facebook.github.io/flux/docs/overview.html + href: https://facebook.github.io/flux/docs/overview.html - id: flux-todo-list title: Flux TodoMVC Tutorial - href: http://facebook.github.io/flux/docs/todo-list.html + href: https://facebook.github.io/flux/docs/todo-list.html diff --git a/_layouts/default.html b/_layouts/default.html index 58f4c8432..123e11622 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -8,8 +8,8 @@ - - + + @@ -53,7 +53,7 @@ diff --git a/_posts/2013-06-02-jsfiddle-integration.md b/_posts/2013-06-02-jsfiddle-integration.md index 51b678d0c..ea729c9ea 100644 --- a/_posts/2013-06-02-jsfiddle-integration.md +++ b/_posts/2013-06-02-jsfiddle-integration.md @@ -3,7 +3,7 @@ title: JSFiddle Integration author: Christopher Chedeau --- -[JSFiddle](http://jsfiddle.net) just announced support for React. This is an exciting news as it makes collaboration on snippets of code a lot easier. You can play around this **[base React JSFiddle](http://jsfiddle.net/vjeux/kb3gN/)**, fork it and share it! A [fiddle without JSX](http://jsfiddle.net/vjeux/VkebS/) is also available. +[JSFiddle](https://jsfiddle.net) just announced support for React. This is an exciting news as it makes collaboration on snippets of code a lot easier. You can play around this **[base React JSFiddle](https://jsfiddle.net/vjeux/kb3gN/)**, fork it and share it! A [fiddle without JSX](https://jsfiddle.net/vjeux/VkebS/) is also available.

React (by Facebook) is now available on JSFiddle. facebook.github.io/react/

— JSFiddle (@jsfiddle) June 2, 2013
diff --git a/_posts/2013-06-05-why-react.md b/_posts/2013-06-05-why-react.md index a459388c6..92ab9a1d4 100644 --- a/_posts/2013-06-05-why-react.md +++ b/_posts/2013-06-05-why-react.md @@ -40,7 +40,7 @@ React really shines when your data changes over time. In a traditional JavaScript application, you need to look at what data changed and imperatively make changes to the DOM to keep it up-to-date. Even AngularJS, which provides a declarative interface via directives and data binding [requires -a linking function to manually update DOM nodes](http://code.angularjs.org/1.0.8/docs/guide/directive#reasonsbehindthecompilelinkseparation). +a linking function to manually update DOM nodes](https://code.angularjs.org/1.0.8/docs/guide/directive#reasonsbehindthecompilelinkseparation). React takes a different approach. @@ -56,7 +56,7 @@ to the DOM. > lightweight description of what the DOM should look like. We call this process **reconciliation**. Check out -[this jsFiddle](http://jsfiddle.net/fv6RD/3/) to see an example of +[this jsFiddle](https://jsfiddle.net/fv6RD/3/) to see an example of reconciliation in action. Because this re-render is so fast (around 1ms for TodoMVC), the developer @@ -74,7 +74,7 @@ some pretty cool things with it: - We've built internal prototypes that run React apps in a web worker and use React to drive **native iOS views** via an Objective-C bridge. - You can run React - [on the server](http://github.com/petehunt/react-server-rendering-example) + [on the server](https://github.com/petehunt/react-server-rendering-example) for SEO, performance, code sharing and overall flexibility. - Events behave in a consistent, standards-compliant way in all browsers (including IE8) and automatically use diff --git a/_posts/2013-06-12-community-roundup.md b/_posts/2013-06-12-community-roundup.md index 0fea125af..336b35f6d 100644 --- a/_posts/2013-06-12-community-roundup.md +++ b/_posts/2013-06-12-community-roundup.md @@ -38,10 +38,10 @@ It looks like [Ben Alpert](http://benalpert.com/) is the first person outside of ## Origins of React -[Pete Hunt](http://www.petehunt.net/blog/) explained what differentiates React from other JavaScript libraries in [a previous blog post](http://facebook.github.io/react/blog/2013/06/05/why-react.html). [Lee Byron](http://leebyron.com/) gives another perspective on Quora: +[Pete Hunt](http://www.petehunt.net/blog/) explained what differentiates React from other JavaScript libraries in [a previous blog post](/react/blog/2013/06/05/why-react.html). [Lee Byron](http://leebyron.com/) gives another perspective on Quora: > React isn't quite like any other popular Javascript libraries, and it solves a very specific problem: complex UI rendering. It's also intended to be used along side many other popular libraries. For example, React works well with Backbone.js, amongst many others. > > React was born out of frustrations with the common pattern of writing two-way data bindings in complex MVC apps. React is an implementation of one-way data bindings. > -> [Read the full post...](http://www.quora.com/React-JS-Library/How-is-Facebooks-React-JavaScript-library/answer/Lee-Byron?srid=3DcX) +> [Read the full post...](https://www.quora.com/React-JS-Library/How-is-Facebooks-React-JavaScript-library/answer/Lee-Byron?srid=3DcX) diff --git a/_posts/2013-06-19-community-roundup-2.md b/_posts/2013-06-19-community-roundup-2.md index d04dc5071..1a76a5205 100644 --- a/_posts/2013-06-19-community-roundup-2.md +++ b/_posts/2013-06-19-community-roundup-2.md @@ -21,12 +21,12 @@ Since the launch we have received a lot of feedback and are actively working on ## React and Socket.IO Chat Application -[Danial Khosravi](http://danialk.github.io/) made a real-time chat application that interacts with the back-end using Socket.IO. +[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. ->
[![](/react/img/blog/chatapp.png)](http://danialk.github.io/blog/2013/06/16/reactjs-and-socket-dot-io-chat-application/)
+>
[![](/react/img/blog/chatapp.png)](https://danialk.github.io/blog/2013/06/16/reactjs-and-socket-dot-io-chat-application/)
> -> [Read the full post...](http://danialk.github.io/blog/2013/06/16/reactjs-and-socket-dot-io-chat-application/) +> [Read the full post...](https://danialk.github.io/blog/2013/06/16/reactjs-and-socket-dot-io-chat-application/) ## React and Other Frameworks @@ -36,9 +36,9 @@ Since the launch we have received a lot of feedback and are actively working on > > We've designed React from the beginning to work well with other libraries. Angular is no exception. Let's take the original Angular example and use React to implement the fundoo-rating directive. > -> [Read the full post...](http://www.quora.com/Pete-Hunt/Posts/Facebooks-React-vs-AngularJS-A-Closer-Look) +> [Read the full post...](https://www.quora.com/Pete-Hunt/Posts/Facebooks-React-vs-AngularJS-A-Closer-Look) -In the same vein, [Markov Twain](https://twitter.com/markov_twain/status/345702941845499906) re-implemented the examples on the front-page [with Ember](http://jsbin.com/azihiw/2/edit) and [Vlad Yazhbin](https://twitter.com/vla) re-implemented the tutorial [with Angular](http://jsfiddle.net/vla/Cdrse/). +In the same vein, [Markov Twain](https://twitter.com/markov_twain/status/345702941845499906) re-implemented the examples on the front-page [with Ember](http://jsbin.com/azihiw/2/edit) and [Vlad Yazhbin](https://twitter.com/vla) re-implemented the tutorial [with Angular](https://jsfiddle.net/vla/Cdrse/). ## Web Components: React & x-tags @@ -64,7 +64,7 @@ Mozilla and Google are actively working on Web Components. [Vjeux](http://blog.v Many of you pointed out differences between JSX and HTML. In order to clear up some confusion, we have added some documentation that covers the four main differences: - - [Whitespace removal](http://facebook.github.io/react/docs/jsx-is-not-html.html) - - [HTML Entities](http://facebook.github.io/react/docs/jsx-is-not-html.html) - - [Comments](http://facebook.github.io/react/docs/jsx-is-not-html.html) - - [Custom HTML Attributes](http://facebook.github.io/react/docs/jsx-is-not-html.html) + - [Whitespace removal](/react/docs/jsx-is-not-html.html) + - [HTML Entities](/react/docs/jsx-is-not-html.html) + - [Comments](/react/docs/jsx-is-not-html.html) + - [Custom HTML Attributes](/react/docs/jsx-is-not-html.html) diff --git a/_posts/2013-06-27-community-roundup-3.md b/_posts/2013-06-27-community-roundup-3.md index 91b35b6b6..d7e30ed0e 100644 --- a/_posts/2013-06-27-community-roundup-3.md +++ b/_posts/2013-06-27-community-roundup-3.md @@ -7,7 +7,7 @@ The highlight of this week is that an interaction-heavy app has been ported to R ## Moving From Backbone To React -[Clay Allsopp](http://twitter.com/clayallsopp) successfully ported [Propeller](http://usepropeller.com/blog/posts/from-backbone-to-react/), a fairly big, interaction-heavy JavaScript app, to React. +[Clay Allsopp](https://twitter.com/clayallsopp) successfully ported [Propeller](http://usepropeller.com/blog/posts/from-backbone-to-react/), a fairly big, interaction-heavy JavaScript app, to React. > [](http://usepropeller.com/blog/posts/from-backbone-to-react/)Subviews involve a lot of easy-to-forget boilerplate that Backbone (by design) doesn't automate. Libraries like Backbone.Marionette offer more abstractions to make view nesting easier, but they're all limited by the fact that Backbone delegates how and went view-document attachment occurs to the application code. > @@ -19,7 +19,7 @@ The highlight of this week is that an interaction-heavy app has been ported to R ## Grunt Task for JSX -[Eric Clemmons](http://ericclemmons.github.io/) wrote a task for [Grunt](http://gruntjs.com/) that applies the JSX transformation to your Javascript files. It also works with [Browserify](http://browserify.org/) if you want all your files to be concatenated and minified together. +[Eric Clemmons](https://ericclemmons.github.io/) wrote a task for [Grunt](http://gruntjs.com/) that applies the JSX transformation to your Javascript files. It also works with [Browserify](http://browserify.org/) if you want all your files to be concatenated and minified together. > Grunt task for compiling Facebook React's .jsx templates into .js > diff --git a/_posts/2013-07-02-react-v0-4-autobind-by-default.md b/_posts/2013-07-02-react-v0-4-autobind-by-default.md index 29e00b83a..5158f8cf4 100644 --- a/_posts/2013-07-02-react-v0-4-autobind-by-default.md +++ b/_posts/2013-07-02-react-v0-4-autobind-by-default.md @@ -8,7 +8,7 @@ React v0.4 is very close to completion. As we finish it off, we'd like to share ## What is React.autoBind? -If you take a look at most of our current examples, you'll see us using `React.autoBind` for event handlers. This is used in place of `Function.prototype.bind`. Remember that in JS, [function calls are late-bound](http://bonsaiden.github.io/JavaScript-Garden/#function.this). That means that if you simply pass a function around, the `this` used inside won't necessarily be the `this` you expect. `Function.prototype.bind` creates a new, properly bound, function so that when called, `this` is exactly what you expect it to be. +If you take a look at most of our current examples, you'll see us using `React.autoBind` for event handlers. This is used in place of `Function.prototype.bind`. Remember that in JS, [function calls are late-bound](https://bonsaiden.github.io/JavaScript-Garden/#function.this). That means that if you simply pass a function around, the `this` used inside won't necessarily be the `this` you expect. `Function.prototype.bind` creates a new, properly bound, function so that when called, `this` is exactly what you expect it to be. Before we launched React, we would write this: diff --git a/_posts/2013-07-03-community-roundup-4.md b/_posts/2013-07-03-community-roundup-4.md index f160c535d..b9bb19688 100644 --- a/_posts/2013-07-03-community-roundup-4.md +++ b/_posts/2013-07-03-community-roundup-4.md @@ -26,12 +26,12 @@ Over the past several weeks, members of our team, [Pete Hunt](http://www.petehun > [Listening Scroll Event](https://groups.google.com/forum/#!topic/reactjs/l6PnP8qbofk) > -> * [JSFiddle](http://jsfiddle.net/aabeL/1/): Basically I've given you two mixins. The first lets you react to global scroll events. The second is, IMO, much more useful: it gives you scroll start and scroll end events, which you can use with setState() to create components that react based on whether the user is scrolling or not. +> * [JSFiddle](https://jsfiddle.net/aabeL/1/): Basically I've given you two mixins. The first lets you react to global scroll events. The second is, IMO, much more useful: it gives you scroll start and scroll end events, which you can use with setState() to create components that react based on whether the user is scrolling or not. > > [Fade-in Transition](https://groups.google.com/forum/#!topic/reactjs/RVAY_eQmdpo) > -> * [JSFiddle](http://jsfiddle.net/ufe8k/1/): Creating a new `` component and using jQuery `.fadeIn()` function on the DOM node. -> * [JSFiddle](http://jsfiddle.net/R8f5L/5/): Using CSS transition instead. +> * [JSFiddle](https://jsfiddle.net/ufe8k/1/): Creating a new `` component and using jQuery `.fadeIn()` function on the DOM node. +> * [JSFiddle](https://jsfiddle.net/R8f5L/5/): Using CSS transition instead. > > [Socket.IO Integration](https://groups.google.com/forum/#!topic/reactjs/pyUZBRWcHB4) > @@ -41,7 +41,7 @@ Over the past several weeks, members of our team, [Pete Hunt](http://www.petehun > > [Sortable jQuery Plugin Integration](https://groups.google.com/forum/#!topic/reactjs/mHfBGI3Qwz4) > -> * [JSFiddle](http://jsfiddle.net/LQxy7/): Your React component simply render empty divs, and then in componentDidMount() you call React.renderComponent() on each of those divs to set up a new root React tree. Be sure to explicitly unmountAndReleaseReactRootNode() for each component in componentWillUnmount(). +> * [JSFiddle](https://jsfiddle.net/LQxy7/): Your React component simply render empty divs, and then in componentDidMount() you call React.renderComponent() on each of those divs to set up a new root React tree. Be sure to explicitly unmountAndReleaseReactRootNode() for each component in componentWillUnmount(). ## Introduction to React Screencast @@ -54,4 +54,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) ->
[![](/react/img/blog/snake.png)](http://tomocchino.github.io/react-snake/)
+>
[![](/react/img/blog/snake.png)](https://tomocchino.github.io/react-snake/)
diff --git a/_posts/2013-07-17-react-v0-4-0.md b/_posts/2013-07-17-react-v0-4-0.md index a42b5e55a..0238ccaf4 100644 --- a/_posts/2013-07-17-react-v0-4-0.md +++ b/_posts/2013-07-17-react-v0-4-0.md @@ -6,7 +6,7 @@ author: Paul O'Shannessy Over the past 2 months we've been taking feedback and working hard to make React even better. We fixed some bugs, made some under-the-hood improvements, and added several features that we think will improve the experience developing with React. Today we're proud to announce the availability of React v0.4! -This release could not have happened without the support of our growing community. Since launch day, the community has contributed blog posts, questions to the [Google Group](http://groups.google.com/group/reactjs), and issues and pull requests on GitHub. We've had contributions ranging from documentation improvements to major changes to React's rendering. We've seen people integrate React into the tools they're using and the products they're building, and we're all very excited to see what our budding community builds next! +This release could not have happened without the support of our growing community. Since launch day, the community has contributed blog posts, questions to the [Google Group](https://groups.google.com/group/reactjs), and issues and pull requests on GitHub. We've had contributions ranging from documentation improvements to major changes to React's rendering. We've seen people integrate React into the tools they're using and the products they're building, and we're all very excited to see what our budding community builds next! React v0.4 has some big changes. We've also restructured the documentation to better communicate how to use React. We've summarized the changes below and linked to documentation where we think it will be especially useful. @@ -18,10 +18,10 @@ When you're ready, [go download it](/react/downloads.html)! * Switch from using `id` attribute to `data-reactid` to track DOM nodes. This allows you to integrate with other JS and CSS libraries more easily. * Support for more DOM elements and attributes (e.g., ``) * Improved server-side rendering APIs. `React.renderComponentToString(, callback)` allows you to use React on the server and generate markup which can be sent down to the browser. -* `prop` improvements: validation and default values. [Read our blog post for details...](http://facebook.github.io/react/blog/2013/07/11/react-v0-4-prop-validation-and-default-values.html) -* Support for the `key` prop, which allows for finer control over reconciliation. [Read the docs for details...](http://facebook.github.io/react/docs/multiple-components.html) -* Removed `React.autoBind`. [Read our blog post for details...](http://facebook.github.io/react/blog/2013/07/02/react-v0-4-autobind-by-default.html) -* Improvements to forms. We've written wrappers around ``, `