Reactjs

技術書典 6 に行ってきた

また React Native の本を出していました。電子書籍版は次から参照できます。ご興味があればどうぞ

tweet によるダイジェストです。

久々に会えた方々といろいろお話できて楽しかったです。またかまってやってください。

お釣りを用意できなかったのは完全にミスですごめんなさい。 ¥500 という値段設定をしておきながら五百円玉を用意しないストロングスタイルを受容してくださったみなさんや

もっとみる

イマドキの React Native での SVG ファイルの取り扱い方

これは Farmnote Advent Calendar 17 日目の記事です。

TL;DR

今は SVGR を使って React component に変換して使おう。多分そのうち react-native-svg でファイル読み込みがサポートされる予定なのでそちらに移行しよう。

現状確認

React Native で SVG を書き下したい場合は react-native-svg とい

もっとみる

React Native で React Hooks を使うにあたっての考察

これは Farmnote Advent Calendar 9 日目の記事です。

TL;DR: アプリの目的やライフサイクル、投資可能なコストを意識して使うかどうかを決めよう

前回、 React Native で React Hooks を使うための方法を紹介しましたが、すべてを Hooks で置き換えるべきか ? という問いを考えたたのでつらつらと書き連ねてみます。

Basic Hooks

もっとみる

React Native で React Hooks を使う

この記事は Farmnote Advent Calendar 2018 の 4 日目の記事です。

前回はエンジニアと自己紹介しておきながらエモい記事を書いたのでエンジニアらしく技術の話題です。今年の ReactConf で発表された React Hooks を React Native でも使ってみよう、という記事になります。

React Hooks とは

React Hooks の概要につ

もっとみる

React Hooks for React Native

I have been satisfied myself to share experiments about React Hooks on React Native finally.

refer: https://reactjs.org/docs/hooks-intro.html

Getting Started React Hooks on React Native

Here is a s

もっとみる

React.js チュートリアル[超入門] 後半まとめ

後半部分のダイジェストです。ザックリと内容を知ってから購入したい人やチュートリアルを終えて、何をしてきたか振り返りたい人に向けて書きました。まず完成品はこちら↓。

では早速始めます。

# 06 新しいプロジェクトを始める

ここでは、create-react-appで生成されるフォルダーを自分で開発しやすい状態に変更する作業をしました。

# 07 ヘッダーの作成

React流のinput

もっとみる

React.js チュートリアル[超入門] #06から#14(最終章)

前半ではReact.jsの基礎を学びました。後半では、YouTubeAPIを使って猫動画検索サービス「NekoTube」を作っていきます!他のReact.js用チュートリアルは「to-doリスト」や「カウンター」などのシンプルな作品をテーマにすることが多いので、敢えてより複雑で実践的な動画サイトを作ることにしました。完成物がこちら。

このYouTubeAPIを使ったチュートリアルは、udemyで

もっとみる

React.js チュートリアル[超入門]  前半まとめ #1-5

このレッスンでは、今まで進めてきたチュートリアルの前半部分をざっくりまとめていきます。必要のない人はスキップしていただいて結構です。

# 01プロジェクトの始め方

ここでは、React.jsの最初の課題である環境構築を行いました。といってもnode.jsとnpmのインストール以外は、create-react-appが一発でやってくれるので楽勝でしたね。

// よく使うnpmのコマンド$ np

もっとみる

React.js チュートリアル[超入門] #05 Stateを使った情報管理

前回のレッスンでは、stylingの方法について学びました。今回は、React特有のコンセプトであるstateをつかった情報管理を学習します。

前回までの作業用フォルダーは、僕のgithubから確認/ダウンロードできます。

このレッスンの目標
・Stateのコンセプトを理解する
・Class component vs functional component
・Stateを初期化してみる
・S

もっとみる

React.js チュートリアル[超入門] #03 Propsを使ってみる

前回のレッスンでは、Componentを一から自分で作ってみました。今回は、propsについて学びます。

このレッスンの目標
・Propsを理解する
・Title.jsにテキストをpropsとして渡してみる
・inline-styleを渡してみる
・event handlerを渡してみる
・props.childrenを使う

前回までの作業フォルダーは、僕のgithubから確認/ダウンロードで

もっとみる