OmniAICreator/Qiita-1.07M huggingface dataset:
CircleCIとは

#CIとは
CIとはContinue Integrationのことで継続的インテグレーション(統合,統一)のことです。
テストやコード解析を自動化し、それを継続的にやってくれるものです。
これで開発した製品に異常がないかを継続的に自動でテストしてくれるため効率的に
商品をリリースできたりします。

#CDとは
CDの略はContinuous Deliveryのことで各環境へのデプロイなどを自動的に行います。

#CircleCIにできていること

⚫︎テストの自動化
*rubocopなど

⚫︎buildの自動化
*コンパイルなど

⚫︎デプロイの自動化
*サービスをリリースする時にやる

#CircleCIの特徴

⚫︎SaaS型
⚫︎リソース機能が充実
⚫︎GitHubアカウントとCircleCIを紐付けることができる
⚫︎クラウド型で運用や環境構築に必要なコストはCircleCIの方がJenkinsより低い。
⚫︎Webサービスとの連携が前提
⚫︎VCS連携(バージョン管理システム)

⚫︎Jenkinsとは
CIやCDを使うためのツールです。汎用性がかなり高いツールでオープンソースで無料です。
最近は利用することが減ったみたいですが大きなプロジェクトでは使われるみたいです。



詳しい内容は下の資料をみてください。

https://qiita.com/gold-kou/items/4c7e62434af455e977c2





⚫︎参考資料
https://agency-star.co.jp/column/circleci
「このサイトにアクセスできません」と表示された時の対応

# 初めに

ポートフォリオ公開後、ページを閲覧したら「このサイトにアクセスできません」と表示された。
単純にnginx,pumaが落ちたのか思い、確認したら起動はしていました....

![スクリーンショット 2021-09-09 22.29.47.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1572216/8fcb0346-7731-1d65-cad2-e215cceecdc6.png)

今回、私が行った対応方法で同じ境遇の方の役に立てればと思い、共有できればと思います。

# そもそも「このサイトにアクセスできません」とは？
このエラー表示はブラウザを使用している際に、アクセスしようとしたページが見つからなかった場合や、接続できなかった場合に表示されます。想定される原因として、インターネット接続状況、PC・ブラウザの設定、サイト管理者の問題などが考えられます。問題を大きく切り分けると「サイトの閲覧者側の問題」か「サイトの運営者側の問題」のどちらかになるということで、サイトの閲覧者側の問題を絞って解決に至りました。

# サイト運営者側の問題

サイト閲覧者側の問題で考えられるのは以下の３つです。

* ネームサーバー設定
* サイトのドメイン失効
* サーバーメンテナンス

##ネームサーバー設定
ドメインの管理サイト（お名前.comなど）にログインし、ドメインのネームサーバーが正しく設定されているか確認してみましょう。
__今回はお名前.comで認証を行うべきところを処理をしないままでドメインが利用できなくなりました。__

###DNSの設定の問題
ドメイン名は、よく「インターネット上の住所」にたとえられます。

DNS(Domain Name System)とは、インターネット上でドメイン名を管理・運用するために開発されたシステムで、人間に判りやすくつけられた「ドメイン名」と、コンピューターが機器を識別するための「IPアドレス」を結びつけるものです。

このDNSで問題が起きている場合、ウェブページにアクセスできなくなります。

###DNSサーバーの問題
「ERR_NAME_NOT_RESOLVED」というメッセージが出る場合は、DNSサーバーにアクセスできないことが原因でウェブページを表示できない状態です。

この場合、次の3点を確認してみましょう。

URLのドメイン名が間違っていないか
そのドメインが廃止されていないか
DNSサーバーの設定が間違っていないか


# サイトのドメイン失効
そのページのドメイン自体が失効している場合は、表示ができません。
ドメインの有効期限は定期的に確認するか、期限が近づいたらメールが送られる設定がオススメです

# サーバーメンテナンス
サーバーメンテナンスやサーバ側の問題により、ページへのアクセスができない状態です。

# 対応方法
ググって辿りついたのは、アドレスの認証手続きをしていないかもということでした。
お名前ドットコムでドメインを取得しており、登録メールが誤っており、
本来ドメインの購入後に、「【重要】[お名前.com] ドメイン 情報認証のお願い」というメールが登録メールアドレス宛に届き、認証を行わなければなりません。こちらの処理をしないままですとドメインが利用できなくなります。これが原因でした:sweat:

お名前.comのドメイン詳細ページを確認したら利用制限中途発見！これが原因ですね。

今回、制限理由をスクショを失念していたため画像を拝借させて頂きました。

![スクリーンショット 2021-09-09 23.17.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1572216/5139686c-b01e-43f3-1ebd-993a2acddd90.png)

利用制限のステータスが異なるみたいです。
今回、Icann ManualHoldと表示されていました。

![スクリーンショット 2021-09-09 23.20.55.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1572216/e9eac8b2-0657-9daf-6e74-4223d254d256.png)


[各ステータスの制限理由](https://help.onamae.com/answer/15333)

今回、メールの設定が誤っていたので第一にメールの再設定をする必要があるので、
①TOPページを開き
②Whois情報を設定
③ドメイン選択
④変更情報の選択　全て選択します。


![スクリーンショット 2021-09-09 23.38.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1572216/f06c6c0c-8f28-e85e-0e1a-0c23234c912f.png)

![スクリーンショット 2021-09-09 23.38.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1572216/4eaf66e1-5beb-d0cf-9a06-427adc860d85.png)

![スクリーンショット 2021-09-09 23.38.57.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1572216/d0852e8b-06f8-a650-140c-bbec82cc4d84.png)

登録後、認証メールが２通受信するのでそちらを承認すると無事公開されます:heart_eyes:

![スクリーンショット 2021-09-09 23.45.05.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1572216/d0ad949a-d9cf-91d5-2338-9cd766afac20.png)

__なお正常に認証できた場合でも、使用できるまでに30分～72時間程度かかる可能性があります。__


今回、私はメール登録に誤りがあったので認証メールを確認できなかったのですが、
そもそもアドレスの認証を行ったか曖昧な人は下記の記事を参考にしてみてください。

https://www.tayorako-hiraya.com/entry/816-address-dns
unityで２台のカメラを切り替え

　Unityで複数のカメラを設置して、切り替えながら使いたい時のサンプル。例えば、一人称視点と三人称視点を切り替えたい時に使える。１台のカメラでも出来なくはないが、一時的な座標の保存などが発生するので、使いにくいだろう。手動なら、インスペクタで一番上のチェックを操作すれば良いが、実行中は、プログラムが必要。
　以下は、スペースキーでカメラを切り替えるサンプル。プログラムをアタッチした後に、mainCameraとsubCameraに割り当てが必要。

```c#:cameraChange.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class cameraChange : MonoBehaviour{
    public Camera mainCamera;
    public Camera subCamera;
    
    void Start(){
        mainCamera.enabled = true;
        subCamera.enabled = false;
    }

    void Update(){
        if (Input.GetKeyDown(KeyCode.Space)) {
            mainCamera.enabled = !mainCamera.enabled;
            subCamera.enabled = !subCamera.enabled;
        }
    }
}
```

![スクリーンショット 2021-09-11 9.10.32.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/ab5e1d53-0a9a-83f2-ef0b-db612087d5a8.png)
「JavaはOSに依存しない」ちゃんと説明できるか俺？

# はじめに

Javaに関することは一通り他人にちゃんと説明できる「つよつよJavaエンジニア」になるための第一歩の記事（そんなこと知らんがなって話ですよねすみません）

当たり前のことなんだけど、改めてOUTPUTして整理しやす

# まず結論

OSに依存しない理由は「**実行環境(JVM)にてバイトコードをOSに合わせた機械語に変換する**」から

# 細かくみていこう

プログラミング言語は２種類に分かれる。

「コンパイラ方式」と「インタプリタ方式」
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/653955/ebac1a2e-2ebd-9ff7-127a-26c0a3615439.png)

インタプリタ方式は、ソースコードを機械語に変換しつつ実行する。
コンパイラ方式は、ソースコードを事前に機械語に変換してから、一気に実行する。

違いは「事前に機械語に変換するかどうか」だ。

この２つ。事前に機械語に変換するかどうかで↓のような差が生まれる。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/653955/049ca3b6-492c-5f83-43bf-a531ed32e323.png)

インタプリタ方式のBadなところが、コンパイラ方式では実現できている。
コンパイラ方式のBadなところが、インタプリタ方式では実現できている。

・
・
・

これは、インタプリタ方式とコンパイラ方式を融合すれば良いとこ取りできるのでは....!!

・
・
・
Java「で、俺が生まれたってわけ」
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/653955/07891015-8baa-e241-d3da-0b438c5c7512.png)

## インタプリタ方式とコンパイラ方式を融合させたJavaとは？

こんな感じ。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/653955/9873cfa1-ebfd-0cf4-611c-f5cf9310433d.png)

↑の通り、コンパイラ方式の良いところとインタプリタ方式の良いところだけを吸収できた。

##### ややこしポイント１：Javaは2回コンパイルしている

機械語に変換するときも「コンパイル」と言うし、バイトコードに変換するときも「コンパイル」と言う。
Javaの開発現場で「コンパイル」といえば9割9分「javaファイルからclassファイルへの変換」のことを指して会話するが、当然Javaも機械語に変換されて実行されるので「Javaは２回コンパイルされている」と言えるのだ。

##### ややこしポイント2：JVM内には「インタプリタ」と「コンパイラ」の２つがあって、両方使われる。

①javaファイル → ②classファイル → ③機械語

JVM内では、②から③にかけて「インタプリタ方式」「コンパイラ方式」の両方で機械語への変換ができる。
「まとめて機械語にコンパイルしてから実行した方がこの処理は効率良いよね」みたいなものはコンパイラ方式を採用し、そうでない場合はインタプリタ方式で実行すると言う具合だ。

※自分用MEMO
> インタプリタの何が良いかって、"実行時"にOSに合わせて機械語に変換するからOSに依存しないこと。なので「OSに依存したくないならインタプリタ1択か！」と思っていたが、Javaでは"実行時"に(JVMランタイム環境で)インタプリタとコンパイラの両方を使えるので、理解の仕方としては【JavaはJVMで実行される時に機械語に変換するから、OSに依存しない】としとこう。

# ポイント整理

✔︎ 実行前にコンパイル(classファイルへの変換)をすることで、エラー検知して修正できる。

✔︎ 通常のコンパイル(機械語への変換)では、コンパイル時点で実行環境となるOSが確定してしまう(OSに依存してしまう)が、Javaではコンパイルの成果物をOSに依存しないもの(機械語ではなくclassファイル)にしているので「**実行前に事前にコンパイルしているのにOSに依存していない！**」となる。

✔︎ Javaでは実行環境で「バイトコード→機械語」のコンパイルを行うことができる。JITコンパイラ！
【tailwind】詰まった時に視覚で伝えるレイアウト楽々整えコピペシリーズ ~レスポンシブ編~

## 【詰まった時に使える】tailwind+Next.js+typescript ~tailwind編~
課題でtailwind+Next.js+typescriptでLPを作ってみるを勉強しながら作っていた時に、自分がリファレンスですぐに取り出せたら楽だなーと思った内容を残しておきます。初心者がつまづきそうなポイント+αで書いてあります。
※React(Next.js)ベースで書いてありますのでclassがclassNameになっています。
課題でいいねが50個必要で...LGTMボタンを押してくれると嬉しいです！！

## 左右に余白をつけてコンテンツが広がらないようにしたい時
![not-expand.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1466470/a66150ad-a7c0-0642-e0b1-f58c6fff4fbe.png)

```html
[実装例]
<div className="container mx-auto">
  //ここに書きたいコンテンツを記述する
  <div className="h-1 text-4xl">ここから始まるよん</div>
</div>
```

## デスクトップは横！モバイルは縦！に並ぶ！[headerあるある]
![responsibe.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1466470/7b1a2512-8101-9cdd-66e0-08cfa8461d4f.png)

```html
[実装例]!配置の重要な部分だけ記述してあります。(細かいレイアウトは消してあります)
<header className="flex flex-col md:flex-row md:justify-between">
         <Image src={logo} alt="logo" width={160} height={80}/>
         <nav>//ここにnavの内容を記述する</nav>
</header>
```
### 上記の解説
![row.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1466470/a3803756-6407-9a6f-fbaa-5bb9acc9afe4.png)


## コンテンツに対しての中央揃えが欲しい..

![center.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1466470/6a9aa3e6-f0bd-2e58-1d20-da9c13d81fb5.png)

```html
[実装例]!配置の重要な部分だけ記述してあります。(細かいレイアウトは消してあります)
<header className="flex flex-col md:flex-row md:justify-between items-center">
         <Image src={logo} alt="logo" width={160} height={80}/>
         <nav>//ここにnavの内容を記述する</nav>
</header>
```
items-center+flexでできるよん


## 全デバイスのレイアウトを一括確認できる最強アプリ「Sizzy」
tailwindではありませんが、これを使うとレイアウトが全デバイスで一気に確認できる最強アプリ。
私はUdemy講師のたにぐちまこと(ともすた)さんの講座で知りました。使い方等はともすたさんの動画から閲覧してもらったらわかるかと思います。
動画内でも出てきていますが、SizzyはSetupというアプリで課金して入れる方が他のアプリも使えてお得です。下記に引用を載せておきます。

![layout.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1466470/44533ea1-a401-606f-593e-254478c919bd.png)

>ウェブ制作と確認が捗る開発者向けブラウザー『Sizzy』(たにぐちまこと講師)
>https://www.youtube.com/watch?v=HhKdTh-FfQ8

>有料で高額なデスクトップアプリが月額980円で使いたい放題になる神アプリ「Setup」
>https://setapp.com
【Rails】フォームのplaceholderを改行する方法

# はじめに
今回はフォームの中のplaceholder（下記の画像のもの）を改行する方法について記述します。
![スクリーンショット 2021-06-26 23.11.23.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1623096/d6a42ce5-d965-0c72-60d7-3e06ca2850b9.png)

# 開発環境
Ruby on Rails バージョン2.6.5

<!-- 各チャプター -->
# 通常（改行を不要とする場合）の記述
通常改行が不要な場合の記述はこのように記述します

```ruby
<%= f.text_area :hoge, class:"hoge", id:"hoge", placeholder:'ここに表示させる文字を入力します' %>
```
ですが、改行をしたplaceholderを作成する場合は、上記の記述に改行を加えても反映されないので、rails helperを使用することで問題が解消されます！

※rails helperをご存知ない方はまずはこちらの記事をご覧ください！
https://qiita.com/yukiyoshimura/items/f0763e187008aca46fb4

# rails helperを使用して改行する

まずrails helperにplaceholder内容を記述します！

```ruby:app/helpers/表示させたいビュー名_Helper
module 表示させたいビュー名Helper
  def メソッド名 
    <<-"EOS".strip_heredoc
　　　　　　　　　　　表示させたい文字
　　　　　　　　　　　表示させたい文字
　　　　　　　　　　　表示させたい文字
    EOS
  end
end
```
（ <<-"EOS".strip_heredoc　〜　EOS　この記述をすることで余分なスペースなどが生まれるのを防ぎます）

rails helperにメソッドを定義できれば後はビューファイルにメソッドを呼び出します。

```ruby
<%= f.text_area :hoge, class:"hoge", id:"hoge", placeholder:rails helperに定義したメソッド名 %>
```

# 完成形
![スクリーンショット 2021-06-26 23.26.28.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1623096/1ef29aa4-f942-d74f-8097-874fc3c29aec.png)

先程の記述で無事に改行ができました！
ちなみに『<<-"EOS".strip_heredoc　〜　EOS』の記述がないとこのように無駄なスペースが生まれてしまいます。
![スクリーンショット 2021-06-26 23.27.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1623096/55e54239-d070-6fb9-2607-1973f04771a1.png)

参考になれば幸いです🙇‍♂️
Mixed Reality Capture (MRC) で撮影した動画で灰色のオーバーレイが適用される問題の解決方法

# はじめに
Mixed Reality Toolkit for Unity (以下、MRTK) を用いて開発、デプロイした HoloLens 2 アプリケーションを Mixed Reality Capture ( MRC ) を使って撮影したところ、下図ように全体にグレーのオーバーレイがかかってしまう現象について、原因を調査しました。本記事では、この問題の解決方法について、ご紹介したいと思います。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/1c53f509-89f0-622a-434a-d2b1691f1059.png" width="800">


# 開発環境
- Unity 2020.3.8f1
- MRTK v2.7.2

# なぜ MRC に灰色のオーバーレイが適用されるのか？
原因は、MixedRealityPlayspace > Main Camera の Camera Component > Background 設定の α値 が 1 (非透過) に設定されているからです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/33abba67-abaf-6a5a-7600-94378eaae23c.png)

# 解決方法

実は、この Camera > Background の値は、[ Mixed Reality ] > [ Project ] > [ Apply recommended scene settings for HoloLens 2 ] ボタンを押下して、HoloLens 2 用のシーン設定を適用すると、α値 が 0 になります。なので、この処理を実行し忘れていただけだったのか... と思っていたのですが、この状態でビルドを実行すると、元の α値 : 1 (非透過) に戻ってしまうことが検証をしているうちに判明しました。( HoloLens 2 実行時も灰色のオーバーレイが適用されたままの状態でした.. orz )

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/b318d084-82e0-9d37-3b60-fffb8e502dd2.png)

理由は簡単で、この Camera コンポーネントの設定が Mixed Reality Toolkit の Profile ( Camera ) で設定されている値に上書きされるからです。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/b3fec7d3-272b-8791-1726-1294645ad4c6.png)

Mixed Reality Toolkit > Camera > Display Settings を見てみると、__Opaque__ (非透過) と __Transparent__ (透過) の2種類のディスプレイ用の設定を保持する構造になっていることが分かります。実行時にこれらの値を利用して、カメラ設定を切り替える仕組みになっています。

例えば、Virtual Reality のようなデバイスの場合は Opaque (非透過)、HoloLens の場合は Transparent (非透過) の設定が使用されるようになっています。

ここで Display Settings > Transparent > Background Color を確認してみたところ、α値 : 0 (透過) の設定になっていました。この状態で、実機にデプロイしても問題は解消されず、Opaque (非透過) の方の設定が当たっているのではないかと、見てみたところ、Background Color の α値 が 1 (非透過) になっていました。当たり前と言えば、当たり前なのですが、試しに Opaque の Background Color (背景色) の α値 (透過度) を 0 (透過) に設定したところ、問題の事象を解消することができました。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/6e0d4f8f-e934-d511-7d4c-96d4bcddbf49.png" width="600">

公式ドキュメントの記載と実際の挙動が異なるので、MRTK の GitHub に新規 Issue として登録してみました。拙い英語なので、伝わるか不安もありますが、、ダメならスルーされて Close されるだけだと思うので、公式の回答を待ちたいと思います。



> <img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/180432/f60cb706-539b-d034-c72a-1f3952d299f1.png" width="400">

> - [Videos was shot using Mixed Reality Capture (MRC) have a gray overlay. #10207](https://github.com/microsoft/MixedRealityToolkit-Unity/issues/10207)


# 参考文献
- [Camera system overview](https://docs.microsoft.com/en-us/windows/mixed-reality/mrtk-unity/features/camera-system/camera-system-overview?view=mrtkunity-2021-05)
- [Create mixed reality photos and videos](https://docs.microsoft.com/en-us/hololens/holographic-photos-and-videos)
【Ruby】正規表現これだけ理解しておこう！


正規表現を苦手としている方は少なくないと思います。
ただ、正規表現に関しては基礎的な部分だけおさえておけば大きな問題はないと思うので、ここで理解を深めてしまいましょう！

**ある程度自信のある人は一番最後の例題を見てパッと理解できるか確認してみてください。**


#正規表現とは

正規表現とは、**文字列のパターンを表したもの**です。

正規表現は`/ /`で囲んで記述します。


#正規表現の基礎項目

正規表現を扱う上で必要な基礎項目を列挙していきます。

##=~

正規表現と文字列がマッチするかをどうかを調べるためのメソッドです。

```ruby
正規表現 =~ 文字列
```

マッチする場合、文字の位置を返し、マッチしない場合、nilを返します。


```ruby
puts /a/ =~ "dance"
#1
```


##^ $ \A \z

```
^は行頭にマッチ
$は行末にマッチ

\Aは文字列の先頭にマッチ
\zは文字列の末尾にマッチ
```

#[ ]

いくつかの文字のうちその１つを指定したい場合は`[ ]`で囲む。

```rb
/[abc]/
#aかbかc

/[a-z]/
#a~z

/[^abc]/
#abc以外の文字
```

※単なる文字として-を表したい場合は[ ]内の最後に記述します。


#.

.（ドット）はどんな文字にもマッチする。

```rb
/aaa.../ =~ "000aaabcdef"

#aaabcdがマッチ
```


#\を使った記法

```
\s 空白文字を表す
\S 非空白文字
\d 0~9までの数字にマッチ
\w 英数字にマッチ

\A 文字列の先頭にマッチ
\z 文字列の末尾にマッチ
```

<br>

また、メタ文字を普通の文字として使うときは`\`をつける。
例えば、`[`に対しては`\[`とする。



#繰り返し

```
* 0回以上の繰り返し
+ 1回以上の繰り返し
? 0回か1回

{n}   n回の繰り返し
{n,m} n~m回の繰り返し
```

「0回以上の繰り返し」の意味が最初はよくわからないかもしれませんが、「直前の文字が１回以上繰り返されているか、なくてもいい」と考えると理解しやすいです。


`{n}`に関しては５回以上なら`{5,}`5回以下なら`{,5}`5~10回なら`{5,10}`とかけます。


##最短マッチ

```
*? 0回以上の繰り返しのうち最短の部分
+? 1回以上の繰り返しのうち最短の部分
```

*や+は、可能な限り長い部分にマッチさせます。
*?や+?とすると最短部分にマッチするようになります。

```ruby
string = "abcdabcdabcd"
/a.*b/ =~ string

#"abcdabcdab"がマッチ
```

```rb
string = "abcdabcdabcd"
/a.*?b/ =~ string

#"ab"がマッチ
```


#i オプション

iをつけると、アルファベットの大文字小文字の違いを無視する。（どちらでもマッチする）

```rb
string = "abcdABCDabcd"
/a.*b/i =~ string

#"abcdABCDab"がマッチ
```


#キャプチャ

正規表現を使ってマッチした部分を色々と操作することができます。
ここをおさえられると実用性がグッと高まります。


##マッチした結果を保持する変数

```
$` マッチした部分より前の文字列
$& マッチした部分の文字列
$' マッチした部分より後ろの文字列
```

```rb
string = "abcdef"
/c./ =~ string

p $`
#"ab"

p $&
#"cd"

p $'
#"ef"
```

<br>

また、正規表現を( )で括った部分を`$1`で取ることができます。

```rb
string = "abcdef"
/(.c)/ =~ string

p $1
#"bc"
```

正規表現内で( )が複数つけた場合は順に\$2、\$3でマッチした部分を取ることができます。 

#gsubメソッド

マッチした文字列を別の文字列に置き換えるメソッド。

```rb
string = "a    b  c    d       e"
p string.gsub(/\s+/, " ")

#"a b c d e"
```

ブロックを渡すこともできる。

```rb
string = "abcabcabc"

string.gsub(/.c/) do |matched|
  p matched
end

#bc
#bc
#bc
```

<br>

ちなみに`subメソッド`は最初にマッチした部分だけを置き換えます。


#scanメソッド

マッチした部分を取り出す。

置換をしないのであればこっちを使えばいい。

```rb
string = "abcabcabc"

string.scan(/.c/) do |matched|
  p matched
end

#bc
#bc
#bc
```

#例題

ここまでで基本はいいと思います。

例題をいくつか見てみましょう。

##例1

問：**emailのドメイン部分を抜き出す。**

```rb
email = "hogefuga@gmail.com"
/\A\S+@(\S+)\z/ =~ email

p $1
#"gmail.com"
```


##例2

問：**「正規表現は難しい！」を「正規表現は楽しい！」に変更する。**

```ruby
string = "正規表現は難しい！"

p string.gsub(/難しい/, "楽しい")
#"正規表現は楽しい！"
```

<br>

ちなみに、複数の変更をすることもできます。
「正規表現は難しい！無理だ！」を「正規表現は楽しい！ヤッホー！」に変更する。

```ruby
string = "正規表現は難しい！ 無理だ！"

p string.gsub(/難しい|無理だ/, "難しい" => "楽しい", "無理だ" => "ヤッホー")
```

##例3

問：**"my-name-is-taro"を"My-Name-Is-Taro"のように変換できるメソッドを作る。**

```rb
def word_capitalize(string)
  string.gsub(/[a-z]+/, &:capitalize)
end

p word_capitalize("my-name-is-taro")
```

<br>

例１〜３は、他にもやり方があると思いますので色々試してみてください。


#まとめ

正規表現の基本について確認をしました。

rubyの正規表現ですが、例えばJavaScriptでもほとんど同じような形で使えるので、基本をおさえておくと実装の幅が広がるかと思います。

今回は以上です！
Amazon Linux 2 でCompassを使いSassコンパイル

## Amazon Linux 2 でCompassを使いSassをコンパイル

amzn2-coreからRubyをインストールすると後々厄介なので、Rubyインストールも含めて手順メモ。

:::note warn
RubyもGemもよく分からんけど「Sassコンパイルしたい」or「Compass使いたい人」におススメ
:::

>えー、今さら？って思った人。そう、まさに今さらだから書いたんすよ。
>Compassは古めの情報多いから「今でもこれで動くぜ！」ってメモっておきたい

## ①Rubyのインストール
以下記事が、非常に分かりやすく失敗しないので、是非やってみてください（他力本願）

https://qiita.com/Ekodhikodhi/items/01eab1b2b5785163e684

## ②GemでCompassのインストール
こちらについても、以下記事が端的でわかりやすいです（こちらも他力本願）

https://qiita.com/taishi41228/items/98b5ab525eb7b79880fb


という完全にパクリだけの内容を、メモ代わりであげておきます
※何も手を入れなくとも、①②を続けてやるだけでインスコできて幸せでした。

>最初は`composer require panique/php-sass`を使ってコンパイルしていたのだけれども、
>`$breakpoint::`やらでコンパイルエラーになるし、イヤになったんすよ。
>やっぱりCompassが王道感あるよね（`LibSass`に移行してる感は否めないけど）
備忘録【現場で役立つシステム設計の原則】①

#はじめに
「オブジェクト指向プログラミングとドメイン駆動設計を学ぶのに適切な書籍とおすすめの読む順番」
（https://qiita.com/yushi_koga/items/655fd11396f6b502eaa4）
の記事で、「現場で役立つシステム設計の原則」の本が紹介されていた。
読んでみたので備忘録を書いておこう（少しずつ）。

##第1章　小さくまとめてわかりやすくする
###なぜソフトウェアの変更は大変なのか
　変更が大変なプログラムの特徴
　・メソッドが長い
　・クラスが大きい
　・引数が多い
###プログラムの変更を楽にするには、「メソッドは短く、クラスは小さく」
・名前は（略語でなく）普通の単語を使う
・数行のコードを意味のある単位として「段落」に分ける
・「目的別の変数」を使う（1つの変数を使いまわさない）
・意味のあるコードのまとまり（段落）を「メソッド」として独立させる
・業務の関心事に対応したクラス（ドメインオブジェクト）を作る
####異なるクラスの重複したコードをなくす手順
①それぞれのクラスで該当するコード部分（段落）をメソッドに抽出
②２つのクラスに参照関係がある場合：
　参照する側で抽出したメソッド呼び出しを参照先のオブジェクトのメソッドの呼び出しに書き換える
②’２つのクラスに参照関係がない場合：
　共通のメソッドの置き場所として、別のクラスを新たに作成し、元のクラスで抽出したメソッドを移動する
③元のクラスのメソッド呼び出しを、それぞれ新しいクラスの共通メソッドを利用するように書き換える







###小さいクラスでわかりやすく安全に作る
「値」を扱うための専用のクラスを作る

```csharp
class Quantity{
  int Min = 1;
  int Max = 100;
  int value;

  Quantity(int value)
  {
    if (value < Min)
      throw new IllegalArgumentException("不正：" + Min + "未満")
    if (value > Max)
      throw new IllegalArgumentException("不正：" + Max + "超")
    this.value = value;
  }
List<Customer> customers;
    
    void add(Customer customer){・・・}
    void removeIfExist(Customer customer){・・・}
    int count(){・・・}
    Customers importantCustomers(){・・・}
}
```

###コレクションオブジェクトで、複雑なロジックを集約して整理する
　コレクション型を扱うロジックを専用クラスに閉じ込める
　コレクションへの参照は変更不可にして渡す

```csharp
class Customers{
    List<Customer> customers;
    
    void add(Customer customer){・・・}
    void removeIfExist(Customer customer){・・・}
    int count(){・・・}
    Customers importantCustomers(){・・・}
}
```

クラス名やメソッド名と業務の用語が一致するほど、プログラムの意図がわかりやすくなり、変更が楽で安全になる
Docker-ComposeでAnaconda環境を構築して、condaコンテナ内でアプリを起動する

# なぜ記事を書くのか
- docker-composeを使ってアプリケーションを作成中に、使うソフトウェアをconda環境を使って作る必要性があった。 
- GPU環境で動かすため、dockerのイメージはnvidia/cuda:10.2-cudnn7-devel-ubuntu18.04を利用していたため、公式のAnacondaイメージは使えなかった(使う方法はあったかも)
- Anacondaをインストールして、作成したコンテナをactiveにする際に非常に手こずった
- 作成したcondaコンテナでアプリケーションを起動するのに非常に手こずった

# やること
1. docker-composeにAnacondaをインストールする
1. condaコンテナを作って、必要なライブラリをインストールする
1. 作成したコンテナ内でアプリケーションを起動する

# Anacondaをインストールする
```dockerfile
FROM nvidia/cuda:10.2-cudnn7-devel-ubuntu18.04
USER root

RUN apt-get update && apt-get install -y wget && apt-get update

RUN wget https://repo.anaconda.com/archive/Anaconda3-2021.05-Linux-x86_64.sh
RUN bash Anaconda3-2021.05-Linux-x86_64.sh -b && rm Anaconda3-2021.05-Linux-x86_64.sh

ENV PATH $PATH:/root/anaconda3/bin

RUN conda update -n base -c defaults conda
```
1. [公式サイト](https://www.anaconda.com/products/individual-d#Downloads)からインストーラーのダウンロードURLをコピーしてくる
1. wgetでDL、bashでインストール(-bオプションでインストール中のyesやenterをスキップする)
1. -bオプションを使うとPATHが通らないため、ENVでPATHを通す
1. なんかアラートが出るからupdateをする

# condaコンテナを作成して、Activeにする
```dockerfile
RUN conda create -n test
SHELL ["conda", "run", "-n", "test", "/bin/bash", "-c"]

RUN pip3 install update pip && pip3 install flask
RUN conda init bash
```
1. `conda create`で作成したいコンテナを作成する。
1. SHELL 〜で作成したコンテナをactiveにする
1. その後にpip installするとコンテナ内にライブラリがインストールされる

# 作成したコンテナ内でアプリケーションを起動する
```dockerfile
WORKDIR /app
COPY ./app /app
CMD python3 app.py
```
1. `CMD python3 app.py`でアプリケーションを起動する

ここが今回の肝です。
ずっと、`CMD ["python3","app.py"]`でアプリケーションを起動していたのですが、それだとinstallされているはずのライブラリがインストールされておらず、No module errorが発生してしまっていました。
色々調べている中で、`CMD python3 app.py`での実行の記述も見ていたのですが、同じこと書いてるわけだし関係ないか、と思ってスルーしていたのですが、ダメもとで試してみたら見事成功したので、目から鱗の発見でした。

# 今回の教訓
関係ないだろうと思っても試してみよう

# 一応docker-compose.yml
```docker-compose.yml
version: '3'
services:
    test:
        container_name: test
        build: ./digiclo-espnet
        ports:
            - "5000:5000"
        tty: true
        deploy:
            resources:
                reservations:
                    devices:
                        - capabilities: [gpu]
        logging:
            driver: "json-file"
            options:
                max-size: "10m"
                max-file: "1"
        restart: always
```
- ログがめちゃくちゃ溜まってしまうので、loggingは設定した方がいいです。
- GPU環境で実行するために、deploy以下を記載してます
PHPで1年分の月を出力する。

##PHPで一年分の月を出力する。

データベースに月毎でデータを保存しているってことはまあまああることだと思います。
一年単位で一括更新したいデータがあったのですが、テーブルが別れているのでめんどくさいのでfor文で一気に更新してしまいます。

for文といえば

```php
for($i = 0; $i < 12; $i++){
  //なんか処理
}
```
こんな感じだと思うんですけど、今回は

```php
$to_month = date("Ym");
//1年後
$limit_month = date("Ym", strtotime(date("Ymd")." +1 year"));

for($m = $to_month; $m <= $limit_month; $m = date("Ym", strtotime($m."01 +1 month"))){

    echo "<pre>";
    var_dump($m);
    echo "</pre>";
}

// string(6) "202109"
// string(6) "202110"
// string(6) "202111"
// string(6) "202112"
// string(6) "202201"
// string(6) "202202"
// string(6) "202203"
// string(6) "202204"
// string(6) "202205"
// string(6) "202206"
// string(6) "202207"
// string(6) "202208"
// string(6) "202209"
```
こんな感じ。

strtotimeは直感的でわかりやすいですよね！私はよく使ってます。

そしてデータベースを更新したいときはSQLを中に書いてあげて

```php
$to_month = date("Ym");
//1年後
$limit_month = date("Ym", strtotime(date("Ymd")." +1 year"));

for($m = $to_month; $m <= $limit_month; $m = date("Ym", strtotime($m."01 +1 month"))){

    $table = "data_table_".$m;
    $sql = "UPDATE {$table} SET ******";

    echo "<pre>";
    var_dump($sql);
    echo "</pre>";
}

// string(42) "UPDATE data_table_202109 SET ******"
// string(42) "UPDATE data_table_202110 SET ******"
// string(42) "UPDATE data_table_202111 SET ******"
// string(42) "UPDATE data_table_202112 SET ******"
// string(42) "UPDATE data_table_202201 SET ******"
// string(42) "UPDATE data_table_202202 SET ******"
// string(42) "UPDATE data_table_202203 SET ******"
// string(42) "UPDATE data_table_202204 SET ******"
// string(42) "UPDATE data_table_202205 SET ******"
// string(42) "UPDATE data_table_202206 SET ******"
// string(42) "UPDATE data_table_202207 SET ******"
// string(42) "UPDATE data_table_202208 SET ******"
// string(42) "UPDATE data_table_202209 SET ******"
```

これで楽々更新♪

仮に10年とかになっても応用が効きそうですね。
M1 MacとPoetryでTensorFlow環境構築

## はじめに

Apple Silicon 搭載 Mac に[TensorFlow](https://developer.apple.com/metal/tensorflow-plugin/) 入り環境 を miniforge ではなく [Poetry](https://python-poetry.org) を使って構築する際に、ちょっと苦労したので備忘録です。

https://qiita.com/hjmr/items/b81de997d4c2b64ef140

こちらの記事を参考にさせていただきました。

## 前提

- Homebrew がインストールされている
- Python のパッケージマネージャは Poetry を使用している

インストールに成功したモジュールは以下のバージョンのものです。

```toml:poetry.lock
[[package]]
name = "tensorflow-macos"
version = "2.5.0"

[[package]]
name = "tensorflow-metal"
version = "0.1.2"
```

## 手順

### 1. Homebrew で必要なものを事前にインストール

```bash:shell
brew install hdf5 zlib openblas openssl
```

### 2. 環境変数付きで tensorflow-macos を `poetry add`

当方の環境では、[参考記事](https://qiita.com/hjmr/items/b81de997d4c2b64ef140) に記載があった環境変数に加え、openblas と openssl についても環境変数を明示するとうまくいきました。

```bash:shell
CFLAGS="-I /opt/homebrew/opt/openssl/include" LDFLAGS="-L /opt/homebrew/opt/openssl/lib" GRPC_PYTHON_BUILD_SYSTEM_OPENSSL=1 GRPC_PYTHON_BUILD_SYSTEM_ZLIB=1 HDF5_DIR=/opt/homebrew/opt/hdf5 OPENBLAS="/opt/homebrew/opt/openblas" poetry add tensorflow-macos
```

### 3. tensorflow-metal を `poetry add`

```bash:shell
poetry add tensorflow-metal
```

## さいごに

良い tensorflow-metal ライフを！
AtCoderログ：0107 - ABC 132 C

# 問題

https://atcoder.jp/contests/abc132/tasks/abc132_c

## 問題文
> 高橋君は、$N$ 個の競技プログラミング用の問題をつくりました。それぞれの問題には $1$ から $N$ の番号がついており、問題 $i$ の難易度は整数 $d_i$ で表されます(大きいほど難しいです)。
> 高橋君はある整数 $K$ を決めることで、
> ・難易度が $K$ 以上ならば「ARC 用の問題」
> ・難易度が $K$ 未満ならば「ABC 用の問題」
> という風に、これらの問題を二種類に分類しようとしています。
> 「ARC 用の問題」と「ABC 用の問題」が同じ数になるような整数 $K$ の選び方は何通りあるでしょうか。

## 制約
> ・$2 \le N \le 10^5$ 
> ・$N$ は偶数である。
> ・$1 \le d_i \le 10^5$
> ・入力は全て整数である。

## 収録されている問題セット
- [AtCoder Problems Boot camp for beginners Easy 100](https://kenkoooo.com/atcoder/#/training/Boot%20camp%20for%20Beginners/1) [#014]

# 回答
## 回答1 (AC)
難易度を配列に保存して昇順(小さい順)にソートした場合、$N/2-1$ 番目の要素は「ABC用の問題」のうち一案難しい問題の難易度、$N/2$ 番目の要素は「ARC用の問題」のうち一番易しい問題の難易度となるので、この間である整数 $K$ はすべて設問の条件を満たします。コードは以下のようになりました。

```C++:abc132c-1.cpp
#include <bits/stdc++.h>
using namespace std;

int main() {
  int n;
  cin >> n;

  vector<int> d(n);
  for ( int i=0; i<n; i++ ) {
    cin >> d.at(i);
  }
  
  sort( d.begin(), d.end() );
  
  int abcmax = d.at(n/2-1);
  int arcmin = d.at(n/2);
  
  cout << arcmin-abcmax << endl;
}
```

# 調べたこと
## [AtCoder の解説](https://atcoder.jp/contests/abc132/tasks/abc132_c/editorial) → [ユーザ解説](https://blog.hamayanhamayan.com/entry/2019/06/30/100033)
回答1と同じ方針でした。

## [AtCoder の解説](https://atcoder.jp/contests/abc132/tasks/abc132_c/editorial) → [コンテスト全体の解説](https://img.atcoder.jp/abc132/editorial.pdf)
回答1と同じ方針でした。

# リンク
## 前後の記事
- 前の記事 → [AtCoderログ：0106 - ABC 161 C](https://qiita.com/RoadLynton/items/2da2409cf3d9fd7be195)
- 次の記事 → [AtCoderログ：0108 - ABC 142 C](https://qiita.com/RoadLynton/items/c69fcdc4bf2256f9bf0f)
awsデプロイ scpコマンド

# AWS,Docker 困ったこと

## 現状
https://qiita.com/at-946/items/1e8acea19cc0b9f31b98
このサイトを参考にDocker EC2でrailsアプリのデプロイを試みましたが、

```
$ scp -i ~/.ssh/myapp.pem ~/myapp/config/master.key myuser@xxx.xxx.xxx.xxx:./myapp/config/
```
scpコマンドでmaster.keyをリモートに送ろうとしましたがエラーが出ました。

```
scp: /master.key: Permission denied
```
エラーメッセージです。

調べるとサーバーにkeyを設定する必要があるとのことなのでやってみましたが、結果は同じでした。

## 解決方法

myuserでの権限がなかった。

```
$ ls -l　
```
確認方法

権限の変え方

```
$ sudo chown -R myuser:myuser myapp
```
[Ruby] AtCoder過去問 C - Go to School

##はじめに
AtCoder過去問を解きました。
が、今回正解のコードは出来上がったものの理解し切れていません。。。

解説できる方がおられたら、コメント欄にて教えていただけると幸いです。

問題はこちらから確認ください。↓

https://atcoder.jp/contests/abc142/tasks/abc142_c


##C - Go to School
この問題かなりややこしくて入力値のaで受け取っているところは、到着した順位を表しています。
先頭から出席番号1です。

出力で表示されている番号たちは順位ではなく、出席番号で、到着した順に並んでいます。

つまり入力値aの添字+1＝出席番号です。

これらの情報をもとに、私がはじめに作ったコードはこちら↓
（このコードは不正解です）

```Ruby
n = gets.to_i
a = gets.split.map(&:to_i)

n.times do |x|
  puts a.index(x+1) + 1
end
```

上記のコード間違っているかどうかと言うより、処理時間が長すぎて不正解となりました。
この手の問題は繰り返し処理を行うと処理時間長すぎで不正解となることが最近わかってきました。


これが間違っていると言うことは配列の順番を並び替える処理だけで行うべきだと考えました。
しかし、冒頭で述べた通り入力と出力は同じ数字に見えても、データとしては別物なのでとても扱いにくいです。


いろんな人の回答を参考にして、最終的に下記のようなコードを作りました。
かなりシンプルです。

```ruby
n = gets.to_i
a = gets.split.map(&:to_i)
 
puts a.sort_by{|i| a[i-1]}
```

紙に書き出して、自分で入力値を代入して、正解になるのはわかるのですが、どれだけ考えても理屈はわからずじまい。。。

説明できる方おられたらコメントで教えてもらえると幸いです。。。
iOSとAndroidを区別するのに便利なJavaScript置いておくね

```
var isAndroid = (UA && UA.indexOf('android') > 0) || (weexPlatform === 'android');
var isIOS = (UA && /iphone|ipad|ipod|ios/.test(UA)) || (weexPlatform === 'ios');
```

これは基本的にユーザーエージェント(UA)を見て正規表現でandroidかiOSかを判別しています。`UA &&`の部分はnullチェックですね。UAの値を取得できなかった時にエラーで落ちないようにしています。

日本のスマホのシェアはAndroidとiOSが99％を占めているので上記以外はその他で例外処理をしてしまって良いでしょう。
【Python】ジャンケンのプログラムを作ってみた！

　Pythonを勉強し始めて1週間が経過したので、何か簡単なプログラムを作ってみようと考え、ジャンケンのプログラムを作ってみました。

```python
import random

while True:
    jan = ["グー","チョキ","パー"]
    cpu = random.choice(jan)
    user = int(input("グーだったら0、チョキだったら1、パーだったら2を入力してください："))
    print("あなた：" + jan[user])
    print("CPU：" + cpu)

    if jan[user] == cpu:
        print("あいこです")
        continue
    else:
        if cpu == jan[user - 1]:
            print("負けです")
            break
        else:
            print("勝ちです")
            break
```

　出力結果は以下のような形です。

```
グーだったら0、チョキだったら1、パーだったら2を入力してください：0
あなた：グー
CPU：グー
あいこです
グーだったら0、チョキだったら1、パーだったら2を入力してください：2
あなた：パー
CPU：グー
勝ちです
```

　何も調べずに自分の知識の範囲内でこのようなコードを書きましたが、ジャンケンの仕組みやPythonのメソッドをもっと考えれば、より良いコードが書けると思いますので、ご意見いただけるとありがたいです。

<br>
【エラー備忘録】MySQLと接続できない。SQLSTATE[HY000] [2002] Connection refused

##状況
いつものように`$ php artisan serve`でローカルサーバーを起動し、`localhost:8000`にブラウザでアクセスするとエラーに。

```
SQLSTATE[HY000] [2002] Connection refused
```

データベースを確認しようとTable Plusを開くと、これもエラーに。
ターミナルで`$ mysql -u root -p`とコマンドを実行して接続を試みるが、やはりエラーに。

```
Can't connect to local MySQL server through socket '/tmp/mysql.sock' (2)
```

##原因
/tmp/mysql.sockが…と言われているが、要はMySQLと接続できていないというエラー内容。
そういえば、macの充電が切れて一度シャットダウンされていたことを思い出した。

MySQLの起動を行ってから接続のコマンドを実行すると、無事接続ができ、Table Plusでも問題なく接続できた。

```
// MySQLの起動
$ mysql.server start

// MySQLに接続
$ mysql -u root -p

// MySQLの停止
mysql.server stop
```

`localhost:8000`を指定すると、こちらも問題なく表示された。
テーブルに後からユニーク制約（一意性）を追加する


# やりたいこと
`User毎に登録Wordを独立`させて、`User毎に登録Wordのユニーク制約を適用`したい。

- 最初に作成したWordテーブルはユニーク制約を用いて同じWordの登録を不可にしている
- 新たにUserテーブルを作成した
- このままではUser全体でWordにユニーク制約がかかってしま（例：User1とUser2でそれぞれtestという単語を登録できない）


# やったこと
下記の記事を参考にして、新たにマイグレーションファイルを作成し`add_index`の部分を記述した。(`add_reference`は外部キー制約を追加するための記述で、ここでは説明を省く)
[uniqueness: scope を使ったユニーク制約方法の解説](https://qiita.com/j-sunaga/items/d7f0e944baad6e56206c)

```ruby
class AddUserToWords < ActiveRecord::Migration[6.1]
  def change
    add_reference :words, :user, null: false, foreign_key: true
    add_index :words, %i[word user_id], unique: true
  end
end
```

ちなみに、最初に作成した`Word`のマイグレーションファイルには以下のようにユニーク制約が設けてある。

```ruby:
class CreateWords < ActiveRecord::Migration[6.1]
  def change
    create_table :words do |t|
      t.string :word, null: false, limit: 100
      t.index :word, unique: true

      t.timestamps
    end
  end
end

```

この状態で`rails db:migrate`を実行すると、`schema.rb`は以下のようになる。

```ruby:schema.rb
  create_table "words", force: :cascade do |t|
    t.string "word", limit: 100, null: false
 
    t.index ["word", "user_id"], name: "index_words_on_word_and_user_id", unique: true
    t.index ["word"], name: "index_words_on_word", unique: true
  end

  add_foreign_key "words", "users"
end
```

# エラー内容
上記の状態で`User1`と`User2`で同じ`test`という単語を登録しようとすると下記のエラーが発生した。

```ruby
ActiveRecord::RecordNotUnique in WordsController#create
PG::UniqueViolation: ERROR: duplicate key value violates unique constraint "index_words_on_word"
DETAIL: Key (word)=(test) already exists.
```

# エラーの原因
エラー文に書いてあるとおり、

`index_words_on_word`の部分が悪さをしているので、元々の`Word`のマイグレーションファイルに記述してある`t.index :word, unique: true`が原因。

# 解決策

元々の`Word`のマイグレーションファイルに記述してある`t.index :word, unique: true`を消去する。
マイグレーションファイルに下記を追記して`rails db:migrate:reset`を実行した。

```ruby
class AddUserToWords < ActiveRecord::Migration[6.1]
  def change
    add_reference :words, :user, null: false, foreign_key: true
    add_index :words, %i[word user_id], unique: true
    remove_index :words, :word
  end
end
```

無事に`User毎に登録Wordを独立`させて、`User毎に登録Wordのユニーク制約を適用`することができた。

# 学んだこと
これまでデータベース周りをいじることが少なかったため、理解すると簡単なことだったが解決までに時間を要してしまった。
今回の経験を通じてデータベース周りの理解が深まった。

## 補足
今回はデータベースをリセットしても問題ないため、`rails db:migrate:reset`を実行した。
リセットしたら困る場合は新たにマイグレーションファイルを作成し、そこに`remove_index`を記述し、`rails db:migrate`で対応する必要があると考える。

また、リセットして構わないのであれば、最初の`Word`マイグレーションファイルから`t.index :word, unique: true`を削除するのでも良かったかもしれない。

ちなみにモデル側でも下記のようにscopeを指定してユニーク制約を設けている。

```ruby:word.rb
class Word < ApplicationRecord
  belongs_to :user
  validates :word, presence: true, uniqueness: { scope: :user_id }, length: { maximum: 100 }
end
```

データベースとモデルの両方でユニーク制約をつける意味については、[Railsチュートリアル](https://railstutorial.jp/chapters/modeling_users?version=5.1#cha-modeling_users)の説明が理解しやすかったです。

# 参考
[uniqueness: scope を使ったユニーク制約方法の解説](https://qiita.com/j-sunaga/items/d7f0e944baad6e56206c)
AtCoderログ：0106 - ABC 161 C

# 問題

https://atcoder.jp/contests/abc161/tasks/abc161_c

## 問題文
> 青木君は任意の整数 $x$ に対し、以下の操作を行うことができます。
> ・操作: $x$ を $x$ と $K$ の差の絶対値で置き換える。
> 整数 $N$ の初期値が与えられます。この整数に上記の操作を $0$ 回以上好きな回数行った時にとりうる $N$ の最小値を求めてください。

## 制約
> ・$0 \le N \le 10^{18}$
> ・$1 \le K \le 10^{18}$
> ・入力は全て整数

## 収録されている問題セット
- [AtCoder Problems Boot camp for beginners Easy 100](https://kenkoooo.com/atcoder/#/training/Boot%20camp%20for%20Beginners/1) [#013]

# 回答
## 回答1 (AC)
入力値 $x$ が $K$ よりも大きいとき、操作の出力は $x-K$ となります。さらにこの値が $x$ よりも大きいとき、2回目の操作の出力は $x-2K$ となります。同様に繰り返すと、出力値が $x \bmod{K}$ になった時点で値は $K$ 以下となります ($x \bmod K$ は $x$ を $K$ で割った余り)。

他方で入力値 $x$ が $K$ 以下のとき、操作の出力は $K-x$ となります。この値は $K$ 以下なので、2回目の操作の出力は $K-(K-x)=x$ となり、もとの値に戻ります。

これらの考察より、求める最小値は $x \bmod K$ と $K-($x \bmod K$)$ の小さい方になることがわかります。コードは以下のようになりました。

```C++:abc161c-1.cpp
#include <bits/stdc++.h>
using namespace std;

int main() {
  int64_t n, k;
  cin >> n >> k;

  cout << min( n%k, k-n%k ) << endl;
}  
```

# 調べたこと
## [AtCoder の解説](https://atcoder.jp/contests/abc161/tasks/abc161_c/editorial) → [コンテスト全体の解説](https://img.atcoder.jp/abc161/editorial.pdf)
回答1と同じ方針でした。

# リンク
## 前後の記事
- 前の記事 → [AtCoderログ：0105 - ABC 217 C](https://qiita.com/RoadLynton/items/82c9162232c3c14241ec)
- 次の記事 → [AtCoderログ：0107 - ABC 132 C](https://qiita.com/RoadLynton/items/79473a19725fa7ffc370)
mockmvcでUnparsable JSON stringが発生する & Response Bodyが常に空になる

# 概要
mockmvcで以下のようにレスポンス値を確認するようなコードを書いていました。
（簡略化しています。）

```java
Sample sample = new Sample("sample");

mvc.perform(get(URI)
            .param("userId", "1")
            .accept(MediaType.APPLICATION_JSON)
            ).andExpect(status().isOk())
             .andExpect(content().json(JsonOutput.toJson(sample)));
```
実際にはjson化できているにもかかわらず、以下のエラーが出てしまい頭を抱えてしまいました。

```
Condition failed with Exception:
org.json.JSONException: Unparsable JSON string: 
```

# 原因
「JSONに変換できないこと」が原因ではありますが、期待値として設定しているsampleがJSON化できないのではなく、テスト対象のエントリポイントから帰ってくるBody値が空だったため、こちらのエラーがでています。

自分が若干悩んだポイントとしては、レスポンス値が空の場合でもAssertが出るのでは？というところですが、
Assertionを出すより先に以下の部分でResponseBodyのJSONパース処理が走って、JSONのパースエラーが出るみたいです。
https://github.com/spring-projects/spring-framework/blob/8f33450df20352ad6eabe632c082d9b02cb46c9a/spring-test/src/main/java/org/springframework/test/web/servlet/result/ContentResultMatchers.java#L227

また、テスト対象のエントリポイントが常に空のBodyを返すという問題についてですが、原因としては、対象コントローラーを以下のように@MockBeanで呼んでしまっており、期待通りにリクエストができていなかったことが問題でした。

```java
@MockBean
private TargetController target;
```
実際には、以下のようにAutowiredで呼ぶ必要があります。

```java
@Autowired
private TargetController target;
```
VNCでローカルからRPiへファイル転送する

# 1.はじめに
ローカルPCからリモートでRPiを使うとき、ファイル転送するのにmobaXtermを使ってましたが、Mac環境ではmobaXtermが無いのでVNCでファイル転送する方法を確認しました。
確認はwin10でやっているので、本当にmacでできるかは不明。


# 2.VNCでローカル→RPiへファイル転送する方法。

1.VNCで接続したらウィンドウの上の方（矢印のあたり）にマウスオーバーして、出てきたアイコンのなかのTransfer filesをクリック。
メニューが出てこない場合は、ウィンドウの上の方（矢印のあたり）を右クリックしてTransfer files...を選択。
![vnc1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/496179/ed506b99-ee4c-65b0-71cb-710b1a728f54.png)

2.出てきたウィンドウの左下、Send filesをクリック。
![vnc2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/496179/1fae85de-4e4c-860a-405d-429ce0b5a853.png)

3.送りたいファイルを選択すると。。。
![vnc3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/496179/60b39529-4bc2-984a-1845-0f9950e4fd4e.png)

4.RPiのデスクトップにファイルができています。開くと、ちゃんと画像が送れていました。
![vnc.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/496179/0ab44ba3-e523-96b6-6428-fd4cb078b15f.png)


macでも同じだと思うけど、、、違っていたらすみません。
Python3について(return[戻り値]について)

#returnについて

関数の最後にいつも書いてありましたが、あまり意味は分かっていませんでした。
なんとなく理解したので、覚書的に書いておきます。

##1.returnがない場合

```.py
def aisatsu():
    print('Hello')

x = aisatsu() #xに対して、あなたは今後aisatsu()ですよと指示している
>> Hello

print(x) #xがaisatsu()になっていれば、Helloが出力されるはず
>> None

```

このようにxにaisatsuを割り当てて、xを呼び出してもHelloはプリントされません。
なぜなら、このaisatsuの関数が直接呼ばれた時でないと関数の中身が動かないからです。
なので、xに関数を割り当ててもdef aisatsu():までしか呼び出されません。(※イメージです)

##2.returnをつけた場合

```.py
def aisatsu():
	print('Hello')
	return ('Hello') #別の名前で呼ばれた時はこれを返してね

x = aisatsu() #xに対して、あなたは今後aisatsu()ですよと指示している
>> Hello

print(x)
>> Hello
```

returnをつけると、その関数が別の名前で呼ばれた時は、returnの値を返す。
なので、returnの中を変えると以下のようになる。

```.py
def aisatsu():
	print('Hello') #正規の名前ならこっち
	return ('Bay') #別の名前で呼ばれたらこっち

x = aisatsu() #xに対して、あなたは今後aisatsu()ですよと指示している
>> Hello

print(x)
>> Bay

```

print(x)では、別の名前で呼ばれたので、returnの中身を返している。
returnの中身は計算結果などを保存できるので、次のようなこともできる。

##3.計算結果を保存

returnの結果は記憶されるので持ち越すことが出来る。
returnを消すと、計算結果すら出力されなくなる。なぜなら、addはx*xを中でやっているだけで、
printすらしていないので、内部で計算して満足して終わりになります。

```.py
def add(x):
	return (x*x)

z = add(3) #zに3×3が記憶される（つまり9）

print(z)
>> 9

y  = add(z) #zに9が記録されているので、9×9になる

print(y)
>> 81
```

##4.最後に

計算結果をどこかで使おうとするのであれば、returnを使い、その関数の結果として何を返すのかを明確にする必要がある。ということを学びました。
最後にreturnが無いと大変だよという例をあげておきます。

```.py
def add(x):
	print(x*x)
	return('Hello') #関数名以外で呼ばれた時はこれを返す

z = add(3) #関数名で呼ばれているので3×3がプリントされる
>> 9

print(z) #関数名以外で呼ばれているので、戻り値のHelloがプリントされる
>> Hello

```
outsystemsの使用感について

一応エンジニアとして就職することができてoutsystemsも主体に
開発しているのでまだひはあさいですが使用感や感想を綴ります。

##初めて触ってみた感想
今までlaravelやPHPをメインに触ってきましたが
色んなUIのテンプレートが用意されていて正直驚きました。
画面ごとにテンプレートを選ぶだけで簡単にSPAが実現します、、

また、バックエンドロジックについても変数の渡し方やサーバー側の昨日の呼び出しなど基本的な概念は必要かと思いますが、ほとんどドラッグ＆ドロップで出来てしまいます、、

あと、outsystemsのエディタではレスポンシブの状態とパソコン上の状態が混同して表示されるのでこまめにデプロイしてチェックするといいかもです。

驚くことは多いですが、ブラウザで動作をチェックする際に
ワンクリックでサーバーにデプロイしてブラウザを見るのですが
モニターがないと結構やりづらいなと感じました。

もし詰まっても、outsystems上にコミュニティがあるらしいので
困った時も参考情報が見つかりそうです。

https://www.outsystems.com/ja-jp/

コミュニティ内だけではなくてここでまたアウトプットしていきます！！
RailsでCSS読み込ませたらAssetNotPrecompiledって出る対処法

##困っていること
Railsで初めて`stylesheet_link_tag`使ってCSS読み込ませようとしたらSprockets::Rails::Helper::AssetNotPrecompiled inってエラーが出て萎えました。

```_left_menu.html.erb
<%=stylesheet_link_tag 'left_menu', media: 'all' %>
```
##解決方法
config/initializers/assets.rbに以下を記述

```config/initializers/assets.rb
Rails.application.config.assets.precompile += %w( *.css )
```
ターミナルで以下コマンドを実行する

```
$ rake assets:precompile
```
一度webサーバーを停止し、再起動（私の場合dockerで開発してるので以下のコマンドを実行）
↑これやるの忘れてて萎えました。

```
$ docker-compose down
$ docker-compose up -d
あるいは
$ docker-compose restart
```
これで解決！
##おまけ（jsの場合）
CSSと全く同じ方法で出来ます。

```config/initializers/assets.rb
Rails.application.config.assets.precompile += %w( *.js )
ちなみにcssとjsどっちも一気に設定する場合は以下
Rails.application.config.assets.precompile += %w( *.css *.js )
```
Power Automate Desktop: 「Web ページのダウンロード リンクをクリックする」が動かない

# 概要
普通に使えると思ったら使えなかったので、エラー内容＆解決方法

https://docs.microsoft.com/ja-jp/power-automate/desktop-flows/actions-reference/webautomation#clickdownloadlink

https://docs.microsoft.com/en-us/power-automate/desktop-flows/actions-reference/webautomation#clickdownloadlink

# Edge でやろうとした際のエラー
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120072/6c6d1eb5-0245-f5d9-a114-edcd4931f098.png)

# 解決方法
オートメーションブラウザを利用すればOK。
無事にダウンロードに成功しました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120072/6d9c0051-0c87-ddd9-1d3b-4374dae1cad8.png)

https://docs.microsoft.com/ja-jp/power-automate/desktop-flows/using-browsers#using-the-actual-internet-explorer-vs-the-automation-browser

# 試行内容
## Document確認
1. 日本語みても特に IE のみの記述無し
1. 英語版みても同様

## IE で動作確認
- IE9 以降はダメですって
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120072/7727a0c6-b720-77bd-b7f6-db5a6d22b6a6.png)

### IE での過去のこの関連？
解決策１＆２共に変化なし

https://docs.microsoft.com/ja-jp/troubleshoot/browsers/cannot-download-files-from-secure-websites

## エラーメッセージから、オートメーションブラウザの起動を試す
Actionの中にあるだろうと思って探してみたところ、ここにて発見。で無事成功
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120072/caab8946-361c-0b01-d5ed-43a7111652f1.png)

# search for
How to download file by Power Automate Desktop 

# あとがき
以下どっちかにしてほしいものですね・・
1. エラーメッセージをもう少し分かりやすく・・
1. オートメーションブラウザをIEアクションから分離
彦摩呂「Rubyや～～」

こんにちは！
スクールのカリキュラムの通りに実装を進めて教材の通りに
Ruby on RailsでWebアプリケーション作成しました。
しかしふと思ったんです。

# 何でRuby?

***ラビットの麒麟川島「Rubyだ」***

PHP、Java, Pythonとあって何でRubyを俺は使ってる？？
と思いました。
まさしく僕は誰？状態です。
メモ用としてRubyのことについてディグっていきたいと思います。

# いつできて誰が作ったの？
Rubyが生まれたのは1995年です。
はいそうです、僕と同い年です。
しかも開発された方は日本人の
まつもとゆきひろさんという方だそうです！！

海外旅行に行くと
レペゼンジャパンはドラゴンボールやキャプテン翼などが挙げられますが、
エンジニア界隈では「Rubyやん！」と言われることもあるんじゃないの。

# Rubyの特徴

動的型付き言語でありシンプルな構文なので記述量が少なく、
プログラミング初心者でも比較的入りやすい言語のようです。
また、オブジェクト指向を採用しているため、保守、運用に優れています。

これ初めて聞いた時、因みに僕はこう思いました。

***どこがやねん***

***めちゃくちゃ何言ってんのかわからんがな。***

数こなしていく内に点と点が線でつながるようになりましたが、
プログラミングにおいて数をこなす事が大事だったのかなと今では思っています。

## 動的型付き言語？？？？
むちゃくちゃわからん単語出てきたがな。理解できんまま進めんわ。
ということで調べてみました。

そもそも動的と静的という言葉はなんやと思い調べると
***動的:状況によって状態を変える***
***静的：状況によらず状態を変えない***
だそうです。

動的サイトならユーザーの要求で表示内容を変えるサイト
静的サイトならいつでも表示する内容が変わらないサイト
と言えます。

これを踏まえて
動的型付け言語とは
***変数などのデータ型の宣言がいらない言語***のことで、
静的型付け言語とは、
***変数などのデータの定義が必要な言語***
ということです。

記述の違いを見て考えていきましょう。

### 動的型付け言語の記述例

```ruby
a = 2
b = 3
puts a + b
```

簡単に書けますね。実行結果は5です。

### 静的型付け言語の記述例

```c
#include <iostream>
using namespace std;

int main()
{
	int a = 2;
	int b = 3;
	cout << a + b << endl;

	return 0;
}
```

いやなっが。
すごいですね計算結果5を出す為だけにこんなに記述しないといけないのか。
int型という整数の変数a,bが定義されています。

### 動的型付けと静的型付けを比較して解ること

動的型付け言語なら変数などのデータ型の宣言がいらないので
記述量が大幅に減り、比較的容易にプログラムを書くことができます。

短く簡単にプログラムをかけるんなら全部動的型付け言語でええやんけと
思いました。

静的型付け言語のメリットについても考察してみました。

- コンパイル時にエラーが発生
- パフォーマンスの向上

***コンパイル時にエラーが発生***
コンパイル時にエラーが発生するので
プログラムを実行する前にエラーを特定することが可能です。
int型の変数なのに文字列を代入しようとしてしまってるとかですかね。

確かに動的型付け言語だとプログラムが実行された後にエラーが発生するので
見返すのに時間がかかったりしちゃうんですよね。

***パフォーマンスの向上***
静的型付け言語ならデータの型が分かるので、
整数同士の計算や
小数同士の計算が
プログラム実行前に解る。

データの定義がされているのでコードを見返すのが楽ちんですね。

また、Rubyはインタプリタ方式を採用しています。

## インタプリタ方式とコンパイル方式
インタプリタ方式とは簡単にいうと
***プログラムの内容を人間がわかる言葉からコンピュータがわかる言語へ一つずつ翻訳しながら動かす方式***のことです。

人間がプログラムを入力&rarr;
入力されたプログラムをコンピュータが解るように翻訳&rarr;
翻訳された命令に従ってコンピュータが仕事を実行する
というそんな流れ。

この入力されたプログラムを1行ずつ繰り返すのがインタプリタ方式です。

彦摩呂のグルメコメントでインタプリタ方式を例えてみましょう。

***彦摩呂がウルフギャングでステーキを頬張る***(人間がプログラムを入力)&rarr;
***彦摩呂の心の声「ん？ジューシーやな？これは何てコメントしよかいな」***(入力されたプログラムをコンピュータが解るように翻訳)&rarr;
***彦摩呂がコメント「味のIT革命や〜」***(翻訳された命令に従ってコンピュータが仕事を実行する)

コンパイル方式は入力されたプログラムを全部翻訳しその翻訳された
プログラムを実行する方式です。

コンパイル方式を彦摩呂で例えてみましょう。

***彦摩呂がステーキを完食する***(人間が入力したプログラムをコンピュータが全て翻訳)&rarr;
***彦摩呂のコメント「赤かぁ～。てんこ盛り～～っ！食べ物を美味しく表現するのが僕の使命です～。お肉と野菜とタレの騎馬戦や～。肉汁のドリンクバーや～。」***(翻訳されたプログラムを基にコンピュータが実行)

# Rubyのデメリット

インタプリタ方式を採用してるから処理速度が遅いんですよね。

上記の彦摩呂のグルメコメントを例を基に考えてみましょう。
インタプリタ彦摩呂はステーキを一口一口頬張るごとに、
いちいちコメントをしています。
それに対してコンパイル彦摩呂はステーキを完食してから
考えたコメントを発言しています。
食べ終える時間が遅いのは明らかにインタプリタ彦摩呂ですよね。

インタプリタ方式を採用するということは、コードの記述量が増えれば増えるほど
処理速度が遅くなるということです。
食べる量が増えれば増えるほど彦摩呂は食べ終えるのに時間がかかりますよね。

だから大規模なアプリや処理速度が命のアプリなものには
Rubyは向いていないと言えますね。
Doxygenで生成されるドキュメントにC言語のマクロ定義が出てこないことがあるのを調査


# 環境

最近の Doxygen を使用。

```
PS > doxygen.exe -V
1.9.2 (caa4e3de211fbbef2c3adf58a6bd4c86d0eb7cb8)
    with clang support 5.0.0.
```

# 現象

test.h はドキュメント生成するつもりのないファイル。

ただし、以下のようにコメント文に Markdown のコードブロックの開始に該当する記述がある。

```c:test.h
/***********
 * ~~~
 ***********/
```

test.c は test.h をインクルードしている。

```c:test.c
/*! @file */

/*!
 * comment
 */
#define AAA

#include "test.h"

/*!
 * comment
 */
#define BBB
```

Doxygen の設定は、プリプロセスを処理した方が良いと考えて `INCLUDE_PATH` を追加。他の設定はデフォルトのまま。

```:MyDoxyfile
INCLUDE_PATH = "test.h の配置されているディレクトリのパス"
```

Doxygen を実行すると、以下のように警告が出力される。

```
PS > doxygen.exe MyDoxyfile | Out-Null
test.c:13: warning: documentation for unknown define BBB found.
```

生成される HTML ファイルに `BBB` が無い。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/38075/b517bfbc-c900-860c-d986-a3a90fedec5f.png)

# 原因の推測

https://github.com/doxygen/doxygen/blob/Release_1_9_2/src/pre.l の処理。

プリプロセスで test.c に test.h のインクルードを見つけて test.h の解析に切り替え。
test.h の解析で `~~~` の閉じが無いので `SkipVerbatim` のまま `<<EOF>>` に到達。
test.c に戻ってきても `SkipVerbatim` で解析が進み `BBB` の定義が正常に解析されない。

解析するファイルの切り替えには flex の `yy_switch_to_buffer()` を使用している。
flex のドキュメントには `yy_switch_to_buffer()` は開始状態を変更しないとの記述。

https://github.com/westes/flex/blob/v2.6.4/doc/flex.texi#L2041 

> Note also that switching input sources via either @code{yy_switch_to_buffer()} or @code{yywrap()} does @emph{not} change the start condition.

# 回避策１

Doxygen の設定 `INCLUDE_PATH` を使わない。

# 回避策２

インクルードの直後に `~~~` の閉じを入れる。

```c:test_new.c
/*! @file */

/*!
 * comment
 */
#define AAA

#include "test.h"

/*
 * ~~~
 */

/*!
 * comment
 */
#define BBB
```

Doxygen を実行すると、警告は出力されない。

```
PS > doxygen.exe MyDoxyfile | Out-Null
```

生成される HTML ファイルに `BBB` がある。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/38075/54c528a0-dee4-96f2-742b-93aaaee40be3.png)
ネイピア数と虚数と円周率

#はじめに
オイラーの等式と呼ばれる式がある。
e^iπ+1=0
一見関係のない３つの数、ネイピア数と虚数と円周率の間に関係性があるという式。
eとπは無理数で、それぞれの計算式の一例は以下のとおり。
e=Σ1/n!　（n=0~∞）

ラマヌジャンよりも収束の速い、チュドノフスキーの式を使って、
sum = Σ((-1)^n*(6*n)!*(13591409+545140134*n))/((3*n)!*n!^3*(640320^3)^(n+0.5))　　（n=0~∞）
π = 1/(12*sum)

πの計算は、n=0とn=1を計算すれば、十分な精度が得られる。
ここで、十分とはコンピュータプログラムで一般的に扱える64bit幅の精度のことで、大体15桁。

エクセルでPI()とかEXP(1)を使っても、桁数の限界があるので、これ以上は面倒すぎてやめる。また、エクセルは内部的にeを持ってるのはなくて、同じように近似計算してるのかも。

こうしてみると、
ネイピア数の計算式も、高速に求める式はありそうだ。

問題は、虚数空間と円周率に関係性が見出せるか。面積を何かの式で表すことが出来るか、だ。

さて、プログラムでこういった無理数の計算をすると、必ず、有効桁数の問題にぶつかる。floatが32bitでdoubleが64bit、それぞれおよそ７桁、15桁ぐらいの精度。これ以上になると、専用ライブラリを使う必要が出てくる。

これまでも、簡単なライブラリがないか、調べてはいるもののピンとくるものがない。今回見つけたのは、pythonのdecimal。
decimal.getcontext().prec = 100;//有効桁数指定
decimal.Decimal(1)として使う。
しかし、pythonは速いのか、ライブラリは速いのか問題があって、まだ使ってみる気になってません。

![ネイピア数の計算.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/510257/d3d8e7e6-83a2-4b01-f7a5-51e10996180d.png)
Rails Checkboxのクリック箇所を画像と連動させる方法


### やりたいこと
チェックボックスの代わりに画像をクリックで反応してほしい
サンプルGIFは"画像をクリック"⇨"チェック状態"→"グレースケールからカラー状態に変化"するようにしました
![sample.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1745298/077873ea-a85c-6795-677a-e8c04903c5e3.gif)
[このページでも同じようなコード使ってます](https://still-shore-37853.herokuapp.com/facilities/search)

### 実装コード
```erb:html.erb
  <body>
    <%= form_with model: @blog do |f| %>
      <%= f.check_box :タイトル %>
      <%= f.label "タイトル" , class:"ラベル" do %>
        <%= image_tag "minecraft.png" , class:"写真"%>
        <span>文字もいけるよ</span>
      <% end %>
    <% end %>
  </body>
```

```css:css
.写真{
  width: 300px;
  cursor: pointer;
  filter: grayscale(100%);
  transition: 0.5s;
}

input:checked + label .写真 ,
input:checked + label span {
  filter: grayscale(0);
  font-weight: bold;
  color: red;
}
```


### 説明
取り急ぎ自分用で書きました
理解し始めたら詳細を書いていきます
kubectlでNodeGroupにあるPodを一覧表示する(AWS EKS, Kubernetes)

# NodeGroupごとにPodを一覧表示する

```bash
pod_list=$(kubectl get pods -A -o jsonpath='{range .items[*]}{@.spec.nodeName}{"\t"}{@.metadata.name}{"\t"}{@.metadata.namespace}{"\n"}{end}')
sed_cmd=$(kubectl get nodes -o jsonpath='{range .items[*]}sed "s/{@.metadata.name}/{@.metadata.labels.nodegroup-name}/g" | {end}sort')
echo "$pod_list" | eval "$sed_cmd"
```

# 任意のNodeGroupのNodeにあるPodを一覧表示する

上のコマンドの後ろに`| grep "NodeGroup名"`をつけてください

# 感想

ググっても出なかったのでjsonpathで気合で頑張りました。

もっと良いやり方をご存じの方は何卒コメントでご教授ください。
ext2形式のフロッピーディスクのイメージファイルをもらった備忘録

**課題**
与えられたイメージファイルをvmware内のubuntuにてマウントして中身を見る。
マウントしないと中身のファイルたちの権限が変更できないので以下の手順で行った。これは、マウント先の権限とユーザー権限のマウントは実際にはエミュレートしてるだけだかららしい。
まずはrootになる。

```
$ sudo su-
```
新しいディレクトリ作ってそこにマウントした。

```
$ mount -t ext2 ファイル名フルパス　マウントしたい場所
```
中身のファイルの権限を変更した。

```
$ chmod 644
```
読めるようになったと思ったが中身が変だったのでfileコマンドで調べる

```
$ file Q3.txt
```
ただのテキストファイルだったのでデコードを色々試す
使ったツールはCyberChef
https://gchq.github.io/CyberChef/
jisコードかな？となったので、iconvコマンド(文字コードを変換するコマンド)を用いる。オプションは次の通り

-f 入力のエンコーディング -t 出力のエンコーディング

```
$ iconv -f iso2022jp -t utf8
```
読めるようになったので中の問題を解く
**iconvコマンドについて**

|  短縮オプション  | 長いオプション | 意味 |
|:-------------:|:-------------:|:---:|
| -f  | --from-code=コード  | 入力のエンコーディング  |
| -t  | --to-code=コード  | 出力のエンコーディング  |
| -c  |   | 変換できなかった文字を出力しない  |
| -s  | --silent  | 変換できなかった場合にエラーメッセージ表示しない  |
|   | --verbose  | 処理中のメッセージを表示する  |
| -o  | --output=ファイル  | 保存先のファイル  |
| -l  | --list  | 対応しているコードを表示する  |
参考にしたのは以下
https://atmarkit.itmedia.co.jp/ait/articles/1609/12/news019.html