Just A Programmer

JavaScriptの値を消費するジェネレータがややこしい件

社内の輪読会で取り扱っている『JavaScriptモダンプログラミング完全ガイド』の第12章「イテレータとジェ…

2022/02/06 00:02

モダンJavaScriptプログラミングのテクニック

概要 社内の輪読会で『JavaScriptモダンプログラミング完全ガイド』を読んでいくことになった（推薦者は僕…

2021/09/06 23:00

Javaのstaticメソッドの使いどころ

はじめに 先日のJJUGナイトセミナー『オブジェクト指向プログラミング入門』（アーカイブ動画）の後半の座談会で…

2021/06/17 22:24

【読書記録】Compete Guide to Test Automation (3)

前回の投稿はこちら。ようやっと読了したので、9章以降の概要と感想をまとめる。9章以降は第2部となっており、テス…

2021/06/04 00:20

JJUG CCC 2021 Springで登壇します

2021/5/23(日)にオンライン開催されるJJUG CCC 2021 Springで登壇します。『Spoc…

2021/05/10 18:11

【読書記録】Complete Guide to Test Automation (2)

前回の投稿はこちら。 3章 People and Tools（人々とツール） テスト自動化にあたっては、正しい…

2021/05/06 22:43

【読書記録】Complete Guide to Test Automation (1)

Complete Guide to Test Automationというテスト自動化に関する本（洋書）を読んで…

2021/04/07 00:25

【読書記録】アジャイルソフトウェア開発の奥義(6) ソフトウェアを腐敗させないためのSOLID原則 L

OODの名著『アジャイルソフトウェア開発の奥義』を久しぶりに読み返しながら、少しずつ感想やら気付きやらをブログ…

2021/03/28 20:05

【読書記録】アジャイルソフトウェア開発の奥義(5) ソフトウェアを腐敗させないためのSOLID原則 O

ちょっと間が空いてしまったが、前回に続きSOLID原則。 第9章 オープン・クローズドの原則（OCP） オープ…

2021/03/28 17:01

【読書記録】アジャイルソフトウェア開発の奥義(4) ソフトウェアを腐敗させないためのSOLID原則 S

前回の記事 引き続きボブおじさんの名著を読み直している。 第7章 アジャイル設計とは？ ソフトウェアの仕様は常…

2021/02/19 06:52

【読書記録】アジャイルソフトウェア開発の奥義 (3)

ボブおじさんの名著『アジャイルソフトウェアの奥義』を読み返しながら感想などをつらつらと書き連ねる、その3。 【…

2021/02/07 18:04

【読書記録】アジャイルソフトウェア開発の奥義 (2)

ボブおじさんの名著『アジャイルソフトウェアの奥義』を読み返しながら感想などをつらつらと書き連ねるシリーズ2回目…

2021/02/06 00:20

【読書記録】アジャイルソフトウェア開発の奥義 (1)

ボブおじさんことロバート・C・マーチンによる名著の第2版。長らく積ん読状態だったが、少しずつ読み進めながら感想…

2021/02/03 22:21

JavaScriptの配列のソートの話 (3) – lodash _.orderBy()

前回の記事lodashのorderByについて書くのを忘れていたので簡単に。sortByよりも柔軟なソートを手軽に行うことができる。 it('_.orderBy()でソートできる', () => {

2021/01/24 15:29

Bookレビュー：Test-Driven React

本の概要タイトルのとおり、テスト駆動でReactアプリケーションを開発していく方法を学べる本。紙の本だと170ページとのことで、分量はそれほどでもない。ただ、チュートリアル形式の本なので、実際に手を動かしながら読んでいくのがよい。そうすると

2021/01/24 12:25

JavaScriptの配列のソートの話 (2) – lodash _.sortBy()

の続き。Array.prototype.sort() は操作が破壊的である点や、柔軟なソートに耐えられないという決定があり、多くの場面では使いづらい。プリミティブ要素のソートまずは _.sortBy() から。_.orderBy() はま

2021/01/19 18:56

JavaScriptの配列のソートの話 (1) – Array.prototype.sort()

JavaScriptでの配列のソートについて簡単にまとめてみた。Array.prototype.sort()配列自体のsortメソッドには通常比較関数を渡すが、何も渡さなかった場合は要素が文字列に変換されてUTF-16のコード順でソートされ

2021/01/18 22:34

Jestを試してみる

インストールとテスト実行Jestを使ったことがなかったので、create-react-appを使って簡単に試してみたメモ書き。プロジェクトの作成。$ npx create-react-app try-jest --template type

2021/01/12 17:11

Azure Static Web Apps にReactアプリをデプロイする方法

Azure Static Web Apps（プレビュー版）を使い、ReactアプリおよびAzure Functionsで動作するAPIをまとめてデプロイする手順についてまとめます。

2020/11/17 19:16

SpringでコレクションをDIする方法

SpringのDIでコンポーネントをコレクション型で受け取るのは簡単であるが、Spring 4系だと受け取るコンポーネントが0件の場合にUnsatisfiedDependencyExceptionが発生するという問題があった。その回避方法を調べたので備忘録として残す。

2020/10/13 23:14

React Hooks入門チュートリアル

React Hooksの入門チュートリアル（TypeScriptバージョン）です。Google Books APIsを利用して書籍情報を検索し、リストに保存する簡単なアプリケーションをチュートリアル形式で開発しながら、React Hooksの中で最も重要なuseStateフックとuseEffectフックの使い方を学びます。

2020/09/22 09:26

『React Explained』の感想 – React初学者にお薦めのチュートリアル本 –

『React Exlpained』を読了したのでレビューをまとめた。チュートリアル形式の書籍で、React初学者の学習には非常に役立つ書籍と思う。 リファクタリングの章で一部期待通りに動作しないコードがあったが、全般的には誤植等も少なく、信頼できる本だと思った。

2020/06/07 20:57

Reactサンプルアプリ開発 プラニングポーカー (16) react-i18nextによる多言語対応

Reactアプリを多言語対応するためのライブラリはいくつかあるが、なかでもreact-i18nextは簡単に利用可能なライブラリだ。プラニングポーカーアプリに組み込んでみた。

2020/05/31 11:02

Reactサンプルアプリ開発 プラニングポーカー まとめ

React Hooksの勉強のため、プラニングポーカーを題材にしたサンプルアプリを開発した。ソースコードはGitHubにアップしてある。また、サンプルアプリはHerokuにデプロイしてある（無料枠だが）。

2020/05/25 01:18

Reactサンプルアプリ開発 プラニングポーカー (15) デッキのタイプを変更 – Contextの利用

今回のサンプル開発では、createContextによるコンテキスト情報の作成やuseContextによる利用を試してみた。

2020/05/22 23:31

Reactサンプルアプリ開発 プラニングポーカー (14) カスタムフックを使った処理の再利用

React Hooksを使った関数コンポーネントにて、繰り返し使われる処理を再利用するにはカスタムフックという仕組みを利用することができる。 プラニングポーカーアプリで実際に試してみた。

2020/05/17 17:52

Reactサンプルアプリ開発 プラニングポーカー (13) Flask-SocketIOでWebSocket通信のグルーピングを行う

チャットアプリにおけるチャットルームのように、複数のクライアントをまとめたグループを作成してその中でWebSocket通信を行いたい。 Flask-SocketIOのルーム機能を用いて検証を行ってみた。

2020/05/16 21:33

Reactサンプルアプリ開発 プラニングポーカー (12) React Transition Groupによるアニメーション

Reactコンポーネントに対して、CSSトランジションによるアニメーション効果を付けるにはどうするか？ React Transition Groupライブラリを使った方法をサンプルアプリで検証してみた。

2020/05/16 21:09

Reactサンプルアプリ開発 プラニングポーカー (11) カードのオープン、次のゲーム

プラニングポーカーのサンプルWebアプリ開発を進めながら、これまで学んだReact Hooksによるコンポーネント開発やWebSocketによる双方向通信の実装などを復習する。

2020/05/13 00:21

Reactサンプルアプリ開発 プラニングポーカー (10) Bidの通知

WebSocketのイベント受信・画面更新処理はまさに副作用でありuseEffectを使って実装するが、注意すべき点がいくつかある。プラニングポーカーアプリの実装サンプルコードをもとに解説。

2020/05/09 22:38

Reactサンプルアプリ開発 プラニングポーカー (9) Redisを使う

プラニングポーカーの場の情報（場名や参加プレイヤー名）をFlaskアプリケーションのトップレベルの変数に格納していたが、これだとHerokuにデプロイしたときにちゃんと動作しないので、Redisに永続化することにする。ローカル環境ではDoc

2020/05/06 15:52

Reactサンプルアプリ開発 プラニングポーカー (8) WebSocketで通知する

Flask-SocketIOとSocket.ioを利用したWebSocket双方向通信の実装。

2020/05/05 22:14

Reactサンプルアプリ開発 プラニングポーカー (7) 他のプレイヤーが参加できるようにする

前回は、親が場を開くと場の画面へ遷移し、Ajaxで取得したプレイヤーリストを表示するところを実装した。今回は、この場に対して他のプレイヤーが参加できるようにする。開いた場のURLは親が何らかの手段で伝達済みであるとし、そのURLにアクセスす

2020/05/03 11:32

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

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

2020/04/29 15:27

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

今回は、トップ画面からポーカーを行う「場」の画面への遷移を実装する。トップ画面は以下。トップ画面場名とニックネームを入力し「場を開く」をクリックすると、以下の画面に遷移するようにしたい。場の画面Flaskど素人なので、基本的なところから調べ

2020/04/23 23:51

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

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

2020/04/19 22:58

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

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

2020/04/19 10:40

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

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

2020/04/18 13:39

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

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

2020/04/17 21:30