より良いドキュメンテーションに向けて

優れた開発者体験には、優れたドキュメンテーションが不可欠です。良いドキュメンテーションを作成するには多くの労力がかかります。理想的なドキュメンテーションは、簡潔で、役立ち、正確で、完全で、そして楽しいものです。最近、私たちは皆さんのフィードバックに基づいてドキュメンテーションを改善するために懸命に取り組んできました。そこで、私たちが行った改善点の一部を皆さんと共有したいと思います。

インラインサンプル

新しいライブラリ、新しいプログラミング言語、または新しいフレームワークを学ぶとき、初めて少しのコードを書き、試してみて、それが機能するかどうかを確認し、それが実際に機能する...という美しい瞬間があります。あなたは何か本物を作り出したのです。私たちはその本能的な体験をドキュメンテーションに直接組み込みたいと考えました。このように。

import React, { Component } from 'react';
import { AppRegistry, Text, View } from 'react-native';

class ScratchPad extends Component {
  render() {
    return (
      <View style={{flex: 1}}>
        <Text style={{fontSize: 30, flex: 1, textAlign: 'center'}}>
          Isn't this cool?
        </Text>
        <Text style={{fontSize: 100, flex: 1, textAlign: 'center'}}>
          👍
        </Text>
      </View>
    );
  }
}

AppRegistry.registerComponent('ScratchPad', () => ScratchPad);

Devin Abbottの協力を得たreact-native-web-playerモジュールを使用したこれらのインラインサンプルは、React Nativeの基本を学ぶための素晴らしい方法だと考えています。そして、新しいReact Native開発者向けのチュートリアルを、可能な限りこれらを使用するように更新しました。ぜひ試してみてください。もし、サンプルコードのほんの少しの部分を変更したらどうなるか、ずっと知りたかったなら、これは探求するのに本当に良い方法です。また、開発者ツールを構築していて、自分のサイトにライブのReact Nativeサンプルを表示したい場合は、react-native-web-playerがそれを簡単にします。

コアとなるシミュレーションエンジンは、Nicolas Gallagherのreact-native-webプロジェクトによって提供されています。これは、TextやViewのようなReact Nativeコンポーネントをウェブ上で表示する方法を提供します。コードベースの大部分を共有するモバイルおよびウェブ体験の構築に興味がある場合は、react-native-webをチェックしてみてください。

より良いガイド

React Nativeの一部の機能には複数の実現方法があり、より良いガイダンスを提供すべきだというフィードバックをいただきました。

新しいナビゲーションガイドでは、異なるアプローチを比較し、Navigator、NavigatorIOS、NavigationExperimentalのうちどれを使用すべきかについてアドバイスしています。中期的には、これらのインターフェースの改善と統合に取り組んでいます。短期的には、より良いガイドが皆さんの生活を楽にすることを願っています。

ボタンのようなインターフェースを作成する基本的な方法と、タッチイベントを処理するさまざまな方法を簡潔にまとめた、タッチ処理に関する新しいガイドも作成しました。

もう一つ取り組んだ分野はFlexboxです。これには、Flexboxでレイアウトを処理する方法と、コンポーネントのサイズを制御する方法に関するチュートリアルが含まれています。また、地味ですが、うまくいけば役立つ、React Nativeでレイアウトを制御するすべてのプロパティのリストも含まれています。

はじめに

マシンにReact Native開発環境をセットアップし始めると、多くのもののインストールと設定を行う必要があります。インストールを本当に楽しくエキサイティングな体験にすることは困難ですが、少なくともできるだけ迅速かつ簡単に行えるようにすることはできます。

新しいGetting Startedワークフローを構築しました。これにより、開発用OSとモバイルOSを事前に選択でき、すべてのセットアップ手順を1つの簡潔な場所にまとめることができます。また、インストールプロセス全体を確認し、すべてが機能することを確認し、すべての決定ポイントに明確な推奨事項があることを確認しました。無邪気な同僚でテストした結果、これは改善であると確信しています。

また、既存のアプリにReact Nativeを統合するためのガイドにも取り組みました。Facebookアプリ自体のように、React Nativeを使用する最大規模のアプリの多くは、アプリの一部をReact Nativeで構築し、残りを通常の開発ツールで構築しています。このガイドが、より多くの人々がこの方法でアプリを構築するのを容易にすることを願っています。

皆様の協力が必要です

皆様のフィードバックは、私たちが何を優先すべきかを知る上で役立ちます。このブログ記事を読んで、「より良いドキュメント？ふん。Xのドキュメントはまだゴミじゃないか！」と思う人もいるでしょう。それは素晴らしいことです。私たちはそのエネルギーを必要としています。フィードバックの種類によって、私たちにフィードバックを伝える最善の方法は異なります。

説明が不正確だったり、実際に動作しないコードなど、ドキュメントに間違いを見つけた場合は、イシューを提出してください。「Documentation」というタグを付けて、適切な担当者に届けやすくしてください。

具体的な間違いではないが、ドキュメントの何かが根本的に分かりにくい場合は、GitHubのイシューにはあまり適していません。代わりに、助けが必要なドキュメントの分野についてCannyに投稿してください。これは、ガイドの執筆など、より一般的な作業を行う際に、私たちが優先順位を付けるのに役立ちます。

ここまで読んでいただき、React Nativeをご利用いただきありがとうございます！