サンプル開発

Reactサンプルアプリ開発 プラニングポーカー (6) Ajaxでプレイヤーリストをフェッチ

関数コンポーネントからAjax処理を行ってデータをフェッチする。useEffectを用いるのがよさそう。 Flaskのエンドポイントにaxiosを使ってAjaxリクエストを投げデータを取得・更新する。
サンプル開発

Reactサンプルアプリ開発 プラニングポーカー (5) 画面遷移

今回は、トップ画面からポーカーを行う「場」の画面への遷移を実装する。トップ画面は以下。 トップ画面 場名とニックネームを入力し「場を開く」をクリックすると、以下の画面に遷移するようにしたい。 場の画面 Flaskど...
サンプル開発

Reactサンプルアプリ開発 プラニングポーカー (4) 他のコンポーネントとの相互作用

次に、ボタン押下時のアクションを実装する。Reactのコンポーネント構成は以下のようになっている。 コンポーネント構造 「オープン」押下時に、各プレイヤーの手札をオープンするようにする。(この操作はテーブルの親しかできない。本...
サンプル開発

Reactサンプルアプリ開発 プラニングポーカー (3) 親コンポーネントへ反映

ポップアップでモーダル表示したデッキで選択されたカードを親コンポーネントへ反映させる。 モーダルダイアログに包含されるDeckコンポーネントの<div>タグにonClick属性を指定する(9行目)。このとき、カードに書...
サンプル開発

Reactサンプルアプリ開発 プラニングポーカー (2) モーダルダイアログ

プレイヤーのカードをクリックするとモーダルダイアログでデッキを表示するようにする。 モーダルダイアログでデッキを表示 モーダルダイアログにはreact-modalを使う。 $yarn add react-modal $y...
技術情報

Spockでジェネリックなインターフェースをモックするには

Spockは標準機能としてスタブ/モックを内包しているのでとても便利。以下のように簡単にモックを作成し、期待する振る舞いを定義できる。 // モックの作成 def mock = Mock(Foo) ...
一歩上のJava

キーブレイク処理をジェネリクスで汎用化する

業務アプリケーションでよくあるキーブレク処理を、ジェネリクスを使って汎用化する手順を紹介する。
サンプル開発

Reactサンプルアプリ開発 プラニングポーカー (1)始める

React/TypeScriptでプラニングポーカーのサンプルアプリを開発していく記録・その(1)。まずは作るアプリケーションのイメージを固め、ハリボテのUIを作った。webpackの設定に関する技術メモなど。
技術情報

[技術メモ] Flaskの静的コンテンツのパス指定

忘れないようにメモ。静的コンテンツのフォルダはstatic_folder="public"のように指定するが、これだけだとHTMLファイル中のリンクがhref="public/css/style.css"のようになってしまうので、stat...
Books

チーム・ジャーニー 第09話の感想

第09話は「塹壕の中のプロダクトチーム」。社長命令により3つのプロダクトが統合されることになり、太秦がその開発リーダーに指名される。POもそれぞれのプロダクトにいて、とりまとめるシニアPOなるものがいて、この混合チームをどう取りまとめてプ...
タイトルとURLをコピーしました