タグ

ブックマーク / mae.chab.in (6)

  • Reactの「Render Props」について – 公式ドキュメント日本語訳 | maesblog

    昨年から Reactl界隈で「Render Props」という言葉をよく目にするようになりました。Render Props は、React のコンポーネントを再利用可能な方法でその状態や振る舞いをカプセル化するためのパターンのひとつです。同様の目的でよく使われるパターンに Higher-Order Components (HOC) がありますが、Render Props は HOC の問題を解決したもので、今後主抽象化パターンの流になりうると言われています。この Render Props を全然追いきれていなかったので、今回 React の公式ドキュメントの『Render Props』 の部分を日語に訳してみました。 The term “render prop” refers to a simple technique for sharing code between React co

    Reactの「Render Props」について – 公式ドキュメント日本語訳 | maesblog
  • TypeScriptでVue.jsを書く – Vue CLIを使った開発のポイントを紹介

    2018年8月11日に新しいメジャーバージョンとなるVue CLI 3.0がリリースされました。Vue CLI 3では、公式にTypeScriptをサポートし、 TypeScriptを利用するプロジェクトの生成に対応しました。これにより、TypeScriptVueを気軽に試せるようになったということで、今回ちょっとどんなものか試してみることにしました。試した中でポイントとなりそうな部分をまとめてみたので紹介します。なお、私は普段はAngularTypeScriptを書いているため、TypeScriptのクラス構文を使った説明になっています(クラス構文を使わなくても、TypeScriptvue.jsを書くことはできます)。 目次 はじめに – Vue CLI + TypeScript TypeScript + Vue サンプル Vue CLIでTypeScriptプロジェクトを生成する

    TypeScriptでVue.jsを書く – Vue CLIを使った開発のポイントを紹介
  • React 16 β版 – 公式ドキュメント日本語訳

    2017年7月24日に待望のReact 16のβ版(ベータ版)が公開テスト用として公開されました🎉。それに合わせてReactGitHubのリポジトリでも専用のissue(#10249)が立てられました。そこにβ版のリリース内容について詳しい記述がありましたので、日語に訳してみました。来たるReact 16の正式リリースに備えて、参考にしてもらえればと思います。 Getting Started: はじめにInstallation Instructions: インストール手順The beta has been published to NPM with the tag “next”. Regular NPM installs will continue to use the 15.6 release. To install the beta use: β版は”next”タグがついた状態で

    React 16 β版 – 公式ドキュメント日本語訳
  • 覚えておきたいReactの実装でよく使う基本的な構文(書き方)

    Reactを勉強し始めた頃は、その概念はわかったとしても、実際にコードを書いてみようとすると、どう書いていいかわからず手が止まってしまう人もいるかと思います。jQueryをバリバリ書いていた人でも、Reactを書こうとすると最初は戸惑ってしまうっていうのはよく聞く話です。ある意味Reactの書き方は特殊です。まずは書き慣れる必要があるかと思います。今回の記事では、初心者向けとしてReactの実装でよく使う基的な構文を紹介します。今回紹介する構文を覚えれば、ほぼほぼReactの仕組みも理解できるようになり、その後の学習も楽になるかと思います。ぜひ参考にしてみてください。 ファイルを読み込む時の構文ReactUI(ユーザーインターフェース)を実装する際は、一般的にnpm経由でreactreact-domをプロジェクトディレクトリ内にインストールして、ファイルに読み込んで使うようにします。

    覚えておきたいReactの実装でよく使う基本的な構文(書き方)
  • Relay チュートリアル【日本語翻訳】

    先日、Facebookがデータ駆動型のReactアプリケーションの開発を行うためのJavaScriptフレームワーク「Relay」のTechnical Preview版を公開しました。さっそくですが、自分の理解を深めるためにRelayのチュートリアルを和訳しました。せっかくなのでブログにもアップしておきます。誤訳などもあるかと思いますが、Google翻訳よりはマシだと参考にしていただければと思います。原文もつけておいたので、翻訳がおかしなところもなんとなくニュアンスを掴んでいただければと思います。 Relayチュートリアルに行く前に、Relayの基礎知識RelayRelayは、「データ駆動型のReactアプリケーションを開発するためのJavaScriptのフレームワーク」です。RelayはReact同様、Facebook�が開発を進めています。Relayを使うと、サーバから取得したデータを

    Relay チュートリアル【日本語翻訳】
  • React.jsチュートリアル【日本語翻訳】

    フロントエンドの世界では今React.jsが注目されてきていて、自分もチュートリアルをやる機会があって、その際に日語訳(和訳)を簡単に作っていました。まだこのチュートリアルに関して翻訳されたものがなさそうだったので、ちょっと手直ししてブログにアップすることにしました。誤訳などもあるかと思いますが、Google翻訳よりはマシだと思ってお使いいただければと思います。 当記事のチュートリアルは「React v0.13」当時の古い内容のものとなっています。最新の「React」の公式チュートリアルの翻訳記事は以下となります。 Reactチュートリアル: Intro To React【日語翻訳】 – maesblog React.js React.jsReactはFacebookが開発しているJavaScriptのフレームワークです。MVCで言う所のViewの部分に特化したフレームワークとなってい

    React.jsチュートリアル【日本語翻訳】
  • 1