エンジニアのはしがき

プログラミングの日々の知見を書き連ねているブログです

ER図はPlantUMLで書いて楽しよう!

f:id:tansantktk:20210404183536p:plain

こんばんは!

仕様書に書く図ってチームで管理する上で統一感を出すのって難しいですよね。 私の場合、色や枠線などのデザインも人によって微妙に違ったりすることも多かったのですが、 そのせいで別の仕様書にコピペするとデザインが合わずキモチワルイ感じになってしまい、 結局デザイン修正に工数がかかり、本来やるべきプログラミングの時間が削られて…といった具合でした。

ではデザインのルールを決めて順守すれば良いのかといえばそれも正直ツラいので、つい先日ツールで図を自動生成する方向に舵を切ることにしました。

今回、その生成に「PlantUML」を使ったので紹介していきたいと思います。

続きを読む

AWS Lambdaを運用しての所感

f:id:tansantktk:20201120002649p:plain

Lambdaを本番環境で約2年程運用してきましたが、機能追加・修正や保守のことを考えると最初からこうしておけばよかったなーと後悔することもありました。 現在までの知見で個人的に考慮した方がいいこと、やっておいた方がいいことを書き連ねてみます!

続きを読む

クロスドメインにiframeを使うのは難しかった

f:id:tansantktk:20210706220622p:plain

iframeは実務でも趣味でも使う機会が全く無く、これに関しては無知だったのですが 先日Unity(WebGL)とiframeを組み合わせて自作ゲームを制作する機会があり、結果見事に頓挫したのでiframeについて調べた記録を残しておきたいと思います。

慣れた方にとってはアタリマエの話かもしれませんが…。

続きを読む

ポートフォリオサイトが完成しました!

f:id:tansantktk:20210706220911p:plain

空き時間を見てはちまちまとNext.jsで書いていたポートフォリオサイトを公開しました!

今後も追加する内容があればマイナーアップデートを続けていくつもりです😊

portfolio.ts-soda.net

github.com

続きを読む

VSCodeで.NET Core(CUI)アプリの入力を受け付けたい

f:id:tansantktk:20211023211140p:plain

先日、.NET Coreでコンソールアプリを作る機会がありました。 VSCodeで何も意識せずにF5でデバッグしようとすると、コンソールに出力はされるものの、 Console.Readline()で入力を受け付ける処理で、入力を受け付けてくれずに処理が止まってしまうことに気づきました。

Visual Studioではデフォルトで入力を受け付けてくれますが、VSCodeのデフォルトの挙動ではコンソールへの出力しかされないようです。

対応策

VSCodeで初めてF5でデバッグを開始すると、launch.jsonというデバッグ時の設定を記述するファイルを自動生成してくれます。

このファイルの一部を下記のように修正することで、bash等のターミナルから入力も出来るようになります。

launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "name": ".NET Core Launch (console)",
            "type": "coreclr",
            "request": "launch",
            "preLaunchTask": "build",
            "program": "${workspaceFolder}/bin/Debug/net5.0/Smile9DangerDeleter.dll",
            "args": [],
            "cwd": "${workspaceFolder}",
            "stopAtEntry": false,
            // console, internalConsoleOptionsを記述
            "console": "integratedTerminal",
            "internalConsoleOptions": "openOnFirstSessionStart"
        },
        {
            "name": ".NET Core Attach",
            "type": "coreclr",
            "request": "attach",
            "processId": "${command:pickProcess}"
        }
    ]
}

あとがき

久々にCUIアプリを.NET Coreで書いてはみましたが、ぶっちゃけNode.jsやPythonの方が記述量が減るので楽だったかなぁと思った次第です…😅

規模の大きいアプリサーバの処理の方が.NET Coreのルールの厳密さは生かせると思いますね。

serverless-nextjsを使うもTypeError: Object(...) is not a functionエラーでビルドに失敗した

f:id:tansantktk:20211023211438p:plain

AWS環境にNext.jsをお手軽にデプロイするツールにserverless-nextjsというものがあったので、最近試してみていました。

serverless-nextjsとは

github.com

Serverless Framerworkを使っているならお馴染みのserverless.ymlファイルに、Next.js用の記述を書いてserverlessコマンドを叩くだけで、AWSのCloudfront, Lambda, S3に各種データを展開してくれる超便利ツールです。

Route53で取得したドメインも指定しておけば、CloudFrontにうまい具合に紐づけてくれます。

記述例

serverless.yml

myNextApplication:
  component: "@sls-next/serverless-component@1.18.0"
  inputs:
    domain: ["portfolio", "ts-soda.net"]

通常は↑のファイルをプロジェクトのルートに配置し、serverlessを実行するだけなのですが、 私の場合はNext.jsのビルド段階でTypeError: Object(...) is not a functionエラーが出てしまい、なかなかデプロイできませんでした。

原因

npmパッケージのバージョンによっては、エラーが発生する模様。 next, react, react-domのバージョンを現時点での最新に上げて、再度serverlessを実行したところ上手くビルドが出来るようになりました。

ビルドに失敗したバージョン

package.json

{
  ...
  "dependencies": {
    "next": "10.0.3",
    "react": "17.0.1",
    "react-dom": "17.0.1",
    ...
  },
...
}

ビルドに成功したバージョン

package.json

{
  ...
  "dependencies": {
    "next": "10.1.3",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    ...
  },
...
}

GitHubのIssueにも同じ内容のバグ報告が上がっていましたが、明確な原因は掴めず…。 もし、ビルドできず悩んでいる方がおられましたら、まずはバージョンの変えてみることをおすすめします。

参考

github.com

sunday-morning.app

初学者の気持ちに戻ってみた

f:id:tansantktk:20210416201727p:plain

こんばんは!

4月が始まり、私の下にもプログラミング初学者の後輩が付きました。

業務ではC#が必須になるので、まずはその勉強の為の課題を出してやってもらっていますが、なかなか苦戦しているようです。 ふと自分が初学者の頃はどうだったろうと思い返すと、ぼんやりとしか思い出せません。

これはきっと初心を忘れてしまっているのでは…?🤔

初心を忘れた人間に後輩の指導が出来るのだろうか…?いや出来ないだろうと思い、まずはしっかりとかつての私の状況を思い出してみることにしました。

続きを読む

Markdown Preview Enhancedで簡易なドキュメントを作ろう

非エンジニア向けの簡易的なドキュメントを作成するときのツールとして 日本企業御用達のエクセル、ワードがよく挙がりますが、 見やすく書こうとするとスタイル編集は必須になり、見た目に労力を割かないといけなくなりだんだんと辛くなります。

MarkDownでザクザク書きてぇ…という欲望から 最近使いだしているのがVSCodeの拡張機能「Markdown Preview Enhanced」です。

続きを読む

Windowsでスクリーンショットを多用するならScreenpressoはいいぞ

Windows10でスクリーンショットを撮る時は、今までSnippingToolを使っていたのですが 最近Screenpressoというソフトに乗り換えました。

www.screenpresso.com

ブログ用のスクリーンショットを撮るのが主なのですが、結構作業の時短に貢献してくれています。

有料版と無料版があるようで、私はずっと無料版を使っていますが今のところ特に問題なく使い続けてます。

良かったところ

キーボードのPrint Screenを押すと撮影モードになる

WindowsでmacOSのShift+Command+4を押した時の挙動に近い動きをしてくれるようになります。 地味に嬉しい機能です。

撮影したスクショはワークスペースに保存される

スクショ撮影すると画面右下にワークスペースの画像がウィンドウが表示されます。

f:id:tansantktk:20210414204327p:plain

デフォルトだとワークスペースはC:\Users\*********\Pictures\Screenpressoを指しており、このパスに撮ったスクショが次々に保存されるようです。

私の場合、何枚も連続してスクショを撮ることが多いのですが、 いちいち保存する為にダイアログを開いたりするのが面倒なので助かります。

撮影したスクショを後から気軽に編集できる

ワークスペースに溜め込んだスクショは、それぞれ後から編集できます。

f:id:tansantktk:20210414205321p:plain

雑にスクショをガンガン撮影した後、後からじっくりとトリミングするなり、コメントを付けたり、枠線を付けたりといったことが出来るということですね。

文字や矢印のデザインはmacOSのアプリのSkitchに近いです。Windows版のSkitchもあるにはあるのですが若干使い勝手が悪いので、こういうソフトこそまさに今まで求めていたものでした。

実務でも簡単な操作説明の為のスクショを相手に送る時には活用できそうです。

微妙だったところ

画面上部に専用メニューが常駐する

f:id:tansantktk:20210414205854p:plain

デフォルトだとデスクトップの中央上部に小さいメニューバーみたいなものが常駐するようになるのですが、マウスポインタが触れると上記のようなフキダシがいちいち表示されるようになり、気になる時は気になります。

対策

f:id:tansantktk:20210414210215p:plain

設定ウィンドウから「クイックキャプチャウインドウ」のチェックボックスのチェックを外すと、メニューバーみたいなものが非表示になります。 これでデスクトップが静かになりました😎