OmniAICreator/Qiita-1.07M huggingface dataset:
正しい言葉で伝えよう

# 言葉足らずで起こるコミュニケーションエラーを少なくしたい
[yuki](https://twitter.com/yuki82511988)と申します。高校の国語科の教員からWEBエンジニアになって、そろそろ1年になります。

本記事は、これまでのエンジニア生活の中で感じた**「言葉足らず」**が引き起こすトラブルを挙げ、お互いそれを気をつけていきましょうという気持ちを伝えたいと思い、執筆しました。

よろしくお願いします。

先に結論を書きます。

<img width="200px" alt="トイレに座っている先生" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/557847/2f0ce522-dc6b-1b5d-4c13-26db68fd4884.png">

**「先生トイレ！」**みたいな言い方をしないようにしましょう。

## コミュニケーションエラーが起こりやすい言い方・伝え方の事例
リモートワークも増え、エンジニア同士で仕事をする際に、文字で相手に情報を伝える必要が増えてきました。

ZoomやGoole meetを使用している方々も当然いらっしゃいますが、オフィスで声をかけるよりも、Slackなどで「テキスト」を送る機会が増えていると思います。

### 事例と対策
本章では、これまで自分が経験した「それって伝わりにくいよな…」というテキストでのやり取りの例を挙げてみたいと思います。
また、その対策を記すことでお互いに気を付けていくきっかけに出来ればと思います。

#### エラーが出た時
```
今、エラーが出て困っています。どうすればいいでしょうか？
```
これだけだと、聞かれた方は状況を把握するために色々なことを聞かなければなりません。

- 何がしたかったのか
- 何をしたのか
- どういう結果になったのか
- エラーメッセージはなんと出ているか
- 自分でどうやってみて、参考にしたURLはあるか

ちょっとしたエラーの質問ならともかく、しっかりと答えて欲しい場合は、こちらもしっかりと情報を用意してあげましょう。
相手へのマナーでもあると思います。


#### 何かを追加した時
```
項目の追加をしておきました！
```
何かしらの追加の作業を行った時のことです。
相手が伝えたい内容は、DBのあるテーブルに、特定のカラムを追加したということでした。

プログラミングの作業では、関数を作ってクラスに追加したり、プロパティを追加したり、上記のようにカラムを追加したりといった作業が多種存在します。

ここで、抽象的な言葉**「項目」**というものを使うと、何のことを指すのかわからないです。

`「AAAというDB」に「BBBB」というカラムを「CCCC」のために追加しました。`

このように、背景とともに、どこに追加したのか、何を追加したのか具体名で伝えてあげるだけで全然違うと思います。

とはいえ、専門用語すぎると逆に相手がわからない場合もあると思います。
難しい言葉を使う場合は相手が理解していることを確認するか、説明をしてから使ってあげれば解決できるでしょう。

#### 考えを伝えたい時
```
それは、〜だと思いました。
```

語尾に関してです。ある現象を再現しようとして、それがうまくいかなかった時のやりとりでした。
あらゆる事実を元に、その現象を再現しようとしていますので、ここでの情報のやり取りは非常に重要です。

やりとりをしているうちに、お相手の方は以下の情報を混ぜて話していることに気づきました。

- それはあなたの感想なのか
- それはあなたの、何かに基づく推測なのか
- それは事実なのか

ここを混同してしまうと、意図せず誤った情報を相手に伝えてしまうことになります。

特に**「それは事実なのか」**に関しては注意してほしいと思います。

---
例えば

`リクエストを送信したのですが、ページが遷移しませんでした。`

という事実（？）が後輩から伝えられたとします。
実際にあなたが再現してみたら、実はボタンをクリックした時になんらかの原因で押下されず、ログにはリクエストが表示されていなかったなんてこともあるでしょう。

これは、**事実だと思っていたら推測だった**パターンです。
相手に事実を伝えるときは特に、「本当にそれは事実か？自分の勘違いなのではないか？」と疑ってほしいと思います。

---

### 少し前のタイミングを示したい時
```
さっきのところに入れておいてください。
さっきのファイルを直しておいてね。...etc
```
つい少し前の時間や、作業していた場所を示す際に「さっき」という副詞を使うことがあります。
私はこの言葉を、非常に危険だと思っています。

あなたと私が想像する「さっき」は本当に同じ長さを示すでしょうか。

出来れば言葉を省略せずに、`さっき作業をしていたhogehogeというディレクトリに`とか、`さっき私がconsole.logを書いた時に`というように具体的な場所と時間を指定してあげてもいいと思います。

## 結論
これまでの学びをまとめて、締めくくります。

```javascript:ketsuron.js
1.  めんどくさがらずに状況や背景をちゃんと説明する

2.  抽象的な言葉を使わない // しかし、専門用語を使う場合は相手に伝わるかを考える

3.  事実推測感想を混ぜない

4.  曖昧な時間軸や場所を示す言葉を使わない // 「さっき」など
```

私は、これらのことが起きる主な原因は、**めんどくさがって早く伝えようとした結果、多分これで伝わるだろう**という相手への気遣いが欠けることだと考えています。

しかし、正直なところ自分もやりがちです。昨今の状況のせいだけではありませんが、文字で全部書くって大変ですよね。それでも、コミュニケーションエラーが起こるとストレスも溜まりますし、逆にお互いの理解に時間がかかって大変だと思うので、一緒に気をつけていきましょう！🙇‍♂️

#### 最後に
最後に、ここまで読んでくださる方はきっと大丈夫だと思いますが、一応記載しておきます。

それは、必ずしもこんなことを全部守っていると**窮屈に感じてしまうこと**です。言葉を使ったコミュニケーションには、ほとんどの場合相手が存在しています。

一番大切なのは、相手を思いやって言葉を選んでいくことだと思いますので、このルールに縛られすぎず、密なコミュニケーションをとっていくのが良いと思います。私も気を付けます。
【Rails】カラム名の変更方法

#はじめに
Railsでサービス開発中、カラム名を間違えてしまったので
カラムの変更方法を備忘録としてまとめておきます。

Rails：5.2.5

| モデル名 | 変更前のカラム名 | 変更後のカラム名 |
|:--:|:--:|:--:|
| user | profile_image | profile_image_id |

#1.migrationファイルを作成する
カラム名を変更するために、migrationファイルを作成する。

```
$ rails g migrate rename_[変更前のカラム名]_column_to_[モデル名(複数形)]
```

今回の場合だと、以下のようになる。

```
$ rails g migrate rename_profile_image_column_to_users
```

#2.migrationファイルを編集する
生成されたファイルにchangeメソッドを追加し、変更したいカラム名を記述する。
```rename_column :テーブル名, :変更前のカラム名, :変更後のカラム名```

```Ruby:db/migrate/20210425060907_rename_profile_image_column_to_users
def change
  rename_column :users, :profile_image, :profile_image_id
end
```

#3.DBに反映する
下記コマンドを実行。

```
$ rails db:migrate
```

#4.カラム名が変更されているか確認
rails cでカラム名を確認する。
```モデル名.column_names```

```
$ rails c
```

```
$ User.column_names
```
Laravel+vueでなんか作る(Laravel基礎⑤ ～リレーションシップ編～)

当記事はUdemyの講座、[Vue 3 and Laravel: A Practical Guide with Docker](https://www.udemy.com/course/vue-laravel-admin/)を進めるにあたり、理解を深めるために記された備忘録です。

今回はOne to many、およびMany to manyリレーションシップの作成についてまとめます。

#One to many
例として、Orderが複数のOrderItemを持つ状況を想定しよう。

###マイグレーション
OrderItem(many)側がOrder(one)を参照するためのキーを持つことに注目。
``order_item``キーがそれにあたり、``$this->foreign()``メソッドで``order_item``が外部キーである旨を指示している。

```php:create_order_items_table
Schema::create('order_items', function (Blueprint $table) {
            $table->id();
            $table->unsignedBigInteger("order_id");
            $table->foreign("order_id")->references("id")->on("orders");
            $table->string("product_title");
            $table->decimal("price");
            $table->unsignedBigInteger("quantity");
            $table->timestamps();
        });
```
``$this->foreign``メソッドの使い方は以下のような感じ。

```php
$this->foreign("どれが外部キーか")
->references("主テーブルのどのキーを参照しているか")
->on("どれが主テーブルか");
```

###モデル
hasManyやbelongsToを使って関連テーブルを呼び出せます。

```php:Order
    public function orderItems(){
        return $this->hasMany(OrderItem::class);
    }
//主テーブルから従テーブルを呼び出す
```

```php:OrderItem
    public function order(){
        return $this->belongsTo(Order::class);
    }
//従テーブルから主テーブルを呼び出す
```

###ネストシーディング
「ひとつの主テーブルが、かならず一つ以上の従テーブルを持つ」
シーディングをしたい場合、ちょっとした工夫がいる。

```php:ModelSeeder
Order::factory(30)->create()
//Orderの配列(30個)を作っている
        ->each(function(Order $order){
//ひとつひとつのOrderをeachで取り出す
            OrderItem::factory(random_int(1,5))->create([
//Orderひとつごとに、1～5個のOrderItemを作る
                "order_id"=>$order->id
//作ったOrderItemのorder_idを、eachで取り出した各Orderのidにする
            ]);
        });
```

#Many to many
例として、roleとpermissionが互いにmany to manyの関係を持つものとする。
この場合は、RoleとPermissionの双方に対して従の立場にあるテーブル（これを中間テーブルと言う）、role_permissionsテーブルを作ることで対応する。

###マイグレーション
role_permissionsテーブルは、RoleとPermissionの双方のidを外侮キーとして参照する。

```php:create_role_permissions
Schema::create('role_permissions', function (Blueprint $table) {
            $table->id();
            $table->unsignedBigInteger("role_id");
            $table->unsignedBigInteger("permission_id");
            $table->foreign('role_id')->references('id')->on('roles')->onDelete('CASCADE');
            $table->foreign('permission_id')->references('id')->on('permissions')->onDelete('CASCADE');
        });
```

###モデル
many to manyリレーションシップの場合、双方のモデルにbelongsToManyを設定する。またこの場合は介する中間テーブルの名前を第二引数として指定する必要がある。

```php:Role
    public function permissions(){
        return $this->belongsToMany(Permission::class,"role_permissions");
    }
```

```php:Permission
    public function roles(){
        return $this->belongsToMany(Role::class,"role_permissions");
    }
```
なお、中間テーブルに関してはモデルの作成は任意となる。
（今回はやらない）


###シーディング
many to manyのシーディング方法、色々ありそうなので別記事でまとめていきたい……。
docker-composeでサービス運用しているなら設定しておきたいログローテート

# ことの始まり
社内で使用しているサービスにいくらリクエストを送っても返事がなくなったので調査。

# 原因
サーバーがdiskfull状態だったことでファイルの書き込み処理が行えず、ほぼほぼ何もできなくなっていたことが原因。
なぜ、そんなに容量が圧迫されてしまったのか調べたところdockerのログが膨れ上がって容量を圧迫していた。

# 対策
docker-composeを使用してサービスを運用しているケースだったので、コンテナごとにログファイルの上限サイズと保持するファイル数を設定した。
docker-compose.ymlに以下のように書くことで上限サイズとファイル数を設定できるみたい。

```yaml:docker-compose.yml
version: '2'
services:
  web:
    build: .
    ports:
     - "5000:5000"
    volumes:
     - .:/code
    logging: # ログ記録の設定
      driver: "json-file" # ロギングドライバの指定
      options:
        max-size: "1k" # 上限サイズを1KBに設定
        max-file: "2" # ファイル数は２まで
```

上記の設定で、webコンテナから吐き出されるlogファイルは1KBに到達するとロールオーバー（別ファイルに繰り出）されます。
実際に吐かれたログを見てみると、確かに1KB程で `コンテナID-json.log.1` とロールオーバーされたものが出来ています。

```bash
# docker for macだと、このpathにログファイルは存在しません。（hyperkit vm上で動いているため）
/var/lib/docker/containers/8918bd3a1b22eb04f9538ca8df869ef1588f27aefffad37efe4c09d1bd079ab8 # ls -la
total 48
（略
-rw-r-----    1 root     root           424 Apr 28 02:51 8918bd3a1b22eb04f9538ca8df869ef1588f27aefffad37efe4c09d1bd079ab8-json.log
-rw-r-----    1 root     root          1020 Apr 28 02:51 8918bd3a1b22eb04f9538ca8df869ef1588f27aefffad37efe4c09d1bd079ab8-json.log.1
（略
```
これで、次のロールオーバーが発生すると `max-file` が2になっているため、 `コンテナID-json.log.1` のものが削除されて今まで  `コンテナID-json.log` だったものが　`コンテナID-json.log.1` となります。
このように、ロールオーバーする設定にすると、 `docker-compose logs コンテナ名`で表示されるログは `コンテナID-json.log`のみになるので、前のものを確認したいときは直接見に行ってください。

ログの設定についてもっとしたい場合は、 [公式ドキュメント](https://docs.docker.jp/compose/compose-file.html#logging)を確認してください。
また、オプションにどんなものが使えるか知りたい場合は、[こちら](https://docs.docker.jp/engine/reference/logging/overview.html)を見てみてください。

# 設定できたか確認
しっかり設定できた確認したい場合は以下のコマンドで確認することができます。

```bash
docker inspect コンテナID | grep LogConfig -A 5
            "LogConfig": {
                "Type": "json-file",
                "Config": {
                    "max-file": "2",
                    "max-size": "1k"
                }
```

## おまけ
docker for macでローテートされたログを見に行きたい場合は、特権コンテナに入って `var/lib/docker/containers/コンテナID/` を見に行くと見れます。
特権コンテナの入り方は以下のような感じです。

```bash 
docker run -it --rm --privileged --pid=host justincormack/nsenter1
```

# 終わりに
ログローテートの設定をせずにdockerを使ってサービスを運用していると、肥大し続けるlogファイルに障害を起こされます。
時限爆弾みたいなものなので、設定してなければ早めに対処することをお勧めします。

## 参考資料
- [Compose ファイル・リファレンス#logging](https://docs.docker.jp/compose/compose-file.html#logging)
- [ロギング・ドライバの設定](https://docs.docker.jp/engine/reference/logging/overview.html)
- [Docker Desktop for MacのHyperKit VMに入る](https://uzimihsr.github.io/post/2020-12-15-docker-desktop-for-mac-hyperkit-vm/)
【heroku】設定した環境変数が本番環境で反映されない

# はじめに
クレジット決済機能を用いた実装をした際に、ローカル環境での動作は問題なかったものの、本番環境（heroku）でエラーが出てしまったので、その時に行った解決までの手順を記事にしたいと思います。

## エラーログの確認
まずは原因を探るためエラーログを確認しました。

```:ターミナル
% heroku logs --tail --app アプリ名
```

実行し、エラーログを読んでいくと気になる表示が…

```:ターミナル
〜省略〜
2021-04-29T05:23:03.659101+00:00 app[web.1]: [a5daeeac-209a-40b8-93b4-661fcec9677c] Payjp::AuthenticationError (Your API key is invalid, as it contains whitespace. (HINT: You can double-check your API key from the Payjp web interface. See https://pay.jp/api for details, or email support@pay.jp if you have any questions.)):
〜省略〜
```
ここからPAY.JPの環境変数の設定がうまくいっていないと仮説を立てました。

## 環境変数を確認

```:ターミナル
% heroku config
```
実行すると

```:ターミナル
=== アプリ名 Config Vars
〜省略〜
PAYJP_PUBLIC_KEY:         
pk_test_*************
PAYJP_SECRET_KEY:         
sk_test_*************
〜省略〜
```
PAYJP_PUBLIC_KEY:、PAYJP_SECRET_KEY:の後に改行が入ってしまっています。
これが原因みたいです。

## 対処法
環境変数を設定し直します。
コピペの際に余計な改行が入らないように注意しながら以下のコマンドを実行します。

```:ターミナル
% heroku config:set PAYJP_SECRET_KEY='sk_test_*************'
% heroku config:set PAYJP_PUBLIC_KEY='pk_test_*************'
```

正しく設定できているか確認します。

```:ターミナル
% heroku config
```

ここで改行が消えていることが確認できたら空のコミットを生成します。

```:ターミナル
% git commit --allow-empty -m "空のコミット"
```

最後にherokuへプッシュします。

```:ターミナル
% git push heroku master
```

もう一度動作を確認し、エラーが出なくなったことを確認しました。
テレ〇限定・今日のドラマ再放送は何やるの？LineBotを作ろうと思う

先日、LineBotの作り方を学びましたので、さっそく何か作ってみたくなりました。

妄想の結果、
**テレ〇限定・今日のドラマ再放送は何やるの？LineBot（自己満足型）**
がいいかなと。

すっかりテレワークが多くなりまして、平日の14時～17時のスーパー再放送タイム（テレ〇）がいつも気になるのです（これは大きな声で言えませんね）

#LineBotで実現したいこと
LineBotに今日の番組は何？と聞くと、再放送ゴールデンタイムの番組ラインナップを返してくれるという簡単なものにしようと思います。
イメージはこんな
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/365273/917d9f3d-98a3-e32d-9e7a-0c13daa6ad9e.png)

#必要な機能
おそらくこんな感じになろうかと思います。

1. 番組の情報をどうにかして取得する機能
1. 必要な情報だけに絞り込む機能
1. LineBotの機能
1. 会話になるようにやり取りする機能


#番組の情報をどうにかして取得する
今回、LineBotを学ぶとともにWEBAPIの有用性についても教えてもらいましたのでTV番組の情報もWEBAPIでサクッととりたいところです。
しかしながら、自分の調査の結果においては各TV局からWEBAPIは提供されていないようでした。残念。
　ちなみに、NHKはWEBAPIを提供していました。[https://api-portal.nhk.or.jp/](https://api-portal.nhk.or.jp/)
ちょっと遠回りになりますが、スクレイピングして番組情報を取得することにしようと思います。
Node.js用のスクレイピングモジュール（cheerio-httpcli）が公開されていましたので、こちらの素敵なモジュールを利用させていただくことにします。
[https://qiita.com/ktty1220/items/e9e42247ede476d04ce2](https://qiita.com/ktty1220/items/e9e42247ede476d04ce2)

さてさて、うまく情報を引っ張ってこれるでしょうか・・・
楽しみだなー　俺専用LineBot！

今日は方針検討と調べ物で終了です。
[SQL SERVER + Laravel] IDENTIFY 設定したテーブルにIDを含むデータをInsertする


SQL Server で Identify 設定がしてあるテーブルにIDを含むInsert文を発行したところ、下記のエラーが発生。

```
SQLSTATE[23000]: [Microsoft][ODBC Driver 17 for SQL Server][SQL Server]IDENTITY_INSERT が OFF に設定されているときは、テーブル 'tableName' の ID 列に明示的な値を挿入できません。
```

Identifyが設定してある場合は任意のIDで登録できないんですね。というわけで、SET IDENTITY_INSERT 文を発行して一時的に設定を解除したのちに登録することにしました。

ややこしい（？）ポイントとしては、ON で identify を無効化、 OFF で有効化です。


#### 構文

```
SET IDENTITY_INSERT [ [ database_name . ] schema_name . ] table_name { ON | OFF }  
```



#### コードサンプル（Laravel）
プロジェクトがLaravelを使っていたので Laravel のコードになりますが、下記サンプルになります。

```php
use DB;

$tableName = 'test_table';

// IDを任意の値で設定したいので Identify 設定を解除
DB::unprepared("SET IDENTITY_INSERT {$tableName} ON;");

// ここでInsert文を発行

// 設定を戻す
DB::unprepared("SET IDENTITY_INSERT {$tableName} ON;");
```
PhoenixのcontextをActiveRecordっぽく動かせるか試す

RailsからPhoenixに来た人にはActiveRecordというとてつもないORMの経験が染み付いていると思います。
`rails g scaffold ~~~`なんかすると基本的なことは概ね出来上がった状態でモデルが生成されちゃいます。
ElixirのORMとしてはEctoがとても有名ですがPhoenixのコマンドでできたファイルにはCRUDのコードがハードコードされた状態で生成されます。
前から気になってたのですが雨で暇なのでActiveRecordっぽい感じに共通の実装を単一のモジュールから呼び出せないかやってみました。

## useマクロとは？

Elixirにはuseマクロという他のモジュールを利用して呼び出し元のモジュールの定義を変更する方法が提供されています。
モジュールの中でuse句を書いてから使いたいモジュールを書くだけです

```elixir
defmodule Hoge do
  use Fuga
end
```

useされる側のモジュールはこの時こんな感じ

```elixir
defmodule Fuga do
  defmacro __using__(_opts) do
    quote do
      # なにか書く
    end
  end
end
```

この `quote do ~ end`の中に関数を定義すればuseした側でも使うことができる


## よく使いそうなやつ関数を書いてみる

全体像

```elixir
defmodule TestApp.ActiveRecord do
  require IEx

  defmacro __using__(schema: schema) do
    quote do
      alias TestApp.Repo

      import Ecto.Query

      def all do
        unquote(schema)
        |> Repo.all()
      end

      def find(id) do
        unquote(schema)
        |> Repo.get!(id)
      end

      def find_by(conds) do
        unquote(schema)
        |> Repo.get_by(conds)
      end

      def where(conds) do
        from(unquote(schema), where: ^conds)
        |> Repo.all()
      end

      def insert(attr) do
        %unquote(schema){}
        |> unquote(schema).changeset(attr)
        |> Repo.insert()
      end

      def insert!(attr) do
        %unquote(schema){}
        |> unquote(schema).changeset(attr)
        |> Repo.insert!()
      end

      def insert_all(maps, opts \\ []) do
        now = DateTime.utc_now() |> NaiveDateTime.truncate(:second)

        changesets =
          maps
          |> Enum.map(fn map -> Map.merge(%{inserted_at: now, updated_at: now}, map) end)

        Repo.insert_all(unquote(schema), changesets, opts)
      end

      def update(account, attr) do
        account
        |> unquote(schema).changeset(attr)
        |> Repo.update()
      end

      def update!(account, attr) do
        account
        |> unquote(schema).changeset(attr)
        |> Repo.update!()
      end

      def delete(account), do: Repo.delete(account)
      def delete!(account), do: Repo.delete!(account)

      def delete_all(), do: Repo.delete_all(unquote(schema))
    end
  end
end
```

こんな感じで書いてみた
`__using__`マクロの引数で `schema: schema`としているのがポイントで呼び出し側で関連するschemaを指定してやることでActiveRecordっぽくクエリを実行することができる。

なので呼び出し元はこんな感じになる

```elixir
defmodule TestApp.User do
  use TestApp.ActiveRecord, schema: TestApp.User.Account
end
```

あとは必要に応じて追加で関数を書いたりすれば良し




##　お知らせ

個人的に使ってみた感じ結構便利だったのでhex.pmに公開しました :tada:
[hex.pm/itaco](https://hex.pm/packages/itaco)
とりあえず個人用で公開したのでドキュメントとかはこれからなんですがよかったらお使いください。
JuliaでPyPlot使おうとしたらMKLがどうとかエラーした

## エラーの内容
JuliaでPyPlotを使おうと，using PyPlotってやるとカーネルが落ちる（Macで起動したJupyte lab上で）。

```
INTEL MKL ERROR: dlopen(/Users/travis/.julia/conda/3/lib/libmkl_intel_thread.dylib, 9): Library not loaded: @rpath/libiomp5.dylib

  Referenced from: /Users/travis/.julia/conda/3/lib/libmkl_intel_thread.dylib

  Reason: image not found.

Intel MKL FATAL ERROR: Cannot load libmkl_intel_thread.dylib.
```

エラーメッセージは上みたいな感じ。ネットから拾ってきたから，ホームの名前が若干が違うが，内容的には同じ。

## 現状の対応
これが正解かよくわからないが，とりあえず，以下の対応で直った気がする。

__Juliaが使っているcondaでmklのバージョンを2019.4にする。__

```
$ $HOME/.julia/conda/3/bin/conda install mkl==2019.4
```

mklのバージョンが2021になっていると，エラーが出ていた様子。少し古いバージョンに戻すとエラーがとりあえず，出なくなった。

## とりあえずやったこと

### Juliaの再インストール
homebrewから再度インストールが効果なし。

### .juliaディレクトリを消して，PyPlotを入れ直す
ホームのなかにある.juliaディレクトリを削除してから，PyPlotのライブラリをadd。

PyPlotを最初にusing PyPlotするときにはエラーがでないが，REPLを一旦終わって，再度using PyPlotしようとするとエラーした。よくわからない。

### Pyenvの環境を消して，再インストール。Python環境を作り直した。
Pythonの環境はシステム上で設定（Pyenvで設定）したPythonが使われていると思っていたので，入れ直してみた。Julia内で独自にCondaを使っているので，関係なかった。

JuliaのENV["PYTHON"]で設定するPATHがJuliaが独自につかうPythonのPATH設定だったことを学んだ。

### .condaディレクトリを削除してから，PyPlotを入れ直す
これも関係ない。

### LD_LIBRARY_PATHにJulia内で使うCondaのライブラリのPATHを追加
最初のエラーを検索すると，結構出てくる。Julia関係なしのPythonだけの話だといっぱい出てくる。
検索した中にこんな情報があった。
https://github.com/JuliaPy/Conda.jl/issues/182#issuecomment-813023645

ライブラリがないというなら，PATHを通す。

```
export LD_LIBRARY_PATH=$LD_LIBRARY_PATH:$HOME/.julia/conda/3/lib
```

実際これをやってから，Juliaを起動するとエラーがでなくなった。

ただ，Jupyter labを起動して，using PyPlotってやるとエラーがでる。Jupyter labはターミナルのPATH設定を反映してくれるわけではないんだなということを学んだ。

で，ほぼ同じ環境でエラーが出ないMacBook Airの設定を見ていて，mklのバージョンが違うことを発見して，mklのバージョン変更して，今に至る。
Goで作った共有ライブラリはどのへんでGCとかランタイム初期化しているか

こんにちは駆け出しエンジニアです！！！Go初心者なんでここが気になり調べました！！！！！！！！！

```console
$ go version
go version go1.14 linux/amd64
$ go build -buildmode=c-shared -ldflags=-w -o hello.so hello.go
$ LANG=C readelf -Wx .init_array hello.so

Hex dump of section '.init_array':
  0x00317068 f0930600 00000000 80680c00 00000000 .........h......

$ nm hello.so| grep 000c6880
00000000000c6880 t _rt0_amd64_linux_lib
```

ソースもみる。手元のバージョンがちょっと古いけど全体的なロジックは変わらないだろう。たぶん。おそらく。

[src/runtime/rt0_linux_amd64.s](https://github.com/golang/go/blob/2ebe77a2fda1ee9ff6fd9a3e08933ad1ebaea039/src/runtime/rt0_linux_amd64.s#L10) をみると

```go
TEXT _rt0_amd64_linux_lib(SB),NOSPLIT,$0
	JMP	_rt0_amd64_lib(SB)
```

で [src/runtime/asm_amd64.s](https://github.com/golang/go/blob/142151697397235ba5f30a7a660ed8a159adce0b/src/runtime/asm_amd64.s#L32) を読むとこのへんから初期化がはじまっていることがわかる。

```go
// _rt0_amd64_lib is common startup code for most amd64 systems when
// using -buildmode=c-archive or -buildmode=c-shared. The linker will
// arrange to invoke this function as a global constructor (for
// c-archive) or when the shared library is loaded (for c-shared).
// We expect argc and argv to be passed in the usual C ABI registers
// DI and SI.
TEXT _rt0_amd64_lib(SB),NOSPLIT,$0
	// Transition from C ABI to Go ABI.
	PUSH_REGS_HOST_TO_ABI0()

	MOVQ	DI, _rt0_amd64_lib_argc<>(SB)
	MOVQ	SI, _rt0_amd64_lib_argv<>(SB)

	// Synchronous initialization.
	CALL	runtime·libpreinit(SB)

	// Create a new thread to finish Go runtime initialization.
	MOVQ	_cgo_sys_thread_create(SB), AX
	TESTQ	AX, AX
	JZ	nocgo

	// We're calling back to C.
	// Align stack per ELF ABI requirements.
	MOVQ	SP, BX  // Callee-save in C ABI
	ANDQ	$~15, SP
	MOVQ	$_rt0_amd64_lib_go(SB), DI
	MOVQ	$0, SI
	CALL	AX
	MOVQ	BX, SP
	JMP	restore
```

いかがでしたか？
VSCodeでCMakeのログが文字化けする

# 問題

Visual Studio 2019を更新した後、VSCodeでcmake-tools＆CMake&Visual C++でビルドしたところ、いきなり文字化けするようになりました。

```console
[build] cl : �R�}���h ���C�� warning D9025 : '/W3' ��� '/W4' ���D�悳��܂��B
```

Visual Studio側の問題かと思い調べたのですが、どうやらCMakeがUTF8を仮定している一方で、Visual C++の出力はシステムの規定のコードページ（私の場合はShift-JISでした）に従うことが理由のようです。
microsoft/vscode-cmake-tools: [output message is garbled #153](https://github.com/microsoft/vscode-cmake-tools/issues/153)

なぜ更新前に問題が起きなかったんだ…

# 解決方法

VSCodeの設定ファイルでエンコーディングを指定します。

```json:settings.json
{
    "cmake.outputLogEncoding": "shift-jis"
}
```

すると文字化けが治ります。

```console
[build] cl : コマンド ライン warning D9025 : '/W3' より '/W4' が優先されます。
```
1コンテナでcronとジョブを実行する【バグ：cronが実行されない】

#目次
[1.本記事の目的](#1-本記事の目的)
[2.修正前](#2-修正前)
[3.試したこと](#3-試したこと)
[4.解決](#4-解決)


#1. 本記事の目的

書籍のチュートリアルで、

* 'Hello'とログファイルに標準出力するジョブ
* 1分周期でジョブを実行する[cron](kagoya.jp/howto/rentalserver/cron/)

を、１つのコンテナで動かす実装を行った。

イメージを実行すると、１分経過するごとに 'Hello'とログが出力される想定だったが、当初エラーは出力されず、ログも出力されない結果となった。

原因はcronの構文誤りだった。
この問題を解決するまでに試したことや、その結果について記載する。

※ この記事では、MacOS Big Sur バージョン11.2.3を使用しています。

書籍

https://gihyo.jp/book/2018/978-4-297-10033-9


#2. 修正前
修正前のディレクトリ構成、ファイルの内容は以下の通り。

【ディレクトリ構成】
 cronjob/
　├ cron-example/
　├ Dockerfile/
　└ task.sh/

【Dockerfile】

```dockerfile

FROM ubuntu:16.04  
# ubuntu:16.04 のイメージを利用する。イメージはDockerHubにある。
# ubuntuはLinuxディストリビューションの1つ。

RUN apt update
# ubuntuのパッケージマネージャaptを更新する。

RUN apt install -y cron
# aptで、cronをインストールする。

COPY task.sh /usr/local/bin/
COPY cron-example /etc/cron.d/
# 各ファイルをコピーし、コンテナに追加する（右側はコンテナ内のパス）。

RUN chmod 0644 /etc/cron.d/cron-example
# パーミッションを設定する

CMD ["cron","-f"]
# cronはバックグラウンドで動き続けるため、CMDとして実行すると、すぐに終了してしまう。
# このため、フォアグラウンドで実行させる（-fコマンド）。
```


【task.sh】

```javascript
#!/bin/sh

echo "[`date`]Hello!" >> /var/log/cron.log
```

> コマンド >> ファイル	
Linuxのリダイレクト
コマンドの出力結果をファイルへ追記

参考：[５分で一通り理解できる！Linuxのリダイレクト 使い方と種類まとめ](https://eng-entrance.com/linux-redirect)

【cron-example】
task.shのジョブを毎分実行する

```
***** root sh /usr/local/bin/task.sh
```


【dockerコマンド】
ここではdockerコマンドを使用する。

```
イメージのビルド
docker image build -t example/cronjob:latest .

イメージの実行
docker container run -d --rm --name cronjob example/cronjob:latest

logファイル実行
docker container exec -it cronjob tail -f /var/log/cron.log
```

#3. 試したこと

#### task.shは実行できるか
コンテナ内部に入り、shコマンドでtask.shを実行後、ログファイルに出力されるか確認する。

```
コンテナ内部に入る
docker exec -i -t コンテナ名 bash

task.shを実行する
sh /usr/local/bin/task.sh

ログファイルを確認する
cat /var/log/cron.log
```

#### cronの実行権限はあるか
コンテナ内で、cron-exampleがあるフォルダに移動し、0644の権限を確認する。

```
フォルダ移動
cd etc/cron.d

中身確認
ls 
> cron-example

権限確認
ll
> -rw-r--r-- 1 root root  37 Apr 29 00:12 cron-example
```



https://qiita.com/shisama/items/5f4c4fa768642aad9e06

>  最初の１文字目はファイル種別を表しています。
2文字目から4文字目はファイルの所有者に対する権限を表し、
5文字目から7文字目はファイルの所有グループに対する権限を表し、
8文字目から10文字目はその他に対する権限を表しています


最初の1文字目 : -　ファイル
2~4 : rw-　6
5~7 : r--　4
8~10 : r--　4

権限は合っている。

#### crondが起動しているか

```
起動確認
service cron status
> * cron is running
```
起動している。

https://qiita.com/katsukii/items/d5f90a6e4592d1414f99

#4. 解決
原因：cronの構文誤り

cronで1分周期を設定する場合、以下のように記載する。

```
*/1 * * * * root sh /usr/local/bin/task.sh
```

cron-exampleの修正を行い、イメージのビルド、コンテナの作成と実行を行った。
動作確認をしたところ、期待通りだった。

> 期待する動作は、イメージを実行すると、１分経過するごとに 'Hello'とログが出力されること。

実行結果
[Thu Apr 29 02:38:01 UTC 2021]Hello!
[Thu Apr 29 02:39:01 UTC 2021]Hello!
gitのrebert方法


コードレビューがあったのでコードレビューを書いていましたが、間違えて出してしまったのでもう一度描き直そうとするとmergeしてしまった。

これわいけないと思い再度コミットしてプッシュしましたが、revertしてくださいと怒られました。
で、わからないのでここで備忘録とします。

１、間違った最後のところまで戻ります。
-

今回はmergeまで

![20210429-154628.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/960935/56fe8c26-0451-6772-0708-c23175bfd32e.png)

２、masterで次に間違った箇所を右クリックして「Revert Changes in Commit」まで戻す
-

![20210429-154533.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/960935/d57073af-b58f-c8a1-dcd3-738a90cfc2c7.png)

ここで新しく記入したことをなかったこととします。
![20210429-160007.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/960935/835d4160-0938-ccb5-8e93-dabd6911b4e1.png)

３。プッシュします。

４、新しくレビューしてもらうbrabchをきる
-

５、新しくきったBranchで右クリックして「Revert Changes in Commit」まで戻す
-

![20210429-160207.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/960935/78279371-08b5-c752-040a-89fabeaf2cc1.png)

なかったことにしたコードを再度復活させます。

５.これでプシュして、コードレビューを出します。
Gitの初期設定時にmasterからmainへbranch名を変更できない場合の対処法

超絶初心者です。

#masterからmainへ変更する際のエラー
git initコマンドを実行後、git branch -M mainを行うとエラー。


```
/work/project$ git init
/work/project$ git branch -M main
error: refname refs/heads/master not found
fatal: Branch rename failed
```


REDEME.mdファイルを作成後、addとcommitを行った後に再度実行すると成功。

```
/work/project$ echo "# project" >> README.md
/work/project$ git add README.md
/work/project$ git commit -m "first commit"
/work/project$ git branch -M main
```

成功後に確認すると、refs/heads/にmainファイルが作成されていた。
失敗した段階ではrefs/heads/にはmasterファイルがなかった。
恐らく、addまたはcommitを実行した際にmasterファイルが作成され、そのためmasterからmainへのbranch名の書き換えが成功したっぽい。
CSS　での指定の仕方をメモ


# はじめに
こんにちは、@takashi_sakamotoです。
Webの仕組みとしてHTML、CSS、JavaScriptなど関連について、学んだことをメモしていきたいと思います。

## CSSとは
CSS（Cascading Style Sheets、カスケーディング・スタイル・シート）の意味で、カスケーディングとは、小さく連なった滝という意味らしいです。

HTMLと一緒に使われ、HTMLがWebの構造を記載しているのに対して、CSSは構造要素のスタイルを指定するものです。Webページをいろいろ装飾するようなもんですかね。

## CSSの構成
セレクタ (selector)、宣言 (declaration)、プロパティ (property)、プロパティ値 (property value)で構成されています。

セレクタでどこにスタイルをあてるのか、指定することができます。

|セレクタ名|何を選択するか|例|
|-|-|-|
| 要素セレクタ (時々タグまたは型セレクタと呼ばれます) | 指定された型のすべての HTML 要素 | 	p < p > を選択 |
| ID セレクタ | ページ上の指定された ID を持つ要素。| 特定のHTMLページでは、1つのIDにつき1つの要素（そしてもちろん1つの要素につき1つのID）しか許されません。|
| クラスセレクタ | 指定されたクラスを持つページの要素 (複数のクラスインスタンスがページに表示されます) | .my-class < p class="my-class" > 及び < a class="my-class" > を選択属性セレクタ指定された属性を持つページ上の要素img[src] < img src="myimage.png" > を選択するが、< img > は選択しない |
| 擬似クラスセレクタ | 指定された要素が指定された状態にあるとき。例えば、マウスポインターが上に乗っている (ホバー) 状態。	 | a:hover < a > を選択するが、マウスポインターがリンク上にあるときのみ。 |
`[CSS の基本]より`

## まとめ
* CSSはHTMLと一緒に使い、スタイルを色々変えたい時に使用する
* セレクタのの指定でスタイルを当てたい箇所に当てて行く

###関連記事
 - どのようにスタイルを変えて行くかの種類を調べたい時[スタイルシートリファレンス](http://www.htmq.com/style/)
 - どのようなスタイルがあるか確認[CSS の基本](https://developer.mozilla.org/ja/docs/Learn/Getting_started_with_the_web/CSS_basics)
Javaの変数・データ型についてのまとめ

Javaでよく使われる変数についてまとめた個人的なメモです。
Javaでは、基本的に `型 + 変数名` で変数を定義します。

## 文字... char
一文字だけの文字を扱う場合は、`char`を使います。

```MyApp.java
char a = 'a';
char b = '花';
```

charを用いる時は変数の値をシングルクオーテーション `''` で囲わなければならない点に注意が必要です。

## 文字列... String

```MyApp.java
String message = "Hello World!";
```

String変数に代入する値はダブルクオーテーション `""` で囲います。
また、特殊文字として`\n`の改行や、`\t`でタブを使う事が可能です。

```MyApp.java
String message = "Hello\nWorld\t!";
```

バックスラッシュ`\`は、Macの場合`option + ¥`を押すことで入力できます。

## 整数... byte / short / int / long

|データ型|値|
|-|-|
|byte|8ビット整数 -128～127|
|short|16ビット整数 -32,768～32,767|
|int|32ビット整数 -2,147,483,648～2,147,483,647|
|long|64ビット整数 -9,223,372,036,854,775,808～9,223,372,036,854,775,807|

通常は `int 型` がよく使われます。

```MyApp.java
int x = 10;
long y = 1234567891234L;
```

`long 型`の変数に `int 型`の範囲を超える数値を代入する場合は末尾に「L」を記述する必要があります。

## 浮動小数点数... float / double

|データ型|値|
|-|-|
|float|32ビット単精度浮動小数点数|
|double|64ビット倍精度浮動小数点数|

通常は `double 型`がよく使われます。

```MyApp.java
double d = 1234.567;
float f = 3.14F;
```

`float 型`の変数に数値を代入する場合、それぞれのデータ型の扱える範囲の数値であってもそのまま記述するとエラーとなる為、 `float 型`の値に浮動小数点数を記述する場合は末尾に「F」を付ける必要があります。

## 論理値... boolean

true もしくは false の値を格納する際に使用します。

```MyApp.java
boolean flag = true;
```

## 型を変更する（キャストする）
- `double 型`の値を`int 型`にする場合

```MyApp.java
public class MyApp {
  public static void main(String[] args) {

    double d = 5242.88;
    int x = (int)d;
    System.out.println(x);

  }
}
```

```
% javac MyApp.java
% java MyApp
5242
```

- `int 型`の値を`double 型`にする場合

```MyApp.java
public class MyApp {
  public static void main(String[] args) {

    /* 
    以下の方法だと整数の状態で計算されてしまうため、結果 2.5 ではなく 2 が返ってきてしまうため注意。
    int i = 10;
    double y = i / 4;
    System.out.println(y);
    */

    // 正しく処理するためには以下のように記述する
    int i = 10;
    double y = (double)i / 4;
    System.out.println(y);

  }
}
```

```
% javac MyApp.java
% java MyApp
2.5
```

以上になります。

【参考サイト】
- [Let'sプログラミング -基本のデータ型](https://www.javadrive.jp/start/var/index4.html)
Pythonでアルゴリズムを考える

#アルゴリズムの学習

アルゴリズムの学習中に素数を出力するプログラムを作成というものに出会った。
様々な記事にあるようにまずアルゴリズムを文字で書いてみるというのがあったので実践してみた。
私が思い付いたのは以下の通りである。

1. for文で2~10までを表示するコードを作る(2,3,4,5,6,7,8,9,10)
2. 素数を表示する式をつくる
3. if分で素数をを見つけ出す表現をする

このぐらいしか思いつかなかったが、とりあえず思い付いたものを記述した。

```python:Python
for i in range(1, 11):
    print(i)
```

ここまでしか書けなかった。

2と3を考えて素数とはなんぞやと考え、１と自分自身意外に約数を持たない自然数で、１ではない数とあったので、
コードっぽく書いてみたが、
n / 1 == 0 and n / n == 0(これしか思いつかなかった上に全然違う)
ここでギブアップして解説を漁った。

**素数**
素数に対する考え方として、例えば10のとき
・2,3,4,5,6,7,8,9,で割り算した時のあまりをチェックして、もし１つでもあまりが０となっていれば、割り切れているので、素数ではない。
・全てあまりが０でなければ、素数であると言える。
-例-
4 % 2 = 0 
4 % 3 = 1
割り切れる数字あるので素数ではない

5 % 2 = 1 
5 % 3 = 2 
5 % 4 = 3
割り切れる数字がないので素数

10 % 2 = 0
10 % 3 = 1
10 % 4 = 2
10 % 5 = 0
10 % 6 = 4
10 % 7 = 3
10 % 8 = 2
10 % 9 = 1
割り切れる数字があるので素数ではない





**解答**

```python:Python
numbers = [] # ⇦素数を出力するために空のリストを作成
for i in range(2, 11): # ⇦(2~10までの数字が順番で出てくる)
    flag = True
    for j in range(2, i): # ⇦(ここで2~9までの数字が出てくるつまり %2や%3の部分)
        if i % j == 0: # ⇦(ここで実際に 10 % 2や 10 % 3を行っている)
            flag = False

    if flag == True:
        numbers.append(i) # ⇦(ここで素数が成り立っていたら、numbersの中に素数が１個づつ加わる)
print(numbers)
```
#感想
今回は素数に対する考え方が理解できたので、解答で出てきたコードを見ても理解することができた。
アルゴリズムの問題を見ているとコード自体は難しくないのに別のところで引っかかって前に進めないことが多く感じた。(今回だと素数に対する考え方)
この方法が正しいのかわからないが少しずつパターン化してみて、１日１パターンだけでも覚えれたらいいと思った。
swiftでカウントアップのアニメーションを実装する。

# 目的とするアニメーション

![yed8e-slbce.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/861241/1d8d9c24-8114-5f05-a14e-5da70ba602be.gif)


別のクラスを作成するため、比較的キレイにコードが書けると思います。

```swift:CountAnimateLabel.swift
import UIKit

final class CountAnimateLabel: UILabel{

    var startTime: CFTimeInterval!
    var fromValue: Int!
    var toValue: Int!
    var duration: TimeInterval!

    func animate(from fromValue: Int, to toValue: Int, duration: TimeInterval) {
        text = "\(fromValue)"

        // 開始時間を保存
        self.startTime = CACurrentMediaTime()

        self.fromValue = fromValue
        self.toValue = toValue
        self.duration = duration

        // CADisplayLinkの生成
        let link = CADisplayLink(target: self, selector: #selector(updateValue))
        link.add(to: .current, forMode: .default)
    }

    // 描画タイミング毎に呼ばれるメソッド
    @objc func updateValue(link: CADisplayLink) {
        // 開始からの進捗 0.0 〜 1.0くらい
        let dt = (link.timestamp - self.startTime) / duration

        // 終了時に最後の値を入れてCADisplayLinkを破棄
        if dt >= 1.0 {
            text = "\(toValue!)"
            link.invalidate()
            return
        }

        // 最初の値に進捗に応じた値を足して現在の値を計算
        let current = Int(Double(toValue - fromValue) * dt) + fromValue
        text = "\(current)"
    }
}

```

このクラスをインスタンス化して、任意のタイミングでanimateメソッドを呼び出します。

```swift:CountAnimateLabel.swift
import UIKit

final class ShowSumViewController: UIViewController {
    
    var label: CountAnimateLabel!

    override func viewDidLoad() {
        super.viewDidLoad()
        setUpViews()
    }

    private func setUpViews() {
        
        label = CountAnimateLabel()
        let labelWidth = 200
        let labelHeight = 100
        label.frame = CGRect(x: (Int(view.frame.size.width) - labelWidth) / 2 , y: (Int(view.frame.size.height) - labelHeight) / 2, width: labelWidth, height: labelHeight)
        label.textColor = .black
        label.textAlignment = .center
        label.font = label.font.withSize(100)
        view.addSubview(label)
        
        label.animate(from: 0, to: 100, duration: 0.7)
    }

}

```
fromは開始時の数字、toは終了時の数字、durationは時間を表しているので、適宜変更してください。




# 参考

https://qiita.com/satorun/items/6e27c5a46c0fec8f701d

使わせていただきました　🐝
【ruby on rails】簡単なアプリ作成までの流れ


<h1>（１）アプリを作成するフォルダ(xxx)に移動</h1>

```ruby:ターミナル
cd ~/xxx
```

<h1>（２）アプリの型作成(アプリ名：xxx-app)</h1>

```ruby:ターミナル
rails _6.0.0_ new xxx-app -d mysql
```


<h1>（３）上記で作成したアプリのフォルダに移動</h1>

```ruby:ターミナル
cd xxx-app
```

<h1>（４）Gemfileの設定</h1>
以下のGemfileを追加

|gem一覧              |
|:------------------|
|gem 'rspec-rails'|
|gem 'factory_bot_rails'| 
|gem 'faker'| 
|gem 'rubocop', require: false| 
|gem 'rails_12factor'| 
|gem 'active_hash'| 
|gem 'rails-i18n'| 
|gem 'gimei'| 
|gem 'pry-rails'| 
|gem 'devise'| 
|gem 'mini_magick'| 
|gem 'image_processing', '~> 1.2'| 
|gem 'payjp'| 
|gem 'gon'
|gem 'simple_calendar', '~> 2.0'| 
|gem 'bootstrap', '~> 4.1.1'| 
|gem 'jquery-rails'| 

```ruby:ターミナル
bundle install
```

上記の補足（コピーしづらいので表を2つに分けました）

|gem詳細              |
|:------------------|
|単体テスト実行用(開発・運用)|
|テスト用データ作成(開発・運用)|
|ダミーデータ作成(開発・運用)|
|コーディング調節用(開発)|
|ログの保存先をHeroku用に微調整(本番)|
|モデル内でテーブル実装用|
|エラーメッセージを日本語で表示|
|ダミーデータを日本語で作成|
|デバッグ用|
|ユーザー管理機能用|
|画像加工用 imagemagickインストール済|
|画像サイズ調整用|
|payjp|
|railsからjavascriptに変数導入用|
|カレンダー導入|
|bootstrap導入(jquery使用) 容易にページレイアウト作成|
|jquery導入|



<h1>（５）エンコード変更（utf8mb4→utf8）</h1>


```ruby:config/database.yml
default: &default
  adapter: mysql2
  encoding: utf8
  pool: <%= ENV.fetch("RAILS_MAX_THREADS") { 5 } %>
  username: root
  password:
  socket: /tmp/mysql.sock
```

<h1>（６）アプリ用データベース作成</h1>

```ruby:ターミナル
rails db:create
```

<h1>（７）ユーザー管理機能追加</h1>

<h2>デバイス設定ファイルのインストール</h2>
```ruby:ターミナル
rails g devise:install
```

<h2>ユーザーモデル追加</h2>
```ruby:ターミナル
rails g devise user
```


<h2>ユーザーテーブルのカラム設定（マイグレ）</h2>
今回はnameカラムのみ追加

```ruby:db/migrate/2020××××××××××_devise_create_users.rb
class DeviseCreateUsers < ActiveRecord::Migration[6.0]
  def change
    create_table :users do |t|
      ## Database authenticatable
      t.string :name,               null: false, default: ""
      t.string :email,              null: false, default: ""
      t.string :encrypted_password, null: false, default: ""

      ## Recoverable
      t.string   :reset_password_token
      t.datetime :reset_password_sent_at

      ## Rememberable
      t.datetime :remember_created_at
```

<h2>ユーザーテーブル作成</h2>

```ruby:ターミナル
rails db:migrate
```
04/29 HTML 書き方の基本

使用教材『HTML＆CSSとWebデザインが1冊できちんと身につく本』
https://www.amazon.co.jp/HTML-CSS%E3%81%A8Web%E3%83%87%E3%82%B6%E3%82%A4%E3%83%B3%E3%81%8C-1%E5%86%8A%E3%81%A7%E3%81%8D%E3%81%A1%E3%82%93%E3%81%A8%E8%BA%AB%E3%81%AB%E3%81%A4%E3%81%8F%E6%9C%AC-%E6%9C%8D%E9%83%A8-%E9%9B%84%E6%A8%B9/dp/4774190640

進捗：Chapter3 知っておきたいHTMLのきほんと描き方

学んだこと
　  <!DOCTYPE html>
　　まず1行目に記す。HTMLのどのバージョンで作成されているかを示す。

 

```
<!DOCTYPE html>
<html>
    <head>
         <meta charset="UTF-8">
        <title>サンプルページ</title>
    </head>
    <body>
        <header>
            <div class= "logo">
                <a href="index.html">
                    <img src="images/wagtail.jpg" alt="wagtail">
                </a>
            </div>
            <nav>
                <ul class="global-nav">
                <ul>
                    <li><a href="portforio.html">Portfolio</a></li>
                    <li><a href="about.html">About</a></li>
                    <li><a href="contact.html">Contact</a></li>
                </ul>
            </nav>
        </header>
        <div id="wrap">
            <div class="contact">
            </div>
        </div>
        <footer>
            <small>こんにちは</small>
        </footer>
    </body>
</html>
```
Laravel5.5でもVue.jsっぽくReact.jsを部分的に導入する

# 背景

タイトルまんま

## 導入

```console
$ composer create-project --prefer-dist laravel/laravel react-laravel "5.5"
$ cd react-laravel
$ php artisan preset react
$ npm install && npm run dev
```

ここでコンパイルまでは行って、サンプルまで表示できる。

## LaravelからReact.jsに変数を渡す

```welcome.blade.php
.
.
.
    <body>
        <div class="flex-center position-ref full-height">
            <div id="example" title="title"></div>
        </div>

        <script src="{{ asset('js/app.js')}}"></script>
    </body>
```


```Example.js
import React from 'react';
import { render } from 'react-dom';

const Example = ({ title }) => (
    <div className="container">
        <div className="row">
            <div className="col-md-8 col-md-offset-2">
                <div className="panel panel-default">
                    <div className="panel-heading">Example Component</div>

                    <div className="panel-body">
                        {title}
                    </div>
                </div>
            </div>
        </div>
    </div>
);


const Element = document.getElementById('example');
if (Element) {
    const title = Element.getAttribute('title');
    render(<Example title={title} />, document.getElementById('example'));
}
```

いざコンパイルと画面表示

```
$ npm run dev
$ php artisan serve
```

![スクリーンショット 2021-04-29 15.31.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/133718/3130feb7-bef7-be56-d733-5d118bb7c35b.png)


## 参考

[Laravel bladeからReactコンポーネント(Material UI)にバリデーションエラーメッセージを渡してみる](https://qiita.com/motuo/items/8cdb9d70c11a3447ee7b)
Qiitaのストックにカテゴリ機能ができたので喜び勇んで使おうとしてなんじゃこら！？ってなって使うのを断念した話

追記：続編記事書きました。

https://qiita.com/seroqn/items/81adc31f695c13535ae5

## TL;DR


- カテゴリのソートできない（致命的）
- カテゴリの一覧性が悪い（5つのみ）
- 記事数が増えるとそのカテゴリのロードが遅くなる


## Qiitaの記事のストックをカテゴリごとに分類出来るようになったよ
今年(2021年)の3月ごろから、Qiitaのストックがカテゴリ別に管理できるようになった。
私は整理好きなので喜び勇んだものの、時間が取れなかったのでカテゴリ整理の計画だけ立てて、時間が空いたときに貯め込んだ記事をカテゴリ分類しようと思っていた‥。
10程度の細分化されたカテゴリに分ける計画だ。

そして本日、満を持してカテゴリ整理にとりかかったところで、なんじゃこら！？ってなって最終的に細分化をあきらめた。

## なんじゃこらポイントその1：カテゴリのソートができない
カテゴリは**作成順（古い順）にだけしか並べられない**。
よく使うカテゴリを上の方に持ってくることもできないし、似通ったカテゴリを後からまとめて並べ直すことも、自分にとっての重要度でソートすることもできない。
何より、ストック時に「ストックするカテゴリ」が表示されるが、カテゴリ選択ウィンドウには一度に~~**5つ**~~（2021年12月現在、ウィンドウが拡大され10つまで表示されるようになったようです）しかカテゴリが表示されない（それより下のカテゴリを選択するにはスクロールする必要がある）。もしよく使うカテゴリを後の方に作ってしまったら、カテゴリ登録のたびにいちいちスクロールさせなければいけない。
ちなみにカテゴリの最上段は「あとで読む」固定である（「あとで読む」カテゴリは変更できない）。
![スクリーンショット 2021-04-29 145904.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17558/188197d1-b0ba-09ca-1529-6bb2a10923b7.gif)


## なんじゃこらポイントその2：ストック一覧画面の初期状態で表示されるカテゴリは5つのみ
（ストック一覧画面の左カラムにある閲覧カテゴリ選択画面）
![ストック一覧の左カラム](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17558/396e0928-d254-c976-31d7-1abb468fb487.png)
先ほどのソート不能なカテゴリとのコンボで凶悪に不便。
ストック一覧に表示されるカテゴリーは「すべて」を除いて5つしかない（そのうちの一つは「あとで読む」で固定）。
もちろんソートできないから作成順（古い順）である。

下の方にあるカテゴリを開くにはまず「もっと見る」ボタンをクリックする必要があるが‥
![スクリーンショット 2021-04-29 151151.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17558/126706bb-8637-6eb9-1c63-15643ed83fe5.png)

「もっと見る」ボタンを一回クリックしたところ。なんとカテゴリが5つだけしか展開されない。もしカテゴリの数を10より多く作っていた場合は、さらに下のカテゴリを見るためには再び「もっと見る」をクリックしなければいけない。
![スクリーンショット 2021-04-29 151425.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/17558/923769b5-c8dd-ac2a-66f5-66e4c010cb04.png)

「もっと見る」を2回クリックしてやっと全カテゴリが表示された。

## 結論：運用、ムリです
カテゴリを登録したり閲覧するたびにスクロールやボタンクリックをしなければいけないストレスに耐えられそうにないので無理です。何より、一度順番が決められたらソートができないシステムを使うのはそれだけでストレスになります。
今の仕様ではストックの手間が1つ増えただけでおそらく活用されないまま終わるでしょう。
Qiita様には以下のことをお願いしたいです。

- カテゴリのソート機能
- 閲覧時に「もっと見る」を押さずに閲覧できるカテゴリ数の増量（8つ程度に）

どちらかというとカテゴリがソートできないの方が切実なのでそこをお願いします。

### あえて現行の仕様でカテゴリーを使うのなら:
カテゴリの数を**4つ以下**に留めるなら、上述した欠点はほとんど気にならないね:smiley:
ほとんど分類という役割を捨て去ることになるが
laravel8 tailwind テーブルに中央配置

こちらの記事では、Laravelでtailwindを使ったテーブルを中央に配置する方法についてご紹介します！
非常に簡単に実装できるので是非参考にして頂ければと思います！

#テーブル中央配置を実装

```
<div class="flex justify-center">
  <table>
  <thead class="">
    <tr>
      <th class="">期限</th>
      <th class="">商品</th>
      <th class="">数量</th>
  </thead>

  <tbody class="">
    @foreach ($stocks as $stock)
      <tr class ="">
        <td class="">
          {{$stock->deadline}}
        </td>

        <td class="">
          {{$stock->name}}
        </td>

        <td class="">
          {{$stock->number}}
        </td>
      </tr>
    @endforeach
  </tbody>
  </table>
</div>
```

tailwindの実装はdivタグ内のclassに`flex justify-center`を実装するだけです。
あとは文字の大きさやテーブルの幅、背景色など、個別によって実装したいデザインがあるかと思うので、各タグのclassに記述していけばOKです！

今回実装した`flex justify-center`については下記のリンクからtailwind公式のサイトをご覧ください。
https://tailwindcss.com/docs/justify-content#class-reference
HTMLの超シンプルテンプレート

javascriptやCSSのチェックだけしたいけど、とりあえずHMTL一式ほしい場合の超簡易型テンプレートです。
(余計なものは極力省いています)

```index.html
<!DOCTYPE html>
<html lang="ja">
 <head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="style.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="main.js"></script>
 </head>
 <body>
  ここに内容
 </body>
</html>
```

```style.css
@charset "utf-8";
/* CSS Document */

body{
 font: 14px/1.6 "Hiragino Kaku Gothic Pro",Osaka,"メイリオ","ＭＳ Ｐゴシック","MS PGothic",Verdana,Arial,sans-serif;
 margin:0;
 color:#111111;
}
```

```main.js
$(function(){
  console.log(window.location.href);
});
```

https://github.com/taro-n/simplehtml
HTMLの基本テンプレート

何かしら使いたいときにスグ調べちゃうので、ここに残しておきます。
とりあえず、これだけあれば表示はできます。

```index.html
<!DOCTYPE html>
<html lang="ja">
 <head>
  <meta charset="utf-8">
  <title>タイトル</title>
  <meta name="description" content="ディスクリプション">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="style.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="main.js"></script>
 </head>
 <body>
  <header>ヘッダー</header>
  <nav>ナビ</nav>
  <section>
  <article>
  ここに内容
  </article>
  </section>
  <footer>フッター</footer>
 </body>
</html>
```

```style.css
@charset "utf-8";
/* CSS Document */

body{
 font: 14px/1.6 "Hiragino Kaku Gothic Pro",Osaka,"メイリオ","ＭＳ Ｐゴシック","MS PGothic",Verdana,Arial,sans-serif;
 margin:0;
 color:#111111;
}

img{
 outline:none;
 border-style:none;
}


header{
    display: block;
    color:#FFFFFF;
    background-color: #7952b3;
    width:100%;
}


nav{
    width: 100%;
    border-top: 1px solid #000000;
    border-bottom: 1px solid #000000;
    margin-bottom: 5px;
}


section{
    display: block;
    width: 100%;
    margin: 20px auto;
    padding: 1%;
    background-color: #d9ffe4;

}
article{
    width: calc(50% - 15px);
    padding: 2%;
    background-color: #94e07f;
}

footer{
    font-size:.8em;
    width: 100%;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #6f6f6f;
    color:#111111;
}
```

```main.js
$(function(){
  console.log(window);
  console.log(window.location.href);
});
```

https://github.com/taro-n/defaultHTML
M1 macでUITestが実行できない

## 環境
- 2021/04/29時点
- M1チップのMacBook airを使用
- rosettaを利用してXcodeを利用

## 起きた問題
- swiftのプロジェクトを作成すると一緒に作成されるUITestを実行したところ、下記のエラーで実行に失敗する
![スクリーンショット 2021-04-29 15.15.16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/268579/86b3aa0c-56f1-9acc-6484-ad792fe6031e.png)



```
Details

Could not attach to pid : “29327”
Domain: IDEDebugSessionErrorDomain
Code: 3
Failure Reason: attach failed ((os/kern) invalid argument)
User Info: {
    DVTRadarComponentKey = 855031;
    RawLLDBErrorMessage = "attach failed ((os/kern) invalid argument)";
}
--


System Information

macOS Version 11.1 (Build 20C69)
Xcode 12.4 (17801) (Build 12D4e)
Timestamp: 2021-04-29T15:15:21+09:00
```

## 解決方法
- Xcodeをrosettaを利用して利用しない(原因は不明)
独学でiosアプリをリリースしてみた

#はじめに

今回の環境といたしましては
Monacaを使ってアプリを作成しました。
自分のレベルとしては独学でHTML,CSS,javaScriptを一年ほどや学習しております。

#なぜMonacaを使ったのか
自分自身独学でWeb系の言語を学習しており
HTML,CSS,javaScriptはある程度は扱えるレベルでした。
ちなみにこちらが自分のポートフォリオサイトです。↓↓
https://skirnir1198.github.io/Myportfolio/

そしてある程度できたところでたくさんの方に自分の作ったサービスを使ってもらえるかを考えたところ
PC持ってる人よりもスマホ持ってる人の方が多くね？と思ったのでiosアプリを作ろうと思い、
一からネイティブアプリの言語(swift,Objective-C)を習得するのは学習コストが高いと思いMonacaを利用しました。

#今回作ったアプリ
今回作ったアプリは「日本酒メモ」という日本酒をメモするシンプルなアプリです。→ https://apps.apple.com/us/app/%E6%97%A5%E6%9C%AC%E9%85%92%E3%83%A1%E3%83%A2/id1563214567
![qiita.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/970553/1e8e290a-567b-5545-d4d0-3aaaa391f77c.png)


とにかく早く自分の作ったアプリをリリースしたかったのでめちゃくちゃシンプルな機能にしました。
今後少しずつアップデートして行ければいいなと思っております。🙇‍♂️


#開発期間

学習コストを抑えての開発でしたが意外とリリースするまで時間がかかってしまいました。
期間の内訳としては

+ 開発   3日
+ apple developer programへの登録   4日
+ アプリのビルドとリリース　  1週間

計 2週間ほどかかりました💦

ビルドに関しては以下のサイトを参考にさせてもらいました。
- [monacaでのiPhoneアプリのビルドとリリース 前編 2020年版](https://apps.jp.net/introduction/how-to-build-ios-app/)
-  [monacaでのiPhoneアプリのビルドとリリース 後編 2020年版](https://apps.jp.net/introduction/how-to-relase-ios-app/)

去年の記事なのですが大体はこの記事通りにしました。
<font color="Red">途中＊(ワイルドカード)を使う場面があるのですが現在はワイルドカードを使うとapp store connectでアプリが表示されないことがあるので使わないようにしましょう</font>

#Monacaを使うメリット・デメリット

###メリット
+ Web系の言語を触ってきた人たちにとっては学習コストが低い
+ ネット上に情報が多いのでググれば参考書なしでもある程度いける(その人にもよるかも)

###デメリット
+ 無料プランだと1日のビルド回数が3回までと少し少ない(3回目以降は24時間待たないとビルドできないので意外と開発効率が悪くなってしまう)


#まとめ

今回は学習コストを抑えてなるべくスピーディーにアプリをリリースしようということでMonacaを利用してみました。
swiftなどを使ったことがないのでそれらの言語と比較するのはできないのですがMonacaでも全然iosアプリの開発はできるなと思いました。
ある程度の設計はこれまで触ってきた言語をそのまま使えるので全然問題なく進めることができアプリならではの機能(カメラなど)はプラグインを使って導入するのでその度に調べたりすることはあったのですがそういった情報は先駆者たちが既に投稿してくれているので結構スムーズに導入することができました。
ただappleとの連携の際はやっぱりappleから出されているswiftやXcodeなどのソフトウェアを使って開発を行なった方がスムーズにいくのかなと思うのでMonacaで実際にアプリを作ってみて今後もiosアプリを作る予定があるのならばswiftなどの言語を学習していくのがおすすめだと思います。
Adalo リレーションオブジェクトの一括操作

現在NoCode開発ツールAdaloを使用しネイティブアプリ開発を行っています。
そこで実装に苦戦したリレーションオブジェクト（こオブジェクト）を一括操作する機能を忘れないよう記事に残していきたいと思います。

この操作はどのアプリでも必須と言って良いほど必ず使用する技術ただと思います。

例えば
1.「ログインしているUser」に紐づいている「フォロワー」に対して一斉にメッセージを送りたい。フォロー解除したい
2.「自分が参加しているチャットグループ」に紐づいている「メッセージ」を既読にしたい。
などあげたらキリがありません。

今回は2.で例に挙げたメッセージを既読した際にReadFlagをtrueにデータを一斉アップデートをかける際の実装に苦戦したのでその例をもとに解説していきます。

普通にソースコードを記述する場合であれば
1_1.紐づくデータを一括操作
1_2.for文でループさせ1個づつ操作
という選択になると思います。

しかし**Adaloではではどちらも行うことができません。**（＊2021年4月29日時点での情報）

なのでListとカウントダウンコンポーネントを使用し1_1に近い操作をできるよう工夫します。
カウントダウンコンポーネントは0になったタイミングでactionを実行することが可能なコンポーネントです。
今回はチャットルームに入った際にReadFlagをtrueにしたいので0カウントダウン秒数は0秒にして入室したタイミングで処理ができるようにします。
＊カウントダウンコンポーネントはインストールが必要です。無料なのでインストールしてご使用ください。

流れは下記の通り
1.Listの作成（今回はメッセージのリスト）
2.カウンドダウンコンポーネントを設置
3.メッセージテーブルのReadFlagをtrueにUPDATE

これで実装可能です！
趣味のデータ探索(1)_東京23区中古マンション

#目的
東京23区の中古マンション物件情報を探索して、可視化したりお得物件を抽出したりしてみたい。昔見た以下の記事を大いに参考にさせて頂きながら、関連する情報を学んで理解する。

https://www.analyze-world.com/entry/2017/10/09/062445

#前提
環境構築は自信もないし面倒なのでGoogleColaboratoryを利用します。

https://colab.research.google.com/notebooks/intro.ipynb?hl=ja

#手順

1. [BeutifulSoupでWebスクレイピング](https://qiita.com/sckln/items/ae4c001e5066613171d0)
1. [GoogleColaboratoryにおけるファイルの読み書き](https://qiita.com/sckln/items/bea00b6d2f4cdfd6fa52)
1. [データの前処理（Pandas）](https://qiita.com/sckln/items/d42bc1d5564ae65ff899)
1. なるべく学習コストを掛けずにデータを可視化したい
1. 住所テキストから緯度・経度の情報を取得したい
1. Foliumによる中古マンション価格相場の可視化
【SQL】重複したデータを削除する

# はじめに

事の発端は、とあるテーブルの重複を削除するというあるある事象だったが、単純な重複削除ではない内容であり、無駄にGROUP BYとかHAVINGとか色々使ってドツボにハマってしまったので、備忘録としてメモ。

# 環境

Windows10
PostgreSQL 13.2
PgAdmin 4.29

#状況説明

実際のテーブルに比べて相当デフォルメしているが、以下のようなカラムとデータが入ったテーブルがある。

Noはユニークだが、それ以外は同じデータである。dateは日付なのでまちまちだが、今回の抽出対象ではない。

・それぞれのカラムのデータ型,PKはテキトー。
・テーブル名は仮で「dup_test」とする。

![スクリーンショット 2021-04-29 15.02.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1111664/29b4b14c-60a5-53e3-671f-c947f80586be.png)

#やること
・Name1, Name2, Name3が同じデータは削除する。ただし、1つは残す。

#やったこと
まずはNoが1のデータが残れば良いよね、と考えた。
No=1 **以外** のデータを取るには以下のSQLになる。
（基本中の基本ですがとりあえず記載します。）

`select * from dup_test B where A.no <> 1`

で、このデータをサブクエリにして、DELETEすればOKじゃないかと。

`DELETE FROM dup_test A
WHERE exists(
select * from dup_test where A.no <> 1
)`

![スクリーンショット 2021-04-29 15.08.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1111664/5c074afa-abbb-8749-6437-2becdc882db9.png)

とりあえず上手くいった。（と思う。）

#おわりに

同じケースであれば、取り急ぎこれで重複削除はできそう。

私自身SQLはそれなりに利用しているが、正直知見が乏しいので、シンプルで良い方法はこれからも模索していきたい。
Google ColabとJupyter-LabでEmacsキーバインドを使う【完結編】

#はじめに
長年悩んでいた課題がついに解決したので共有したい。

#環境
環境は以下の通り
- Windows10

#対応方法
早速対応方法を記載していく。

## 1. AutoHotKey のインストール
https://www.autohotkey.com/ などからAutoHotKeyをインストールする。
AutoHotKeyについては、色々情報があるので参考文献を見てほしい。

## 2. AutoHotKey のスクリプトを作成し実行
[emacs.ahk](https://github.com/usi3/emacs.ahk/blob/master/emacs.ahk)からソースをダウンロードし、is_target関数を以下の通り変更する。そして、そのスクリプトをダブルクリックで実行さればOKだ。

```
is_target()
{
  IfWinActive,ahk_exe chrome.exe
  {
	WinGetTitle, Title
	If InStr( Title , ".ipynb") > 0 ;
		;MsgBox, The active window is "%Title%".
		Return 0
	If InStr( Title , "JupyterLab") > 0 ;
		;MsgBox, The active window is "%Title%".
		Return 0

  }
  Return 1
}
```

ソースの解説をしよう。
まず、[emacs.ahk](https://github.com/usi3/emacs.ahk/blob/master/emacs.ahk)は、Emacsのキーバインドを設定したAutoHotKeyのスクリプトになっており、is_target関数に条件がマッチした場合(Return=0)の場合のみ、Emacsキーバインドに変更する。
どういったキーバインドが設定されているかは、githubのぺージを見てほしい。
で、この is_target 関数を、ブラウザがChromeでブラウザのウィンドウタイトルに ".ipynb" が含まれる場合 (Google Colab に対応) もしくは、"JupyterLab" が含まれている場合 (JupyterLab に対応)に、Emacs のキーバインドになるように条件を変更したものが上のソースである。
ブラウザを変更したり、条件を変更したい場合は、[AutoHotkeyJp](https://sites.google.com/site/autohotkeyjp/reference/commands/index)を参考に条件を変更してみるといいだろう。

#感想
長年悩んでいたことが立ったこれだけで解決してしまって感動している。
これが所にPyCharmやVSCodeで書いていたが、Jupyterでもガンガンスクリプトが書けそうだ。

ついでに上のis_target関数にQiitaの条件も入れて、このQiitaの記事をEmacsキーバインドで書いている!!。
おそろしく快適である！
皆さんも色々カスタマイズし、色々なアプリケーションでEmacsキーバインドを楽しんでほしい。


#参考
- [どうしてもemacsのキーバインドが使いたい（特にCtrl-Wが使いたい）！](https://qiita.com/nognog/items/dcc44b9a16e20736eb4d)
- [Windows 10でも「Emacs風キーバインド」を使おう【AutoHotKey】](https://linuxfan.info/windows-emacs-keybindings)
- [emacs.ahk](https://github.com/usi3/emacs.ahk/blob/master/emacs.ahk)
- [AutoHotkeyJp](https://sites.google.com/site/autohotkeyjp/reference/commands/index)