Firebaseの機能を順次試していきたいと思います。 FirebaseではAuthenticationを利用することで様々な認証を用いることができます。今回実装するメールアドレスの他に各種SNSやSMSなどにも対応可能です。Webの他にiOSやAndroidなどにも導入可能。 今回は単純…

FirebaseのHostingを利用すれば基本無料で静的なサイトを運用できます。 独自ドメインも追加でき、何らならSSL証明書も無料でついてくるという太っ腹。もしサイトが成長し膨大なアクセスが発生した場合は課金する必要がありますが、こちらがプラン変更しない…

しばらく見ないうちにFirebaseでできることが驚くほど増えていたので、今回からしばらくFirebaseを触ってみたいと思います。 Firebaseが何たるかは公式サイトをご覧ください。 firebase.google.com プロジェクトを作成する Firebaseのコンソールへログインし…

「はじめてのReact」一覧に戻る 3回に渡ってお送りしたToDoアプリ開発も最終回。今回はAjaxを利用しデータをサーバに保存してみます。 Propsのデータ型をチェック src/header.js src/todocreate.js src/todolist.js src/todoitem.js データをサーバ側で管理…

「はじめてのReact」一覧に戻る 前回に引き続き今回もToDoアプリを作っていきます。目標としてはフォームの使い勝手を向上させつつToDoの削除に対応するところまでとなります。 フォームを改良する Submitイベントに対応 Validationを行う テキストボックス…

「はじめてのReact」一覧に戻る 前回準備した環境を使って、早速Webアプリを作ってみたいと思います。こういうときはToDoアプリを作るのが伝統となっていますので、それに習いますｗ なお、本来であればテストコードを書きながら進めるべきだとは思いますが…

「はじめてのReact」一覧に戻る ここまでご紹介してきたサンプルは学習やちょっとした検証には使えるのですが、実際に本番環境で動かすのには向いていません。というわけで今回は本番環境で動かすコードを作成するための開発環境を準備してみたいと思います…

「はじめてのReact」一覧に戻る 昨今のWebアプリではWebAPI(RESTful API等)をAjaxなどで叩きデータを取得する、もしくはデータを保存するといった行為を日常的に行っているわけですが、今回はAjaxでデータ取得し表示するまでに挑戦してみます。 MonsterView …

「はじめてのReact」一覧に戻る これまで何の前触れもなくチラッと出てきたComponentにCSSを適用する方法について、いよいよ解説したいと思います。まぁブログの構成(順番)を間違えてるだけなんですけどねｗ もっと早く取り上げるべきだったｗ ダイアログ Co…

OSSのプロジェクト管理ツールである「Redmine」を利用している方も多いと思いますが、デフォルトのままだと投稿されたURLをクリックするとRedmineサーバのFQDNが参照元(REFERER)として相手方サーバに渡されてしまいます。 以下はGoogle Analyticsで「参照サ…

「はじめてのReact」一覧に戻る これまでは、最終的にrender()する際にはのようにタグで何らかの文字列や要素を囲わない状態でした。今回はそこから一歩進んでHello!のように何らかの要素を挟んでみたいと思います。 ダイアログ Component サンプル 実行結果…

「はじめてのReact」一覧に戻る いよいよReactの真骨頂っぽいところに足を突っ込んでみます。前回はComponentの中にComponentが1つだけ内包されていましたが、これを複数にしてみたいと思います。 西暦・和暦 相互変換Component サンプル 実行結果 解説 状態…

「はじめてのReact」一覧に戻る 今回はユーザーが入力した値を別のComponentにリアルタイムに渡すサンプルを作ってみたいと思います。 カラーチェッカーComponent サンプル 実行結果 解説 内包するComponentに値を渡す 書籍 参考ページ カラーチェッカーComp…

「はじめてのReact」一覧に戻る Reactでフォームを使ってみようシリーズも佳境に差し迫った第4弾。今回はラジオボタンを触ってみます。 時限爆弾の解体ラジオボタンComponent サンプル 実行結果 解説 ラジオボタンの生成方法 書籍 素材 参考ページ 時限爆弾…

昔からの習性でコーディングする際のインデントはタブ派なんですよ、スペースの数は4つ。 ところが… GitHubでソース見るとタブがスペース8つ分になる ブラウザのデフォルト動作 URLの最後に?ts=4とかつけると変更はできるが… JavaScript界隈だとスペース2個…

確定申告終了まで残り68日となりました（執筆時点） みなさん順調に入力進んでますか？こちらは地獄ですｗ 今回は自分でも時々わからなくなる勘定科目についてメモ代わりにまとめました。 定期的に思いついたら更新したいと思います。 前提のお話 私は大きく…

WordPressの記事はMarkdownに対応するプラグインを入れて書いてるんですが、エディタが等幅フォントになってないことでテーブルを書く際にずれまくって終始イライラすることが増えたので対策しました。 今回はWordPress側には一切手を入れないため、突如Word…

過去、AWSを大きな組織や複数のプロジェクトで利用する場合、AWSのアカウント自体を複数用意して利用していたわけですが、2017年2月に登場した「AWS Organizations」を利用すると、請求先の一元化や、ユーザーの権限管理が一括して行えます。 考え方 これま…

もうどこからアカウント情報が漏れるかわかりませんからね。昨年GitHubの2段階認証の設定をしたように、今回はAWSのアカウントにも施したいと思います。特にルートアカウント。 認証方法 詳しくはAWSの「多要素認証」のページに書かれていますが、実質的にス…

「はじめてのReact」一覧に戻る Reactでフォームを使ってみようシリーズも第3弾。今回のテーマはチェックボックスです。 都道府県チェックボックスComponent サンプル 実行結果 解説 デフォルトでチェックしたい チェック状態を確認したい 注意点 Stateは最…