--- title: 姫路IT勉強会 2022.02 langs: ja-jp --- 姫路IT系勉強会 2022.02 ==================== * 開催日: 2022/02/19 13:15 - * 司会: wateさん * 参加人数: 参加者: 4名 (うち学生 1名) * HackMD: https://hackmd.io/uo-y80kVQjeoCi8_HETYag * connpass: https://connpass.com/event/239350/ * ハッシュタグ:[#histudy](https://twitter.com/search?q=%23histudy&src=typd) * Discord(オンラインミーティング専用)姫路IT系勉強会招待コード: https://discord.gg/rZCeScB * Discordは無料プランに乗れる人数(10人以内)なので使っています。 * 有料版でも$15/月程度なら払えなくもないですね。 * Discord以外にも色々ありますので、人数が増えたら検討しましょう。 * ニュース(あれば) * Github が ~~GitLabをまねて~~ mermaid.js をサポートしたとか * [.Net が20周年迎えた](https://dotnet.microsoft.com/ja-jp/)とか ## 自己紹介 - NaviにCommon Lisp を組込めないか..? - 社長に社員の私物を売られる会社の話 - いもけんぴはアイディアの源泉 - 確定申告やろうぜ!(2/15~3/15?) ## 話題 ### SVGを動的に組み込んで見ました(もりや) * 発射装置の部品待ちの間に発射画面の方を進めました。 * [Inkscape](https://inkscape.org/ja/)で作成したSVGをメーター類で使えるようになりました。 * Inkscape の Adobe Illustrator のオープンソース版のようなベクター系のツール * Adobe Photoshop や [Gimp](https://www.gimp.org/)はドロー系 * [SVG](https://developer.mozilla.org/ja/docs/Web/SVG)は画像形式のひとつ(xml) * サーバー側で読み込んだSVGをそのままクライアントに渡すと、バイナリをBase64化した物が渡る * これだと画像として表示は出来るけど、Javascriptで操作できない * 受け取ったデータを、Base64→バイナリ(Uint8Array)→テキストデコード→InnerHTMLでDOM化 の流れでHTML化出来る * Javascript側から、表示内容を動的に操作できるようになる * JavaScriptで操作できていい * 参考 [SVG に JavaScript を埋め込む方法](https://qiita.com/imk2o/items/f60c9fe9c55cb48a8e8a) * この結果、昨年末に作成したPDF作成ツールが不要に * SVGのレイアウトを作成・編集するツールを作成しましたが不要に * よりよい開発がすすむ #### *おいしいいもけんぴ* * [RTSP形式](https://ja.wikipedia.org/wiki/Real_Time_Streaming_Protocol)で画像を受けとりたいがいいのがない??? * 変換していると、遅延が大きい。 * 遅延一秒をいれると安全上の問題がある。 * いもけんぴ加速装置のコンデンサーが多くてやばい * 安全を図ってください * コンデンサの数=ロマンの数 * 芸術は爆発だ(違う) * [アリエクプレス](https://ja.aliexpress.com/all-wholesale-products.html)でコイルガンが販売されていた * 複数のコイルを分割して使うといいとわかった * コイル一つあたりの電力量やスイッチが軽量のもので済む * それぞれのコイルで電力の制御が必要 * タイミングはナノ秒単位で Arudino で管理できる * 軍事技術が民生用に平和利用できるような... * ロマン駆動開発 ### iPhoneSE バッテリ換装しました(さとう) * 初スマホで、2016年購入したもの * ここ数年、ほとんど使ってなかった * 情報端末としてはMediaPad(タブレット) * 電話機としてはNichiPhone-S 4G * 4G対応だけど、電話は3Gしか使えない(VoLTE非対応) * 既に[死亡予定](https://www.iijmio.jp/info/iij/1627316726.html) * 電話機として復活させたけど、やはりバッテリが挙動不審 * Appleに交換させたら、[6k円くらいかかる](https://support.apple.com/ja-jp/iphone/repair/service/battery-power)よし * ダメ元で、[サードパーティ](https://store.shopping.yahoo.co.jp/kksshop/iphone-se-battery-pse-pl-plus-repair-tools-freeshipping.html)買いました * 販売サイト公認の[分解サイト](https://bunkaikoubou.jp)を参考に。 * その日は失敗しました。 * 交換して、電源オンしたら、一見正常に起動したけど、タッチパネルが無反応... * しかも、通電中はやり直しできない... * バッテリが尽きるのを待って(数週間)リトライして、ようやく換装できました。 * 一番奥のビスが締めにくいので省略したら、タッチパネルの導線が繋がってなかった([写真](https://www.kuzuore.com/misc/dust/screenshots/phone/iphone_se_connectors.png)の中央) * とりあえずはちゃんと動いてますが、バッテリを新品にした効果はどうも微妙 * [交換風景のひとつ](https://www.kuzuore.com/misc/dust/screenshots/phone/iphone_se_battery.png) * [iFixitの修理しやすさの評価](https://jp.ifixit.com/smartphone-repairability) * バッテリはちゃんと止っていない * ネジなどではなく接着剤とか両面テープとか * 少しずつ引っ張って、ひんまげながら外しました * ドライヤーではなく、ヒートガンなどで200度手前まであたためてとる * ヒートガン..意外に広い範囲をあたためてしまう ## 休憩 14:25 - 14:35 ### OpenStreetMap の相談 - 仕事で[OpenStreetMap](https://openstreetmap.jp/#zoom=5&lat=38.06539&lon=139.04297&layers=B000)を使う上で、相談したい - Google Mapは有料だが精度はいい - APIなどを使用しようとすると有料などはある - [Google Mapの料金体系](https://mapsplatform.google.com/intl/ja/pricing/) - [Yahoo Map](https://map.yahoo.co.jp/)も有料化 - 埋め込みをあきらめて、GoogleMapの場所へのリンクをいれるというのが... - 外部サイトになるのでユーザビリティ的によくない - 自分達で育てていくというのが大事 - ムチャクチャはしないように - 最悪アカウントBANもある - 動的に地図をいじるため、リクエストはおおくなりがち - OpenStreetMapの見た目がアレな場合は別のプロバイダがあるので、それを使うといいですよ - Web・モバイル用地図アプリケーション - MapTiler: https://maptiler.jp/ - 測地系の問題 - 日本測地系と世界測地系で、微妙に場所が異なることがある。 - [日本測地系](https://www.gsi.go.jp/sokuchikijun/datum-main.html) - ずれていることを指摘しているサイトはあるが、計算式などを書いてるサイトは少ない - https://www.symmetric.co.jp/blog/archives/37#outline__4 ### Linuxのサーバーが更新メンドくさがってやってくれない(fu7mu4) * 遠隔地にある会社のサーバー。 * あまり詳しくないのか、怖いのかやってくれない。 * sudo apt update; sudo apt -y upgrade; sudo shotdown -r -h now でいいはず * cron-apt で自動的にできるはず... * aptの設定(unattended-upgrades)でできるらしい、参考:[Ubuntu 20.04 LTSの自動アップデートと、自動再起動を設定した話](https://unluckysystems.com/ubuntu-20-04-lts%E3%81%AE%E8%87%AA%E5%8B%95%E3%82%A2%E3%83%83%E3%83%97%E3%83%87%E3%83%BC%E3%83%88%E3%81%A8%E3%80%81%E8%87%AA%E5%8B%95%E5%86%8D%E8%B5%B7%E5%8B%95%E3%82%92%E8%A8%AD%E5%AE%9A%E3%81%97/) * [両者の比較](https://askubuntu.com/questions/731963/unattended-upgrades-vs-cron-apt-on-a-server) * こまめにアップデートしてあれば... * 最初にそうなるように設定しないと * 誰も管理しない、したがらないので、既に行き詰ってる * 死ぬのは時間の問題 * **一回痛い目をみればいいんじゃないかな?かな?** * 誰も管理しないなら、別にサーバーを建てるしかないのでは * クラウドに逃げられるよう、上層部に働きかけなければ * オブジェクトストレージに逃せられるから * [KUSANAGI](https://kusanagi.tokyo/)はバージョンの上げ方が乱暴(PHP7.2->7.3とか) * CentOS Stream のローリングアップデート * 長期間放置するとやばい * [KUSANAGI 8 から KUSANAGI 9 の変更点 | KUSANAGI 9:](https://kusanagi.tokyo/kusanagi9/document/changes/) * KUSANAGIはCMS専用から汎用ディストロに変わりつつある * でも「WordPress を除くCMS及びフレームワーク」はサポート対象外である由明記 * 実態は WordPress 専用? * WordPress と他サービスを併用するのはちょっと * 更新が必要なパッケージ数が3ケタある. * OpenSSH も更新が必要なので離れたところからは更新作業したくない.. * 最悪の場合 [iLO](https://www.hpe.com/jp/ja/servers/integrated-lights-out-ilo.html) を使うしかないかな。 * ある日、サービスが止まったので、サービス再起動させた事件 * 代替サーバーを立てたりする時間とかがほしい * [vuls](https://vuls.biz/) でチェックした方がいいかも? ### Linux Foundation の無料の教育コースを受けてみた。(fu7mu4) * 会社で研修を受けろという圧があったので、無料かつWEBで完結するコースを探していた * [Introduction to Linux](https://learning.edx.org/course/course-v1:LinuxFoundationX+LFS101x+2T2021/home) Linuxのイントロダクション * コースとしてはしっかりしている * ちょっと内容は初等的すぎてつまらなかった。 * 高等な内容は高い * 疲れているときに英語はつらい * vi はちゃんと動画で操作をみせてくれるよ(:wqで終了) * 大学のコースレベルで量は多い * $169 で認定証が得られるらしい * Coursera | 一流講師によるオンライン講座でスキルアップ。会員登録無料: https://ja.coursera.org/ * MOOCの一つ * 機械学習が学びたいなどで、こういう大学の授業で数学 * JMOOC -無料で学べる日本最大のオンライン大学講座(MOOC): https://www.jmooc.jp/ * 海外の授業はガチが多い印象がある ### PlantUML使い勝手について(tomline) * wateさん推奨 [DrawIO](https://app.diagrams.net/) 挑戦 → 更に進化したもの欲しくなった → PlantUML * VSCodeアドインにて簡単に環境構築可能 → https://qiita.com/couzie/items/9dedb834c5aff09ea7b2 * GitHub連動にて履歴管理も簡単 * GitLab も連携できるよ * [GitLabの拡張マークダウン](https://docs.gitlab.com/ee/user/markdown.html#plantuml) * ER図・クラス図・マインドマップ・ガントチャート等もMarkDown記述可能 * [公式サイトリンク](https://plantuml.com/ja/) * [環境設定手順](https://qiita.com/opengl-8080/items/98c510b8ca060bdd2ea3) * LibreOfficeでも拡張機能でPlantUML使えたり…(ぼそ) * https://extensions.libreoffice.org/en/extensions/show/libo_plantuml * ドキュメントを残しておかないと、あとで思いだすのが難しいし無駄 * 最初からドキュメント化しておくほうがいい * githubが記法をサポートしたmermaidとかはどう? * [mermaid-js公式](https://mermaid-js.github.io/mermaid/#/) * Include diagrams in your Markdown files with Mermaid | The GitHub Blog: https://github.blog/2022-02-14-include-diagrams-markdown-files-mermaid/ * mermaid - Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.: https://mermaid-js.github.io/mermaid/#/ * mermaid.js は JavaScript だから環境構築が簡単 * [gitlab の 拡張マークダウン](https://docs.gitlab.com/ee/user/markdown.html#mermaid) * [UI ExtensionでRedmineでもmermaid.js](https://hosting.redmine.jp/service/value-added/plugins/) ## AWS開発について(inapyon) * 組み込みメインで開発してきたが、新規案件でAWS使うことになった。 1年目の方のサポート依頼されてるのですが、 私もサーバー系の開発経験ほぼなく……。(一応研修でクラウドプラクティショナーは取りましたが) 1年目の方から伺っているやりたいこととしては * デバイスから送信される動画のストリーミングサーバーをAWSで構築したい * →動画を[Amazon S3(ストレージ)](https://aws.amazon.com/jp/s3/)にアップロードするところまでテストしたいが、   まずは、[APIGateway](https://docs.aws.amazon.com/ja_jp/apigateway/latest/developerguide/welcome.html)を用いてデバイスからHTTPリクエストを送れるかどうかまでテストをしたい   →サーバー系の開発経験がなく初歩的なところかもしれないが * APIGatewayを使ってリクエストを受け付ける方法 * 認証方法どうするか の2点が課題とのこと * サポートにあたり社内にAWS経験者少なく担当者が基礎的な技術調査に時間がかかっている 要件の難易度・工数などが明確にできていない(ものすごく簡単なのか、難しいのかすら分からない) が課題になりそう * 動画をS3に保存する段階だけに限定した方がいいのかな。 * [Amazon S3 でファイルの保存と取り出し(公式)](https://docs.aws.amazon.com/ja_jp/mobile/sdkforxamarin/developerguide/getting-started-store-retrieve-s3-transferutility.html) * お値段や容量、帯域なども含めて技術選定してみては? * WEB RTC * 自前構築するとコストが大きいかもしれない。(納期も大事!) * **ロマン駆動開発** や自社研究開発ならOK * [ffmepg](https://www.ffmpeg.org/) などでトランスコーダーやエンコードが必要かもしれない。 * カメラごとにストリームデータの仕様が違いますが、ちゃんと埋められますか * コマ落ちなどが発生する可能性がある * [Janus](https://janus.conf.meetecho.com/)で配信する? * 試作時の所見でサーバーからのストリーム配信以外に、ツリー型にサーバーからクライアント、その下のクライアントと、配信を中継出来る可能性が高いことが分かったんですが、実証する前に試験が終わった経緯があります。 * 試作プロジェクトに若干残骸も残っていますが、うまく動けば一昔前のSkypeのような方式で同時接続ユーザーが増えれば増えるほど回線負荷が下がるシステムを実現できる可能性がありますので、研究されるならば、是非この辺も検証をしてみてください。 * [作ってみたことあります](https://github.com/Yasuko/vmeeting) * [動いてるサンプルです](https://vmeet.yasukosan.net/) * サービス化するのであれば、[YouTube](https://www.youtube.com/) や [Vimeo](https://vimeo.com/jp) などの外部サービスを利用してもよいのではないか? * 外部サービスであれば開発者もAPIだけを把握すればいい * 料金なども把握しやすい * Vimeo の方が高品質? サービスの要件次第かな? * [BTS](https://bts-official.jp/) のライブ配信は自前でやっている。特殊な事情がないかぎり自前実装は止めたほうが… * Office 365があれば、含まれているMS Streamサービスを使うのがいいんじゃない? * Microsoft Stream でビデオを共有する - Microsoft Stream | Microsoft Docs: https://docs.microsoft.com/ja-jp/stream/portal-share-video ### 最新言語触ってみた感想(tomline) * [Flutter](https://flutter.dev/)(dart) * モバイルアプリ向けフレームワーク、dart言語(Googleの言語?) * Android・iPhoneマルチプラットフォームアプリ開発環境 * 通常はAndroid=[Kotlin](https://developer.android.com/kotlin?hl=ja)、iPhone=[Swift](https://www.swift.org/)使うことが多い * Widget を埋めこんでいく形 * マルチプラットフォーム開発には [Single Page Application(SPA)](https://ja.wikipedia.org/wiki/%E3%82%B7%E3%83%B3%E3%82%B0%E3%83%AB%E3%83%9A%E3%83%BC%E3%82%B8%E3%82%A2%E3%83%97%E3%83%AA%E3%82%B1%E3%83%BC%E3%82%B7%E3%83%A7%E3%83%B3)が多い印象 * コンポーネント指向で、部品の再利用を推進したい * [Go](https://go.dev/) * Googleの開発した言語 * C++にガベッジコレクション追加されてもの * 割と古典的な環境な感触 * 並列制御も簡単に実装する機能有り * サーバー系の独自コマンドをつくるにはいいかも。 * デプロイも単一バイナリでよい。 * [Rust](https://www.rust-lang.org/ja) * [Mozilla](https://www.mozilla.org/ja/)が開発した言語 * 独自のメモリ管理(所有権システム) * C/C++/Rustが高速なシステムようの言語として有名 * メモリ安全などに配慮されている(ダメなコードはビルドエラー) * アプリでのボトルネックは、DBになっていることが多い * SQL最適化などが重要 * ORM * マスコットキャラクターのgopher くんがかわいい * .Net MAUI(C#) * [MAUI](https://docs.microsoft.com/ja-jp/dotnet/maui/what-is-maui)はマルチプラットフォームでモバイルアプリ向けにも利用できるGUIのフレームワーク、C#言語(v7 ?) * 本年夏頃?リリース予定にてまた試してみます * [.NET MAUIがPreview 8をリリース、しかしGAは2022年Q2に延期(infoq)](https://www.infoq.com/jp/news/2021/10/dotnet-maui-ga-postponed/) ### 開発中システムの依存パッケージのアップデートどうしてますか? * 開発中のブランチをcloneして、npm installした→依存パッケージに開発終了があった。アップデート? * 開発終了したとしてもそれを選んだ人がどう判断するか?(開発のポリシー次第) * 組織として、自分達でメンテナンスするか * 別のライブラリを選定するか * 方法とかタイミングとか * [Backlog](https://backlog.com/ja/)なんで[DependaBot](https://dev.classmethod.jp/articles/github-dependabot-2021/)使えないんですが、良い代替方法ないですか? * githubなら、Dependabotは更新するかどうかを教えてくれる * 通知だけでもいいので代替がほしい * [openhub](https://www.openhub.net/) いろいろな OSSの情報を調べるためのサイト: 最終更新日をみることも可能 * githubなどのサイトを見てもよい * 更新ポリシーなどは開発毎に異なるのでみるのが * CIで定期的にビルドして、ビルドがこけるかを見ることもできる ### nginxぜんぜんわからん(のがじゅん) * [nginx](https://www.nginx.co.jp/)で旧URLからのリダイレクトのrewrite設定書いてたけど全然わからんかった * https://www.nofuture.tv/get-messed-up-by-nginx * nginx のスタンダードな書き方がわからない * 前のシステムがあって複雑になってしまっている * `if`は邪悪 * If は邪悪 | NGINX 日本語訳: http://mogile.web.fc2.com/nginx_wiki/nginx_wiki201510/start/topics/depth/ifisevil.html * できるけど、これをするとシェル芸っぽくなるからやめよう * 未来の自分が対応できるか?わからない * [sedとawkは許して...](https://jp.quora.com/kaisha-deha-sed-ya-awk-wo-shiyou-suru-tokiniha-jumon-to-iware-te-shima-i-masu-sed-ya-awk-wo-shi-wa-nai-nin-ha-kawari-ni-nani-wo-shiyou-shi-te-shori-shi-te-iru-no-desu-ka) * スニペットで複雑な部分をつくって、このスニペットをインクルードする形にする * システムでわけた方がいい? * 移行したシステムには手をいれたくなかったので nginxにおしつけようとした * nginx の正規表現ぜんぜんわからない * nginx の locationで / ありなしで挙動がかわる * もうなんにもわからない * nginx のマッチパターンを把握しておくこと * 前方一致,後方一致など) * マッチパターンも優先順位がある * https://heartbeats.jp/hbblog/2012/04/nginx05.html * nginx のブログ書いている人が俺はこうしたら直ったとしかかいてない * 理由書いて...書いて...お願い...(情報の信頼性) * 公式文書はいっぱいよんだよ * もう一度同じ問題にあったときに対応できるとは思えない、忘れている... * サーバーで変なことはしないようにしよう(正論) * できることが多過ぎる * nginx を有効活用しようとしているのは WAF * フルビルドはきついので、あきらめて [Apache web server](https://httpd.apache.org/) * 後ろをリバースプロキシで... * ロードバランシングはしやすい * [集大成](https://github.com/wate/ansible-role-nginx/tree/develop) * [設定](https://github.com/wate/ansible-role-nginx/blob/develop/defaults/main.yml#L10-L159) * [スニペットの例](https://github.com/wate/ansible-role-nginx/tree/develop/files/snippets)を作成しておいて、インクルードする * [Lets Encryptを避けたリダイレクトの例](https://github.com/wate/ansible-role-nginx/blob/fd8129d73c4ce7920735299db430a1ad68f7aa22/templates/vhost.j2#L18) * 勉強会用にフォークしておいてほしい * これが理解できる人と仕事したい * 最終的には、これは仕事には使えている * [公式:NGINXクックブック設定レシピ集(日本語版)無料DL](https://www.nginx.co.jp/resources/ebooks/nginx-cookbook-jp/) * 待望の【O'Reilly】NGINX Cookbook日本語版がついに完成!NGINXクックブックは、NGINXを最大限に活用する方法を解説しています。 # 質問 * Q オフライン、オンラインがありますが? * 現状は新型コロナと会場の移転があるため、来月(3月19日)、再来月(4月)までオンラインになりそう * 5月以降はオンラインにしたい * 姫路駅と東姫路駅の間 * <https://osm.org/go/56vgl86CB-?m=> * オンラインの場合はログは重要 * オンラインの方が遠隔地のメンバーが参加しやすい * オフラインとオンラインを併用したりしたい * Q HISTUDYの突発開催について * 突発で開催するには、slackで呼び掛けてください * **姫路IT系勉強会**の方で呼び掛ければいいです * 参加したいメンバーだけで開催することがあります。 * ただ、参加できないメンバーがいるかもしれません。数人で開催できるかもしれません。 * チャンネルはあまり気にしなくていいです。