---
title: 姫路IT勉強会 2021.7
langs: ja-jp
---
# 姫路IT系勉強会 2021.7

* 開催日: 2021/7/17 13:15 - 17:35
* 司会: fu7mu4さん
* 参加人数: 参加者: 10名(うちLisper 1名) 学生 0名
* HackMD https://hackmd.io/aVHxec9eRkakAkecJ4gyMg
* connpass: https://histudy.connpass.com/event/218595/
* ハッシュタグ：[#histudy](https://twitter.com/search?q=%23histudy&src=typd)
* Discord(オンラインミーティング専用)姫路IT系勉強会招待コード: https://discord.gg/rZCeScB
* Discordは無料プランに乗れる人数(10人以内)なので使っています。
* 有料版でも$15/月程度なら払えなくもないですね。
* Discord以外にも色々ありますので、人数が増えたら検討しましょう。

# お題

## Chrome, EdgeでIEみたいにfileスキームのリンクを”既定のプログラム”で開けるようにした（田窪）
* セキュリティに詳しい~~ニキ達~~諸兄のご意見を伺いたい。
* [ニキ](http://www.nikkigames.co.jp/)とは?
* すみません。なんj語です…。

* `<a href="file:///Z:/share/master.xlsx">` みたいなリンク
* file スキームはRFCにより絶対パス指定です
* IEだとこのリンクで一気にエクセル開いて編集して保存できた。
* 昔ActiveXでやりたい放題だったことが
* Edgeではこれが出来ないので不便
* こういう拡張機能を見つけました
* ローカルファイルリンク有効化 - Chrome ウェブストア: https://chrome.google.com/webstore/detail/enable-local-file-links/nikfmfgobenbhmocjaaboihbeocackld?hl=ja
* ↑これだと、別タブで開くだけなので、ファイルを編集することができないです。
* 拡張機能を探したけど見当らないのは、セキュリティ上の問題があるから？

### 自作の「ファイルオープンサーバ」を使う方法をデモ
* fileリンク->拡張機能->ファイルオープンサーバ(goで実装しました)->「既定のプログラム」
* このアーキテクチャでセキュリティの懸念はなにがあるだろうか？
* ファイルオープンサーバーが信頼できるかどうか?
* ファイルオープンサーバーがこっそりコピーするとかあると怖い
* オープンソースですれば中身わかるから信頼できる
* なので、今回の仕組みの中に悪意があることは想定しません。外部からの攻撃に対する脆弱性のみを問題にしています。
* 開けるファイルを制限する機能があった方がいいかも
* プロキシで制限かける？ → 多分「プロキシだけ」だと意味ない
* ホワイトリスト方式でURLをバリデーションしてから渡す
* リンク先が拡張子やアプリケーションなどを偽装できそう
* Mimeタイプ偽装とかあると検出しにくい
* fileスキームには、Mimeは関係ないと思います。　
* MS: SharePointでよくね?それかOffice 365 でクラウドにファイル置くといいよ
* データファイルが共有ストレージに散らかる問題についてひとくさり

## HackMDにサインインすると、[ぜんぜん知らないところ](https://g0v.hackmd.io/?nav=overview)にリダイレクトされました(さとう)?
* 何ももしてないのに飛ばされました
* [なにもしていないのにこわれました](https://minne.com/items/2715511)
* 見慣れたメモがひとつもなく、外国語らしいメモがいっぱい。
* すわアカウント盗まれて荒らされたかと冷や汗
* たまげてあちこちアクセスしているうちに普段のページに
* HackMD は台湾のサービス
* g0vですやん。g0vは、これです: https://g0v.tw/intl/ja/
* 「g0v 零時政府」（ガブゼロ）
* [集団知がさまざまな問題を解決する 台湾デジタル担当大臣 オードリー・タンさんが語る未来(4/6) | JDIR powered by JBpress](https://jbpress.ismedia.jp/articles/-/62751?page=4)
* 中の人がポカミスやったところを偶然踏んでしまった、らしい?
* ルーティングの設定をミスったのでは？
* それだと逆に、`g0v.hackmd.io` にアクセスしたかった人が別のページに飛ばされたかも

## Raspberry PiでUSBカメラの映像をリアルタイムに飛ばす簡単な方法ありますか？(もりや)
* [FFMPEG](https://ffmpeg.org/) → [Nginx](https://www.nginx.co.jp/)で飛ばすとバッファの関係で4秒ずれます
* [Janus](https://janus.conf.meetecho.com/)を使いWebRTCで飛ばすとリアルタイムに飛びますが、以前作ったクライアントが[Angular6](https://angular.io/)で作っていたので、今は[React](https://ja.reactjs.org/)に宗派を切り替えているので作り直しが面倒です。
* Janusのフロント設計がjQueryベースで作成されておりかなり古いです
* Janus上で発生するイベントごとに関数をオーバーライドする実装方法のため無駄に長いコードを書かないといけません
* 最近のReact等に組み込もうとするとお作法の違いでちょっと面倒です。
* これが低遅延で最強ですよ [WebRTC SFU Sora - 機能・特長](https://sora.shiguredo.jp/features)
* やはり有料しかないのか
* 監視カメラで使用している、RTSP対応のカメラとVLCのブラウザプラグインを組み合わせれば低遅延で簡単に映像は見れます。
* VLCはエンコーダとしても多機能
* PHP は 型がゆるい言語から型の厳しい言語の話
* ~~[ピーエイチピー](https://github.com/cninja/pEigthP)~~ ?

### Web言語は地獄です
* 歴史的経緯1
* HTMLはゆるい書き方を許容してきました
* JavaScript もブラウザ上でちょっと動く言語ぐらいのもの
* PHP は HTML を動的に簡単に作れる言語
* Google MAP が非同期通信 & SAPでウェブアプリの世界を切り開いた
* WEB開発の大規模化が顕著に
* 歴史的経緯2
* 紙のグラフィックデザイナーがWEBデザインもする
* WEBデザインしつつコーディングもする
* 妙なコードが溢れる
* HTML/CSS/JS は緩く書ける
* 適当な書き方でも動いちゃう
* 妙なコードが溢れる

* 素のJavaScriptはしんどい
* 型定義がない、全ての関数、クラスを上書き可能
* jQueryは使いやすけど、データを保持・管理する仕組みが無い
* React単体でも型定義がない、データ保持機能が無い
* Typescript+[React](https://github.com/facebook/react)+[Redux](https://github.com/reduxjs/react-redux)+[Saga](https://github.com/redux-saga/redux-saga)で利用すると型定義、データ管理は一応網羅できます。
* redux-sagaは結構最近(v1.0が2019年1月)
* この辺、Reactは破壊的変更がまだまだ入りそうでツラいとこあります。

* Reactは分かると良いですが、そこまでが大変
* [FLUX](https://github.com/facebook/flux/tree/master/examples/flux-concepts)で実装出来るため、考え方がシンプルになります。React、ReactJsでは満たせないので、React+Reduxで実装する必要があります
* あらゆるデータ、イベントの流れが必ず一方向になるので機能ごとに実装する内容をシンプルに出来ます。コードの再利用性も上がります。

## 皆さんのプログラム環境と言語を知りたいです。(tom)

### Wate さんの例
* 何でもござれです。
* サーバサイドからインフラまで
* ソースコードがドキュメントなときが
* 言語切り替えのコンテキストスイッチはきつい...
* PHP
* メインは CakePHP
* SQL / ORM でパフォーマンスがでないときに
* SQLかける人少ない。フレームワークの弊害?
* 最近MySQLしんどい。PostgreSQLに変えたい
* bash
* サーバーのチューニングなど
* ruby
* Redmineやってるとき
* ansible
* pythonとかYAMLとか
* go
* JavaScript/JQuery
* Typescriptも手をだすはめになりそう
* もうプログラミングだけではダメ。政略->戦略->戦術で考えると
* 業務フローを考えると、設計の方に行かないと
* 設計がしっかりしていれば、言語なんてどうにでも
* KGI Key Goal Indicator
* KPI Key Performance Indicator
* 上流がしっかりしてないと、下流が地獄を見ます
* 異動されたら、なんど誰も何もやってなかった
* 自分が設計がんばらないとならない状況あるある
* 上流に食い込むのはしんどいけど楽しい
* 下流工程からアラートを上げて、上流に反映させ、情報を共有していく
* BTSにログ入れない奴にぶち切れる程度になった
* 日本語めんどくさい
* アルファベットはちゃんとかけるけど、日本語はなぜかタイポしまくり
* タブとスペースの混在は頭痛い
* EditorConfigは入れてくれ

### ムネナガ
* Wordpress : CMS 元々ブログシステム
* PHPを主に、DBの面倒もみてます
* WordPressでブログ記事を書くためのエディタがReact製
* なので半強制でReactも始めました
* 最初つらかったけど、今はReact派です
* Kotlin: Android の アプリ
* 最近のアプリ開発事情は？
* [React Native](https://reactnative.dev/)が多そう
* [Xamarine](https://docs.microsoft.com/ja-jp/xamarin/get-started/what-is-xamarin)もシェアある
* [Flutter](https://flutter.dev/), [Dart](https://dart.dev/) でアプリ書きたいと思う
* マテリアルデザインでサクサク作れるらしい
* TypeScriptやKotlinやってれば、Dartはさほど大変ではないらしい
* ExcelのアドオンをC#で書いてました

### のがじゅん
* シェルスクリプトばかりだったけど、
* [LibreOffice](https://ja.libreoffice.org/)のために、C++をちゃんと勉強しなければ
* 実は自然言語の方が
* 計算機の自然言語処理、でなく韓国語です
* [textlint](https://github.com/textlint/textlint) で日本語をチェックしたい
* [prh](https://github.com/textlint-rule/textlint-rule-prh)をつかうと独自用語定義が楽
* [redpen](http://redpen.cc/docs/latest/index_ja.html) はちょっと違う
* 用語統一に苦労しています
* 用法とか文言の意味合いが異なってたりする
* ルールを書いても皆が守るとは限らないので、システムで固めたい
* そのまえに、[editorconfig](https://editorconfig.org/) で開発環境を整備したほうがいい

## スマホアプリ開発でお勧めの言語＆環境知りたいです(tom)
* 私はflutterか.net mauiを勉強しようと考えています。　　
* Androidなら[Kotlin](https://developer.android.com/kotlin?hl=ja)いいですよ
* 車載アプリはJavaだったりします。10年後もJavaで戦いますか...?
* 10年乗りの車なんて普通にありますよね
* 新しいJavaわからないのでJava8です(一部だと思いたい)
* Java8 LTSのリリースは2014年
* ScalaでAndroidアプリを書くという苦行が過去にあったらしい。
* [2020年ScalaでAndroidアプリ](https://scalapedia.com/articles/52/%E3%80%902020%E3%80%91Scala%E3%82%92%E4%BD%BF%E7%94%A8%E3%81%97%E3%81%9FAndroid%E3%82%A2%E3%83%97%E3%83%AA%E9%96%8B%E7%99%BA%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6%E3%81%AE%E6%9C%80%E6%96%B0%E6%83%85%E5%A0%B1)
* [Cordova](https://cordova.apache.org/)は一応生きてます。が、今はReact Nativeが主流
* React Nativeもアップデートで死ねるそう…
* [Kotlinでクロスプラットフォームもできます](https://kotlinlang.org/docs/native-overview.html)
* JVM 部分のかわりに、ネイティブで動作するライブラリを使うらしい。
* それ大丈夫なの...?
* JetBrainsは推してますがどうだろ
* C# / Xamarine で Androidアプリを作成する可能性が..
* dot net は v5以降ならマルチプラットフォームだから...
* マイクロソフトのサービス、プロダクトの話題が少ない(検索にかからない)
* 主流じゃない？古い？
* Webで発信されやすいのはOSSとかが多い
* Windowsサーバは高いですし
* OSS だと試しやすいし、今は MS も OSSにも注力しているから

## histudyのありかたについて若干雑談しました
* セミナーより技術雑談が好き
* オンラインなら十数人が適切な人数と思います
* histudyには伝説の人物が多数輩出しました
* 素人からWebシステム開発者にジャンプしたお爺さんとか
* とんがった学生さんたちもおりました
* 姫路こわい。まんじゅうこわい
* 現在、オンライン専用になってしまっていますが、ハイブリッドできたらいいですね
* 昨今のコロナ禍を考えると、場所は借りれてもオフライン開催はしにくい
## AWS / Azure等のクラウド開発について知りたいです(tom)
* 「クラウド開発」の定義をまず知りたいです
* オンプレから移行は難しいのでしょうか？
* オンプレの構築手順がどのくらい整っているかによるのでは
* AnsibleのPlaybookで作りこんであるなら、そう難しくないかも
* sshとgitが使えるなら、デプロイ先がオンプレだろうがクラウドだろうが
* マイクロソフトのE2Eだと既存Windowsサーバのイメージを抽出をしてAzureに展開するとかできるらしいです。
* 使うツール/技術
* [Ansible](https://www.ansible.com/) の playbook.yml
* [K8s](https://kubernetes.io/ja/)
* [terraform](https://www.terraform.io/)
* ssh/git など
* Git のワークフロー、CIサービス
## 初歩的な話ですが、Gitの分岐(branch)機能の使い方教えて下さい(tom)
* githubの?gitではなくて? github flowの話?
* GitHub Flow (Japanese translation): https://gist.github.com/Gab-km/3705015
* Gitflow ワークフロー | Atlassian Git Tutorial: https://www.atlassian.com/ja/git/tutorials/comparing-workflows/gitflow-workflow
* 各ブランチの役割を決めておく、ブランチ戦略、[ブランチフロー](https://qiita.com/pandama09396862/items/9f013fa7b60f4d12d1d8)

* チームメンバーごとにブランチを切る方法も
1. Aさんのブランチ dev-a
2. Bさんのブランチ dev-b
3. 各々のメンバーは一旦、自分のブランチにコミットしていく
4. 各人の作業が完了したら、マスターへプルリクを出す
5. レビュワーが見てOKならマスターへマージ
6. 二人でバラバラにコーディングしても相互に影響しない
* AさんがPHPを修正、BさんがCSSを修正など平行して作業できる
* dev-aブランチをdev-bにマージもできるので、PHPを修正してCSSあてて、見られる状態になってからステージングブランチへマージして表示を確認とか
* Redmineのチケット一つにブランチ一つ切る
* そのチケットに対して、どういう変更があったか記録していける

* Gitは自由度が高い
* チームやプロジェクトごとにワークフロー、ブランチ戦略を定める必要がある
* CVSなど他のバージョン管理との違い
* 参考
* [backlogのサル先生のGit入門](https://backlog.com/ja/git-tutorial/)
* [Git - ブランチとは](https://git-scm.com/book/ja/v2/Git-%E3%81%AE%E3%83%96%E3%83%A9%E3%83%B3%E3%83%81%E6%A9%9F%E8%83%BD-%E3%83%96%E3%83%A9%E3%83%B3%E3%83%81%E3%81%A8%E3%81%AF)
## NoSQLのDBを使っている方いらっしゃれば、従来RDBとの違いと使い分けを教えて下さい(tom)。
* 本格的に使っている人がいない
* NoSQL は早いらしい
* データの型がきっちりわかれている場合は RDB にいれる
* ログなどで型がわかれていない場合は、NoSQL にいれる
* 実は[Realm](https://github.com/realm)という NoSQL を使ってます
* **しかし**
* ORMかましてアクセスしてるので、使い勝手とか違いは分らないです。
* データ構造もそこまで複雑なもの扱ってないので使い勝手とか(以下略
* 比較対象もWordPressのMySQLなもので

## SQLテーブル設計の正規化ってどのレベルまでやられます？(tom)
[関係の正規化 - Wikipedia](https://ja.wikipedia.org/wiki/%E9%96%A2%E4%BF%82%E3%81%AE%E6%AD%A3%E8%A6%8F%E5%8C%96)
* 第1 〜 第５正規化まである
* 第3正規化ぐらいまででいいんじゃない？
* 4、5正規化まで行くと人間が理解しずらくなりそう
* メンタルモデルと乖離してこない？
* 計算機科学的「正しさ」、コンピュータが処理する分にはいいのかも
* [DBスペシャリストを認定する資格 OSS-DB技術者認定試験](https://oss-db.jp/dojo/dojo_info_04)
* ER図なにで描いてます？
* [draw.io](https://app.diagrams.net/)
* [visual Studioのプラグインあります](https://qiita.com/riku-shiru/items/5ab7c5aecdfea323ec4e)
* [cacoo](https://cacoo.com/ja/)でも描けますよ
* [plantuml](https://plantuml.com/ja/)もあります。

* データベースを解析して、マークダウンでドキュメントを生成してくれている。
* [tbls](https://github.com/k1LoW/tbls)
* 外部参照キーなどがちゃんとわかる
* [サンプル](https://github.com/k1LoW/tbls/blob/master/sample/postgres/README.md)
* [graphviz](https://graphviz.org/) を使うと図が作成できる。
* [tblsの設定](https://github.com/k1LoW/tbls#configuration)

### ドキュメントについて
* エンジニアならドキュメントは書きましょう
* 誰も書かないなら、三ヶ月後の自分のために
* すべてを忘れ去った＊年後のリプレース案件のときのために
* 「誰かのために」は逆に心が折れます
* 書くことが思考や状況の整理にもなります
* [ラバーダック・デバッグ - Wikipedia](https://ja.wikipedia.org/wiki/%E3%83%A9%E3%83%90%E3%83%BC%E3%83%80%E3%83%83%E3%82%AF%E3%83%BB%E3%83%87%E3%83%90%E3%83%83%E3%82%B0)
* 他の人はドキュメントを書かなかったり、ドキュメントよりコード書け文化についてひとしきり

## LibreOfficeのUI/Helpの翻訳ファイル(gettextのpo)をTextlintにかけてチェックしたいと思案中(のがた)

* textlintは、ルールに従って日本語校正をするチェッカーです
* textlint · The pluggable linting tool for text and markdown: https://textlint.github.io/
* WorksApplications/textlint-plugin-po: A textlint plugin to lint translated text in .po files: https://github.com/WorksApplications/textlint-plugin-po
* こういうのを見たのですが、LibreOfficeの翻訳も表記ゆれ、表記チェックをかけたいなと妄想
* フロントエンド開発にtextlintを導入して運用している話 - Speaker Deck: https://speakerdeck.com/diescake/hurontoentokai-fa-nitextlintwodao-ru-siteyun-yong-siteiruhua

## ゆる募 facebook inferに詳しい人 *たぶんいない* (fu7mu4)
* [facebook infer](https://fbinfer.com/) は facebook がOSS化した、スマフォアプリなどを対象にした静的解析ツール
* C/C++ Objective-C/Java
* Erlangもできるよ?
* なぜか OCaml 製だよ
* Docker 環境で動かすと libc のバージョンがちがうといわれたのでソースからビルドするよ
* opamというOCaml Package Manager 1.2から 2.0にあがらない、インストールしなおしが必要
* infer のC++ 対応には カスタマイズした clang をビルドする
* 30-60くらいかかるよ。

## RubyとかNodeのバージョンマネージャーでバージョン固定を行うときの方針はどうしたら？（ムネナガ）

* 自分の中で確定
* 本番環境には入れない
* 本番と開発環境で実行バージョンを揃えたい時に固定する
* 最近思うこと
* npm パッケを開発でしか使ってないなら、要らないのでは？
* 2021年の今ならそこまでガッチリ固定しなくていいと思うんですが？
* そんなに厳しいの最近、あまり出くわしてない
* むしろ排除すべし？
* チームとかプロジェクトでケースバイケースになりそう
* Python / Ruby あたりは要るかな？
* 今も要る気配があります
* PHPはWordPressばっかりだから使ったことがない
* Composerをバリバリ使うなら要る？
* 結局、最近はそんなシビアなパッケージ少なくない？
* 実行バージョンを切り替えたい時にバージョンマネージャーを使う
* 動作確認や不具合調査など
* バージョン切り替えなら仮想化内で実行する方法もある
* がちがちに固めるならdockerでいいんでないの
* dockerは中の権限がrootなのがねぇ
* 一応Sandboxになっています
* ユーザーモードもあります
* そのあたりを分かってない人が使うとヤバイ
* WordPressの公式開発環境がdockerです。
* [@wordpress/env – Japanese Team — WordPress.org](https://ja.wordpress.org/team/handbook/block-editor/reference-guides/packages/packages-env/)
* 元々は[ブロックエディタ](https://wordpress.com/ja/support/wordpress-editor/)開発用に用意されました。
* 固めるつもりならLockfile入れといてね
* Nodeなら package.json だけでなく、 package-lock.jsonも
* 運用を考えて揃えるなら、仮想化の方がベター

* バージョンを変えると失敗する例
* Android 11(AOSP全体)のビルド
* Ubuntu 16.04, 18.04 はサポートされている
* Ubuntu 20.04 はサポートされていない