FacadeとMediatorは似ている?~デザインパターンのとらえ方~

f:id:ecb_smiyahara:20201012183634p:plain


こんにちはecbeingでアーキテクトをやっている宮原です。


皆さんデザインパターンについてはどのくらいご存知でしょうか?
「かなり自信がある」という方も「名前は聞いたことあるけど・・・」という方もいると思います。

今日はそんなデザインパターンの中から「Facade」と「Mediator」を取り上げます。

FacadeとMediatorの類似性??

ある程度デザインパターンに詳しい方なら、「FacadeとMediatorは似ている」というタイトルを読んで『あれ、そうだったっけ?』となるかもしれません。


この考え方は自分が発想したものではありません。
下記に紹介する書籍「アジャイルソフトウェア開発の奥義(以下「アジャイル奥義本」)」の第15章に書かれている内容なのです。
www.amazon.co.jp

『15章:FacadeパターンとMediatorパターン』
この章で取り上げる2つのパターンの目的は共通して言える。
どちらのパターンも、ある種の方針*1をオブジェクトに強制する。
Facadeパターンは上から方針を強制し、Mediatorパターンは下から方針を強制する。Facadeパターンは視覚的にとらえることができる制約的な方法であるのに対し、Mediatorパターンは視覚的にとらえることはできない方法で方針を強制する。
(アジャイルソフトウェア開発の奥義 p.223 より)

この抜粋した文章を読んで、『うんまあそうだよね』という感想をもった方。
申し訳ありません。
当記事はこの抜粋文章をこのあと延々と説明をするだけの記事です。
得るものはないのでそっ閉じして下さい。


それ以外の『日本語は分かるが意味がわからん』という感想を持った方、あなた達こそがこの記事がターゲットとする読者の方々です。


是非最後までお付き合い下さい。

*1:ここで使われる「方針」とは、「DBをオープンしたらクローズする」「入出力の文字コードはUTF-8を使用する」などプログラム上でのルールのことです。

続きを読む

SOLID原則をまとめてみた Part1 ~SOLID原則とはなんぞや編~

  • はじめに
  • SOLID原則とは
  • どうしてSOLID原則が生まれたのか
    • ダメなソフトウェア設計の4つの原因
      • Rigidity-剛性
      • Fragility-脆弱性
      • Immobility-不動性
      • Viscosity-粘性
    • 本当の原因
    • どんな変更が設計をダメにするのか
  • おわりに&次回記事に続く…

はじめに

はじめましてorこんにちは!
ecbeing2年目、R&D部門所属の浦…改め蓑代です。
※結婚して名前変わっちゃいました

これまでは、Dockerの記事やスクラムに関する所感記事、JavaScriptライブラリに関する記事を書きました。
blog.ecbeing.tech

そして今回…というより本シリーズでは、泣く子も黙る『Clean Architecture』本を参考に…。
www.amazon.co.jp ソフトウェア設計の5つの原則として名高い「SOLID(ソリッド)原則」についてまとめていこうかと!

…既にSOLID原則をご存じの方は、「すごく難しい話題をまとめるんだな」と察していただけましたかね…?

SOLID原則は「原則」と名が付いているように、非常に概念的な話が多く。
※具体的な実装の話ではなく、もっと上位の概念の話が多い…という感じです

実は筆者は新卒のころにSOLID原則について学ぶ機会があったのですが…。
趣味でプログラミングしてた程度の知識しか持ってなかったからか、さっぱり身につかず。
そんな状態でSOLID原則を見ても、2週間後には「SOLIDのSってなんだっけ…」となるくらいに頭から消え去っちゃいました。

しかし、そんな筆者も今年で2年目(とちょっと)。
様々なプロダクトにプログラマとして関わってきた今の筆者なら、以前よりもSOLID原則の事が分かるようになる…と淡い希望を抱き、まとめてみようと決心した次第です。

後、社内の凄腕アーキテクトの青木さん(めっちゃすごい)が、こんなことを話してくれ…。
※筆者の要約なので、これをまんま話したわけではないです

世の中の様々なアーキテクチャを学ぶと、新技術を学ぶときに「その技術がどんなアーキテクチャを採用したか」が分かるようになる。
例えばMVVMを知っていれば、Vue.js製のプロダクトを見た時に「画面上へどんなデータが出力されるのか」はViewをたどれば見つける事が出来る。
「どこのフォルダやファイルにどの様な処理が書いているか」が、その技術を知らなくても推測できるようになるのだ。(ここ重要)
十分な知識と良く練られた良質なソフトウェアであれば、僅かなコードを見るだけで何のアーキテクチャを採用したのかが分かるようになり…。
そこまでのレベルにたどり着くと、新技術のinput速度が圧倒的に早くなる。

日進月歩が激しいこの業界で、爆速input力を身につけられればエンジニアとしてものすんごい強みになりそうだなと思い。
筆者もそうなりたい!と強く思ったというのも動機です。
((というかこっちが本命

その取っ掛かりにまず、SOLID原則を学んで行こうかなと。

…序章が長くなってしまいました…。
早速本題、「SOLID原則をまとめてみた」に入っていきましょう!

続きを読む

(元)データサイエンティストらしく、見える化をしてみたって話

f:id:ecb_tkaihatsu:20200730174359p:plain

この記事は前回(TSTSTS)の続きです。

前回の記事は ↓↓↓↓↓こちら↓↓↓↓↓

blog.ecbeing.tech

はじめに

ブンブンHello World.

最近はフロントエンドよりのコーディングにハマりつつある開発です。

どうせフロントエンドやるなら、見た目に凝った何かを入れたい。

だってフロントエンドだもの。

そんな感じで今回は、実行結果をグラフにしてそれっぽい感じにする方法をまとめたいと思います。

見える化、出来ていますか?

  • はじめに
  • 前回までのあらすじ
    • TS入門してみた
    • 課題点
  • vue-chartjs
    • Vue.js
    • vue-chartjs
  • 何はともあれ実装
    • 環境構築
    • vue-chartjsのコーディング
    • 合☆体
  • 結果
  • おわりに
続きを読む

バーコードリーダーをブラウザから使えるようにしたい!JSのバーコードリーダーライブラリを調査しました

  • はじめに
  • 技術調査まとめ
    • 余談: サーバーサイドで何とかする選択肢について
  • QuaggaJSについて
    • QuaggaJSの素敵ポイント
    • QuaggaJSの注意ポイント
  •  まとめ

はじめに

はじめましてorこんにちは!
ecbeing2年目、R&D部門所属の蓑代です。

前回や前々回には、Dockerの記事やスクラムに関する所感記事を書きました。
blog.ecbeing.tech blog.ecbeing.tech

そして今回は…技術寄りな記事となります。
具体的には、「バーコードリーダーが実装可能なJavaScriptライブラリについて」まとめていこうかと思います!

…というのも、半年前程に自分が所属するプロジェクトから「ブラウザベースでバーコードリーダーを実装してほしい」というオーダーがありまして。
また、「アプリ形式ではなく ブラウザから 利用したい」という条件付き。
((アプリ形式なら実践してみた系の記事はわんさかあるんですけどね

なぜこの様な条件が付いたかというと…。
当時の(今もですが)プロダクトはブラウザベースで稼働するものでして。
バーコードリーダーのためだけに、わざわざiOSやAndroid用のアプリを作るのは高コストだという背景があります。

「ブラウザベースでバーコードリーダーを実装してみた」系の記事は意外と少なく…。
中々いいJSライブラリが見つかりませんでしたが、それでも何とか3つほどライブラリを見つけられたので、こうして記事にまとめてみた次第です。

前置きが長くなりましたが…それでは記事本編へ参りましょう!

続きを読む

Microsoft Teamsで何ができるの??

f:id:ecb_ssakagami:20200401185857j:plain



初めまして!シングルファーザーで時短勤務をしているガミさんです
このご時世、娘っ子の臨時休校やら何やらでテレワークをしていてあまり上京してきていませんが元気です

さて、本題です。
本来RTJ(リテールテックジャパン)でマイクロソフトさんと協業で ブース出展するはずだったのですがコロナの影響で出展停止に なってしまったのでここで少し技術情報が共有できればいいかなと ネタが少し硬いのでLINEチャット風でお送りましす!


天の声
えらいひと
RTJに出店するからTeams連携よろー
ほえー
何すりゃええんやろなぁ
ユーザが持ってきた写真をTeamsで
画像検索して商品詳細画面に案内したろ
ついでに在庫確認できますってシナリオでええんかの・・・

あとは売り場にカメラでも付けて
顔認証から年代と性別集計して
PowerBIで分析できるようにしたろ!
(承知しました!)
既読
0:30
えらいひと
心の声と逆やで
まぁそれでええで
期限は来月末までなー
ほな
既読
0:30
※画像はイメージです。本当は期日指定以外ちゃんと指示されました!


続きを読む!

さてまずはTeamsに画像を投稿したら近い商品画像を検索してECサイトの商品詳細画面へ飛ばして商品説明と在庫がわかればいいかなということで調査開始
これは宣伝ですがecbeingではオムニ対応の一環でEC在庫の他に店舗在庫を表示する対応も可能です!

話を戻してTeamsに画像投稿しても検索するトリガーが必要になります
そこで登場するのがチャットボット
チャットボットというと身近なもので質問すると返信くれる例のアレです
文字を入力したらサーバ側で解析してこれかな?という回答を返すやつです
それを画像にしてしまおうというのが今回の趣旨になります
チャットボットに投稿された画像を今度は解析しなくてはなりません
マイクロソフトさんのブースで出すんだからAzure使わないとね!
ということでAzure Cognitive Serviceの登場です
PaaSで用意されているサービスですが検索を主とするものになります
その中にCustom Vision Serviceがあるのですが、マイクロソフトさんのサービスなのにマーケットプレイスという落とし穴が・・・
そのためお支払いは一本化できません!

動きのほうに戻ろう
Custom Visionでは何をするかというと・・・
まずは画像登録
今回は自動登録までは考えていないのでECで持っている商品画像をCustom Visionに登録していきます
そしてその商品へ商品コードのタグ付けをしていきます
時間があれば検索された商品画像をCustom Visionへ登録して、その後選択された商品の商品コードをタグ付するという自動化を考えていたのですが叶わずヾ(・ω・`;)ノ

チャットボットから通知された画像をCustom Visionで解析して一致率が80%(今回一致率の判断は適当です)以上の商品コードをURLルール化して戻すという設定をします
チャットボットへ商品名、商品URL、画像一致率を戻して処理完了

構成図ですが・・・

f:id:ecb_ssakagami:20200401175903p:plain

①Teamsのチャットボットから画像登録した場合にCustomVisionへ画像を飛ばす
②事前にラーニングされた画像の一致率の高い画像をピックアップ
 ピックアップされた画像のタグに設定してある商品コードをチャットボットに戻す
③リンク付きにしたので商品詳細ページに案内してやれ!


ちなみに動画にしてみるとこんな感じです

f:id:ecb_ssakagami:20200401184439g:plain




次はレポート表示や!

シナリオとして考えたのはスーパーでも家電屋さんでも色々なカテゴリーの売り場が存在しています
そこで各売り場にカメラを設置しておいて訪問者の年齢、年代をためる
時間ごとにグラフ表示して年代、性別ごとの売り場改善やセールの判断ができるようになればいいな
店長会議などでグラフ化しておけば資料を用意する手間も省けて他の仕事に専念させることができるかな?
こんな感じです!

さて用意するのは・・・
顔認証するにあたり、kioskアプリを使ってみよう
kioskアプリはAzure Cognitive Servicesのデモを簡単にできるマイクロソフトさんのデモアプリです
ここでFace APIを繋いで年齢、年代を判断してもらいます
社内を駆け回って顔収集していたのですが、若くみられる分には全然構わないのだけど老けてみられた人への申し訳なさと言ったら・・・言葉にできません
判断された時刻、年齢、性別、感情(無表情、嬉しい、悲しいなど)をSharePointに配置したエクセルファイルへ追記していきます

次にMicrosoft Flowを使ってエクセルファイルからレコードを読み込んでPowerBIに渡して集計と並び替えを実施します
担当者がTeamsにアクセスしてPowerBIタブを開いたときに集計されたグラフを表示させる

構成図ですが・・・

f:id:ecb_ssakagami:20200401180955p:plain

①カメラアプリでAzure Faceと繋いで年齢、年代を取得(判断はAzure任せ)
②結果をSharePointにエクセルで保存
③Microsoft Flowからエクセルデータ読み出してPowerBIで解析
④Teamsの担当者がPowerBIを開いたときにグラフ表示


天の声
こんなのできたでー
えらいひと
RTJはコロナの影響で中止や!
おつかれさん!
ほな

f:id:ecb_ssakagami:20200401182235p:plain

既読
1:30
ーーーーー

ということでマイクロソフトさんがRTJのリカバリプランとしてそのうち公開されるはずです!
※コロナ禍の影響で遅れているようです

~ecbeingでは、新しいことに楽しんでチャレンジできるエンジニアを大募集中です!~
careers.ecbeing.tech



.NET Core の設定情報の仕組みをしっかり理解したい方向け基本のキ【その2】

f:id:ecb_mkobayashi:20190924113406p:plain

こんにちは、アーキテクトの小林です。

前回の記事では、さまざまなプロバイダから提供される情報がフラットな KeyValue データ構造に変換され、後勝ち方式でカスケーディングされていることをご紹介しました。

今回の記事では、フラットな設定情報から階層構造を持ったクラスのプロパティに値をバインドする方法と、設定ファイルが更新されたときに自動的に設定情報を再読み込みさせる方法を紹介します。

まだ前回の記事をお読みでない方は以下をお読みください。 blog.ecbeing.tech

続きを読む

ウォーターフォール型PMと新人が半年間スクラムと向き合って感じたこと(新人編)

  • はじめに
  • 新人目線でスクラム開発を振り返ってみて
    • スクラム開発の良さその1: 恐れずに早く機能を作れ、リリースできる
    • スクラム開発の良さその2: 誰か1人に機能開発の責任を押し付ける…という考えがなくなる
    • スクラム開発の良さその3: 打ち合わせがいっぱいあるので、仲良くなれる機会が多い!
  • まとめ & おわりに

はじめに

こんにちは!ecbeingの浦…もとい蓑代です。
※結婚して名前が変わりました

今回は、こちらの記事の「新人編」の位置づけとして…。
blog.ecbeing.tech

ウォーターフォール型開発を知らない新人目線から、スクラム開発について感じた事を書いていこうかなと。

ちなみに、私のスクラム経験や開発経験について少し触れると…。

  • スクラム開発=未体験
  • ウォーターフォール型開発=未体験
    • スクラム開発に携わる前は、保守開発を中心に行ってました

…というような感じです。
ウォーターフォール型は未経験といいましたが、職場の同期がウォーターフォール型開発であり…。
「設計書を作るの大変だー」とか「テスト項目書作るの大変だー」とかは良く聞きますが、まぁほぼほぼ知識0みたいなもんです。

そんな私がスクラム開発を通じてどう感じたのか…。 見ていきましょう!

続きを読む