OmniAICreator/Qiita-1.07M huggingface dataset:
今日の日付に基づいて四半期の開始日を計算するための数式

[Answersで回答する時に使う情報のまとめに戻る](https://qiita.com/Keiji_otsubo/items/9e6e0e946826133eddc7)

[Date formula to show beginning of current calendar quarter and beginning of previous calendar quarter](https://trailhead.salesforce.com/trailblazer-community/feed/0D54S00000A8SBsSAN)




今日の日付に基づいて四半期の開始日を計算するための数式の例を以下に示します。  

IF(MONTH(TODAY())< 4,  DATE(YEAR(TODAY()),1,1),//今日の日付が1月から3月の間にある場合 
   IF(MONTH(TODAY())< 7,  DATE(YEAR(TODAY()),4,1),//今日の日付が4月から6月の終わりの場合
    IF(MONTH(TODAY())< 10,  DATE(YEAR(TODAY()),7,1),//今日の日付が7月から9月末までの場合
      IF(MONTH(TODAY())> 9,  DATE(YEAR(TODAY()),10,1),Null //今日の日付が10月から12月の間にある場合。 
       )
    )
  )
)

```
IF(MONTH(TODAY())< 4,  DATE(YEAR(TODAY()),1,1),
  IF(MONTH(TODAY())< 7,  DATE(YEAR(TODAY()),4,1),
    IF(MONTH(TODAY())< 10,  DATE(YEAR(TODAY()),7,1),
      IF(MONTH(TODAY())> 9,  DATE(YEAR(TODAY()),10,1),Null
      )
    )
  )
)
```

[営業日(週末を除く)を考慮した日付の追加](https://qiita.com/Keiji_otsubo/items/0055b7780e0868c94e1a)

[How do I find the number of business days from the first day of the current fiscal quarter through today?](https://trailhead.salesforce.com/trailblazer-community/feed/0D54S00000BrJffSAF)


# 今ある日付から、締日を求める数式
[今ある日付から、締日を求める数式](https://qiita.com/Keiji_otsubo/items/8c34fc01b5d6c3d66ba9)
【Rspec】システムテストでブラウザバックをしたいとき【Ruby on Rails】

# はじめに
<!-- 発端や概要を記載 -->
システムテストを書いているときにブラウザバックを動作させたかったのですが、英語の記事ばかりだったので備忘録として書かせていただきました。

<a id="#Chapter1"></a>
# 前提
Capybara が正しく導入されていること（導入に関しては先人の有識者の方々が分かりやすい記事を投稿されているのでご検索ください）

<a id="#Chapter2"></a>
# 本題
gem の導入（これが無いと動かないかも）

```ruby:Gemfile
  gem 'selenium-webdriver'
```

```
$ bundle install
```

`page.driver.go_back` を使用してブラウザバックを実行できる

```ruby:systems/hogehoge_spec.rb
  context 'ブラウザバックをした場合', js: true do
    it 'リダイレクト処理が行われること' do
      visit '/hogehoges'
      click_on '新規ホゲホゲ'

      expect(page).to have_current_path '/hogehoge/new'
      page.driver.go_back

      expect(page).to have_current_path '/hogehoges'
    end
  end

```
注意点としてはシナリオに、`js: true` がついていない場合正しく動作しません。

<a id="#reference"></a>
# 参考文献
- https://stackoverflow.com/questions/3888131/how-can-i-simulate-the-browser-back-button-in-capybara
Wicketの開発環境をDockerで構築

Wicketのプロジェクトの生成・実行をDockerのmavenを使用して行う方法です。

## Wicketプロジェクトの生成

まずプロジェクト生成のみを行う一時的なコンテナを立ち上げる。

```
$ docker run --rm -v $(pwd):/usr/src -w /usr/src -it maven /bin/bash
```

Shellで[WicketQuickStart](https://wicket.apache.org/start/quickstart.html)を実行。プロジェクトが生成される。

## Wicketプロジェクトの実行

以下のようなdocker-compose.ymlを作成する

```yaml
version: '3'

services:
  app:
    image: maven
    volumes:
      - .:/usr/src
      # m2のローカルキャッシュ
      - .m2:/root/.m2
    working_dir: /usr/src/myproject
    command: mvn jetty:run
    tty: true
    ports:
      - 8080:8080
```

m2のローカルキャッシュがディレクトリに配置されるので注意。



実行する。

```
$ docker-compose up -d
```

しばらく待ち、コンテナのログに [INFO] Started Jetty Server と表示されたら起動完了。 localhost:8080 からアクセスできる。
Vim でのタブ、ウィンドウ、バッファ操作が覚えられなくて、絶望した末に、


Vim も現代的なエディタなので、画面分割もタブもあります。タブや画面を渡り歩く操作が覚えられない！

自分の頭のできの悪さに絶望したのだけれども、自分で覚えられるようなキーバインディングを用意してみたら、嘘のように便利に使えるようになったという話です。15年遡って過去の自分に教えてやりたい。

以下が設定です。平凡な設定だから、こういう感じで設定している人も多そう。（2021-08-18 修正）

~~~ .vim
" タブを巡回
nnoremap <Leader>tl :tabnext<CR>
nnoremap <Leader>th :tabprev<CR>

" 上下左右のウィンドウに移動
nnoremap <Leader>wk <c-w>k
nnoremap <Leader>wh <c-w>h
nnoremap <Leader>wj <c-w>j
nnoremap <Leader>wl <c-w>l

" バッファを交換
nnoremap <Leader>bh :bprev<CR>
nnoremap <Leader>bl :bprev<CR>
~~~

基本はカーソル移動のキーの前に、文脈に応じて t, w, b を前置するだけなので苦もなく覚えられるでしょう？以下がいくつかの例です。

- `<Leader>bl`: 次のバッファを表示
- `<Leader>wk`: 上のウィンドウに移動
- `<Leader>tl`: 右のタブを表示

---
## （2021-08-18 の修正内容について）

コメントに書いたように、以前の設定を施したところ `t`, `b` などの移動コマンドに対するビジュアルフィードバックが遅くなりました。`t` の打鍵後に neovim が次の文字の入力を待って、タブの変更かカーソル移動かを判断することが原因と思われます。

今日の修正内容は、`t` や `b` などの移動コマンドとの衝突を避けることが目的です。私は `<Leader>` にスペースバーを割り当てています。
Dockerで環境変数を秘密情報として扱う方法

# はじめに
https://qiita.com/myabu/items/89797cddfa7225ff2b5d

「環境変数を使って接続の設定をすることは開発時には一般的にOKですが、本番環境では非常にお勧めできません」という情報がありましたので、普段使っている環境でsecretsを使う方法を実際に試してみました。
Laravelなどでは、環境変数はフレームワーク側のenvファイルで取り扱うことが多いため、この手法を使うことはあまりないかもしれませんが備忘録として記事にまとめたいと思います。

# 動作確認環境
- Windows10 Home
- wsl2
- Docker Desktop for Windows
- Ubuntu20.04 LTS

# サンプルのdockerfile

```bash
version: "3.9"
volumes:
  db-store:
services:
  db:
    build:
      context: .
      dockerfile: ./infra/docker/mysql/Dockerfile
    ports:
      - target: 3306
        published: 3306
        protocol: tcp
        mode: host
    volumes:
      - type: volume
        source: db-store
        target: /var/lib/mysql
        volume:
          nocopy: true
    secrets:
      - db_root_password
      - db_user_password
    environment:
      - MYSQL_ROOT_USER=root
      - MYSQL_USER=db_user
      - MYSQL_ROOT_PASSWORD_FILE=/run/secrets/db_root_password
      - MYSQL_PASSWORD_FILE=/run/secrets/db_user_password
secrets:
  db_root_password:
    file: ./root_password.txt
  db_user_password:
    file: ./user_password.txt
```

root_password.txtの中身の例 ↓

```bash
rootnopassword
```

# secretの仕組み
secret指定すると、指定したファイルの内容を/run/secrets/以下にマウントしてくれます。
MySqlのイメージではMYSQL_ROOT_PASSWORD_FILEといったような形で「_FILE」と付けてあげるとファイルから環境変数を読み取ることができるようになります。
これら2つを組み合わせ、環境変数を秘密情報として扱うことができるようになります。

# トラブルシューティング
「MYSQL_ROOT_PASSWORD_FILE」の指定は、「mysql:8.0」イメージで使えます。
イメージによっては使えないので注意しましょう。

https://hub.docker.com/_/mysql

# トラブルシューティング２
マウントされるパスワードは、スペース、キャリッジリターン、および最後の改行も保存されます。
パスワードを保存してあるファイルは最低限の内容のみにしましょう。

# トラブルシューティング３
シークレット情報を保存するファイルの権限は0444にする必要があるようです。
もし上手く読み込みがされない場合は、マウントもとファイルのファイル権限を読み取り専用に変更して下さい。

```bash
chmod 0444 {ファイル名}
```

# 注意点
DockerfileのENVやARGを使い環境変数を設定すると、Docker imageに変数の中身が残ってしまうため注意しましょう。

https://qiita.com/KEINOS/items/518610bc2fdf5999acf2

# 参考ページ
https://docs.docker.com/engine/swarm/secrets/

https://diogomonica.com/2017/03/27/why-you-shouldnt-use-env-variables-for-secret-data/

https://docs.docker.com/compose/compose-file/compose-file-v3/#secrets

https://terashim.com/posts/docker-build-secret/
ec2-userでディレクトリ移動が出来なくなった

AWSでのデプロイ中

.ssh から　「ec2-user」へログインし、ホームディレクトリからリポジトリ名ディレクトリまで移動したいのに、急に出来なくなった！

```terminal
$ cd /vim/www/リポジトリ名(アプリ名)
```

## 解決した方法

```terminal
$ cd /var/www/リポジトリ名
```

#### 超シンプル。「vim」じゃなくて「var」だった・・・。

## 解決方法

* Linuxコマンドを検索
* 使えそうなコマンドを探していた所、「find」が使えそう
* `$ find / -name リポジトリ名` を実行。

沢山ファイルが表示された後に最後の方に `/var/www/furima-35496`の文字が。

##### 見つかって良かった〜

※初学者です
AWS lambdaでAPI作るときに参考にしたサイトメモ


## AWSアカウントの作成
- [AWSアカウントを取得したら速攻でやっておくべき初期設定まとめ](https://qiita.com/tmknom/items/303db2d1d928db720888)
    - CloudTrailはS3の料金がかかりそうだったのでやめた

## Lambdaの実装
- [API Gateway から Lambda にパラメータを渡す](https://qiita.com/minsu/items/c9e983f109b1cf5a516e)

## LambdaとAPI Gatewayの連携
[AWS Lambda を Amazon API Gateway に使用する(AWS公式)](https://docs.aws.amazon.com/ja_jp/lambda/latest/dg/services-apigateway.html) 

[Amazon API Gatewayは「HTTP API」と「REST API」のどちらを選択すれば良いのか？ ](https://dev.classmethod.jp/articles/amazon-api-gateway-http-or-rest/)

## 実際に呼び出すには？
- API Gatewatでルートを見るとわかるように、lambdaの関数名が階層的に配置されているのでそれに従う
- API GatewayのURLへGETリクエストを出すとInternalServerErrorが出てしまった。
    - 参考：[500 ステータスコードが表示される理由は何ですか?](https://aws.amazon.com/jp/premiumsupport/knowledge-center/api-gateway-lambda-stage-variable-500/)
    - 参考：[Using resource-based policies for AWS Lambda](https://docs.aws.amazon.com/lambda/latest/dg/access-control-resource-based.html)
        - Lambdaの対象の関数を選択し、設定のアクセス制限を選択
        - 画面下の方のリソースベースポリシーの`ポリシードキュメントを表示`を選択すると、現状の設定の確認が可能
        - apigatewayが許可されており、関係なさそうでした。

# **↓TODO↓**
## ログはどうやって見る？
- そもそも見たいログは？
    - API Gatewayのエンドポイントへのリクエストの履歴
    - Lambdaの実行ログ

## アクセス制限とかセキュリティ対策ってどうやってやる？
- サーバー内部から呼び出す場合とかはいいけど、クライアントから呼び出す場合にどうなるか
    - WAFとか通せなさそう
    - OAuthとかできるの？
    - Basic認証だとクライアント側に露呈されてダメっすよね
# **↑TODO↑**
レポートのURLハック

[まとめページに戻る](https://qiita.com/Keiji_otsubo/items/60afc2a8d211b6f7d89f)

検索条件の指定に色々ありそうです。順序の確認が難しそうですね。

# モバイルでは使えない

+ [モバイルアプリからカスタムボタンでレポートの絞り込み表示ができない](https://trailhead.salesforce.com/trailblazer-community/feed/0D54V00007ifh1Y)

:::note
使用できないレポート機能

+ Salesforce モバイルアプリケーションでは、動的パラメーター値を使用する URL を介してレポートを表示できません。パラメーターをレポートに渡すように URL を変更すると、アプリケーションに空白画面 (返される結果がないレポートレコード) が表示されます。

https://help.salesforce.com/s/articleView?id=sf.limits_mobile_sf1_analytics.htm&type=5
:::


# Lightning版

[Lightning account button issue (pass thru value isn't populating)](https://trailhead.salesforce.com/ja/trailblazer-community/feed/0D54S00000BrGVmSAN)


[Filter Reports via URL Parameters in Lightning Experience](https://help.salesforce.com/s/articleView?id=sf.reports_filter_url.htm&type=5)

+ パラメータの意味

**＆** —URLの新しいパラメータを示します。URLに他のパラメータが存在しない場合は、の代わりに置き換え?てください 

**fv0 — fv**は「フィルター値」を表し、パラメーターの名前です。これ0は、フィルターがレポートに表示される番号順です。（最初のフィルターは0、2番目のフィルターは1、3番目は2などです。）標準フィルターはこの順序ではカウントされず、最初の3つとして表示されますが、URLパラメーターを使用してフィルター処理することはできません。すべてのレポートをフィルタリングします。レポートの5番目のフィルターの値を設定するには、を指定します fv4。この例では、レポートの最初のフィールドフィルターをフィルター処理しています。
レポート実行ページのLightningExperienceにフィルターが表示される順序は、必ずしもフィルターがレポートに表示される順序とは限りません。ロックされたフィルターは、実行ページのロックされていないフィルターの下に一覧表示されますが、必ずしもすべてのロックされていないフィルターの後に順序付けられるとは限りません。レポート内のフィルターの順序を確認するには、レポートビルダーでフィルターの順序を参照してください。または、GET呼び出しを行い、JSON応答でそれらの順序をメモします。/services/data/v39.0/analytics/reports/<report ID>/describe

フィルタ値—フィルタが動作する基準。
フィルタ値はURIエンコードする必要があります。つまり、特定の文字（スペースなど）は、URLが理解できる形式で記述する必要があります。スペース（ ''）は%20、URIエンコードされたときになります。


+ [Download salesforce report as CSV via URL](https://trailhead.salesforce.com/trailblazer-community/feed/0D54V00007X6C9Z)

:::note

```
https://<DOMIAN NAME>.lightning.force.com/<SFDC ID OF REPORT>?csv=1&exp=1&enc=UTF-8&isdtp=p1
```

https://ideas.salesforce.com/s/idea/a0B8W00000GdXfQUAV/download-a-salesforce-report-directly-from-browser-using-url
:::


# Classic版

[Salesforce Reports URL Hack (Preset Report Filters)](https://www.salesforceben.com/salesforce-reports-url-hack/)


# コミュニティー用

+ [コミュニティURLのSalesforceレポートパラメータ](http://www.salesforcechris.com/salesforce-report-parameters-in-a-community-url/)




# エラー

+ [Help With Syntax for Link to Report with Parameter](https://trailhead.salesforce.com/trailblazer-community/feed/0D54S00000Pf8Iy)

Looks like there's a problem. This record is no longer available. Ask your administrator for help.

For the filter 1: Picklist value does not exist

:::note
he report did have three filters. I was not trying to set all three in the URL, so I didn't realize I needed to deal with them. I am now dealing with them, and my link is working! 
:::

+ [ハイパーリンクでレポート作成時の複数条件設定方法について](https://trailhead.salesforce.com/trailblazer-community/feed/0D54V00007X7ziD)

# 質問

+ [Record specific reports on lightning page.](https://trailhead.salesforce.com/trailblazer-community/feed/0D54V00007clJwH)

:::note
Please check this article.

Filter Reports with URL Parameters in Lightning Experience
https://help.salesforce.com/s/articleView?id=sf.reports_filter_url.htm&type=5
:::
n進数について　[n進数とは]

#そもそもn進数とは

n進数とは**コンピュータが情報処理したものを表現するためのツール**



コンピュータは”１”と”０”しかわからない。
この２つの数字を使い、あらゆる組み合わせによって多くの情報を処理している。

###意味

n進数の”n”には数字が入る
そしてn個数字が進んだら、桁が１桁上がるという意味

**そして使える数字もn個ということ**

#基本のn進数


基本的に**２進数を使う**




#####数え方

例）
例えば１０進数なら。。。

０　１　２　３　４　５　６　７　８　９　１０　・・・・・

というように０〜９まで１０個の数字を使う

**つまり１０個数字を数えたら１１個目に”１０”がきて、1桁上がっている**



２進数では

０　１　１０　１１　１００　１０１　１１０　１１１　１０００・・・・

使える数字は２個（０と１）
そして２個数字が進んだら３桁目で1桁上がっている


#８進数と１６進数

２進数の他にも８進数、１６進数がある

#####２進数との違い


２進数

ひとつの桁（←要は桁が上がる前の数字）で
８進数は０〜７（７は０から数えて８個目）

１６進数は０〜F（Fは０から数えて１６個目）

２進数の同じ部分を比べると
０〜１１１　　　　　２進数の８個目は１１１になる
　　　　　　　　→ つまり表現するのに３桁必要なのが、８進数では1桁で済んじゃう

０〜１１１１　　　　２進数の１６個目は１１１１になる
　　　　　　　　→つまり表現するのに４桁必要なのが、１６進数では１桁で済んじゃう　　


例）

２進数　　　　　　　　１１０１.０１１
８進数　　　　　　　　　　１５.２
１６進数　　　　　　　　　　 D.4

これらは全て同じ数値を表している

**要は、複雑な情報を表現するのに、８進数や１６進数を使うことでより簡潔に表現できるようになる**

>参考書籍

>>きたみりゅうじ　『キタミ式　イラストIT塾　基本情報技術者　令和０３年』 技術評論社 2020年
C から libpq を使って PostgreSQL に接続してみる

C から libpq を使って PostgreSQL に接続するプログラムの作成方法について説明します。

環境は CentOS 7 または 8、PostgreSQL 9.6 以降を対象とし、PostgreSQL に接続できる状態になっていることを前提とします。PostgreSQL のインストールや設定がまだであれば、インストール方法は [こちらの記事](https://qiita.com/tom-sato/items/e1903cb974fb6c6d5664)、ローカルホスト以外からの接続受けつけに必要な設定方法は [こちらの記事](https://qiita.com/tom-sato/items/d5f722fd02ed76db5440) を参照してください。

1. GCC、PostgreSQL ヘッダファイル・開発ライブラリをインストールします。

    CentOS 7 で PostgreSQL 11 以降の場合には、EPEL、SCL リポジトリをインストールします。理由は [こちらの記事](https://qiita.com/tom-sato/items/b5f1263911fdedd5e81b) を参照してください。

    ```shell-session:CentOS&nbsp;7&nbsp;の場合
    $ sudo yum install -y epel-release centos-release-scl
    (省略)
    Complete!
    ```

    続いて、GCC、PostgreSQL ヘッダファイル・開発ライブラリをインストールします。

    ```shell-session
    $ sudo yum install -y gcc postgresql13-devel
    (省略)
    Complete!
    ```

    パッケージ名に含まれる `13` は PostgreSQL のバージョンです。ご自身の環境に合わせて書き替えてください。バージョン 9.6 以前は `96` のように 2 つの数字からなるバージョンから `.` を取り除いたものとなります。

1. プログラムを作成します。

    プログラムの内容はデータベースの一覧を出力するというものです。エラー処理は原因特定に必要最低限のことしか行っていません。

    ```c:test_libpq.c
    #include <stdio.h>
    #include <stdlib.h>
    #include <libpq-fe.h>
    
    int
    main(void)
    {
        const char *conninfo;
        PGconn *conn;
        PGresult *res;
        int i;
    
        conninfo = "host=localhost port=5432 dbname=postgres user=postgres password=password";
        conn = PQconnectdb(conninfo);
        if (PQstatus(conn) != CONNECTION_OK)
        {
            fprintf(stderr, "%s", PQerrorMessage(conn));
            exit(1);
        }
    
        res = PQexec(conn, "SELECT datname FROM pg_database");
        if (PQresultStatus(res) != PGRES_TUPLES_OK)
        {
            fprintf(stderr, "%s", PQerrorMessage(conn));
            exit(1);
        }
    
        for (i = 0; i < PQntuples(res); i++)
        {
            printf("%s\n", PQgetvalue(res, i, 0));
        }
    
        PQclear(res);
        PQfinish(conn);
    
        return 0;
    }
    ```

    変数 `conninfo` には空白区切りで `パラメータ名=値` 形式で接続先を指定します。パラメータの `host` は接続先のホスト、`port` はポート、`dbname` はデータベース名、`user` はユーザ、`password` はパスワードを表します。ご自身の環境に合わせて書き替えてください。

1. プログラムをビルドします。

    ```shell-session
    $ gcc -Wall -I/usr/pgsql-13/include -L/usr/pgsql-13/lib -lpq -o test_libpq test_libpq.c
    ```

    `-I`、`-L` オプションにはそれぞれ PostgreSQL ヘッダファイル、開発ライブラリ格納先のパスを指定します。パスに含まれる `13` は PostgreSQL のバージョンです。ご自身の環境に合わせて書き替えてください。

    エラーメッセージが出力されず、実行ファイル `test_libpq` が生成されれば、プログラムのビルドは成功です。

1. プログラムを実行します。

    ```shell-session
    $ ./test_libpq
    postgres
    template1
    template0
    ```

    エラーメッセージが出力されず、データベースの一覧が出力されれば、プログラムの実行は成功です。

以上でプログラムの作成は完了です。
JavaScriptを基本からまとめてみた【10】【classList.addメソッド】

##はじめに

####学習するに至った経緯

2020年より、未経験からエンジニアへの転職を目指し、某プログラミングスクールへ通う。
入学後、『Ruby』を未経験から学ぶ人が多いのと『Ruby』の求人が思っていた以上に少ないので、
卒業後、フロントエンドのエンジニアを目指す事に。
Javascriptの学習した事を言語化し、認識の深化による備忘録として記載。

##classListとは
『classList』とは特定の要素のクラス名を追加したり、削除したり、参照したりすることが出来る便利なプロパティで、classListの後にメソッドを定義することにより、追加削除などの機能を指定することができる。


#####classListに用意されているメソッド

|メソッド名 |機能   |
|--------|------|
|add     |クラスを追加する  |
|remove  |クラスを削除する  |
|contains  |クラスが含まれているか確認する  |
|toggle  |クラスが含まれていれば削除、含まれていなければ追加する  |

##addメソッドとは

『addメソッド』とは指定した文字列などをclassに対して追加するメソッド。classはHTMLのスタイル指定に使う属性。
JavaScriptでHTMLのタグを取得すると、「classList」がプロパティとして入る。classListは、HTMLのclassの変更や削除などの操作をするメソッドを持っており、その中の要素に対して追加を行うメソッドがaddとなる。

##addメソッドの使い方

JavaScriptでエレメントを取得し、.add(【追加するクラス名】)とすることで使用可能。

##class属性を追加する方法

addメソッドを使用した場合、HTMLにはclass属性が追加される。
追加するクラス名を複数指定することで、複数のクラスを追加することも可能。

##add()　　使用例

####sample : 1
① add()はclassの追加ができ、例として、ボタンクリックでclassを追加するようにする。

```html
<div id="sample">サンプル</div>
<button id="btn">変更</button>
```
② 追加するclassによってスタイルが変わるように適当にCSSを用意。

```css
.is-red {
    color: red;
}
.is-large {
font-size: 28px;
}
```
③ 追加したいclass名をadd()で指定したら、ボタンクリック時にclassを追加することができる。

```js
document.getElementById('btn').addEventListener('click', function() {
    document.getElementById('sample').classList.add('is-red');
});
```

####sample : ２

① ②を使用する。
③ カンマ区切りで複数のclassも設定できる。ただしIEでは複数指定は対応しておらず、1つ目のclassのみ適用される。

```js
document.getElementById('btn').addEventListener('click', function() {
    document.getElementById('sample').classList.add('is-red', 'is-large');
});
```
####sample : 3
① ②を使用する。
③ 配列の形で複数指定も可能です。 ※ この方法はスプレッド構文を使用しているため、対応していないIEだと構文エラーになる。

```js
let classes = ['is-red', 'is-large'];
document.getElementById('btn').addEventListener('click', function() {
    document.getElementById('sample').classList.add(...classes);
});
```

####sample :4
① classを追加するためのHTMLを準備。　※このコードではclassを変更するdivタグにIDとして、targetという名前をつける。

```html
<!DOCTYPE html>
<html lang='ja'>
<head>
  <meta charset='UTF-8'>
</head>
<body>
  <div id='target' class='red'>ここにclassを追加することでスタイルを変更する</div>
</body>
</html>
```
② 追加するclassのCSSを準備。　※ここでは、追加されたことがわかるように色をつけるスタイルを3つ用意する。

```css
.red{
  background-color: red;
/*   背景が赤 */
}
.green{
  color: green;
/*   文字が緑 */
}
.blue{
  border: solid 2px blue;
/*   枠線が青 */
}
```
③ JavaScriptのソースを作成。　※ HTMLのdivタグを取得し、classList.addメソッドで2つのclassを追加。

```js
const div = document.getElementById('target');
div.classList.add('greet','blue');
```




##参考サイト
[JavaScriptのclassList.addメソッドを使ってclass属性を追加する方法を現役エンジニアが解説【初心者向け】]
(https://techacademy.jp/magazine/27026)
[JavaScriptのclassListを使ってみる]
(https://cly7796.net/blog/javascript/how-to-use-classlist/)
[【JavaScript】classListの使い方まとめ(add.remove.contains.toggle)]
(https://qiita.com/tomokichi_ruby/items/2460c5902d19b81cace5)
ひらがなの文字を小さい文字、濁音、半濁音に変換する

## なぜ作ったか
フリック入力の簡易的なプログラムを作っているときに作りました。
書くのが面倒なのでめんどくさがりな方は是非使ってください。

## ひらがなを大きい文字、小さい文字へ相互に変換する
ひらがなを与えると大きな文字、小さな文字に変換します。
アルファベットを与えると大文字小文字に相互変換する機能もついています。

```python
def komoji2oomoji(moji):
    if moji in "ぁぃぅぇぉっゃゅょ":
        henkan = str.maketrans("ぁぃぅぇぉっゃゅょ", "あいうえおつやゆよ")
        return moji.translate(henkan)
    elif moji in "あいうえおつやゆよ":
        henkan = str.maketrans("あいうえおつやゆよ", "ぁぃぅぇぉっゃゅょ")
        return moji.translate(henkan)
    elif moji in "ァィゥェォッャュョ":
        henkan = str.maketrans("ァィゥェォッャュョ", "アイウエオツヤユヨ")
        return moji.translate(henkan)
    elif moji in "アイウエオツヤユヨ":
        henkan = str.maketrans("アイウエオツヤユヨ", "ァィゥェォッャュョ")
        return moji.translate(henkan)
    elif moji in "abcdefghijklmnopqrstuvwxyz":
        henkan = str.maketrans("abcdefghijklmnopqrstuvwxyz", "ABCDEFGHIJKLMNOPQRSTUVWXYZ")
        return moji.translate(henkan)
    elif moji in "ABCDEFGHIJKLMNOPQRSTUVWXYZ":
        henkan = str.maketrans("ABCDEFGHIJKLMNOPQRSTUVWXYZ", "abcdefghijklmnopqrstuvwxyz")
        return moji.translate(henkan)
    else:
        return moji
```

## ひらがなを濁音に変換する
ひらがなを濁音に変換します。すでに濁音のものは元に戻します。
半濁音のひらがなも濁音に変換します。

```python
def dakuon(moji):
    if moji in "かきくけこさしすせそたちつてとはひふへほ":
        henkan = str.maketrans("かきくけこさしすせそたちつてとはひふへほ", "がぎぐげござじずぜぞだぢづでどばびぶべぼ")
        return moji.translate(henkan)
    elif moji in "カキクケコサシスセソタチツテトハヒフヘホ":
        henkan = str.maketrans("カキクケコサシスセソタチツテトハヒフヘホ", "ガギグゲゴザジズゼゾダヂヅデドバビブベボ")
        return moji.translate(henkan)
    elif moji in "がぎぐげござじずぜぞだぢづでどばびぶべぼ":
        henkan = str.maketrans("がぎぐげござじずぜぞだぢづでどばびぶべぼ", "かきくけこさしすせそたちつてとはひふへほ")
        return moji.translate(henkan)
    elif moji in "ガギグゲゴザジズゼゾダヂヅデドバビブベボ":
        henkan = str.maketrans("ガギグゲゴザジズゼゾダヂヅデドバビブベボ", "カキクケコサシスセソタチツテトハヒフヘホ")
        return moji.translate(henkan)
    elif moji in "ぱぴぷぺぽパピプペポ":
        henkan = str.maketrans("ぱぴぷぺぽパピプペポ", "ばびぶべぼバビブベボ")
        return moji.translate(henkan)
    else:
        return moji
```



## ひらがなを半濁音に変換する
ひらがなを半濁音に変換します。すでに半濁音のものは元に戻します。
濁音のひらがなも半濁音に変換します。

```python
def handakuon(moji):
    if moji in "はひふへほハヒフヘホ":
        henkan = str.maketrans("はひふへほハヒフヘホ", "ぱぴぷぺぽパピプペポ")
        return moji.translate(henkan)
    elif moji in "ぱぴぷぺぽパピプペポ":
        henkan = str.maketrans("ぱぴぷぺぽパピプペポ", "はひふへほハヒフヘホ")
        return moji.translate(henkan)
    elif moji in "ばびぶべぼバビブベボ":
        henkan = str.maketrans("ばびぶべぼバビブベボ", "ぱぴぷぺぽパピプペポ")
        return moji.translate(henkan)
    else:
        return moji
```
Terraform とは

## 勉強前イメージ

cloudformation的なやつ？

## 調査

### Terraform とは

HashiCorp社が手掛けた、OSSでIaCを行うためのツールです
IaCとはInfrastructure as Codeの略で、インフラをコード化するためのツールになります。
インフラの構成を記述することで、コードベースでのインフラ管理を行うことが出来ます。
また、コードでの管理を行うことでバージョン管理が可能になりました。

### メリット

- 少量の記述で宣言が可能

少量の記述で宣言が可能です。
workspaceという機能で環境を切り替えられて
リソースを再利用することが可能です。

- 検索のしやすさ

teraformを利用しているところが多く、
またいろんなサービスで利用することができるので
参考できるサイトが多く見られます。

### AnsibleやChef、cloudformationとの違いは？

イメージとしては以下に分類されます。
※必ずしも当てはまるものではないので、イメージとして認識していてください

- teraforma, cloudformation : インフラ環境の管理
- Ansible, Chef : サーバ内の設定管理

teraformとcloudformationは
例えばAWSでいうとEC2やVPC、サブネットを構築。
Ansible,ChefはEC2の中でapacheやDBなどの設定を行います。


## 勉強後イメージ

cloudformationと似たようなやつで
いろんなクラウドサービスで使えるようなやつ・・・って感じかな

## 参考

- [Terraformとは](https://y-ohgi.com/introduction-terraform/first/about/)
- [AWSでTerraformに入門](https://dev.classmethod.jp/articles/terraform-getting-started-with-aws/)
SSHとは (メモ)

AWSを利用してデプロイする方法を勉強中。
EC2のセッティングをしていた際に・・・
EC2のインタンスにディレクトリを変更する際に、ホームディレクトリから入ろうとしたら移動出来なかった。　一度、 sshに移動してから入る必要があるのだ。

## そもそも「ssh」って何？

私達の使っているパソコンから、サーバーを遠隔操作する。
遠隔操作する際に使う通信手段がSSH

昔はtelnet(何これ？テルネットって読むの？？)　を通信手段として使っていたが、
内容を暗号化したりよりセキュリティ面を強くしたのが <strong>`SSH`</strong> だ！

#### SSHクライアント（英：SSH client）とは

* SSHで接続「する方」のコンピュータのこと　　　　　あるいは
* SSHで接続するときに使うプログラムのこと　　　　  だそうです。　

> https://wa3.i-3-i.info/word17546.html
(参考記事)　めっちゃ分かりやすかった！

しょうもない内容ですが、メモ。
59日後にITパスポートを受けるFラン私大文系既卒(17日目)

# 関係データモデル
* 関係データモデルとは?
 * データの集まりを表形式で表すこと

# 複合主キー
* 複合主キーとは
 * 複数のフィールドを組み合わせて主キーにすること

# 正規化
* 正規化とは?
 * データが重複したり、データ更新の際に矛盾が生じないようにテーブルを分けること

# データベース管理システム
* データベース管理システムの3つの機能
 * データ操作
 * トランザクション管理
 * 排他制御

# データ操作
* データ操作の6つの分類
 * 選択
 * 挿入
 * 更新
 * 削除
 * 射影
 * 結合

# トランザクション管理
* トランザクション管理とは?
 * ユーザがDBMSに対して行う一連の命令を管理する機能
 * トランザクションとは、ユーザから見た1つの処理

# 排他制御
* 排他制御とは?
 * 複数人が同じデータを同時に更新しようとした場合にデータに矛盾が生じないようにする機能
 * ロックという機能を使う

# ロック
* ロックとは?
 * データベースに対する読み書きを一時的に制限する機能です
サイコロプログラムを作ってみた

今日学んだことをそのままアウトプット

#randメソッド
randメソッドはランダムな数値を表示させるときに使います。

```rb.
number = rand(1..6)
puts "サイコロの目は#{number}です"
```
今回はサイコロなので引数には(1..6)を渡すとサイコロプログラムの完成！
【WordPress】「MW WP-FORMを使っているページをリダイレクトさせる際、入力画面を一緒に修正しましょう」という学び

# 解決できるかもしれないこと
「WordPressにおいて、設定していないはずのリダイレクト処理を止めること」（検索用）

結論は掲題の通りです。
WordPressのテーマ作成やプラグインの設定、及びWP-FORMなどをご存知の方向けの記事です。

## 問題の経緯

#### やりたかったこと
- /hogeにアクセスした時に、/fugaへリダイレクトさせる
- /hogeで表示していたページを/newhogeにアクセスした際に表示させる

#### やったこと
- [Simple 301 Redirects](https://ja.wordpress.org/plugins/simple-301-redirects/)を導入、/hogeにアクセスした際に/fugaにリダイレクトさせるように設定
- /hogeの固定ページのURLスラッグを/newhogeに変更
- page-hoge.phpをpage-newhoge.phpにファイル名の変更

#### 起こったこと
- /hogeにアクセスして、/fugaにリダイレクトはできた
- <font color="Red">/newhogeにアクセスすると、なぜか/fugaに飛ぶ</font>

## 原因

原因は、/hogeで使用していたWP-FORMの設定をそのままにしていたことです。
具体的に説明します。

WP-FORMは設定画面から、このように入力画面などを決めることができます。

![スクリーンショット 2021-08-14 9.37.44.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/557847/dc745e13-6754-0093-2bbd-1a8cdcc9dcae.png)

※今は空欄になっていますが、こちらは全て入力済みでした。

根本的な原因は、この**入力画面URL**のところを/hogeと入力していたままにしていたためです。
本来は、このフォームの使用場所は/newhogeに変わるので、「/newhoge」を入力しなければなりませんでした。

## 感想や解決の経緯など
ただ、これを画面上で確認しようとすると、/newhogeにアクセスした段階で、なぜか/fugaに飛ぶので意味が分かりませんでした。リダイレクトのプラグインの原因かとも迷いました…。

発見に至った経緯としては、検証ツールのNetworkタブを確認したことが大きなきっかけです。
/hogeから/fugaへのアクセスは301のステータスになっていましたが、

**/newhogeにアクセスしてから/fugaに飛ぶまでの挙動を見てみると、綺麗にリダイレクトされているのではなく、page-newhoge.phpでエラー処理が走ってから、/hogeに飛び、さらに/fugaに飛んでいました。**

2回りダイレクトされているということですね。

該当のエラーを見てみると、このような表示がされていました。

```html:page-hoge.php
      <div name="contact__form" class="contact__content__tel">
        <div class="contact__form">
          		<script type="text/javascript">
		window.location = "https://hogehogehoge.hoge";
		</script>
		<div id="mw_wp_form_mw-wp-form-xxxx" class="mw_wp_form mw_wp_form_direct_access_error">
				このページには直接アクセスできません。
			<!-- end .mw_wp_form --></div>        </div>
      </div>
```

こいつか…！

で、設定を見に行ったら入力画面を変えていないことに気づいたという所存です。
ページだけが変わると、入力画面で矛盾が起きるので、こういうことになってしまったわけですね。

## まとめ
MW WP-FORMを使っているページをリダイレクトさせる際は、入力画面を一緒に修正しましょう。
WSL2のUbuntuが起動しない

久しぶりにWSL2のUbuntuを起動したら、以下のメッセージ…
WslRegisterDistribution failed with error: 0x8007273f
とりあえずubuntuを再インストールしてみたが、解決せず。。

いろいろ調べると以下の対処を行うと良いとのこと。
プログラムと機能／Windowsの機能の有効化または無効化から
「Linux用Windowsサブシステム」と「仮想マシンプラットフォームを」
をチェック外して再起動、再起動後に再度チェックして再度再起動

で…NGでした。

解決策
いくら調べても不明なのでWindows10の再インストールを決行。
下記の
https://www.microsoft.com/ja-jp/software-download/windows10
インストールディスクを作成し、Windowsのみ再インストール

で、ubuntuを再インストールし起動すると今度は以下のエラーが出る
WslRegisterDistribution failed with error: 0x800701bc
以下を再インストールする。
x64 マシン用 WSL2 Linux カーネル更新プログラム パッケージ
https://wslstorestorage.blob.core.windows.net/wslblob/wsl_update_x64.msi
をインストール後に再起動で、ちゃんと起動しました。
AtCoderログ：0073 - ABC 081 C

# 問題

https://atcoder.jp/contests/abc081/tasks/arc086_a

## 問題文
> 高橋君は，$N$ 個のボールを持っています． 最初，$i$ 番目のボールには，整数 $A_i$ が書かれています．
> 高橋君は，いくつかのボールに書かれている整数を書き換えて，$N$ 個のボールに書かれている整数が $K$ 種類以下になるようにしたいです．
> 高橋君は，少なくとも何個のボールの整数を書き換える必要があるでしょうか？

## 制約
> ・$1 \le K \le N \le 200000$
> ・$1 \le A_i \le N$
> ・与えられる数値はすべて整数

## 収録されている問題セット
- [AtCoder に登録したら次にやること](https://qiita.com/drken/items/fd4e5e3630d0f5859067) ([第07問類題](https://qiita.com/drken/items/fd4e5e3630d0f5859067#%E7%AC%AC-7-%E5%95%8F--abc-085-b---kagami-mochi-200-%E7%82%B9))

# 回答
## 回答1 (AC)
どの番号のボールが何個あるかを調べる必要がありますが、今回の場合、番号は高々 $N \le 200000$ 種類なので、配列 number を用意し、number.at(i) で番号 i の個数を保持することにします。

求めたいのは番号を書き換えるボールの個数の最小値ですが、書き換える個数を最小にするには書き換えない個数を最大にする必要があります。そこで、配列 number を降順 (多い順) にソートしてボールの個数が多い最初の k 項を書き換えないことにすれば、その個数が最大となります。よって書き換えるボールの個数は k+1 項目から最後の項までの和となります。

ここまでの処理をまとめると以下のコードになりました。

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

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

  vector<int> a(n);
  for ( int i=0; i<n; i++ ) {
    cin >> a.at(i);
  }
  
  vector<int> number(n,0);
  for ( int i=0; i<n; i++ ) {
    number.at(a.at(i)-1)++;
  }
  sort( number.rbegin(), number.rend() );
  int sum = 0;
  for ( int i=k; i<n; i++ ) {
    sum += number.at(i);
  }

  cout << sum << endl;
}
```
上のコードは $N$ 回の繰り返しと $N$ 個の要素のソートを処理しているので、計算量は $O(M+N \log{N})=O(N \log{N})$ です。

# 調べたこと
## [AtCoder の解説](https://atcoder.jp/contests/abc081/tasks/arc086_a/editorial) → [ユーザ解説](https://blog.hamayanhamayan.com/entry/2017/12/10/224259)
回答1と同じ方針でした。

## [AtCoder の解説](https://atcoder.jp/contests/abc081/tasks/arc086_a/editorial) → [公式解説](https://img.atcoder.jp/arc086/editorial.pdf)
回答1と同じ方針でした。

# リンク
## 前後の記事
- 前の記事 → [AtCoderログ：0072 - 三井住友信託銀行プログラミングコンテスト2019 B](https://qiita.com/RoadLynton/items/7cf8c190b914ba4dd200)
【Ruby on Rails】ルートパスの設定方法


#対象者

* トップページを作っている方


#目的

* ルートパスを設定して、遷移先を決める

#実際の手順と実例
###1.routes.rbへの設定

```
root to:  'コントローラ名#アクション名'
```

````routes.rb
root to: 'home#top'
````

これで設定完了です。

例えば下記のようにリンクを貼るとトップページに遷移できます。

```
<%= link_to 'TOPページ', root_path %>
````


ちなみに、こんな書き方もありです。

````
root :to => 'コントローラ名#アクション名'
```

#参照

>[Ruby on Railsでrootへのルーティング設定方法【初心者向け】](https://techacademy.jp/magazine/7131)


####投稿者コメント
ルートパスに関してまとめてみました！
基本大事！！！！！

####My Profile
プログラミング学習歴３ヶ月目のアカウントです！
プログラミングスクールで学んだ内容や自分が躓いた箇所等のアウトプットの為に発信しています。
また、プログラミング初学者の方にわかりやすく、簡潔にまとめて情報共有できればと考えています。
もし、投稿した記事の中に誤り等ございましたら、コメント欄でご教授いただけると幸いです。
jQueryの基礎

jQueryの勉強で記載してます！！！ 
 
- []はeq()でかく(要素の順番を指定できる)

```
document.querySelectorAll('ul > li')[2].remove();
= $('ul > li').eq(2).remove();
```
- 基本形、この中に書いていくイメージ

```
$(() => {
    
});

```
 - つなげてかける（メソッドチェーンという）

```
$('p').text('おはよう');
$('p').addClass('red-text');
＝$('p').text('おはよう').addClass('red-text');
```
 - <>があることで新規追加の意味になる。ないと既存のli要素の取得の意味になる。 

```
$('<li>')
```

 - 要素の追加

```
.appendTo(セレクター);
```

 - 定数を定義できる、その後使いまわせる

```
const $input = $('input');
```

 - jqのオブジェクトじゃないとjqのメソッドは使えない。fadeOoutのために$()で囲む必要がある。
 
```
$('ul').click(e => {
        if (e.target.nodeName !== 'LI' || !confirm('削除大丈夫？？？')) {
            return;
        }
        $(e.target).fadeOut();
});
```
 - jqの読み込み方は下記のコードをheadタグで読み込む

```
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
```
デザイナのためのWeb制作基礎カリキュラム

デザインスキルを除くWeb屋さんになるためのカリキュラムです。

# １．インターネットとは


### [1.1 インターネット基礎](https://qiita.com/rougherina/private/2537378b09f3473e45b7)
### [1.2 無料のホスティングサービスを使う](https://qiita.com/rougherina/private/e246fedf0e1f4b95c262)

# ２．Chromeデベロッパーツール

### [2.1 Chromeデベロッパーツールの使い方](https://qiita.com/rougherina/private/5df63496954c4609ca7a)

# ３．HTML基礎

### [3-1 HTMLタグ、HTML基本形](https://qiita.com/rougherina/private/df3b1c141acce72ef53e)
### [3.2 HTMLだけでWebページを作ってみよう](https://qiita.com/rougherina/private/5160e95567e7879d5382)
### [3.3.1 HTML演習](https://qiita.com/rougherina/private/9bf6c49082ca72423bf5)

# ４．CSS基礎

### [4-1 CSS基礎](https://qiita.com/rougherina/private/045fb45a578695af1a71)
### [4-1 CSS基礎　補足](https://qiita.com/rougherina/private/4b6921185f83ac847625)
### [4-2 CSS ボックスモデル](https://qiita.com/rougherina/private/64714a7c344fd6b0e92f)
### [4-3.1 CSS演習1](https://qiita.com/rougherina/private/22ce5385c0be94ceef2b)
### [4.3.2 CSS演習2](https://qiita.com/rougherina/private/715971ee692d10c3040f)
### [4.3.3 CSS演習3](https://qiita.com/rougherina/private/e3bd68bfd7cf9492c086)

### [4.4 FlexBox](https://qiita.com/rougherina/items/8a32a5fb632f2b0a1cd7)
### [4.5 Grid Layout](https://qiita.com/rougherina/items/5716178d908ab9387a3a)

### [4.6 幅、高さ等の単位について](https://qiita.com/k-penguin-sato/items/786ffb8cc418cbdecc02)

# ５．CSS応用

### [5.1 Sassとは](https://qiita.com/rougherina/items/b25975fddad416f22031)
### [5.2 Webフレームワークの紹介]()

# ６. レスポンシブ

### [5-1 レスポンシブ基本](https://qiita.com/rougherina/private/6b85cd2b2f5ba18de67a)
#### 5-1-1 レスポンシブ基本 無料テンプレート

便利ですね。無料のテンプレートもインターネットにはたくさんあります。
画像を変えたりするだけでも使用できますね。用途は限られますが。 

- https://f-tpl.com/template/
- https://template-party.com/

# ７. レスポンシブのテクニック


# ８．Javascript基礎

### [8.1 Javascriptを触ってみよう](https://qiita.com/rougherina/private/b6a928ac9c229b20dc6a)

### [8.2 基本構文（変数とは、if文, switch文, for文, while文について）](https://qiita.com/rougherina/private/3c4e3307dfee6bd59c5f)

#### [8.2 補足](https://qiita.com/rougherina/private/4b36d4309e0970f849f4)

### [8.3 関数](https://qiita.com/rougherina/private/be23b521df512d3777a8)

# ９．Javascript応用(jQuery)

### [9.1 jQueryとは](https://qiita.com/rougherina/private/163dabf647970333e2b8)
### [9.2 Bootstrap](https://qiita.com/rougherina/private/0e988ee03049e9d12616#fnref-1)

# １０．レンタルサーバの契約、アップロード

# １１．実習（ポートフォリオサイト作成）

- [初級編](https://qiita.com/rougherina/private/6f64224cf6ff7e7e71e7)
- [初級編２](https://qiita.com/rougherina/private/240be1ec5616babf2d57)

# [１２．最後に復習と補足](https://qiita.com/rougherina/private/0615416b25736f9a9764)

# その他Tips

### [Tips集](https://qiita.com/rougherina/private/13eefe1fa59477fc4db5)
### [SEOとは](https://qiita.com/rougherina/private/cfec6dcc3e81e84c1e5e)
### [GoogleAnalytics](https://qiita.com/kamisho/items/dade4b6db4b18df71f99)
転職活動


## Webアカウントの作成・提示
相手先に自身のWebアカウントを提示する（提示は職務経歴書内で行う形）
具体的には下記のアカウント。

GitHub
Qiita
SlideShare
他にも技術系のWebサービスを積極的に利用していれば、そちらのアカウントを提示する（自分の場合はteratail）
StackOverflowを積極利用していれば、そちらのアカウント名になるはず。

技術ブログがあれば、そのURLも共有する（自分の場合はQiitaがそれ）。
その他差し支えなければ、Twitter, Facebookアカウントも提示する。

## 履歴書
URL共有
WantedlyのプロフィールページのURL共有。
この形式で問題ない企業に対しては、これが一番早い。
そしてこの業界だと問題ないケースが多い。
人事に共有する場合は、通常の共有URLではなく「限定公開URL」を共有すること。
通常の共有URLだと設定によるが公開範囲が限られており、見せたい情報を共有できない可能性が高い。
履歴書の磨き込みはWantedlyのプロフィールの更新という形に注力できる。
海外向けの場合はLinkedInの方が良い。
海外のエンジニアは転職にLinkedInを活用している。
印刷する場合
PCで作成する。
手書きなんか必要ない。
PCの最低限のスキルも示せるので、PCで作らない理由がない。
データの更新が容易。
写真込みで印刷ができる（写真は白黒で良い）
JIS規格のフォーマットをハローワークのWebサイトで配っているので利用する。
履歴書・職務経歴書の書き方 - ハローワーク
## 職務経歴書
職務経歴書OSS化の記事のようにGitHubリポジトリのURL共有が早い。
スキルがわかればよいため、紙にこだわる必要はなく、形式はなんでも良いとのこと（人事担当者より）。
Web業界のスキルについては紙で表現しにくいので、GitHubを活用する形が良い。
コミットとして更新が残せたり、GitHub上にあれば更新端末を選ばなくなるので都合が良い。
スキルが分かるもの
こちらもGitHubのURLで共有する形で良い。
Readmeにスキルが分かるポートフォリオ、コードのURLを一覧化して共有する。
フロントエンドのコード共有だと、Codepen、jsdo.it、jsFiddle などが活用できる。
もちろん利用するサービスのアカウントは作成しておくこと。
自作の解説記事があれば、サンプルコードと併せてリンクしておくと、よりアピールできると考えている。
必要があれば、GitHub Pagesも活用する。
## 備考
URL共有は意外と問題ない。
就活の段階になっていきなり作り出すより、普段からコードを書くようにしておき、就活時にそれを集約する形の方がまとめるだけでよいので、手早く作れる。
普段からいろんな事をコードにしたり、記事にまとめておく癖があると、非常に楽である。
JavaScript　配列　オブジェクト

JavaScriptの学習の備忘録と振り返りの記事です。
何かの参考になれば幸いです。
付け足しや訂正などある場合ご教授いただけると
大変嬉しく思います！！

#配列とは
複数の値(要素)をまとめて管理するときに用いるもの
**書き方**
[値１,値２,値３]

**代入の仕方**
<details><summary>const 定数名 = ["値１","値２","値３"];</summary><div>

```js
const favorite = [movie,interior,art];
```

</div></details>

**要素の取得の仕方**
<details><summary>console.log(配列名[インデックス番号]);</summary><div>

```js
console.log(favorite[movie]);
```
:::note warn
インデックス番号は「０」から数える
:::

</div></details>

**値の更新の仕方**
<details><summary>配列名[インデックス番号]　= 新しい値;</summary><div>

```js
favorite[1] = "shopping";
```

</div></details>

##オブジェクトとは
オブジェクトは配列と同じく複数のデータをまとめて管理するのに用います。
それぞれの値にプロパティと呼ばれる名前をつけて管理します。
**書き方**
<details><summary>{プロパティ１:値１,プロパティ2:値2,プロパティ3:値3,};</summary><div>

```js
{ breakfast:1 ,lunch:5 ,dinner:4 };
```
:::note warn
プロパティーと値はコロン「:」で繋ぐ
:::

</div></details>

**代入の仕方**
<details><summary>const 定数名 = {プロパティ１:値１,プロパティ2:値2,プロパティ3:値3,};</summary><div>

```js
const meal = { breakfast:1 ,lunch:5 ,dinner:4 };
```

</div></details>

**値の取得の仕方**
<details><summary>console.log(オブジェクト名.プロパティ名);</summary><div>

```js
console.log(meal.lunch);
```
**出力結果**
5

:::note warn
プロパティーと値はドット「.」で繋ぐ
:::

</div></details>

**値の更新の仕方**
<details><summary>オブジェクト名.プロパティ名 = 新しい値;</summary><div>

```js
meal.breakfast = 0;
```

:::note info
『配列、オブジェクト共通』
・繰り返し処理の方法
定義の後にfor文で作り『console.log( 配列名[ for文で作った変数] ) 』　で要素を取得

・要素数取得方法
配列.length　 と書く　『console.log(meal.length);』
出力結果⇨『３』

:::

</div></details>
Salesforceで総計サマリーレポート

# 標準レポート

+ フィールドウィンドウの[数式]で、[数式の追加]をダブルクリックします。
+ 式の名前とその目的の簡単な説明を入力します。
+ 「フォーマット」選択リストから、「パーセント」を選択します。
+ 「小数点以下の桁数」で、表示する小数点以下の桁数を選択します。
+ Salesforceが計算式を表示する表示領域を選択します
+ 行ごとにパーセンテージを計算する場合は、Grouping1を選択します。
+ 注：数式を作成する前にレポートがまだグループ化されていない場合、Grouping1は表示されません。
+ 要約レベルでグループ化してフィールドのパーセンテージを表示するには、「RowCount」を選択します。これは、各グループの行の総数を考慮し、式構造PARENTGROUPVAL（summary_field、grouping_level）を使用します。

+ 総合計との割合

```
RowCount / PARENTGROUPVAL(RowCount, GRAND_SUMMARY)
```
+ 小計ごとの中での割合

```
RowCount/PARENTGROUPVAL(RowCount, ROW_GRAND_SUMMARY) 
```

+ [PARENTGROUPVALを使う時に注意](https://trailhead.salesforce.com/trailblazer-community/feed/0D54S00000LIPgpSAH)

もう一つ設定がある
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/328136/551e3ff8-da76-dff2-8062-8657ba78900a.png)


# カスタムレポート

カスタムレポートを使用して上記の手順を実行すると、エラーが発生します。マトリックス形式のレポートでは、数式「RowCount / PARENTGROUPVAL（RowCount、GRAND_SUMMARY）」は、Error: Invalid custom summary formula definition: Incorrect number of parameters for function ‘PARENTGROUPVAL().’ Expected 3, received 2

このエラーは、このレポート形式に3つのパラメーターを定義する必要があるために発生します。たとえば、次のようになります。PARENTGROUPVAL（summary_field、parent_row_grouping、parent_column_grouping）

ありがたいことに、このエラーは簡単に修正できます。あなたがしなければならないのは、わずかに異なる式を使用することです。マトリックス形式のレポートの場合、完全な式は次のようになります。


```
RowCount / PARENTGROUPVAL(RowCount, ROW_GRAND_SUMMARY, COLUMN_GRAND_SUMMARY)
```

[How to Generate Grand Total Summary Reports in Salesforce](https://cloudmybiz.com/how-to-generate-grand-total-summary-reports-in-salesforce/)

# レポートでグループごとの割合を計算

[PARENTGROUPVALでのエラー](https://note.com/relaxedly/n/nd957d2e05e0a)

# 解決例

[Custom formulae to work at summary & grand summary (PREVGROUPVAL)?](https://trailhead.salesforce.com/ja/trailblazer-community/feed/0D54S00000A7vBtSAJ)

# レコード数ではなく金額に基づいて勝率を計算します。

カスタムフィールドを使用

```
Opportunity.Amount_Won__c：SUM 
 / 
Opportunity.Amount_Closed__c：SUM
```

[Calculate win % based on amount not record count.](https://trailhead.salesforce.com/ja/trailblazer-community/feed/0D54S00000A7ywuSAB)

# 重複を見つけるためのレポート

[Salesforce Tip: How to Quickly Find Duplicate Accounts and Contacts](https://backofficethinking.com/blog/salesforce-tip-how-quickly-find-duplicate-accounts-and-contacts)

# PARENTGROUPVAL関数

[添付画像のE列［αの割合］を、レポートに表示させたいです](https://trailhead.salesforce.com/ja/trailblazer-community/feed/0D54S00000BtCO9SAN)

[Need help with PARENTGROUPVAL](https://trailhead.salesforce.com/ja/trailblazer-community/feed/0D54S00000DfYLzSAN)

[レポートの合計に対する割合を出す計算式](https://trailhead.salesforce.com/ja/trailblazer-community/feed/0D54S00000EoVmz)

# Molis Steve

[Lightning Report Formula Editor](https://trailhead.salesforce.com/ja/trailblazer-community/feed/0D54S00000E97ZTSAZ)

# 集計

```
CONVERTED:SUM/RowCount
```

[Formula for working out the percentage of leads converted from total leads](https://trailhead.salesforce.com/ja/trailblazer-community/feed/0D54S00000EoVsTSAV)
MySQLではDELETEやUPDATE文のサブクエリで更新対象のテーブルを指定できない

# 例題
以下のテーブルのうち、

| コード | 日付     |
| ------ | -------- |
| 1      | 20210801 |
| 1      | 20210802 |
| 2      | 20210701 |
| 2      | 20210702 |
| 3      | 20210801 |
| 3      | 20210802 |
| 3      | 20210803 |
| 4      | 20210601 |

UPDATEのケース：コード内で日付が最大のレコード以外の日付を0に更新する
DELETEのケース：コード内で日付が最大のレコード以外のレコードを削除する
以上の条件で更新の対象となるレコードは以下の通り

| コード | 日付     | 対象 |
| ------ | -------- | ---- |
| 1      | 20210801 | ○    |
| 1      | 20210802 |      |
| 2      | 20210701 | ○    |
| 2      | 20210702 |      |
| 3      | 20210801 | ○    |
| 3      | 20210802 | ○    |
| 3      | 20210803 |      |
| 4      | 20210601 |      |


# スキーマ
```SQL
CREATE TABLE `テーブル`
    (`コード` int, `日付` int);

INSERT INTO `テーブル`
VALUES
    (1, 20210801),
    (1, 20210802),
    (2, 20210701),
    (2, 20210702),
    (3, 20210801),
    (3, 20210802),
    (3, 20210803),
    (4, 20210601);
```
# 対象レコードを抽出するSELECT文

```SQL
SELECT *
FROM テーブル AS Z
WHERE 日付 < (SELECT MAX(日付)
              FROM テーブル AS A
              WHERE A.コード = Z.コード
              )
```

| **コード** | **日付** |
| ---------- | -------- |
| 1          | 20210801 |
| 2          | 20210701 |
| 3          | 20210801 |
| 3          | 20210802 |

# 一般的なＳＱＬの構文

## UPDATE文
```SQL
UPDATE テーブル AS Z
SET 日付 = 0
WHERE 日付 < (SELECT MAX(日付)
              FROM テーブル AS A
              WHERE A.コード = Z.コード
              );
```

## DELETE文
```SQL
DELETE
FROM テーブル AS Z
WHERE 日付 < (SELECT MAX(日付)
              FROM テーブル AS A
              WHERE A.コード = Z.コード
              );
```

上記はMySQLでは以下のエラーとなります
```You can't specify target table 'Z' for update in FROM clause```
DeepLで翻訳すると
```FROM句で更新対象のテーブル'Z'を指定できない```

# MySQLでの対処方法

サブクエリ部分を1階層深くして、更新文のFROM句で指定したテーブルをサブクエリで直接参照しないようにします

## UPDATE文
```SQL
UPDATE テーブル AS Z
SET 日付 = 0
WHERE (コード,日付) IN(SELECT *
                      FROM (SELECT コード, 日付
                            FROM テーブル AS Z
                            WHERE 日付 < (SELECT MAX(日付)
                                          FROM テーブル AS A
                                          WHERE A.コード = Z.コード
                                         )
                           ) SUB
                      );
```

## DELETE文
```SQL
DELETE 
FROM テーブル
WHERE (コード,日付) IN(SELECT *
                      FROM (SELECT コード, 日付
                            FROM テーブル AS Z
                            WHERE 日付 < (SELECT MAX(日付)
                                          FROM テーブル AS A
                                          WHERE A.コード = Z.コード
                                         )
                           ) SUB
                     );
```
ATtiny85のベンチマーク


# ATtiny85ベンチマーク
[こちらのベンチマーク](https://qiita.com/infinite1oop/items/4b658d9eded09c360b6b)の続きである。

## Dhrystoneはダメだった
本当はDhrystoneを動作させたかったが、ATtiny85の容量が足りず、プログラムをそのままの形では実行できず断念。

## 代わりに
どこかのページ（失念）を参考に、四則演算を繰り返し行うソースコードをつくり、Arduino(ATmega328p)と比較することにした。

### ATtiny85の結果をArduinoに転送
[こちらのソフトウェアシリアル手法](https://qiita.com/infinite1oop/items/6e45a01b903b8d6f1a69)を使ってATtiny85の計算結果をArduinoに転送した。この方法だと、残念ながら、ATtiny85のクロックは1MHzとなってしまう（本来は20MHz?）。なおArduinoのクロックは16MHzである。

### ATtiny85およびArduino共通ソースコード
Benchmarkとして適切かどうかは不明であるが、10000回、四則演算した時間を計測する。

```c++
#define NUM 1000*10
char buf[128];
void pseudo_benchmark() {
  volatile float value; // "volatile" is necessary.
  uint32_t t0, t1, len, i;

  memset(buf, 0, sizeof(buf));
  sprintf(buf, "\nATtiny85-Start\n");  // ここは「ATtiny85」または「Arduino」となる
  t0 = millis();
  value = 1.0;
  for (i = 0; i < NUM; i++) {
    value += 0.1;
  }
  t1 = millis();
  sprintf(buf+strlen(buf), " +: %d\n", t1 - t0);

  t0 = millis();
  value = 12345678.0;
  for (i = 0; i < NUM; i++) {
    value -= 0.1;
  }
  t1 = millis();
  sprintf(buf+strlen(buf), " -: %d\n", t1 - t0);

  t0 = millis();
  value = 1.0;
  for (i = 0; i < NUM; i++) {
    value *= 1.1;
  }
  t1 = millis();
  sprintf(buf+strlen(buf), " *: %d\n", t1 - t0);

  t0 = millis();
  value = 12345678.0;
  for (i = 0; i < NUM; i++) {
    value /= 1.1;
  }
  t1 = millis();
  sprintf(buf+strlen(buf), " /: %d\n", t1 - t0);

  sprintf(buf+strlen(buf), "ATtiny85-End\n");  // ここは「ATtiny85」または「Arduino」となる
}
```

### ATtiny85ソースコード
```c++:ATtiny85PseudoBenchmark.ino
#include <SoftwareSerial.h>
SoftwareSerial mySerial(3, 4); // RX, TX

// ここに上記の共通ソースコードあり

void setup()
{
  mySerial.begin(4800);
  pseudo_benchmark();
}

void loop()
{
  if (mySerial.available()) {
    (void)mySerial.read(); // throw away
    for (int i = 0; i < strlen(buf); i++) {
      mySerial.write(buf[i]);
    }
  }
}
```

### Arduinoソースコード
```c++:ArduinoPseudoBenchmark.ino
#include <SoftwareSerial.h>
SoftwareSerial mySerial(10, 11); // RX, TX

// ここに上記の共通ソースコードあり

void setup()
{
  Serial.begin(9600);
  mySerial.begin(4800);
  pseudo_benchmark();
  Serial.println(buf);
}

void loop() // run over and over
{
  if (Serial.available()) {
    String data = Serial.readStringUntil('\n');
    mySerial.write('S'); // sending dummy date to start ATtiny85.
  }
  if (mySerial.available()) {
    Serial.write(mySerial.read());
  }
}
```

起動時にベンチマークのもととなる計算を実施。ソフトウェアシリアルを使って、ArduinoとATtiny85とを接続する。Arduinoに接続されたPCから何かを入力すると、ArduinoからATtiny85へコマンド（'S'）を送り、ATtiny85は結果をArduinoに返し、ArduinoはPCに計算結果を表示。


## 結果
![比較.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/634816/8f838726-1a81-0a02-baa3-26879a1fac49.png)

ここで、ATtiny85のクロックは1MHz、Arduinoのクロックは16MHz。比較という視点では、ほぼ、相当する結果が得られているようだ。
FreeBSD 12.2Rのソース

FreeBSDは13Rからソース管理をgitに移行しましたが、12.2はsvnで管理されています。gitはハッシュベースでの管理ですがsvnはレビジョンでの管理になります。現在スケジュールにのってる12.3Rもsvn管理になると思われますが、これが最後になるでしょう。

13Rでいろいろデバイスが消されたり、mipsがclangになって動かなくなったりしているので、12Rは結構重要です。

freebsd-updateで最新の状態にした場合は下記のソースが利用されています。

https://svnweb.freebsd.org/base/releng/12.2/

このソースはgitにもミラーされていて、ここにもあります。

https://cgit.freebsd.org/src/log/?h=releng/12.2

と思ったのですが、実際はgitがマスターでsvnにコピーしているようです。

githubにもミラーがあります。

https://github.com/freebsd/freebsd-src/tree/releng/12.2

svnの使い方は忘れてしまったので、gitで本家からこれで取得できます。

```
%  git clone -b releng/12.2 --depth 1 https://git.freebsd.org/src.git src
```

パッチが出たときはgit pullすればその時点のソースを引き出せます。

実際インストールされているFreeBSDのバージョンはfreebsd-versionコマンドで確認できます。

パッチについての説明はここにありますが、まとまってないのでわかりにくいです。

https://www.freebsd.org/security/advisories/

インストールされたホストからレビジョンを確認する方法はないのかな？

FreeBSD/mipsは結局14Rで消されることになりました。13Rでclangになって起動できなくなっていたので、まともに使えるのは12-STABLEまでです。

ZRouterでfreebsd-srcをforkして自前の修正を入れたyamoriu813_modifyというブランチを作っています。本家の差分は以下で取り入れてます。

```
% git pull https://github.com/freebsd/freebsd-src.git stable/12
```
日記；回すだけ⑦Beckhoffのカプラの準備

　オムロンのNXシリーズは、エラーがなくならないので取り去りました。Beckhoffのカプラとモジュールだけにし、新たにモジュールを追加しました。
![IMGP0741.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/407635/edde05f8-3bbb-6141-30ea-98d690561f31.png)
　左から、

- EK1100　EtherCATカプラ
- EL2008　ディジタル出力（8チャネル。確認用LEDだけを利用）
- BK1250　EバスとKバスの信号変換器
- KL1002　ディジタル入力（2チャネル）
- KL3102　アナログ入力（2チャネル）
- WAGO 750-600（終端）

　ELシリーズだけであればBK1250は不要です。終端はWAGOの製品ですが、挿し込んだら認識したのでそのまま使っています。アナログ入力は、今回使っていません。
###ディジタル入力KL1002の特徴
- チャネル数　2
- Lowレベル　-3～5V
- Highレベル　15～30V

　チャネル0には光電スイッチ、チャネル1には近接スイッチをつないでいます。いずれもアマゾンで入手しました。

● **光電スイッチ**
　　「 [【2021年お正月スペシャル】光電スイッチセンサー、E3JK-DS30M1 E3JK-DS30M2検知距離30CM拡散センサースイッチ(2＃)](https://www.amazon.co.jp/gp/product/B08HHZRWPM/ref=ppx_yo_dt_b_search_asin_title?ie=UTF8&psc=1)」

- 電源電圧　AC90～250V
- 応答時間　30ms
- 検出距離　30cm
- ケーブル色　電源；青色と茶色、共通；白色、NC；グレイ、NO；黒色（使わず）

●**近接（電磁）スイッチ**
　　「[uxcell 近接スイッチ DC 6-36V NPN NO SN04-N スイッチ検出 アプローチ誘導センサ近接](https://www.amazon.co.jp/uxcell-%E8%BF%91%E6%8E%A5%E3%82%B9%E3%82%A4%E3%83%83%E3%83%81-SN04-N-%E3%82%B9%E3%82%A4%E3%83%83%E3%83%81%E6%A4%9C%E5%87%BA-%E3%82%A2%E3%83%97%E3%83%AD%E3%83%BC%E3%83%81%E8%AA%98%E5%B0%8E%E3%82%BB%E3%83%B3%E3%82%B5%E8%BF%91%E6%8E%A5/dp/B00JR6O0WC/ref=sr_1_57?__mk_ja_JP=%E3%82%AB%E3%82%BF%E3%82%AB%E3%83%8A&dchild=1&keywords=GRAVITY+SN04-N+30V&qid=1628832700&sr=8-57)」

- 電源電圧　DC6～36V
- 検出物　鉄
- 検出距離　4mm
- ケーブル色　電源；黒色、出力（NPN NO）；茶色、GND；青色
- 負論理で使っている

 ![IMGP0733.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/407635/a3ae7967-dd1e-14c4-941a-90b313ee766c.png)

###ディジタル出力EL2008の特徴
- チャネル数　8
- Highレベル　24V（標準15mA）

###電源
　24Vを2系統用意しました。1系統は、カプラEK1100と信号変換器BK1250の電源およびEPOS4用です。もう1系統は、モジュール用の電源です。

<img width="350" alt="ファイル名" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/407635/397b3838-20bf-ad7e-f01d-580266b9cb02.png">

###EPOS4
　モータ・コントローラは、「Maxon EPOS4 Compact 24/1.5 EtherCAT、デジタル位置制御ユニット、 1.5 A、10 - 24 VDC」を使いました。第1回と同じもので、一番小型のモータに対応したモデルです。
　EtherCATは一般のLANケーブルで接続します。PCからはEK1100　EtherCATカプラのINにつなぎ、OUTからEPOS4のINにつないでいます。OUTは解放したままです。
ISBLANK

# ISBLANK使用時の検討

[ISBLANK not working properly in formula field in auto-launched Flow?](https://trailhead.salesforce.com/ja/trailblazer-community/feed/0D54S00000A7dCLSAZ)

Similar issues have been reported with ISBLANK function and text attributes. A common workaround is to compare the length of the text attribute (field) and compare it with 0. You can try it out and see if it work. The other workaround you have mentioned also works.


ISBLANK関数とテキスト属性でも同様の問題が報告されています。一般的な回避策は、テキスト属性（フィールド）の長さを比較して0と比較することです。試してみて、機能するかどうかを確認できます。あなたが言及した他の回避策も機能します。

ロングテキスト、テキストエリアでは機能しないようです。
Isblank won't work with a long text area and therefore your 3rd approach should. Are you able to retry with your 3rd approach as this should work


+ [Validation Rule with Long Text area not working](https://trailblazers.salesforce.com/answers?id=9064S000000D8boQAC)
+ [Validation Rule help](https://trailblazers.salesforce.com/answers?id=9063A000000sxyeQAA)

text型で比較するときは長さゼロで判断させたほうがいいとのこと。

この時には
Incorrect argument type for function ISBLANK()　というエラーになっているかもしれません。

チェックボックスの時も同じエラーになるみたい。

[ISBLANK() Function Returning Error for a Checkbox Field](https://trailblazers.salesforce.com/answers?id=9063A000000ii9NQAQ)

# 関連する記事

+ [ISBLANK,BLANKVALUEのﾄﾗﾌﾞﾙ回避](https://trailhead.salesforce.com/en/trailblazer-community/feed/0D54S00000FQrdYSAT)
【Rails】初めてRailsの仕事をするときに知っておきたかったこと（基本篇）

# 概要
突然、Railsを使っている仕事を任された時になにをすればいいだろうか？（私は困りました。。。）
仕様書やE-R図などのドキュメントの場所を聞く？ どういった処理なのか先輩社員など詳しい人に聞く？
でもそんな都合の良いドキュメントはない。先輩も忙しくて聞く暇がない。
そんな時に自力である程度は調べる方法を記載する。

# 1.Railsのルーテイングを調べる
`rails routes`コマンドでルーテングを調べる。
基本的にRailsの作法を守っていればAPIに関連するコントローラーが割り出せる。

↓のコマンドで新たに作成したアプリ。

```
$ rails g scaffold Tweet title:string content:text
```

↑のコマンドで実行した場合のアプリのルーティング

```
$ rails routes
    Prefix Verb   URI Pattern                Controller#Action
    tweets GET    /tweets(.:format)          tweets#index
           POST   /tweets(.:format)          tweets#create
 new_tweet GET    /tweets/new(.:format)      tweets#new
edit_tweet GET    /tweets/:id/edit(.:format) tweets#edit
     tweet GET    /tweets/:id(.:format)      tweets#show
           PATCH  /tweets/:id(.:format)      tweets#update
           PUT    /tweets/:id(.:format)      tweets#update
           DELETE /tweets/:id(.:format)      tweets#destroy
```

`Controller#Action`がAPIで使用されるコントローラーのアクションとなる
今回であれば、`tweets_controller.rb`のアクションが関連する。
より細かいルーティングに関しては`routes.rb`を確認しよう。

# 2.モデルに紐つくアソシエーションを調べる

`モデル名.reflect_on_all_associations`
で各モデルに紐ついているアソシエーションを調べることができる。
これでモデル同士の関連を調べることができる（多対多、1対多など）

```
# 全部
$ Account.reflect_on_all_associations

# belongs_to だけ
$ Account.reflect_on_all_associations(:belongs_to)

# has_many だけ
$ Account.reflect_on_all_associations(:has_many)

# has_one だけ
$ Account.reflect_on_all_associations(:has_one) 
```

# 3.E-R図を自作する
2で関連性はわかったけれども、E-R図として全体を見れないと把握がきつい。。。
そんな時は自作しちゃいましょう。Rails ERDのgemでサクッとE-R図を作ってみましょう。

## Graphviz(グラフビズ)のインストール
使用するには Graphviz が必要なため、UbuntuとMacでのインストール方法は以下になります。

### Ubuntu

```
$ sudo apt-get install graphviz
```

### Mac

Homebrewからインストールします。

```
$ brew install graphviz
```


### Gemfileの設定

```ruby:Gemfile
# 開発とテスト環境のGem指定

group :development, :test do
  gem 'rails-erd'
end
```

### rails-erdのインストール

```
$ bundle install
```


### コマンド実行
以下のコマンドをプロジェクトのディレクトリで実行します。
E-R図が作成できるはずです。

```
$ bundle exec erd
```

### E-R図
![E-R.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/594740/d4a14a5f-6d9c-7d88-11d9-fe45603e6afe.png)


まずは使用するAPIのルーティングとモデルのアソシエーションがわかれば、
どのように動いているかの確認ができるようになると思います。


# 参考文献

◇Rails のルーティング
https://railsguides.jp/routing.html

◇モデルに紐つくアソシエーション
https://api.rubyonrails.org/classes/ActiveRecord/Reflection/ClassMethods.html

◇rails-erd
https://github.com/voormedia/rails-erd