作ったもの APIキーの取得 APIキーを登録 フォーム作成 動画取得 動画を表示する おわりに 作ったもの フォームに入力したキーワードに一致するYoutube動画を表示します。 APIキーの取得 Google Cloud PlatformからYoutube Data API v3 のキーを取得します。…

はじめに 以前にcreate-react-appで作成したReactアプリをテストしてみるというJestとEnzymeを使ってテストを行う記事を書きましたが、 今回は、以下の記事を参考にしてReact Testing Libraryを使ってみました。 本記事は実際に手を動かしてみた感想ですので…

正規表現は下記のようにスラッシュで囲まれたパターンからなる let pattern = /正規表現/; match() search() 正規表現パターン 単純な文字列にマッチするか /ABC/ どれか1文字マッチするか [ABC] 指定文字以外のどれか1文字にマッチするか [^ABC] 選択範囲の…

はじめに Redux Persist インストール Redux Persistを実装する index.js 使用オブジェクトのインポート Redux Persistの設定 persistReducerの作成 store, persistorの作成 PersistGate App.js Message.js Button.js はじめに React Reduxを使ってみる - BL…

Reduxとは 特徴 インストール Reduxのインストール React Reduxのインストール Reduxで用意するもの Store Provider Reducer 実際に使っていく create-react-appコマンドで雛形を作る サーバーを起動する ディレクトリ構造 index.js Store.js stateの用意 Re…

Vue.jsの一歩としてToDoリストを作ってみました。 下準備する HTML部分 Vueインスタンス 完成 最後に 下準備する 今回は、CDNを使っています。(2019/07/01) <script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js"></script> HTML部分 setTodayで日付を表示 v-forでtodos配列から一つずつオブジェクトを取得していく チェッ…

開発規模が大きくなり複雑になってくるので同じ処理をまとめる。 componentを用いて処理をまとめる 書式 実装 手順 componentを用いて処理をまとめる コンポーネント作成方法は、「グローバルに登録」「ローカルに登録」の2種類ありますが、今回はローカルに…

React Nativeでアプリを作ってみようと取り組んで、AsyncStorageで躓いたのでメモ React Native AsyncStorage 最後に React Native React Nativeは、JavaScriptのみを使用してモバイルアプリを構築できます。 Reactと同じデザインを使用しているため、宣言型…

Vue.jsとは JavaScriptのフレームワーク 手軽にSPAを作れる 詳しくは jp.vuejs.org 手順 Vue.jsのライブラリをCDNでインストール (バーションは2019/3/28現在) VueとHTMLを繋げる要素を作る Vueインスタンス作成 elオプション どのHTML要素と繋げるか dataオ…