diff --git a/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile.html b/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile.html new file mode 100644 index 00000000000..c848a86851e --- /dev/null +++ b/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile.html @@ -0,0 +1,23 @@ +React Native: Bringing modern web techniques to mobile
React Native Blog
Stay up-to-date with the latest React Native news and events.

React Native: Bringing modern web techniques to mobile

We introduced React to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web projects at Facebook are commonly built using React in one form or another, and it's being broadly adopted across the industry. Engineers are choosing to use React every day because it enables them to spend more time focusing on their products and less time fighting with their framework. It wasn't until we'd been building with React for a while, though, that we started to understand what makes it so powerful.

React forces us to break our applications down into discrete components, each representing a single view. These components make it easier to iterate on our products, since we don't need to keep the entire system in our head in order to make changes to one part of it. More important, though, React wraps the DOM's mutative, imperative API with a declarative one, which raises the level of abstraction and simplifies the programming model. What we've found is that when we build with React, our code is a lot more predictable. This predictability makes it so we can iterate more quickly with confidence, and our applications are a lot more reliable as a result. Additionally, it's not only easier to scale our applications when they're built with React, but we've found it's also easier to scale the size of our teams themselves.

Together with the rapid iteration cycle of the web, we've been able to build some awesome products with React, including many components of Facebook.com. Additionally, we've built amazing frameworks in JavaScript on top of React, like Relay, which allows us to greatly simplify our data fetching at scale. Of course, web is only part of the story. Facebook also has widely used Android and iOS apps, which are built on top of disjointed, proprietary technology stacks. Having to build our apps on top of multiple platforms has bifurcated our engineering organization, but that's only one of the things that makes native mobile application development hard.

+ +

This is an excerpt. Read the rest of the post on Facebook Code.

\ No newline at end of file diff --git a/blog/2015/09/14/react-native-for-android.html b/blog/2015/09/14/react-native-for-android.html new file mode 100644 index 00000000000..aaa011d1a6d --- /dev/null +++ b/blog/2015/09/14/react-native-for-android.html @@ -0,0 +1,23 @@ +React Native for Android: How we built the first cross-platform React Native app
React Native Blog
Stay up-to-date with the latest React Native news and events.

React Native for Android: How we built the first cross-platform React Native app

Earlier this year, we introduced React Native for iOS. React Native brings what developers are used to from React on the web — declarative self-contained UI components and fast development cycles — to the mobile platform, while retaining the speed, fidelity, and feel of native applications. Today, we're happy to release React Native for Android.

At Facebook we've been using React Native in production for over a year now. Almost exactly a year ago, our team set out to develop the Ads Manager app. Our goal was to create a new app to let the millions of people who advertise on Facebook manage their accounts and create new ads on the go. It ended up being not only Facebook's first fully React Native app but also the first cross-platform one. In this post, we'd like to share with you how we built this app, how React Native enabled us to move faster, and the lessons we learned.

+ +

This is an excerpt. Read the rest of the post on Facebook Code.

\ No newline at end of file diff --git a/blog/2015/11/23/making-react-native-apps-accessible.html b/blog/2015/11/23/making-react-native-apps-accessible.html new file mode 100644 index 00000000000..d9af8a7c704 --- /dev/null +++ b/blog/2015/11/23/making-react-native-apps-accessible.html @@ -0,0 +1,23 @@ +Making React Native apps accessible
React Native Blog
Stay up-to-date with the latest React Native news and events.

Making React Native apps accessible

With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vision loss or other disabilities. The Accessibility API for React and React Native enables you to make any React-powered experience usable by someone who may use assistive technology, like a screen reader for the blind and visually impaired.

For this post, we're going to focus on React Native apps. We've designed the React Accessibility API to look and feel similar to the iOS and Android APIs. If you've developed accessible applications for the web, iOS, or Android before, you should feel comfortable with the framework and nomenclature of the React AX API. For instance, you can make a UI element accessible (therefore exposed to assistive technology) and use accessibilityLabel to provide a string description for the element:

<View accessible={true} accessibilityLabel=”This is simple view”>

Let's walk through a slightly more involved application of the React AX API by looking at one of Facebook's own React-powered products: the Ads Manager app.

+ +

This is an excerpt. Read the rest of the post on Facebook Code.

\ No newline at end of file diff --git a/blog/2016/03/28/dive-into-react-native-performance.html b/blog/2016/03/28/dive-into-react-native-performance.html new file mode 100644 index 00000000000..ea61dcc7ece --- /dev/null +++ b/blog/2016/03/28/dive-into-react-native-performance.html @@ -0,0 +1,23 @@ +Dive into React Native Performance
React Native Blog
Stay up-to-date with the latest React Native news and events.

Dive into React Native Performance

React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across multiple platforms. You can ship faster and focus on details that really matter, making your app look and feel fantastic. Optimizing performance is a big part of this. Here is the story of how we made React Native app startup twice as fast.

Why the hurry? #

With an app that runs faster, content loads quickly, which means people get more time to interact with it, and smooth animations make the app enjoyable to use. In emerging markets, where 2011 class phones on 2G networks are the majority, a focus on performance can make the difference between an app that is usable and one that isn't.

Since releasing React Native on iOS and on Android, we have been improving list view scrolling performance, memory efficiency, UI responsiveness, and app startup time. Startup sets the first impression of an app and stresses all parts of the framework, so it is the most rewarding and challenging problem to tackle.

+ +

This is an excerpt. Read the rest of the post on Facebook Code.

\ No newline at end of file diff --git a/blog/2016/04/13/react-native-a-year-in-review.html b/blog/2016/04/13/react-native-a-year-in-review.html new file mode 100644 index 00000000000..75fca9ea1af --- /dev/null +++ b/blog/2016/04/13/react-native-a-year-in-review.html @@ -0,0 +1,23 @@ +React Native: A year in review
React Native Blog
Stay up-to-date with the latest React Native news and events.

React Native: A year in review

It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing React Native to the Windows ecosystem, giving developers the potential to build React Native on Windows PC, Phone, and Xbox. It will also provide open source tools and services such as a React Native extension for Visual Studio Code and CodePush to help developers create React Native apps on the Windows platform. In addition, Samsung is building React Native for its hybrid platform, which will empower developers to build apps for millions of SmartTVs and mobile and wearable devices. We also released the Facebook SDK for React Native, which makes it easier for developers to incorporate Facebook social features like Login, Sharing, App Analytics, and Graph APIs into their apps. In one year, React Native has changed the way developers build on every major platform.

It's been an epic ride — but we are only getting started. Here is a look back at how React Native has grown and evolved since we open-sourced it a year ago, some challenges we faced along the way, and what we expect as we look ahead to the future.

+ +

This is an excerpt. Read the rest of the post on Facebook Code.

\ No newline at end of file diff --git a/blog/feed.xml b/blog/feed.xml index 6bab2feca37..c0946ce3304 100644 --- a/blog/feed.xml +++ b/blog/feed.xml @@ -164,6 +164,30 @@ https://twitter.com/lacker + + <![CDATA[React Native: A year in review]]> + https://facebook.github.io/react-native/blog/2016/04/13/react-native-a-year-in-review.html + + + 2016-04-13T00:00:00Z + + + Martin Konicek + https://github.com/mkonicek + + + + <![CDATA[Dive into React Native Performance]]> + https://facebook.github.io/react-native/blog/2016/03/28/dive-into-react-native-performance.html + + + 2016-03-28T00:00:00Z + + + Pieter De Baets + https://github.com/javache + + <![CDATA[Introducing Hot Reloading]]> https://facebook.github.io/react-native/blog/2016/03/24/introducing-hot-reloading.html @@ -176,4 +200,40 @@ https://twitter.com/martinbigio + + <![CDATA[Making React Native apps accessible]]> + https://facebook.github.io/react-native/blog/2015/11/23/making-react-native-apps-accessible.html + + + 2015-11-23T00:00:00Z + + + Georgiy Kassabli + https://www.facebook.com/georgiy.kassabli + + + + <![CDATA[React Native for Android: How we built the first cross-platform React Native app]]> + https://facebook.github.io/react-native/blog/2015/09/14/react-native-for-android.html + + + 2015-09-14T00:00:00Z + + + Daniel Witte + https://www.facebook.com/drwitte + + + + <![CDATA[React Native: Bringing modern web techniques to mobile]]> + https://facebook.github.io/react-native/blog/2015/03/26/react-native-bringing-modern-web-techniques-to-mobile.html + + + 2015-03-26T00:00:00Z + + + Tom Occhino + https://github.com/tomocchino + + \ No newline at end of file diff --git a/blog/img/big-hero.jpg b/blog/img/big-hero.jpg new file mode 100644 index 00000000000..98047927b81 Binary files /dev/null and b/blog/img/big-hero.jpg differ diff --git a/blog/img/blue-hero.jpg b/blog/img/blue-hero.jpg new file mode 100644 index 00000000000..33a9a7ebc97 Binary files /dev/null and b/blog/img/blue-hero.jpg differ diff --git a/blog/img/dark-hero.png b/blog/img/dark-hero.png new file mode 100644 index 00000000000..e54bd6598f7 Binary files /dev/null and b/blog/img/dark-hero.png differ diff --git a/blog/index.html b/blog/index.html index 87f9c34a3dd..bc11a7d643b 100644 --- a/blog/index.html +++ b/blog/index.html @@ -1,4 +1,4 @@ -React Native Blog
React Native Blog
Stay up-to-date with the latest React Native news and events.

React Native Monthly #1

At Shoutem, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep up with the pace the community was growing and improving. That's why we decided to organize a monthly meeting where all major React Native contributors can briefly present what their efforts and plans are.

Introducing Create React Native App

Today we’re announcing Create React Native App: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of Create React App and is the product of a collaboration between Facebook and Expo (formerly Exponent).

idx: The Existential Function

At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors.

Better List Views in React Native

Many of you have started playing with some of our new List components already after our teaser announcement in the community group, but we are officially announcing them today! No more ListViews or DataSources, stale rows, ignored bugs, or excessive memory consumption - with the latest React Native March 2017 release candidate (0.43-rc.1) you can pick from the new suite of components what best fits your use-case, with great perf and feature sets out of the box:

Using Native Driver for Animated

For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers to create performant animations without having to worry about some of their code causing it to lag.

A Monthly Release Cadence: Releasing December and January RC

Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release of our production iOS apps, so we decided to release the open source versions at the same pace. Now, many of the Facebook apps ship once per week, especially on Android. Because we ship from master weekly, we need to keep it quite stable. So the bi-weekly release cadence doesn't even benefit internal contributors anymore.

San Francisco Meetup Recap

Last week I had the opportunity to attend the React Native Meetup at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet other developers near me that are also interested in React Native.

Toward Better Documentation

Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better based on your feedback, and we wanted to share some of the improvements we've made.

Introducing Hot Reloading

React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grows.

React Native Blog
Stay up-to-date with the latest React Native news and events.

React Native Monthly #1

At Shoutem, we've been fortunate enough to work with React Native from its very beginnings. We decided we wanted to be part of the amazing community from day one. Soon enough, we realized it's almost impossible to keep up with the pace the community was growing and improving. That's why we decided to organize a monthly meeting where all major React Native contributors can briefly present what their efforts and plans are.

Introducing Create React Native App

Today we’re announcing Create React Native App: a new tool that makes it significantly easier to get started with a React Native project! It’s heavily inspired by the design of Create React App and is the product of a collaboration between Facebook and Expo (formerly Exponent).

idx: The Existential Function

At Facebook, we often need to access deeply nested values in data structures fetched with GraphQL. On the way to accessing these deeply nested values, it is common for one or more intermediate fields to be nullable. These intermediate fields may be null for a variety of reasons, from failed privacy checks to the mere fact that null happens to be the most flexible way to represent non-fatal errors.

Better List Views in React Native

Many of you have started playing with some of our new List components already after our teaser announcement in the community group, but we are officially announcing them today! No more ListViews or DataSources, stale rows, ignored bugs, or excessive memory consumption - with the latest React Native March 2017 release candidate (0.43-rc.1) you can pick from the new suite of components what best fits your use-case, with great perf and feature sets out of the box:

Using Native Driver for Animated

For the past year, we've been working on improving performance of animations that use the Animated library. Animations are very important to create a beautiful user experience but can also be hard to do right. We want to make it easy for developers to create performant animations without having to worry about some of their code causing it to lag.

A Monthly Release Cadence: Releasing December and January RC

Shortly after React Native was introduced, we started releasing every two weeks to help the community adopt new features, while keeping versions stable for production use. At Facebook we had to stabilize the codebase every two weeks for the release of our production iOS apps, so we decided to release the open source versions at the same pace. Now, many of the Facebook apps ship once per week, especially on Android. Because we ship from master weekly, we need to keep it quite stable. So the bi-weekly release cadence doesn't even benefit internal contributors anymore.

San Francisco Meetup Recap

Last week I had the opportunity to attend the React Native Meetup at Zynga’s San Francisco office. With around 200 people in attendance, it served as a great place to meet other developers near me that are also interested in React Native.

Toward Better Documentation

Part of having a great developer experience is having great documentation. A lot goes into creating good docs - the ideal documentation is concise, helpful, accurate, complete, and delightful. Recently we've been working hard to make the docs better based on your feedback, and we wanted to share some of the improvements we've made.

React Native: A year in review

It's been one year since we open-sourced React Native. What started as an idea with a handful of engineers is now a framework being used by product teams across Facebook and beyond. Today at F8 we announced that Microsoft is bringing React Native to the Windows ecosystem, giving developers the potential to build React Native on Windows PC, Phone, and Xbox. It will also provide open source tools and services such as a React Native extension for Visual Studio Code and CodePush to help developers create React Native apps on the Windows platform. In addition, Samsung is building React Native for its hybrid platform, which will empower developers to build apps for millions of SmartTVs and mobile and wearable devices. We also released the Facebook SDK for React Native, which makes it easier for developers to incorporate Facebook social features like Login, Sharing, App Analytics, and Graph APIs into their apps. In one year, React Native has changed the way developers build on every major platform.

Dive into React Native Performance

React Native allows you to build iOS and Android apps in JavaScript using React and Relay's declarative programming model. This leads to more concise, easier-to-understand code; fast iteration without a compile cycle; and easy sharing of code across multiple platforms. You can ship faster and focus on details that really matter, making your app look and feel fantastic. Optimizing performance is a big part of this. Here is the story of how we made React Native app startup twice as fast.

React Native Blog
Stay up-to-date with the latest React Native news and events.

Introducing Hot Reloading

React Native's goal is to give you the best possible developer experience. A big part of it is the time it takes between you save a file and be able to see the changes. Our goal is to get this feedback loop to be under 1 second, even as your app grows.

Making React Native apps accessible

With the recent launch of React on web and React Native on mobile, we've provided a new front-end framework for developers to build products. One key aspect of building a robust product is ensuring that anyone can use it, including people who have vision loss or other disabilities. The Accessibility API for React and React Native enables you to make any React-powered experience usable by someone who may use assistive technology, like a screen reader for the blind and visually impaired.

React Native: Bringing modern web techniques to mobile

We introduced React to the world two years ago, and since then it's seen impressive growth, both inside and outside of Facebook. Today, even though no one is forced to use it, new web projects at Facebook are commonly built using React in one form or another, and it's being broadly adopted across the industry. Engineers are choosing to use React every day because it enables them to spend more time focusing on their products and less time fighting with their framework. It wasn't until we'd been building with React for a while, though, that we started to understand what makes it so powerful.

\ No newline at end of file