OmniAICreator/Qiita-1.07M huggingface dataset:
メモ_laravelの環境構築

**・Laravelを使用するには、Composerが必要。**
・Composer：
　PHP用のパッケージ管理システム。
　ライブラリやフレームワーク等をインターネットを通じてインストールしてくれて、
　更新などの管理を行ってくれるソフトウェア。

・Composerのアップデートができないという不具合が発生。
以下のエラーが発生した場合
```
Unable to write "C:\ProgramData\ComposerSetup\bin\composer.phar". Access is denied.
```
いろいろと調べたが、composer.pharがない原因がわからなかったため、composerをアンインストールした。

・laravelにBootstrapをインストールする方法
　①Node.jsをインストールする。
　②npmをインストールする。

・Node.js：
　サーバーサイドのJavaScriptの実行環境。
・npm：
　Node.jsのパッケージ管理システム。
　アプリ開発に役立つプログラムのまとまりのインストールや更新などの管理を行ってくれる。
　Node.jsをインストールするとnpmも一緒にインストールされる。
　**laravelにBootStrapを導入するために必要。**
WebSphere Application Server(WAS) 、最小、最大ヒープサイズを上げて起動できなくなった話

# はじめに
先日、社内の手順書に従ってWebSphere Application Server(WAS)を構築したのですが、
手順書に記載されている設定変更を実施したところ、WASが起動しなくなってしまいました。

WASの起動ログからの原因調査を実施し、設定ファイルを修正して無事解決できたので、原因特定から修正の流れまでを記事にしたら参考になるかなと思い、手順を記事にいたします。
そもそもWASってなんだって人のほうが多いと思いますが、誰かの助けになりましたら幸いです。

# 原因調査
サーバーが起動しない原因をログから調査しました。
WAS起動失敗時のログはデフォルト設定であれば以下に出力されます。
```
C:\Program Files (x86)\IBM\WebSphere\AppServer\profiles\AppSrv01\logs\server1
```
出力されているログの中に。
```
ヒープのインスタンス化に失敗しました。2Gが要求されました。
```
の記述を見つけ、設定したヒープサイズの値が間違っていることに気づきました。
※32bit環境なのに2048を設定してしまっていたので、環境によって設定値を変えるよう手順書もついでに修正。

# 修正方法
ヒープサイズの変更方法は調べたら出てきたのですが、WAS管理画面からの変更方法のみしか情報がありませんでした。
今回WASが起動しないため管理コンソールからの再設定は不可能となっています。
起動時に読み込んでいるであろう設定ファイルを直接編集しようと考え、設定ファイルが入っているであろう
```
C:\Program Files (x86)\IBM\WebSphere\AppServer\profiles\AppSrv01\config
```
のフォルダ内のファイルを、エディタを使用して「2048」でGrep、さらにGrep結果を「heap」で検索してファイルを特定しました。該当ファイルパスとファイル名は以下になります。
```
C:\Program Files (x86)\IBM\WebSphere\AppServer\profiles\AppSrv01\config\cells\XXXXNode01Cell\nodes\XXXXNode01\servers\server1\server.xml
```
このファイルの、2048の文字列を1024に書き換え、WASを起動し無事起動を確認しました。

# 備考
久しぶりにサーバーのログを見ました。ログ解析能力って大事だなと改めて思いました。
TextMeshProを使って日本語を表示する方法

UnityでTextMeshProを使用し、日本語を入力すると画像のようになってしまいます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/368729/b5a4b9f0-8f24-ea2e-08c5-2f3c7fbd0d31.png)
そこで、今回は上記の直し方について手順を追って説明します。

# 手順
1. 日本語に対応したフォントのダウンロードを行います。今回は、無料の[Google Fonts](https://fonts.google.com/)を使用します。
2. 日本語に対応している[Noto Sans Japanese](https://fonts.google.com/noto/specimen/Noto+Sans+JP)を選択します。
3. Download familyを押します。
4. ダウンロードされたフォルダのstaticフォルダの中から使用したい文字太さの.ttfファイルをUnityプロジェクトのAssets > TextMesh Pro > Fonts内に入れます。
5. UnityのWindow > TextMeshPro > Font Asset Creatorを押すと以下が表示されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/368729/9425270b-8e28-7c0a-cbba-545b778a553a.png)
6. Source Font FileでダウンロードしたNotoSansJPを選択します。
7. Atlas Resolutionを4096×4096に設定します。(大きくすると作成されるファイルが重くなります)
8. Character SetをCustom Charactersに変更します。
9. [日本語文字コード範囲指定](https://gist.github.com/kgsi/ed2f1c5696a2211c1fd1e1e198c96ee4)をコピーしてCustom Character Listにペーストします。すべて設定し終わった画面が以下になります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/368729/e2a3de37-85b6-6947-18c3-594465646a78.png)
10. Generate Font Atlasを押します。
11. Saveを押して保存します。
12. 先程のテキストのFont Assetで生成したassetを選択すると日本語が表示されるようになります。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/368729/487b3200-e325-bbbf-265f-a6f8caa55a24.png)
(リンクだけです)余接、cot（cotangent）を調べてみた

**正接＋余接　?　長さの合計　?** 


https://ja.wikipedia.org/wiki/%E4%B8%89%E8%A7%92%E9%96%A2%E6%95%B0

https://en.wikipedia.org/wiki/Trigonometric_functions


https://ja.wikibooks.org/wiki/%E5%A4%A7%E5%AD%A6%E5%8F%97%E9%A8%93%E6%95%B0%E5%AD%A6_%E4%B8%89%E8%A7%92%E9%96%A2%E6%95%B0/%E5%85%AC%E5%BC%8F%E9%9B%86

# 内部検索
余接

https://cse.google.com/cse?cx=a8908fbc24340ebc5&q=%E4%BD%99%E6%8E%A5&oq=%E4%BD%99%E6%8E%A5&gs_l=partner-web.12..0i512l9.3028.17878.0.21325.32.32.0.0.0.0.104.2446.31j1.32.0.csems%2Cnrl%3D10...0....1j4.34.partner-web..7.25.1881.j94htob4h5s

cot

https://cse.google.com/cse?cx=a8908fbc24340ebc5&q=cot&oq=cot&gs_l=partner-web.3..0i3i4j0i4i512i433i131j0i4i512i433l2j0i3i4j0i4i512j0i4i512i433j0i4i512j0i4i512i433j0i4i512.2325.3044.0.3972.3.3.0.0.0.0.79.232.3.3.0.csems%2Cnrl%3D10...0....1.34.partner-web..0.3.232.3JLGAoAf0ho

https://www.google.com/search?q=site%3A%2F%2Fkamelink.com+%E4%BD%99%E6%8E%A5&rlz=1C1GCEB_enJP1054JP1054&oq=site%3A%2F%2Fkamelink.com+%E4%BD%99%E6%8E%A5&aqs=chrome..69i57j69i58.12987j0j4&sourceid=chrome&ie=UTF-8

site://kamelink.com cot に一致する情報は見つかりませんでした。


site://mathmathmass.exblog.jp ”余接”との一致はありません。

site://mathmathmass.exblog.jp ”cot” に一致する情報は見つかりませんでした。


# wolfram alphaで
グラフがでます。

https://www.wolframalpha.com/input?i=cot+x&lang=ja
チャットの場所を「どのくらい残したい情報か」で分けてすっきりした話

# 様々なチャット
- ちょっとこっちで書いているソースコードをチャットで相手に送った
- ドキュメントのページのURLを聞かれたのでチャットで送った

このような***その場だけ情報が共有できればいいチャット***や

- ペアプロの中で決まった方針のメモを共有した
- 雑談

みたいな***後から個人的に見返すかもしれないチャット***

- 調べてて見つけた記事のURL
- 開発中に苦戦した個所

等の***他人にも共有したい情報のチャット***など、一言にチャットと言っても伝えたい情報の中身は様々です。
これらが一つのタイムラインに表示されていると、ぱっと見***ごちゃついている***のがとても気になりました。

今回は***通話しながらペアプロをしているときにオススメしたいチャットの3分割***を共有できればと思います。

## 用意するもの
- VSCode
- LiveShare(VSCodeで使える、複数人でソースコードを編集したりできる拡張機能）
- 任意のチャットツール
- 任意のナレッジ共有スペース

https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare

## どう使い分ける？
>- ちょっとこっちで書いているソースコードをチャットで相手に送った
>- ドキュメントのページのURLを聞かれたのでチャットで送った
>
>このような***その場だけ情報が共有できればいいチャット***

LiveShareにはチャット機能があります。ここでチャットをすれば開発終了してセッションが閉じると同時にチャットもいなくなるので、わざわざ履歴を残すほどでもないやりとりはLiveShareのチャット機能を使うと便利です。
今回はLiveShareと具体的に指定していますが、要するにセッションレベルのチャットを使う事をおすすめします。
例えば、Teamsの会議のチャット欄とかもそれに該当します。

>- ペアプロの中で決まった方針のメモを共有した
>- 雑談
>
>みたいな***後から個人的に見返すかもしれないチャット***

これは使っているチャットツールでやりとりします。今まで通りです。自分はTeams使ってます。

>- 調べてて見つけた記事のURL
>- 開発中に苦戦した個所
>
>等の***他人にも共有したい情報のチャット***

これは専用のナレッジを残す場所にどんどん記録していくべきです。
今トライアルでナレッジ共有サービスを使っているので自分はそこに残してみています。
あるいはナレッジ共有チャンネルみたいなものを用意しておくのも有りだと思いますし、QiitaやZennなどのブロクに書くでもOKです。

## なぜ3つに分けたのか

理由の1つ目は残さなくてもいいチャット履歴を残さないようにするためです。ここは説明済みの為省きます。
もう1個の大きな理由は「どこに投稿すべきか」を考えるフェーズを設けることで「ナレッジとして残しておくと他の人が役に立つだろうな」とより一層思えるからです。
忙しさに追われていると「面倒だから共有しない」になってしまいがちなのを防ぐ狙いがあります。

## まとめ
- LiveShare使うだけで通話しながらのペアプロが効率あがるのでオススメ
- ナレッジ共有はちゃんと専用の場所を設けておく。
- ナレッジ共有をする事により救われる人がいる事を深く心にとどめておく
laravelでデータベースをマイグレーションできない場合の対処法

＜問題＞
laravelでデータベースのマイグレーションに失敗する。
以下の手順で行っていた。
①PHPMyAdminでデータベースを作成する。
②開発フォルダ直下の.envで以下のように変更
```php
DB_DATABASE = ①のデータベース名
```
③コンソール画面で"php artisan migrate" を実行。

＜原因＞
マイグレーションを実行中に以下のエラーが出ていた。
```
 SQLSTATE[HY000] [1045] Access denied for user 'root'@'localhost' (using password: NO) (SQL: select * from information_schema.tables where table_schema = laravel_posting_app and table_name = migrations and table_type = 'BASE TABLE')
```
**→.envファイルにMySQLのパスワードを記述していなかった。**
-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-
MySQLのパスワードを記述しても、マイグレーション実行中に同じエラーが発生する。
**→MySQLのパスワードが違った。**

MySQLのパスワードの確認方法
①コンソール画面で以下を入力する。
```
mysql -uユーザー名 -p
```
②パスワードは？と聞かれるので入力する。
③もしログインできて終わりたい場合は以下を入力する。
```
quit
```
＜結果＞
マイグレーションできた。

＜参考サイト＞
・マイグレーションがうまくいかない時の対処法
https://terrblog.com/php-artisan-migrate%E3%81%8C%E4%B8%8A%E6%89%8B%E3%81%8F%E8%A1%8C%E3%81%8B%E3%81%AA%E3%81%8B%E3%81%A3%E3%81%9F%E6%99%82%E3%81%AE%E5%AF%BE%E5%87%A6%E6%B3%95-sqlstatehy000-1045/

・コマンドでMySQLにログインする方法
https://www.wakuwakubank.com/posts/402-mysql-commandline/
[Perl] ref / reftype / blessed の返り値早見表

Perl の組み込み関数 `ref` と、コアモジュール Scalar::Util のサブルーチン `reftype` 及び `blessed` の、それぞれが返してくる戻り値の関係がややこしかったので、表にまとめました。

なお Perl v5.36 ではコアモジュール builtin が追加され、`reftype` と `blessed` も、インタプリタ組み込み関数に格上げされる流れのようです。

リソースは以下：

- [組み込み関数 ref の翻訳](https://perldoc.jp/func/ref)
- [Scalar::Util の POD の翻訳](https://perldoc.jp/docs/modules/Scalar-List-Utils-1.21/Scalar/Util.pod)
- [perl5360delta の翻訳](https://perldoc.jp/docs/perl/5.36.0/perl5360delta.pod)

# 早見表

.ods データは GitHub に置いています：
https://github.com/tani-ro-hei/ref-reftype-blessed
![ref-reftype-blessed.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/365205/ce245f46-477d-d568-5aa7-1439ece6cf75.png)
VTL がよくわからない (クォートのエスケープ)

# VTL でクォートの中でクォートしようと思ったときにいいやり方がリファレンスを見てもわからなかった

```vtl
"func("{"key":"value"}")"
```

こんな感じのを書きたかった．
片方はシングルクォートでなんとかなるみたいだけど．
ということで，外に出すことにしたらうまくいったみたい．

```vtl
#set($data = "{'key':'value'}")
"func($data)"
```


## Refs

https://velocity.apache.org/engine/devel/vtl-reference.html

https://qiita.com/yoshida874/items/d860aa1f39f5e623ebe6

こちら(ダブルクォートを二回書く方式`""`)が良さそう
Mac Ventura　port:5000を利用しようとすると使われているときの対応方法

## 結論

AirPlayサーバーが5000ポートを使用しているため起きる現象です。
以下の手順で解決します。

「システム設定」 > 「一般」 > 「AirDrop と Handoff」 > 「AirPlayレシーバー」をオフにする。

## 説明

MacOS Monterey 12以降発生している現象です。
Venturaだと設定の変更部分が異なるため記事にしました。

## 参考

https://qiita.com/NasuPanda/items/ac94c496d42aac4fcb6d
BigDecimalを使うときの注意点

- BigDecimalを使うときは、NullPointerExceptionを避けるため、NULLの場合は0を返すようする方が無難である。Stringから変換するときは、以下のようなメソッドを用意しておくと良い！

```java
public static BigDecimal toNumber(String str) {
	if (str == null) {
		return BigDecimal.ZERO;
	} else {
		return new BigDecimal(str.replaceAll(",", ""));
	}
}
```

- BigDecimalを直接使う場合も、Optionalを利用してNULLの場合は0を返すようなメソッドを通す方が良い

```java
public static BigDecimal toNumber(BigDecimal num) {
    return Optional.ofNullable(num).orElse(BigDecimal.ZERO)
}
```

- ゼロ除算で落ちることを防止するため、以下のようなメソッドを用意しておくと良い

```java
public static BigDecimal divide(BigDecimal num, BigDecimal divisor, int scale, RoundingMode roundingMode) {
	if (divisor.compareTo(BigDecimal.ZERO) == 0) {
		return BigDecimal.ZERO;
	}
	else {
		return num.divide(divisor, scale, roundingMode);
	}
}
```
これからエンジニアになる学生としてやっていること（情報収集や知識集めなど）について

## 序論
現在情報系学部４年生の大学生である私だが、正直なところエンジニア的知識を身につけているわけではない。大学で学んでいることが自分の血肉となっている実感がないため、これまでやってきたことを整理する目的を含めてここの記事にまとめる。書く予定である項目を以下に示す。
* 私が普段使っている情報収集と知識ベースのプラットフォーム
* 個人的に身につけておくべき知識分野

## 私が普段使っている情報収集と知識ベースのプラットフォーム
序論でも述べた通り、私は情報系学部の大学生であるが立派にエンジニア的知識を身につけておらず、これから社会人になる身として不安しかない。弱々しいエンジニアが普段情報集めとして使っているプラットフォームをみてもらいたい。
* 本（これがほとんど） → これまで読んできた本の紹介用サイト（リンクを貼る予定です）
* Twitter
* Instagram
* Qiita
* You Tube
* ITmedia
* News Picks
他にもあるが、思い出せないため、ひとまずこれだけにしておいた。TwitterとかInstagramから情報を収集する人はどれだけいるのだろうか。普段からこれらSNSを使っているため、とりあえずエンジニアっぽい人を片っ端からフォローしてその人が普段どのようなトピックを気にしているのか追っているだけである。

## 個人的に身につけておくべき知識分野
一般教養も含め、これからさまざまな知識を身につけたいと思っているところである。特段目標があるわけではないが、「いつか」のために初級編・ビギナー・入門編といったワードの本を漁っている。具体的にどのような分野なのか下にまとめた。
* ハードウェア
    * 半導体（製造工程とか）
    * PC（PCの開発歴史であったり、ゲーミングPCとかのスペックなど）
    * サーバー系（ハードの構築方法とか）
* ソフトウェア
    * セキュリティ
    * UI/UX
    * OS（Linux・Window・Macなど)
    * サーバー系（ソフトの構築とか）
* 数学
    * 暗号理論
    * 統計学（データアナリストとしての知識）
    * アルゴリズム
* 法律

## 最後に
人に見せるために文章を書くなどこれまでほとんど体験したことがない。大学のゼミ発表とかその程度で、人前で話すと必ず話し言葉が破綻して日本語として成立していない。だから日本語ネイティブなのに日本語を苦手意識している。これでは本末転倒。SEとしてシステム構築するには公式ドキュメントなど目を通すことがこれから増えていくのに、日本語が苦手なエンジニアは文章読解を誤訳して開発に悪影響を及ぼしてしまう。だから、私はできるだけ日本語に慣れておくように、本を簡単なものからでいいからちょっとずつ読むようにして、長文に対する苦手意識を克服していこうとしている。（今でもここまで書いてきた日本語に違和感がないか、心臓がゾクゾクしている。おかしな言葉を使っていた場合は申し訳ない。）
AWS ElasticBeanstalkデプロイ時の各種エラー

ElasticBeanstalkに限った話ではないですが、トレーニング不足だとエラーに遭遇しやすいです。
遭遇したものの対処方法をいくつか記載します。

## 証明書エラー

> ERROR	Creating Load Balancer listener failed Reason: Resource handler returned message: "The certificate 'arn:aws:acm:ap-northeast-1:123456789012:certificate/xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx' must have a fully-qualified domain name, a supported signature, and a supported key size. (Service: ElasticLoadBalancingV2, Status Code: 400, Request ID: xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx)" (RequestToken: xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx, HandlerErrorCode: InvalidRequest)
> ERROR	Stack named 'awseb-x-xxxxxxxxxx-stack' aborted operation. Current state: 'CREATE_FAILED' Reason: The following resource(s) failed to create: [AWSEBV2LoadBalancerListener443].

### 原因
発行前のSSL証明書をアタッチして443ポートのリスナーを追加したためでした。
### 対応
リスナーを削除しようとしましたが、不正な状態になると設定変更ができないようでした。
仕方がないので構成を削除してから再作成すると回避しました。


## VPCエラー
> WARN	Environment health has transitioned from Pending to Severe. ELB processes ar
> ERROR	Stack named 'awseb-e-km6mb5kc3j-stack' aborted operation. Current state: 'CREATE_FAILED' Reason: The following resource(s) failed to create: [AWSEBInstanceLaunchWaitCondition].
> ERROR	The EC2 instances failed to communicate with AWS Elastic Beanstalk, either because of configuration problems with the VPC or a failed EC2 instance. Check your VPC configuration and try launching the environment again.
> INFO	Launched environment: jp-kinako-production. However, there were issues during launch. See event log for details.

### 原因
アプリケーションコードが不正なものが指定されていたためでした。

### 対応
構成を一旦削除してから正しいアプリケーションコードを指定したところクリアしました。

#### 補足
今回は非該当でしたが本来はVPCに問題があるケースの方が多いと思います。
下記を調べましたがどれも該当せずエラー文言と異なるため解析に時間がかかりました。。
- https://repost.aws/ja/knowledge-center/elastic-beanstalk-instance-failure
- https://blog.ottijp.com/2022/02/11/eb-error/




以上です。
誰かのお役に立てれば幸いです。
【2023年度】S3にあるhlsコンテンツをセキュアに自分のドメインで再生する方法

# TL;DR
- S3のパブリックアクセスはブロックのままに、バケットポリシーで許可。
- CloudFrontでアクセスできる設定をする
- 認証Cookieをsecure属性で付与して、アクセス！

## 参考文献

https://zenn.dev/bun913/articles/cloudfront-cors-policies
https://qiita.com/hmatsu47/items/dde84a8d059ea2eb62dc
https://tk-ch.hatenablog.com/entry/20221216/1671178609
https://qiita.com/tadasuke/items/9f9fe00115a7f0199e05
https://dev.classmethod.jp/articles/cf-s3-private-content-signed-cookies-with-wildcard/
https://dev.classmethod.jp/articles/cloudfront-signed-cookie/
https://qiita.com/nareff/items/514a9e246779dc1b9489
https://docs.aws.amazon.com/ja_jp/AmazonCloudFront/latest/DeveloperGuide/private-content-setting-signed-cookie-custom-policy.html#private-content-custom-policy-statement-cookies-values
Java 参照の値渡しのメソッドで 戻り値を返すべきか

# 概要
Javaのメソッド内で引数のインスタンスに変更を加える場合に
"メソッドの実行によって呼び出し元のインスタンスにも変更は加わるが、あえて明示的に戻り値として返却するべきなのか？"の疑問に対して、一つ納得できる答えを知ることができたため、その備忘録。

# 前提
Javaのメソッド処理には、「値渡し」と「参照の値渡し」が存在する。

<font color="Red">値渡し</font>：呼び出し先のメソッド処理により、呼び出し元の変数の状態が変化しない。
<font color="Red">参照の値渡し</font>：呼び出し先のメソッド処理により、呼び出し元の変数の状態が変化する。

値渡しになるか参照の値渡しになるかはメソッドの引数により異なり、
プリミティブ型（boolean、byte、char、short、int、float、long、double）の場合は値渡し、
それ以外の場合では参照の値渡しとなる。

**今回は<font color="Red">参照の値渡し</font>の場合の、戻り値の必要性についてのお話。**

# 例
```java:Human.java
private String name;
private int age;

// Getter,Setterは省略
```

### ①戻り値を記載する場合
```java:Main.java
public static void main(String args[]) {
    
    Human human = new Human();
    human.setName("田中");
    human.setAge(30);

    // メソッド返却値を新たなHumanインスタンス「youngerHuman」として定義
    Human youngerHuman = rejuvenate5Years(human);
    
    System.out.println("名前は" + youngerHuman.getName() + "です。");
	System.out.println("年齢は" + youngerHuman.getAge() + "歳です。");
}

// 5歳若返りメソッド
// 引数のHumanインスタンスを編集し、返す
private static Human rejuvenate5Years(Human human) {
    human.setAge(human.getAge() - 5);
    return human;
}
```
rejuvenate5Yearsメソッドで、引数のインスタンスに対しageを5歳若く設定し直して返却している。
### ②戻り値を記載しない場合
```java:Main.java
public static void main(String args[]) {
    
    Human human = new Human();
    human.setName("田中");
    human.setAge(30);

    // メソッド呼び出しのみ
    rejuvenate5Years(human);

	System.out.println("名前は" + human.getName() + "です。");
	System.out.println("年齢は" + human.getAge() + "歳です。");
}

// 5歳若返りメソッド
// 戻り値はvoid
private static void rejuvenate5Years(Human human) {
    human.setAge(human.getAge() - 5);   
}
```
出力結果は同じ。明示的にインスタンスの返却をしていない。

# 結論
#### ②戻り値を記載しない
引数で取得したインスタンスを変更させている場合、戻り値はvoidとする。

#### 理由：戻り値がない⇒引数で渡したインスタンスの中身を変更しているんだろう、と読み手に推測させることができるから。
returnもせず、引数のインスタンスも変更していない場合、そのメソッドは何もしない無意味のメソッドとなってしまう。
そんなメソッドはありえないため、「戻り値がvoidだから引数のインスタンスに何かしら変更を加えるメソッドだ」と判断ができる。

逆に、
戻り値を作る場合には、引数で渡したインスタンスには何も変更を加えず、新しくインスタンスを作成したものを戻り値とすべき。
### ③新しくインスタンスを作成したものを戻り値とする
```java:Main.java
// 引数のhumanは変更せず、新たなインスタンスを生成する。
private static Human rejuvenate5Years(Human human) {
    Human youngerHuman = new Human();
    youngerHuman.setName(human.getName());
    youngerHuman.setAge(human.getAge() - 5);
    return youngerHuman;
}
```


# 結論
「引数のインスタンスも変更するし、戻り値も返す」だと、メソッドの動作が直感的に分かりにくくなってしまう。
そのため、
・引数のインスタンスを直接変更する場合、戻り値はvoidとする。
・引数をもとに新たにインスタンスを作成し処理する場合のみ、そのインスタンスを戻り値とする。
docker compose upで発生した「error response from daemon: network 」の解決方法

# はじめに
本記事の内容は表題の通りです。
docker compose upを実行したところ急に以下のエラーが発生し、
コンテナが立ち上がらなくなりました。
```
Error response from daemon: network c0ba88d32846f727fe9261514ac9782c05be0e9c4d4ee36d728524f996ba8f35 not found
```

困ったことにソースやdockerの設定を変更した記憶もなく、
まさに勝手に壊れた！という状態です。



# 解決方法
## dockerの設定を初期化する(非推奨)
力技です。
大体のことは再起動や初期化で解決します。
```
docker system prune
```

https://docs.docker.jp/config/pruning.html


この方法は非推奨のとさせてください。
コンテナ環境で行っていた変更も消えてしまうからです。
DBが全て消え、悲鳴を上げました。


## networkを作成する（推奨）
こちらが推奨する方法です。
エラーメッセージにある通り「c0ba88d32846f727fe9261514ac9782c05be0e9c4d4ee36d728524f996ba8f35」というNetWrokが見つからないことがエラーの原因です。
以下コマンドによりエラーが解消されました。
```
docker network create --driver bridge c0ba88d32846f727fe9261514ac9782c05be0e9c4d4ee36d728524f996ba8f35
```




# 終わり
以上です。
なんとなくですがdocker環境は頻繁に壊れている気がします。
使い方が雑なせいかもしれません。
PhpStormでGitHub Copilotプラグインを使ってみた


### javascriptでbool値を文字列にするメソッドがほしい

`bool2`まで入力したらあとは察してくれた。
<img width="100%" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533120/3c1b0a5f-e8f2-4d16-7ce6-b5af2433507b.gif">

### 業務ロジックを作成したい

 `//スポット数`とコメント書いただけで処理を作成してくれた
ソースは見せられないけど、プロジェクト内の書き方に合わせてオリジナルのソース作成されてビビった。
![adc.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533120/518a841b-6761-5f84-6d76-f9374dbb92ff.gif)

### javascriptで1ページ目か判断するメソッドを作りたい

メソッド名と`location.search`で取得するまでは自分で書いた。
コメント書こうと`// 文字列に`と入力したところサジェストされた。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533120/a51d6705-39df-3178-d6db-6044f0d26147.png)
ロジックもサジェストされた。ページネーションを`page=`で管理しているのも汲み取ってくれた。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533120/e44264b6-53ff-d0c1-6f4d-dc12edc69a44.png)
`page=1`のパターンもサジェストしてくれた
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533120/1128cca0-6505-7c48-c891-213bef86c51e.png)
どのパターンにも当てはまらない`return false;`もサジェスト
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533120/7990e55d-6574-3a27-9506-616803bdb0f1.png)
コメントも自動で入れて完成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533120/ec4bfd6f-e3cc-3d26-d2dc-dd1a51a5cd03.png)

### javascriptで独自ロジックを作成したい

タイトルの最後尾に文字列を付与したかった。
`titleSuffix: function(){`まで書いたらサジェストされた。
![ad.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533120/80b4cca2-7cc6-cd67-691e-afded5d583b7.png)
最終的にはこのように自分で変更した。
![adfd.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/533120/8d0ce5bb-f4dc-7dc8-c17f-e4cbef37cbb6.png)
やりたいことは伝わってたけどソースの大部分は書き換えた。
Copilotには仕様がわからないし仕方ない部分ではある。
それでも独自に作成した`isFirstPage`メソッドを使ってくれたのはすごい。空気読みすぎ。
無理にLambda@Edge使わなくてもカスタムヘッダーで良くない？



## はじめに

S3でホストしている静的コンテンツの前段にCloudFrontを置くのはよく見る構成ですが、そこで少しつまずいたことがあったので備忘も兼ねて記事にします。

## 現状構成

S3の静的ウェブサイトホスティング機能を利用してウェブサイトを構成、外部のDNSから名前解決させていました。

## 現状構成の問題点

扱った実際のウェブサイトは投稿機能等もなく、閲覧のみのサイトでした。
とは言え、上記の構成ではS3に直接アクセスできてしまうという問題点がありました。

## やりたいこと

CloudFrontを挟んで、S3へのアクセスをCloudFront経由のみに限定する。

## 直面した問題

実際にCloudFrontを挟んでみると下記のような補完が出来ないという問題がありました。

```
https://hoge.com/hoge/ -> https://hoge.com/hoge/index.html
https://hoge.com/hoge  -> https://hoge.com/hoge/index.html
```

もともとはS3の静的ウェブサイトホスティング機能で補完されていましたが、CloudFrontを置くことで機能を無効にする必要がありました。

## 一般的な解決策

一般的な解決策としては下記のようにLambda@Edgeにて補完になると思われます。

https://qiita.com/kzk-maeda/items/8d17ef211cfbd670b0a5

しかし、今回の場合は少し癖のある補完が必要であったことと、それを構築したとしても保守していく体制が無いという問題がありました。

## オリジンのカスタムヘッダーを利用した回避策

というわけで前置きが長くなってしまったのですが、S3の静的ウェブサイトホスティングは保持し、CloudFrontのカスタムオリジンヘッダーを用いることにしました。

対応内容としては以下のとおりです。
※**証明書の設定やRoute53等の設定は省略させていただきます**

1. [CloudFront側]ホスティングするS3のエンドポイントを指定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/450480/45e33644-9ad9-70fa-3918-49e37006b9d8.png)
※エンドポイントURLはS3にて静的ウェブサイトホスティングを有効にすると表示されます
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/450480/f9e54343-236e-4e46-4f6a-b9519de14c71.png)
1. [CloudFront側]カスタムヘッダーの設定
「ヘッダー名」「値」をそれぞれ設定します（この組み合わせで閲覧可否を制御します）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/450480/ed22ccfa-7d29-c3ee-35d0-6ec350801185.png)
1. [S3側]バケットポリシーを変更する
指定のカスタムヘッダーを持たない場合に閲覧できないようにします
```json
{
	"Version": "2012-10-17",
	"Statement": [
		{
			"Sid": "PublicReadForGetBucketObjects",
			"Effect": "Allow",
			"Principal": "*",
			"Action": "s3:GetObject",
			"Resource": "arn:aws:s3:::バケット名/*",
			"Condition": {
				"StringEquals": {
					"aws:Referer": "samplevalue（設定した値）"
				}
			}
		}
	]
}
```

**[動作確認]** 上記設定の後、S3のエンドポイントからアクセスできなくなっていて、CloudFront経由のみアクセスできるようになれば成功です。

##参考URL

- https://docs.aws.amazon.com/ja_jp/AmazonCloudFront/latest/DeveloperGuide/add-origin-custom-headers.html

## 終わりに

今回のように**保守体制が薄いのでリッチに構成できない**って意外とよくある問題なのかな？？と思います。
この記事が同じ悩みを持った誰かの助けになれば嬉しいです。。
[C#] ASP.NETをマスターする（目次）

英語版はこちらになります。
https://medium.com/@syantien/preview-in-mid-of-building-asp-net-core-learning-course-517a8a988ada

基本英語版先に作り翻訳しているので、一部表現が微妙なところがありますが、予めご了承くださいませ。ほぼ日々更新していますので、更新次第こちらのリンクも更新します。

---

現在ASP.NET Coreの学習コースを開発中です、特に社内のエンジニアリングチームを対象として作っていますが公開していきます。このコースを準備して公開しようと思ったのは、チーム全体が私たちの仕事に使用するコアテクノロジーを一貫して徹底的に理解していることを確認することです。

コースの目次は以下です、各セクションの内容は進行に合わせて段階的に公開していきます。

## ASP.NET Coreの概観
- 主な機能と利点
- アーキテクチャとコンポーネントの理解
- 開発環境のセットアップ

## 必要なツールと依存関係のインストール
- 新しいASP.NET Coreプロジェクトの作成
- プロジェクト構造とファイルの探索
- ASP.NET Core MVCを使用したウェブアプリケーションの構築

## Model-View-Controller (MVC)パターンへの導入
- モデル、ビュー、コントローラーの作成
- ルーティングとリクエストの処理
- Entity Framework Coreを使用したデータ処理
- ASP.NET CoreでのWeb APIの構築

## RESTful APIとその利点の概観
- APIコントローラーとアクションの作成
- リソースのCRUD操作の実装
- 認証と認可の処理


## ASP.NET Coreでのミドルウェアの概念の理解
- ミドルウェアとサービスの利用
- ビルトインミドルウェアの設定と使用
- カスタムミドルウェアコンポーネントの作成
- 依存性注入とサービスの利用


## ASP.NET Coreでの状態管理のための異なるオプションの探索
- 状態とセッションの管理
- ユーザーデータの保存のためのセッションとTempDataの使用
- クッキーと認証トークンの利用

## コントローラーとサービスのユニットテストの記述
- ASP.NET Coreアプリケーションのテストとデバッグ
- xUnitやNUnitのようなテストフレームワークの使用
- ASP.NET Coreのデバッグ技術とツール


## ASP.NET Coreアプリケーションのデプロイメントの準備
- デプロイメントとホスティングオプション
- オンプレミスサーバーまたはクラウドプラットフォームへのデプロイ
- ホスティングオプションと環境の設定


## ASP.NET Coreでのパフォーマンス最適化の手法
- パフォーマンス最適化とセキュリティ
- <a href="https://qiita.com/syantien/items/d4df7b58611223ae0d02">キャッシング戦略とパフォーマンスプロファイリング</a>
- セキュリティ対策とベストプラクティスの実装

## 高度なトピックと拡張機能
- SignalRを使用したリアルタイム通信の作業
- Identityを使用した認証と認可の実装
- ASP.NET Coreのサードパーティライブラリと拡張機能の探索
- ベストプラクティスとヒント

## コードの整理と保守性のためのベストプラクティスの遵守
- エラーハンドリングとロギング戦略
- パフォーマンス最適化のヒントと推奨される方法
- プロジェクトの開発とデプロイ

## ガイド付きのプロジェクト開発演習
- ステップバイステップのデプロイメントプロセスと考慮事項

# 最後に

現在絶賛エンジニア採用中です。フルリモート正社員になります。
スタートアップで一旗あげたい方は是非。

詳細と最新情報は下記リンクにてご確認ください。
https://receiptroller.com/ja/jobs
AWS Lambda + bref + php で IntlDateFormatter が Not Found になってしまう

# 起こったこと

Lambda + bref/bref + php で IntlDateFormatter がエラーになってしまいました。

```bash
PHP Fatal error: Uncaught Error: Class 'IntlDateFormatter'
```

# 対応方法

マニュアルをよく読む。

https://bref.sh/docs/environment/php.html#extensions

プロジェクトに、ファイル php/conf.d/php.ini を追加して、以下の内容にする。

```bash
$ cd bref-project-dir
$ mkdir -p php/conf.d
$ vi php/conf.d/php.ini
```

ファイルの内容は以下。

```ini
extension=intl
```

これで再度デプロイすればOK。
【Swift】画像を切り抜いて丸く表示する（SNSのアイコン風）

# はじめに
アルバムなどに入っている長方形の画像(`UIImage`)から、中心部分を正方形にトリミングして`UIImageView`で円形に表示させる方法を紹介します。

`画像を指定した幅にリサイズ` -> `中心部分を正方形に切り抜く` -> `cornerRadiusで円形表示`
# コード
まず、`UIImage`のextensionでリサイズと切り抜きを行います。
引数の`resizeWidth`で画面に表示するときの幅を指定します。
```swift
extension UIImage {
    // リサイズして正方形にトリミング
    func cropResizedSquare(_ resizeWidth: CGFloat) -> UIImage? {
        let minSideWidth = min(size.width, size.height)
        let ratio = resizeWidth / minSideWidth

        let origin = size.width > size.height
        ? CGPoint(x: (minSideWidth - size.width) * 0.5 * ratio, y: 0.0)
        : CGPoint(x: 0.0, y: (minSideWidth - size.height) * 0.5 * ratio)

        // リサイズ
        UIGraphicsBeginImageContextWithOptions(CGSize(width: resizeWidth, height: resizeWidth), false, 0.0)
        // トリミング
        draw(in: CGRect(origin: origin, size: CGSize(width: size.width * ratio, height: size.height * ratio)))
        let resizedImage = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()

        return resizedImage
    }
}
```
最後に、`UIImage`からこのメソッドを呼び出し、`UIImageView`のcornerRadiusで画像を円形に表示させます。
```swift
let myImage = UIImage(named: "myImage") // 表示させたい画像
let imageWidth: CGFloat = 50 // 表示するときの幅

let imageView = UIImageView()
imageView.image = myImage?.cropResizedSquare(imageWidth)
imageView.layer.cornerRadius = imageWidth * 0.5
imageView.clipsToBounds = true
```
Salesforce Summer'23 の Salesforce `サポートを利用` クリックが動作しない場合

# Salesforce Summer'23 の Salesforce `サポートを利用` クリックが動作しない場合のワークアラウンド

Salesforce Summer'23 から macOS の Chrome および Edge で Salesforce `サポートを利用` のクリックが動作しない事象が発生する場合がある様です。

（追記）2023/06/20時点でこの事象は発生しなくなったように観察されます。

## ワークアラウンド

`Salesforce Classic に切り替え` してから `ヘルプ＆トレーニング` を選ぶことによってサポートの利用が可能です。
使用が終わったら `Lightning Experience に切り替え` で元に戻せます。

## 2023/06/20時点

2023/06/20時点で、この事象が発生しなくなったことを確認。訂正されたのかどうかは不明。

このような同種の事象が発生した場合のワークアラウンドのひとつとして、`Salesforce Classic` （クラシックモード）で動作を確認して可能であればワークアラウンドとして採用するのは（しかたないけれど）有望な選択肢となります。
macでphpのバージョンをダウングレードする方法

# php8.2→php7.4へダウングレードする方法

## 背景
間違ってlaravel10を導入してしまい、laravel5.6にダウングレードしようとしたところphpのバージョンが未来すぎて怒られてしまったため。

## コマンド
1. Homebrewはバージョン管理されたフォーミュラをデフォルトで無効化する方針をとっており、古いバージョンのPHPを直接インストールすることは難しいため、shivammathur/homebrew-phpを導入する。

```
brew tap shivammathur/php
```

shivammathur/homebrew-phpでphp7.4をインストールする。

```
brew install shivammathur/php/php@7.4
```

インストールされているphpを確認する。
```
brew list | grep php
```
アクティブなリンクをアンリンク
```
brew unlink php
```

php7.4をリンクする
```
brew link php@7.4 --force
```
pathを通す
```
echo 'export PATH="/usr/local/opt/php@7.4/bin:$PATH"' >> ~/.bash_profile
echo 'export PATH="/usr/local/opt/php@7.4/sbin:$PATH"' >> ~/.bash_profile
```
php-vで確認
```
-> % php -v                                                               
PHP 7.4.33 (cli) (built: Jun  8 2023 14:23:52) ( NTS )
Copyright (c) The PHP Group
Zend Engine v3.4.0, Copyright (c) Zend Technologies
    with Zend OPcache v7.4.33, Copyright (c), by Zend Technologies
```

## お疲れ様でした。
Ethereumスマートコントラクト開発：Coinコントラクトの構築と操作

# Solidityとスマートコントラクト入門：Coinコントラクトの作成

こんにちは！今日はJavaScriptの知識があるが、Solidityやスマートコントラクトについて詳しくないエンジニアのためのガイドを提供します。今回は、EthereumのオンラインIDEであるRemixを使用します。

## 1. コードの説明

まずは、以下のSolidityコードを見てみましょう。

```solidity
pragma solidity ^0.8.4;

contract Coin {
    address public minter;
    mapping (address => uint) public balances;

    event Sent(address from, address to, uint amount);

    constructor() {
        minter = msg.sender;
    }

    function mint(address receiver, uint amount) public {
        require(msg.sender == minter);
        balances[receiver] += amount;
    }

    error InsufficientBalance(uint requested, uint available);

    function send(address receiver, uint amount) public {
        if (amount > balances[msg.sender])
        revert InsufficientBalance({
            requested: amount,
            available: balances[msg.sender]
        });
        balances[msg.sender] -= amount;
        balances[receiver] += amount;
        emit Sent(msg.sender, receiver, amount);
    }
}
```
このコードは`Coin`というスマートコントラクトを作成します。このコントラクトは以下の機能を持ちます：

- `minter`：コインを発行するアドレスを保持します。コンストラクタでこの変数は`msg.sender`（コントラクトをデプロイしたアドレス）に設定されます。
- `balances`：各アドレスのコインのバランスを保持するマッピングです。
- `Sent`：コインが送信されたときに実行されるイベントです。
- `mint`：指定されたアドレスに指定された量のコインを発行する関数です。この関数は`minter`からのみ呼び出すことができます。
- `send`：指定されたアドレスに指定された量のコインを送信する関数です。この関数は送信者が十分なバランスを持っている場合にのみ呼び出すことができます。

## 2. Remix IDEでのコンパイルとデプロイ

次に、Remix IDEでこのコードをコンパイルとデプロイする方法を見てみましょう。手順は先ほどのガイドと同様です。

## 3. コントラクトとのやり取り

デプロイした`Coin`コントラクトは`mint`と`send`関数を通じて操作できます。`mint`関数はコインを発行し、`send`関数はコインを送信します。

それでは、Happy coding！
APIゲートウェイの代わりに関数URLを使ってみた

## 何故使ってみたか？

とある事情でWeb上からLambda関数を呼ぶ必要が出てきました。
以前だとAPIゲートウェイを使って呼び出すのが普通でした。
ただAPIゲートウェイだと…

* APIゲートウェイを設定するのが（私の感覚だと）面倒
* ちょっとしたLambda関数を呼び出すだけには大げさすぎる

と、ちょっと敷居が高かったのですが、2022年4月6日に関数URLが機能追加されました。

https://aws.amazon.com/jp/about-aws/whats-new/2022/04/aws-lambda-function-urls-built-in-https-endpoints/

これは、

* Lambda関数内で定義するだけで簡単に使用できる
* なので1つの関数URLにつき１つのLambda関数が実行される

と、「できるだけ楽したい教」の信者の私はこちらに飛びつきました。

## 使い方

* Lambdaの管理画面から「設定」を選択
    * 「関数URLを作成」を選択
![関数URLを作成.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480287/e79f1b75-3660-9853-b175-528d0ee21867.png)

    * 関数URLを設定して保存
![関数URL設定.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480287/bbe9c993-1203-f397-7096-a63ff20b2aa8.png)
        * 自分は別ドメインのWeb上から呼ぶのでCORSを設定しています
        * 許可オリジンに今回アクセスするWeb URLを設定しています
        * 許可メソッドは必要に応じて変更できます
    * 関数URLが出来ているか確認
        * 試しに関数URLにアクセスするとLambda関数が動き出します
![関数URL確認.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480287/b65c4d13-ddef-204a-56d1-96ac917844e1.png)
        * Lambda実行結果
![hello_from_lambda.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480287/b7969004-96a3-ad97-9fb0-0b0b76976433.png)



## おわりに

記事にするとサクッと出来ているように見えますが、まあまあ試行錯誤しています。（笑）
その辺は機会があれば別記事で公開するかもしれません。

んじゃ
ほぼ未経験でもChatGPTを使えばプログラムを作れるのか②～プログラミングほぼ未経験者の挑戦～：アルゴリズムー①

前回の記事で目標の設定が無事（？）完了～　＼(^o^)／

次はなんだったかな・・・

![スクリーンショット 2023-06-01 155629.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2500101/525078d2-ff18-8c4d-defe-37b12d7cc550.png)
目標の設定ページ図1再掲

『2.アルゴリズムの設計』か。

アルゴリズムってなんだ。

アルゴリズム・・・呟くだけで仕事ができる人になった気分～

![図2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2500101/af382c2a-9b31-d0ff-4db3-00b02c127b9e.png)
図2

最適な解決方法を見つけ出すプロセス・・・・？

永遠に見つかる気がしないよ

![図3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2500101/7c9d7711-195c-ee24-de7d-ae796dc0e5f2.png)
図3

よく分からないんだけど、例えるなら機械の設計図的な感じ？

そうなの？

![図4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2500101/5463a855-59ab-d930-765c-d6b8fce8a81e.png)
図4

あってる！

でも設計図ってどうやって作るんだ・・・？

というか何が必要かもわからないよ。


![図5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2500101/e41cb3ef-0800-1b25-7662-c00aeb8de3bc.png)
図5

問題の理解と分析・・・？目標の設定で行ったものではなく、別にまたやるの？

![図6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2500101/1085be92-3e75-f75f-d104-86f511262a5d.png)
図6

いまいち違いがよくわからないけど、ChatGPTが必要って言ってるし、やってみるか・・・


![図7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2500101/e508bea4-8fae-5f89-772c-a7d7e2f1e9ca.png)
図7

まずは問題の定義と背景理解からするのね。

ちょっと整理すると・・・
今ってアルゴリズムの設計をするための問題の理解の分析をしていて、
問題の理解の分析をするために、問題の定義と背景を理解するってことよね。

複雑になってきて把握するのが辛い～

![図8.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2500101/c6719013-fa81-9104-73c8-5139430dcbc8.png)
図8

聞き方ミスった！

1.の応募率は欲しいけど、2.面接率、3.採用率、4.応募者の質については必要ない項目だな


![図9.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2500101/9fbc096d-1320-7768-1821-e27adb4fdd8c.png)
図9

今度は良い感じ◎
でもここは自分で考えないとダメな感じだなぁぁ・・・

既読率の基準は媒体によって任意で設定したいのだけど、それって可能？

![図10.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2500101/f61f7244-565e-2cfc-ac5b-bba9dfe6ed7a.png)
図10

自分で考えないとな・・・と思っていたけど
もはやこれで良いな！

でも媒体Aとか分かりにくい～
かといって本物の媒体名を使うのはダメな気がするので、
池田が考えた媒体名を使うことにしよう。

上記を参考に作ったのが↓

![図11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2500101/d0e674db-aefd-5e53-e47a-fa1fc6f476ab.png)
図11

これであってる？
こんなんで本当に良いの？

よく分からないけど、アルゴリズムの設計の①の『問題の理解と分析』の中の①の『問題の定義と背景理解』は完了！！（「の」がゲシュタルト崩壊しそう）

思った以上に長くなってしまったため、今日はここまで・・・

所用時間：2時間（内容の理解に思った以上に手間取ったため。読解力、ふってこい！）
最速最短でサイトのtitleタグのエレメントを取得したい！！

## 概要
私事ではあるのですが、Qiitaなどで引用する際に、引用したドキュメント、記事などのサイトの`titleタグのエレメント`が欲しくなります。そういった経緯も相まって、どのように行えば最速最短で引用したサイトの`titleタグのエレメント`に辿り着けるのか私なりに考察致しました。
Jeffrey Zeldmanが”[Taking Your Talent to the Web](https://www.amazon.co.jp/gp/product/0735710732/ref=as_li_qf_asin_il_tl?ie=UTF8&tag=giginc-22&creative=1211&linkCode=as2&creativeASIN=0735710732&linkId=1e6c22d2522f064bb96a7f84335ab2bd)”で述べていたようなことと同様に、なるべくクリック数は少なくゴールにたどり着きたいものです。
それでは、私が思いつく限りの3つの簡単な方法を後述致します。

:::note warn
以下の方法は、ブラウザにChromeを使用しており、**Chromeに依存した方法**である可能性があります。また、OSにはMacを使用しておりMacで使用するショートカットだけを紹介している箇所が御座います。これらを留意してお読み下さい。
:::

## 方法1(無難に検証)
まずは無難に目的のサイトを検証してtitleタグのエレメントを取得する方法を試したいと思います。
`Command + Shift + C（WindowsではControl + Shift + C）`を行い`headタグ`を開いて`titleタグ`に辿り着く方法です。
```mermaid
graph TD;
    Command+Shift+C-->headタグを開く;
    headタグを開く-->|見つかった|Goal!;
    headタグを開く-->|すぐに見つからない|titleタグで検索;
    titleタグで検索-->Goal!;
    
```
まぁ、無難に`titleタグ`には辿り着けますが、場合によって、ゴールまでの工程が多いですね。
つまり場合によって`Command + F`で`titleタグ`を検索して一番上のものを見つけなくてはいけないわけですからね。

:::note
**結果:
到達までのコスト: 2アクション以上🤦
終了までのコスト: 1アクション✨
懸念点: 探す工程がシンプルに多くなる可能性がある🤦**
:::
## 方法2(Command + S)
続いては`Command + S`を使用する方法です！
これは、本来`titleタグのエレメント`を取得する為では当然なく、表示されているHTMLファイルを保存する方法です。
しかし、このショートカットを行うと、ファイルを保存しようとウィンドウが表示されます。
すると、そのファイル名には`titleタグのエレメント1が`用いられています。
それをコピーして使用するという方法です。
以下のような工程になります。

```mermaid
graph TD;
    Command+S-->Goal!;
```
これは方法1の検証と比べて、到達までのアクション数が圧倒的に減りましたね！
気分がいいです！
しかし`Command + S`後のウィンドウ表示が少し遅くないですか？
これは少し気になるので懸念点ですね...

:::note
**結果:
到達までのコスト: 1アクション✨
終了までのコスト: 1アクション✨
懸念点: ウィンドウ表示若干遅くない？🤷‍♂️**
:::

## 方法3(ブックマーク)
3つ目は`ブックマーク`を使用する方法です。
こちらも同様に、本来の用途と違った使用法になります。
私の場合は、ブラウザにChromeを使用してますが、上部の`ブックマーク追加ボタン`をポチッと押すと”**ブックマークを追加しました**”と表示されますね。
その名前のところを見ると、なんと`titleタグのエレメント`が表示されてるではないですか！
これを`Command + C`し、削除して完了です。
```mermaid
graph TD;
    ブックマーク追加ボタンをクリック-->Goal!;
```

この方法は非常に早いです！
ただ、クリックで操作しないといけないのは懸念点でしょうか？
`Ctrl + Shift + D`がブックマークのショートカットらしいですが、クリックで行う操作で出てくるウィンドウの表示結果と異なるものが表示される為、`Ctrl + Shift + D`は適用できないようです。

また、追加された後に、しっかりブックマークの削除をしておかないで画面遷移をしてしまうと、ブックマーク登録されてしまいます。そうすると、回収コストが上がってしまいますね。

:::note
**結果:
到達までのコスト: 1アクション✨
終了までのコスト: 1アクション✨
懸念点: クリックしないといけない & 削除してから画面遷移しないとブックマークされてしまう🤷‍♂️**
:::

## まとめ
私の結論は、**Command + Sの方法**を使用するか、**ブックマークの方法**を使用するのが最強なのではと思いました。
先述させて頂いた方法以外にも良い方法が何かあるかもしれません。
探求に終わりはありません。

## コメントで頂いた取得方法の追記
- 開発者ツールのConsoleでdocument.titleで表示させ取得。
【React】Chakra UIのモーダルが一度しか開かない

# はじめに
アイコンをクリックするとモーダルが表示されるように実装したのですが、モーダルを閉じた後にアイコンを何度クリックしてもモーダルが開きませんでした。

公式からコードをコピペしても同じ現象が起きました。

https://chakra-ui.com/docs/components/modal/usage

# 原因と解決方法
ブラウザの開発者ツールでアイコンのスタイルを確認してみると「chakra-modal__content-container」が画面全体を覆っていました…

調べてみると、どうやらframer-motionのバージョンが古いの原因のようなので、最新版にアップデートすることで解決できました。
今回はv4からv10になりました。

https://www.reddit.com/r/reactjs/comments/u4akp8/problem_with_chakra_ui_modal_component/


# おわりに
見えない何かと戦っていました。ちなみにframer-motionはv6でもモーダルの動作を確認できています。
未経験エンジニアが転職活動のためにローカルで書いていたソースコードをGitHubにアップした話

未経験からエンジニアに転職するなら、名刺がわりに勉強内容をGitHubにアップしてた方が相手に伝わりやすいだろうと思って、いざアップしようと思ったら、

『あれ、どうするんだっけ。。。』

ってなったので備忘録として記事を残します。初学者の書いた記事なので誤った部分があったらすみません&ご教授お願いします。


<h1>作業全体の流れ</h1>
1　作成したアプリのあるディレクトリでgit init

2　ローカルリポジトリにプッシュ
3　GitHubでリモートリポジトリを作成
4　リモートリポジトリとローカルリポジトリに紐付け
5　リモートリポジトリにプッシュ　　

グーグルドライブみたいにボタンひとつでアップロードできる機能があるのかと思ってました。

<h1>各作業の詳細</h1>
<h3>1　作成したアプリのあるディレクトリでgit init</h3>

![qiite1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480176/a1bd7748-fd8f-7ed1-a259-86f371c39e6d.png)
ターミナルはこのようになります。
今回アップしたいアプリはJS_ToDo_Appなのでそのディレクトリまで移動します。gitが入ってない人は入れてください。
```
git init
```
git initコマンドによって、そのディレクトリに新しいローカルリポジトリ（自分のPC内のコード置き場）が作成されると、.gitという隠しファイルができるので、ls -aでみると確認できます。




<h3>2　ローカルリポジトリにプッシュ</h3>
上の作業だけでは、ローカルリポジトリ（自分のPC内のコード置き場）を作っただけで、まだ何も入っていないので、その中に作成したアプリを入れます。（正確には”入れる”という表現は正しくないですが、、）
　　


先程と同じディレクトリで

```
git add .
```

このコマンドによって、ローカルリポジトリにアプリをぶち込むための下準備（ステージング）がされます。

```
git commit -m 'first commit'
```

ステージングされた自分のアプリをローカルリポジトリ（自分のPC内のコード置き場）に入れるコマンドです。シングルクォーテーションに囲まれた部分はコメントなので好きなコメントで良いです。（後ほどGitHub上に表示されますのでふざけられません。）いつもの癖で-m（コメント付き）にしたけどしなくても良いのかもしれません。




<h3>3　GitHubでリモートリポジトリを作成</h3>
先程までの作業はローカルリポジトリ（自分のPC内のコード置き場）にアプリを入れるための作業でした。ここからはリモートリポジトリ（インターネット上のコード置き場）を作ってそこに先程のローカルリポジトリの内容をアップする作業に入ります。　　　　
　　

まずはGitHubでリモートリポジトリを作成しましょう。
![qiite2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480176/91cc2fbd-f72c-af17-81cd-52ac7d3d809b.png)
ここの緑のNewからリモートリポジトリを作成できます。
　　　　
　　

![qiite3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480176/1d1ff438-e1d4-832e-2813-3cf6a9575a71.png)
説明を入れたら作成完了です。人に見せるものならPublicで作りましょう。　　
READMEファイルを作成したら、クイックセットアップ画面が表示されなくなるので注意です。
　　

<h3>4　リモートリポジトリとローカルリポジトリに紐付け</h3>
現在、インターネット上と自分のPC内に２つのリポジトリ（コード置き場）ができたので、それらを紐付けします。

  　　
　　

HTTPS通信はGitHubのセキュリティ上、パーソナルアクセストークンを生成して認証しないといけないので、私はSSH通信で紐付けしました。この赤い部分のコードをコピーして先程と同じディレクトリでコマンドを実行してください。
（ここの工程については少し下に追記したものがあるので、どちらかの方法を選んで実施してください）
![qiite4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480176/fc9b9ee8-585c-a465-3d07-c55ef18b7e84.png)



```
git remote add origin git@github.com:hosomatu/js_hogehogehoge.git
```

ターミナルではこんな感じで、すん...と紐付けが完了します。
![qiite5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480176/974c2320-dfed-b040-3d30-ace2488a8b73.png)


## 後日追記
![スクリーンショット 2023-06-21 21.53.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480176/b4933e49-79e0-7c3c-6d26-9678a7885630.png)

右上のコピペマークを押して貼り付けるだけでOKでした。
次の５番の工程も同時に実施できて、これにて終了になります。

```
git remote add origin git@github.com:hosomatu/js_hogehogehoge.git
git branch -M main
git push -u origin main
```

  
  
<h3>5　リモートリポジトリにプッシュ</h3>
ここまでの作業で、自分のPC内とインターネット上に２つのリポジトリ（コード置き場）が作成されて、それらが紐付けされたので、あとはそれを反映させるだけです。

```
git push -u origin main
```

ターミナル上ではこんな感じです。
![qiite6.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480176/cfea4eb0-4c95-90b2-43d2-ba4cabb24bbd.png)

できた
![qiite7.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3480176/c5fd9647-36e1-8cc7-8ff2-99e47acd20ea.png)



ということでお疲れ様でした。
他にも良い方法があれば、コメントなどで教えてください。
駆け出しどころか、まだエンジニアではないので色々間違っていたらすみません。
ああああ

以下に一般的な例を示します:

sql
Copy code
ALTER SESSION SET EVENTS '10046 TRACE NAME CONTEXT FOREVER, LEVEL 12';
上記の例では、"10046 TRACE"と呼ばれるトレースイベントをセッションに対して有効にします。このイベントは、詳細なパフォーマンストレース情報を収集するために使用されます。"NAME CONTEXT FOREVER"は、トレースイベントの識別子として使用され、"LEVEL 12"はトレースの詳細度を設定するためのパラメータです。

このように、"ALTER SESSION SET EVENT"ステートメントは特定のトラブルシューティングシナリオでデータベースの振る舞いを変更するために使用されます。ただし、これは専門的な操作であり、慎重に使用する必要があります。正確なイベントの使用方法や影響については、Oracleの公式ドキュメントや専門家の指導を参照してください。


一時的なJavaポリシーを宣言し、カーソルを使用してSELECT文を実行することです。

リソース管理に関連する設定を変更するためのセクション
リソースのタイムアウトや使用制限を変更する

分散データベースリンクに関連する信頼関係を設定

セッション間の共有コンテキストを作成するためのセクション
コンテキストは、セッション間で共有されるユーザー定義の情報を保持するための仕組み
セッションごとに値を保持し、アプリケーションやトリガなどでその値を参照することができます。

スキーマのインスタンス化（作成）を行うためのセクション

リプリケーションカタログの移行（インポート）の前処理を行うためのセクション
リプリケーションカタログは、データベース間でのデータの同期やリプリケーションを管理するためのメタデータ情報を保持するデータベースオブジェクト
Qiitaで発信を続けてよかったこと！

# はじめに
Qiitaで発信を始めて3年が経過しました。
別に毎日/毎週投稿とかはあまり気にせずゆる〜く発信を続けてます。

そんなゆる〜い活動から得られたことがいくつかあるので整理してみました。

この記事は次の3人の役に立てばいいかなと思ってます。

**1.技術の発信をしたことがない人**
**2.発信が続かなくてやめてしまった人**
**3.発信した方が良さそうな気はしているけどなかなか行動できない人**


# 1.仕事に繋がった
これが一番大きな収穫です。

現在正社員で勤めている会社と副業で勤めている会社で仕事をするきっかけは全てQiitaで発信した記事です。
「記事を書いたらTwitterにも投稿」を繰り返しているだけで、たまたま誰かの目に止まり興味を持っていただいてDMが届くことがちらほらあります。

もちろん運もあるかもしれないですが、そもそも発信していなければこういう結果にはなりません。
発信をしていたからエンジニアになれたし、たくさんの人との出会いがありました。

どこで誰が見ているかはわからないですが、あなたの記事に助けられる人は必ずいるし、興味を持ってくれる人は必ずいると思います。


# 2.技術の定着
発信する記事に私が書く内容としてよくあるのが

- 開発で使った技術の発信
- 不具合を改善したときの発信
- 新しい技術の発信
- サンプルアプリを用いて勉強したアーキテクチャの発信

などありますが、いずれも発信する前に一度整理してから発信しています。
この「一度整理してから発信」がとても大切だと思っています。

というのも「発信する = アクティブ・ラーニング」なんですよね。

- 自ら体験する
- 他の人に教える

この2点を通過すると学習の定着率が最も高くなると言われています。

自ら体験したことを整理して発信する行動はアクティブ・ラーニングで大切と言われている点をしっかり押さえています。

もちろん開発でやったことのだいたいはしばらくすると忘れますが、一度発信した内容はすぐに思い出せる傾向があり、それは先に挙げた2点を通過しているからだと思っています。

また、学びを記事にしておけば一覧でいつでも見返せるインデックスとして利用することもできます。


# 3.継続力
継続っていうとなんだかハードルが高くなりますが、「継続 = やめない」ぐらいの感覚でいいと思います。

書きたくないときは書かなくていいんです。ただやめなければいいと私は思うようにしています。

よく毎日/毎週投稿とかを目にしますがはじめから頑張らなくていいと思います。
自分のペースで記事にできそうな学びがあれば発信するぐらいの感覚でいいです。

あと、「似たような記事がすでにある」とか「記事にするには内容がしょぼい」とかも考えなくていいと思います。

例を挙げると、2020年に書かれた似たような記事があったとして、あなたが書いた似たような2023年の記事は「3年経っているけど今もこの記事のコードで動作する」という価値がそこにはあります。

また、内容がしょぼいと思った記事でもエンジニアになりたいと思って勉強を始めたての人には刺さるだろうし、シンプルに完結されている記事は素晴らしいと思っています。

私はこういった感じで発信のハードルを下げ、自分ペースで継続していたらいつの間にか3年が経過していました。結果的に継続力が身についた感じです。


# おわりに
すぐ始められておすすめのプラットフォームは
- Qiita
- note
- Zenn

この辺りかと思います。
この記事を見て発信を始めた人がいたらめっちゃ嬉しいです！

最後までご覧いただきありがとうございました〜
djangoのLoginRequiredMixinを継承したViewに未ログインでアクセスしたときにリダイレクトされるログインURLに「next」パラメータを付与させないようにする

# 結論
`LoginRequiredMixin`を継承したカスタムクラスを作成し、`handle_no_permission`関数をオーバーライドしてリダイレクト部分を実装することで`next`パラメータを付与させないようにできます。

# 前提
- 使用モジュールの各バージョンは以下です
  - Django              3.2.19

# 現象確認
djangoで`LoginRequiredMixin`を継承したViewは、未ログインでアクセスするとログインURLにリダイレクトされます。この時、ログイン後にリダイレクト前のViewに帰ってこれるようにURLに「next」のクエリパラメータが付与されています。
```project/config.py
…
# 未ログインでLoginRequiredMixin継承したViewにアクセスしたときにリダイレクトされるURL
LOGIN_URL = '/loginform'
…
```

```myapp/views.py
from django.shortcuts import render
from django.contrib.auth.mixins import LoginRequiredMixin
from django.views.generic import TemplateView

# このviewのルーティングは「/myapp/Index」
class IndexView(LoginRequiredMixin, TemplateView):
    template_name = "myapp/index.html"
```

![nextパラメータ01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3071987/6ae38788-273a-5b14-74ad-ad29e798e67a.png)

# 原因
`LoginRequiredMixin`の仕様によるものです。

# 原因を踏まえての解決策
`LoginRequiredMixin`の仕様そのものを変えてしまうのは難しいと思います。そこで`LoginRequiredMixin`を継承したMixinクラスを用意してカスタマイズをしていきます。
より具体的にはMixinカスタマイズクラスで`handle_no_permission`関数をオーバーライドして「next」パラメータを付与させないようにします。

# 手順
アプリフォルダの中に新規でpyファイル用意して以下のカスタムMixinクラスを作成します。

```myapp/mixins.py
from django.contrib.auth.mixins import LoginRequiredMixin
from django.shortcuts import redirect

class CustomLoginRequiredMixin(LoginRequiredMixin):
    def handle_no_permission(self):
        if self.raise_exception or self.request.user.is_authenticated:
            return super().handle_no_permission()
        else:
            return redirect(self.get_login_url())
```
次に、「next」パラメータを付与させないViewに作成したMixinクラスを継承します。

```myapp/views.py
from django.shortcuts import render
#from django.contrib.auth.mixins import LoginRequiredMixin カスタムクラスを使用するため不要
from django.views.generic import TemplateView

from .mixins import CustomLoginRequiredMixin #追加

# このviewのルーティングは「/myapp/Index」
class IndexView(CustomLoginRequiredMixin, TemplateView):
    template_name = "myapp/index.html"
```
これで「next」パラメータは付与されなくなります。

![nextパラメータ02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3071987/75f45c2f-e375-436b-0da0-6f658e73f4f0.png)

以上です。

# 参考

https://qiita.com/kkk777/items/6f467a14b0f9616a0a79

https://github.com/django/django/blob/main/django/contrib/auth/mixins.py
条件分岐の練習

ターミナルから数字を入力して
・１０００以下なら　１０００以下の数字だよ
・１０００より大きい数字なら　１０００より大きい数字だよ
・１０００以下で　かつ　０以下なら　０以下の数字だよ♪

と出力されるプログラムを
input=gets.to_iを使って作ってみよう♪

```ruby
input=gets.to_i
if input <=0
  puts"0以下の数字だよ
elsif input <=1000
  puts"1000以下の数字だよ
else
  puts"1000より大きい数字だよ♪"
end
```

if文は先に書いた条件から判断していく。
それ以下の条件に当てはまっていてもスルーしてしまう。
なので順番はこれで書く。
markdownlint-cli2を利用してローカル環境でMarkdownの文法チェックを行う

## はじめに

この記事では、ローカル環境でMarkdownを書く際に便利なmarkdownlintについて解説します。

## markdownlintとは

markdownlintは、Markdownの文法チェックを行うツールです。
Markdownの文法チェックを行うことで、Markdownの文法に沿った文章を書くことができます。

markdownlintは、現在VSCodeの拡張機能やGitHub Actions、ESlintの拡張やRubyのGemなど、幅広く利用できるように提供されています。

今回は、markdownlintのCLIツールである[markdownlint-cli2](https://github.com/DavidAnson/markdownlint-cli2)を利用して、ローカル環境でのMarkdownの文法チェックを行う方法を紹介します。

## markdownlint-cli2について

markdownlint-cli2は、[markdownlint-cli](markdownlint-cli)の後継にあたるCLIツールです。
markdownlint-cli2は、markdownlint-cliの機能を網羅しつつ、シンプルかつ早いことを特徴としています。

## markdownlint-cli2のインストール

markdownlint-cli2は、npmでインストールできます。

```bash
npm install -g markdownlint-cli2
```

## markdownlint-cli2を実行する

```bash
markdownlint-cli2 <Markdownファイルのパス>
```

複数ファイルや、`*`などを使った表現も可能です。

`--fix` オプションを付けることで、自動で修正することもできます。

```bash
markdownlint-cli2 --fix <Markdownファイルのパス>
```

試しに、以下のMarkdownファイルを作成して、markdownlint-cli2を実行してみました。

```markdown:article.md
## hello, world!
This is a test article.
https://example.com
```

```console
$ markdownlint-cli2 article.md
markdownlint-cli2 v0.8.1 (markdownlint v0.29.0)
Finding: article.md
Linting: 1 file(s)
Summary: 2 error(s)
article.md:1 MD022/blanks-around-headings/blanks-around-headers Headings should be surrounded by blank lines [Expected: 1; Actual: 0; Below] [Context: "## hello, world!"]
article.md:1 MD041/first-line-heading/first-line-h1 First line in a file should be a top-level heading [Context: "## hello, world!"]
```

なんかエラーが出ていますね。
見出しの前後には空行を入れる必要があるようです。
また、ファイルの先頭の見出しは`#`である必要がありそうです。

```markdown:article.md
# hello, world!

This is a test article.
https://example.com
```

```console
$ npx markdownlint-cli2 article.md
markdownlint-cli2 v0.8.1 (markdownlint v0.29.0)
Finding: article.md
Linting: 1 file(s)
Summary: 0 error(s)
```

エラーが出なくなりましたね:tada:

エラーメッセージに記載されている`MD022`など、markdownlintのルールに関しては、[こちら](https://github.com/DavidAnson/markdownlint/blob/main/doc/Rules.md)から確認することができます。

## markdownlint-cli2の設定

エラーは表示されるようになりましたが、中にはこれでエラーは出したくないなどがあるかと思います。
configファイルを用意することで、markdownlint-cli2の設定をカスタマイズすることができます。

```jsonc:.markdownlint-cli2.jsonc
{
  "config": {
    "line-length": false, // MD013: 1文の最大文字数
    "no-duplicate-heading": false, // MD024: 見出し文字列の重複を許容
    "no-trailing-punctuation": false, // MD026: 見出しに.,;:が入ることを許容
    "no-inline-html": false, // MD033: HTML記述を許容
    "no-bare-urls": false, // MD034: URLそのままの表記を許容
    "fenced-code-language": false // MD040: コードブロックの言語指定を許容
  },
  "ignores": ["node_modules"] // node_modules配下はチェック対象外
}
```

configファイルを適用したい場合は、`--config`オプションを付けて実行します。

```bash
markdownlint-cli2 --config .markdownlint-cli2.jsonc <Markdownファイルのパス>
```

configはいろいろ設定できるため、[公式のドキュメント](https://github.com/DavidAnson/markdownlint-cli2#markdownlint-cli2jsonc)を参考にするのが良さそうです。

## まとめ

markdownlint-cli2を利用することで、ローカル環境でMarkdownの文法チェックを行うことができるようになります。
綺麗にMarkdownを書くことで、読みやすい、後から修正しやすいMarkdownを書くことができるようになると思うので、気になった方は是非試してみてください！
Windows　SSH接続方法

sshの接続方法
下記参考
https://win2012r2.com/2021/10/16/test-netconnection-fails/

仮想サーバ（192.168.84.130）と外部からのやり取り
仮想サーバと外部PCのポート22は開けておくこと

手順
①外部のPC、PowerShellで
PS C:\Users\ [ユーザ名]> Test-NetConnection 192.168.84.130 -Port 22
警告: TCP connect to (192.168.84.130 : 22) failed                                                                                                                                                                                                                                                                                                                       ComputerName           : 192.168.84.130                                                                                 RemoteAddress          : 192.168.84.130
RemotePort             : 22
InterfaceAlias         : VMware Network Adapter VMnet8
SourceAddress          : 192.168.84.1
PingSucceeded          : True
PingReplyDetails (RTT) : 3 ms
TcpTestSucceeded       : False

②TcpTestSucceeded       : Falseになっているので
OpenSSHサーバを仮想サーバ側にインストール
設定＞アプリ＞オプション機能＞機能の追加から行う

③その後、OpenSSHServerのサービスの開始
コントロールパネル＞システムとセキュリティ＞管理ツール＞サービス＞OpenSSHServer
サービスの開始クリック

④仮想サーバ側で
C:\Users\[ユーザ名]>netstat -an | find "LISTEN"
でSSHのポート22を探す

⑤外部PCから下記コマンドを再度cmdに入力
PS C:\Users\ [ユーザ名]> Test-NetConnection 192.168.84.130 -Port 22


ComputerName     : 192.168.84.130
RemoteAddress    : 192.168.84.130
RemotePort       : 22
InterfaceAlias   : VMware Network Adapter VMnet8
SourceAddress    : 192.168.84.1
TcpTestSucceeded : True

これでSSHの接続設定は完了
EC2へのSSHでパブリックIP、IGWが不要になりました



#  ■概要

セッションマネージャー？と思ったんですが、少し使い勝手が違うみたいです。

Amazon EC2 Instance Connect (EIC) Endpointが使用可能となり、IGWやパブリックIPなしでSSH接続、RDPができます。

Amazon EC2 Instance Connect supports SSH and RDP connectivity without public IP address

https://aws.amazon.com/about-aws/whats-new/2023/06/amazon-ec2-instance-connect-ssh-rdp-public-ip-address/

#  ■前準備

適当なインスタンスを立ち上げておきます。
ここではパブリックIPを無効化しておきましょう。

![パブリック無効化2023615093846.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/954355/c15d9e73-d103-7450-3360-ba9ec1ee5a00.png)

もう一つ、エンドポイント用のセキュリティグループを作成します。
セキュリティーグループはインバウンドなし、アウトバウンドを22ポートのみ（インスタンス側SGを許可）で新規作成しました。

インスタンス側に紐づいているセキュリティーグループは上記の新規セキュリティグループからのインバウンド許可します。

#  ■手順

エンドポイントを作成しましょう。
VPCへ移動し、エンドポイントを選択します。

![VPC画面20230615094351.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/954355/fd8e8719-b6cd-4e48-f970-aef18f4158ec.png)


エンドポイント作成欄にEC2 Instance Connectがありますね。
こちらを選択します。

![エンドポイント作成20230615102822.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/954355/0ec64064-4661-0758-204e-51495e6434c4.png)

その他VPCやセキュリティーグループ、サブネットも設定しましょう。
セキュリティーグループは前もって作成しておいたものです。

![エンドポイントその他20230615102950.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/954355/3830d54a-727d-3677-57f7-2a077c285ed4.png)

CLIで作成する事も可能です。


```
aws ec2 create-instance-connect-endpoint \ 
    --subnet-id [SUBNET] \ 
    --security-group-id [SG-ID]
```

### ■作成したエンドポイントを使用して接続してみましょう。
EC2インスタンスを選択し、接続を押下。

![接続1_20230616115455.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/954355/ce5f542c-3759-6e0b-558d-46597d7147e7.png)

「EC2 Instance Connect エンドポイントを使用して接続する」を選択。
新規作成したエンドポイントを選択して接続してみましょう。

![接続2_20230616115539.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/954355/0fc8518e-a666-3349-2ab9-8c92c8ec4c26.png)

接続できました！

![接続完了後20230616113211.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/954355/e1d67b76-0d4e-7db3-1c2b-fe3ef08786c4.png)

コンソール以外でももちろん接続可能です。
CLIを使用して接続する必要があります。
コマンドは以下です。

```
ssh ec2-user@[INSTANCE] \
    -i [SSH-KEY] \
    -o ProxyCommand='aws ec2-instance-connect open-tunnel \
    --instance-id %h'
```

#  ■最後に

IPやIGWを使用する必要がなくローカルから接続する事も可能なので運用の可能性が広がりますね。
そっちも試してみたいと思います。

ただこの検証だけだとセッションマネージャーとどう違うんだろう…？と思ったんですが、見事にまとまっている記事がありました…。
気になる方はこちらも是非！

EC2 Instance Connect Endpoint と Session Managerの違いをまとめてみた
https://dev.classmethod.jp/articles/compare-eic-endpoint-and-session-manager/