OmniAICreator/Qiita-1.07M huggingface dataset:
SCSSなどのカラー変数をFigmaのColor Stylesに簡単に反映する方法

## はじめに
「Webサイトから、カラー設定をFigma上に簡単に反映させる方法はないか」と思ったのがきっかけです。
プラグインを活用することで、簡単に作成することができたので、備忘録としてこちらでも紹介します。

## 手順
SCSSなどを使って、カラーを変数で管理していることが前提となります。

1. 事前準備（プラグインのダウンロード）
2. Figmaにカラーパレットを作成する
3. 作成したカラーパレットを`Color Styles`に登録する

### 1.事前準備（プラグインのダウンロード）
今回の作業で、2つのプラグインを使用します。
作業前にダウンロードしておいてください。

https://www.figma.com/c/plugin/781017118947202678/Generate-Palette

https://www.figma.com/community/plugin/739237058450529919/Chroma-Colors

### 2. Figmaにカラーパレットを作成する
「Generate Palette（Figmaのプラグイン）」を使って、SCSSファイルの変数とカラーコードから、Figmaにカラーパレットを自動生成します。

#### 2-1. 「Generate Palette（Figmaのプラグイン）」を起動する
`⌘`+`/`で検索ボックスを開き、「generate palette」と入力すると簡単に起動できます。

![スクリーンショット 2021-05-19 21.16.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351760/2d92a7eb-f9b5-1a76-b48f-4784b8f0245f.png)|![スクリーンショット 2021-05-19 21.01.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351760/0aea2ecd-d8f3-b522-098f-d8e629ac2be9.png)
---|---
検索中の画面|「Generate Palette」を起動した後の画面

#### 2-2. カラーパレットにしたい変数を入力し、`create`ボタンをクリックする
文頭に`/* ~ */`を記述すると、`Frame`の名称を指定できます。
文頭に`/* ~ */`を記述しない場合は、New Paletteという名称で`Frame`が作成されます。

![スクリーンショット 2021-05-19 21.05.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351760/632d2c62-5432-9cf6-5759-655b5d6522f1.png)|![スクリーンショット 2021-05-19 21.05.24.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351760/08b1a79b-6c41-e393-620a-d16f056c3a08.png)
---|---
変数を入力している時の画面|`create`ボタンをクリックした後の画面

### 3. 作成したカラーパレットを`Color Styles`に登録する
「Chroma Colors（Figmaのプラグイン）」を使って、作成したカラーパレットの色とその名称を一括登録します。

#### 3-1. `Color Styles`に登録したい`オブジェクト`を選択する
`Frame`ではなく、`オブジェクト`を指定するようにしてください。
![スクリーンショット 2021-05-19 21.49.38.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351760/5f8de658-1158-ae43-96b4-d166dc721ba6.png)

#### 3-2. 「Chroma Colors（Figmaのプラグイン）」を起動する
起動と同時に`Color Styles`に指定した色が追加されます。

![スクリーンショット 2021-05-19 21.49.54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351760/2753737c-186d-1463-884e-100a5c01c6a2.png)|![スクリーンショット 2021-05-19 21.50.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/351760/0705cf71-bef8-747e-de09-65347d0b720f.png)
---|---
検索中の画面|「Chroma Colors」を起動した後の画面

<br>
これで無事に、Figamにカラーパレットと`Color Styles`の設定が完了しました。
`Color Styles`を使用すると、ワンクリックで色の指定ができるので、便利ですね。
<br>

最後までお読みいただき、ありがとうございました。
React&Javascript&Typescript基礎の備忘録

# この記事の意図
Reactでウェブアプリを作る際に、Typescript&Javascriptをちゃんと勉強しておかないと、バグに直面した際

1. React特有の書き方で間違った書き方をしている 
2. Javascript or Typescriptの書き方が間違っている 

のどちらで困っているのか、初心者には判別がつかず、バグに対して手が付けられなくなる。

この記事は以下の基準で記載を行う。

1. 筆者がReactでウェブアプリを作成する際に課題に直面する 
2. その課題を解決するために調べた記事などをこの記事に備忘録に記載する 
 
## Javascript
### Javascriptの基礎を学べるサイト
https://jsprimer.net/

#### サブクラス(subclass)
クラスのことで、継承先で、「子クラス」や「派生クラス」とも呼ばれる
https://wa3.i-3-i.info/word17675.html

### JSONの細かい仕様
https://www.json.org/json-ja.html

## イベントについて

https://so-zou.jp/web-app/tech/programming/javascript/event/

## Typescript
### Typescriptの基礎を学べるサイト
このサイトは包括的に情報がまとまっており、素晴らしい。

https://future-architect.github.io/typescript-guide/variable.html

## React
### Reactに関する情報が網羅的に記載されている
https://github.com/the-road-to-learn-react/the-road-to-learn-react

### TypeScriptでReactに入門するチュートリアル
https://qiita.com/yonetty/items/012be4c5c6258a609e35

こちらのサイトでは、下の画像のようなテーマパークの入場料計算を行うWebアプリケーションを作成しています。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/324917/0b43d777-be6f-a428-8da5-a38129967b94.png)

### mapとfilterの使い方
https://qiita.com/ryosuketter/items/c11a58242fa1ad9c6e4c

### create-react-appで React + Typescript な環境を構築する

Reactでweb開発を行うための事始めのやり方が記載されている。

https://qiita.com/sunnyG/items/05c2e9381d6ba2d9fccf

### Reduxまで説明
https://github.com/taming-the-state-in-react/taming-the-state-in-react/tree/master/manuscript

### hooks & redux

https://www.hypertextcandy.com/learn-react-redux-with-hooks-and-redux-starter-kit

### stateとpropsの違い
https://qiita.com/kyrieleison/items/78b3295ff3f37969ab50

### ${}って何？
テンプレートリテラルの中に変数や式を突っ込むための記号

```javascript
var foo = 'ート';
var bar = `テンプレ${foo}リテラル`;
console.log(bar); // テンプレートリテラル
```

### react router

### axios
ブラウザや node.js で動く Promise ベースの HTTP クライアントである｡ REST-API を実行したいときなど､これを使うと実装が簡単にできる｡

https://www.digitalocean.com/community/tutorials/react-axios-react-ja

https://qiita.com/ksh-fthr/items/2daaaf3a15c4c11956e9


## 番外編
### ReactとFirebaseを使っていろんなサイトを作る
https://zenn.dev/masalib/books/2d6e8470732c8b

### Firebaseのデータベース（Firestore）にデータを用意する

https://future-architect.github.io/articles/20200819/

https://firebase.google.cn/docs/firestore/query-data/get-data?hl=ja

### React
React+TypeScriptを使ったNetflixの映画一覧を表示するアプリケーション

https://zenn.dev/gunners6518/books/4c4672f32dd100/viewer

### git パスワードを毎回聞かれる問題をHTTPSでも解決
https://qiita.com/Kamo123/items/c92b03278b6302c641e3

### API開発・テスト便利ツール Postmanの使い方メモ

https://qiita.com/zaburo/items/16ac4189d0d1c35e26d1

### Node.jsが動くための環境構築

https://prog-8.com/docs/nodejs-env-win

### CircleCI

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

### Docker

https://speakerdeck.com/ranks/docker-ru-men?slide=29

### npmとyarnの違い

https://qiita.com/Hai-dozo/items/90b852ac29b79a7ea02b


### VS CodeのExtentions
https://www.geeksforgeeks.org/top-10-extensions-for-reactjs-in-vscode/

### HTMLをJSXに変換する
HTMLで書かれたwebサイトをReactに組み込むためにはJSXにする必要がある。いちいち手で変換すると面倒なので、下記のサイトでHTMLをJSXに変換すると作業時間がぐっと減る。
https://magic.reactjs.net/htmltojsx.htm
[SQL] LeetCodeの無料問題集を活用して、SQLを使いこなし（2）

#Q176　Second Highest Salary
![Q176.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082021/2374ed01-bc6c-9af3-7d14-39b073498524.png)

##質問
Employeeテーブルから2番目に高い給与のデータを抽出。

##Code書き方のHINT
1）消去法　
2）場所指定法（limit offset）

###Code1（消去法）
1番目に高い給与を取得して、それを消去した後に最大値を再取得するば、２番目に高い給与を求める。

■手順：
①：1番目のデータを取得。
```Select max（データが所在列のタイトル名）　from テーブル名```

②:抽出条件をつけて、1番目に高いデータを取り除く
```where データが所在列のタイトル名　<
    (Select max（データが所在列のタイトル名）　from テーブル名)
```
③:②で抽出したデータの中に、1番目に高いデータは全テーブルで２番目高いデータ
```Select max（データが所在列のタイトル名）　from テーブル名
   where データが所在列のタイトル名　<
    (Select max（データが所在列のタイトル名）　from テーブル名)
```


###Code2（場所指定法）
取得したいデータの場所を指定する。
Ref：https://hacknote.jp/archives/13413/

■手順：
①重複のデータを削除
```select distinct (データが所在列のタイトル名) from (テーブル名)```

②データを並び替え
```order by (データが所在列のタイトル名) desc```


③取得したいデータ場所を指定
```select * from (テーブル名) limit (取得したい行数) offset (開始位置)````

④値がnullの場合、クエリはnullを返す必要があります。と要求されたので、ここでもう一手間。
select IFNULL(値１,値２)
※値1がnullの場合、値2を返す。


##Code
###Code1

```SQL
select max(Salary) as SecondHighestSalary from Employee
 where Salary <
(select max(Salary) from Employee)
```

###Code2

```SQL
select ifnull(
    (select distinct Salary from employee
     order by Salary desc
     limit 1
     offset 1),null) as SecondHighestSalary;
```


##Code検証
###Code1の結果
![Q176_result.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082021/aebf98c5-e902-5491-6a8a-cf279d739e06.png)


###Code2の結果
![Q176_result2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1082021/b5ffce14-9144-88cf-00e7-155389b7c511.png)
Jest + material-uiでのエラー解消

# 概要

materiral-uiのテストで必要な設定があったので備忘録

## エラー内容

```
Test suite failed to run

Jest encountered an unexpected token

This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.

By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".

Here's what you can do:
 • If you are trying to use ECMAScript Modules, see https://jestjs.io/docs/en/ecmascript-modules for how to enable it.
 • To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
 • If you need a custom transformation specify a "transform" option in your config.
 • If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.

You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html

Details:

node_modules/@material-ui/core/esm/Typography/index.js:1
({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){export { default } from './Typography';
```

## 対応

エラーに書いてある通りなのだけど・・・transformIgnorePatternsの設定が必要だった。
こんな感じで設定

```js
// jest.config.js
module.exports = {
  ︙,
  transformIgnorePatterns: [
    'node_modules/(?!@material-ui)/',
  ]
}
```
単語の分散表現の学習

##はじめに

※単語の分散表現の学習のためのメモです。
※編集する時間がないので主に自分用のメモです。

##用意するもの

### コーパス 
日本語のwikipediaで学習したコーパスを使います。下記のリンク先からインストールしてください。
[ja.text8]
(https://s3-ap-northeast-1.amazonaws.com/dev.tech-sketch.jp/chakki/public/ja.text8.zip)

### ステップ1.gensimのインストール

```python:pythonインタプリタ
conda install gensim 
```

### ステップ2.必要な機能のインストール
```python:pythonインタプリタ
import logging
logging.basicConfig(format='%(asctime)s:%(levelname)s:%(message)s',level-logging.INFO) 
sentences = TextCorpus('data/ja.text8')
```

### ステップ3.モデルの学習
```python:pythonインタプリタ
model = Word2Vec(sentences, size=100, window=5, sg=1)
logging.basicConfig(format='%(asctime)s:%(levelname)s:%(message)s',level-logging.INFO) 
sentences = TextCorpus('data/ja.text8')
```

### ステップ4.モデルのセーブと読み込み
#### モデルのセーブ
```python:pythonインタプリタ
model.save('models/model.bin')
```

####　モデルの読み込み
```python:pythonインタプリタ
model = Word2Vec.load('models/model.bin')
```
【MRTK】PC Holographic Remoting をやりました

[ HoloLens 2  PC Holographic Remoting のチュートリアル](https://docs.microsoft.com/ja-jp/windows/mixed-reality/develop/unity/tutorials/mr-learning-pc-holographic-remoting-01) をやりました。

# 開発環境
+ HoloLens2
+ Windows 10 pc
+ Unity 2019.4.1f1

# やり方
[ HoloLens 2  PC Holographic Remoting のチュートリアル](https://docs.microsoft.com/ja-jp/windows/mixed-reality/develop/unity/tutorials/mr-learning-pc-holographic-remoting-01)の通りにやればできました。
引っかかる部分も特になかったです。

# 完成
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">MRTK PC Holographic Remoting のチュートリアルやりました。<br>FPS高い状態維持できるのでいいですね<a href="https://twitter.com/hashtag/HoloLens2?src=hash&amp;ref_src=twsrc%5Etfw">#HoloLens2</a> <a href="https://twitter.com/hashtag/MRTK?src=hash&amp;ref_src=twsrc%5Etfw">#MRTK</a> <a href="https://t.co/0nQqcRrIZr">pic.twitter.com/0nQqcRrIZr</a></p>&mdash; 原口昂弥 (@k_haraguchi55) <a href="https://twitter.com/k_haraguchi55/status/1384834704793243657?ref_src=twsrc%5Etfw">April 21, 2021</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

3DモデルをPCで描画してHoloLens2に送っています。
PCで描画するので重いモデルでも描画することができます。
他にはビルドせずにUIやモデルをHoloLensで確かめられるのが便利ですね。

# Holographic Remoting と 実機ビルドの違い
カメラとマイクはHoloLensではなくPCのものを使う。
PC上で動作させるため、ビルド時と動作が異なることがある。
JavaScript DOMとは何か？

DOMとは何か？
DOMとは「Document Object Model」の略です。
直訳で、「ドキュメントを物として扱うモデル」。
プログラムからHTMLやXMLを自由に操作するための仕組みだ。

####例えばブラウザに表示される文字の色を変更したり、大きくしたりと、Webページの見た目をプログラムで処理をしたい場合があるだろう、しかし何もしていない状態のHTMLファイルではJavaScriptから手を出す事が出来ない。そこでファイルの特定の部分に目印を付けて「この部分」に「こういう事をしたい」という処理を可能にするための取り決めがDOMである。



今回のでは「section-1」と「section-2」がID名にあたる。
ID名を指定するメソッドは以下のように定義されている。

####**document.getElementById(id);**

idはタグについているID名。
これを用いて「section-2」を取得して、その文字色を赤色に変更してみよう。

```javascript:javascript
document.getElementById('section-2').style.color = 'red';
```

このJavaScriptをブラウザで実行すると下図のようになる。

![20210426-211320.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/960935/1d8428f7-183f-39e7-47e8-585fb32dd0e5.png)


>参考：エンジニアの入り口
>https://eng-entrance.com/what-is-dom
【Vagrant】vagrant upすると「SSH auth method: private key」で止まってタイムアウトする


# `vagrant up`でちゃんと起動しなかった

久しぶりにVM環境を立ち上げるために`vagrant up`したら以下のようなエラーが発生

```
C:\work\centos>vagrant up
Bringing machine 'default' up with 'virtualbox' provider...
==> default: Checking if box 'centos/7' version '2004.01' is up to date...
~
    default: SSH username: vagrant
==> default: SSH auth method: private key
Timed out while waiting for the machine to boot. This means that
Vagrant was unable to communicate with the guest machine within
the configured ("config.vm.boot_timeout" value) time period.

If you look above, you should be able to see the error(s) that
Vagrant had when attempting to connect to the machine. These errors
are usually good hints as to what may be wrong.

If you're using a custom box, make sure that networking is properly
working and you're able to connect to the machine. It is a common
problem that networking isn't setup properly in these boxes.
Verify that authentication configurations are also setup properly,
as well.

If the box appears to be booting properly, you may want to increase
the timeout ("config.vm.boot_timeout") value.
```

SSH認証のとこでエラーが発生してるぽい

# 原因

**Hyper-Vがオンの状態で起動しようとしてたのが原因でした。**
Docker使うために一時的にHyper-Vを切り替えたのが原因だったので、オフにして再起動後`vagrant up`すると何事もなかったかのように起動しました。

# おわり
- 同じエラーで他によくある原因としてはVMのネットワークの設定がおかしいとかあるみたいでした（自分は違いましたが）

# 参考URL
- [vagrant + virtualbox環境でvagrant up時に「default: SSH auth method: private key」で止まり、タイム・アウトする｜Nな人のWeb示録](https://nnahito.com/articles/61)
- ["vagrant up"したら"SSH auth method: private key"で止まった話 - Qiita](https://qiita.com/sasurai_usagi3/items/2ba572013b16f2703f6a)
RSpecで_spec.rbファイルの先頭行にrequire 'rails_helper'を忘れたときのエラー

こんなエラーになりました。


```rb:spec/models/address_purchase_spec.rb
% bundle exec rspec spec/models/address_purchase_spec.rb

An error occurred while loading ./spec/models/address_purchase_spec.rb.
Failure/Error:
  RSpec.describe AddressPurchase, type: :model do
    describe '商品購入テスト' do
      before do
        # @address_purchase = FactoryBot.build(:address_purchase)
      end
  
      it 'すべての値が正しく入力されていれば保存できること' do
      end
      it '郵便番号が空だと保存できないこと' do
        @address_purchase.postal_code = ''


NameError:
  uninitialized constant AddressPurchase
# ./spec/models/address_purchase_spec.rb:2:in `<top (required)>'
No examples found.
```

ちなみにrequire 'rails_helper'は


![20210426-205938.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/960935/3c05bead-3039-ad71-8b8c-92a92b6814fe.png)

のrails_helper.rbを読みにいっています。
投稿を検索する機能

##今回
・投稿を検索する機能をつける。
・テストは後日改めて書きます。

##投稿検索について
・ログイン時にホームの画面に投稿検索ができるような形にする。

##実装
・投稿検索用のフォームを付けたいと思います。

```app/views/shared/_microposts_search_form.html.erb
<%= search_form_for @q, url: @url do |f| %>

<%= f.label :content_cont, '投稿検索' %>

<div class = "input-group">
  <%= f.text_field :content_cont, placeholder: "キーワードで検索...。"%>
  <%= f.submit '検索' %>
</div>

<% end %>

```

・検索条件のcontent_contはMicropostのcontentからの検索です。
・ユーザー検索フォームと違うのは、url: @urlの部分です。
・投稿検索時に、urlを指定しなければ、検索実行時にエラーが出てしまいます。（エラーの詳細は割愛)

--------------------------------------------------------------------------------
・検索フォームが完成したので、次にcontrollerの実装に移ります。
・ホーム画面のフィードを検索するためにstatic_pages_controllerのhomeアクションに処理を加えます。

``` 
app/controllers/static_pages_controller

def home
    if logged_in?
     @micropost = current_user.microposts.build 
     if params[:q] && params[:q].reject { |key,value| value.blank? }.present?
       @q = current_user.feed.ransack(microposts_search_params)
       @feed_items = @q.result.paginate(page: params[:page])
     else
       @q = Micropost.none.ransack
       @feed_items = current_user.feed.paginate(page: params[:page])
     end
     @url = root_path
    end
  end
 
```
-----------------------------------------------------------------------------------

・microposts_search_paramsは、applicationControllerに設置しました。

```
app/controllers/application_controller

#投稿検索機能
  def microposts_search_params
    params.require(:q).permit(:content_cont)
  end

```
-----------------------------------------------------------------------------------
・micropostControllerのcreateアクションに@qとransackの処理を追加します。

```app/controllers/microposts_controller.rb

def create
    @micropost = current_user.microposts.build(micropost_params)
    if @micropost.save
      flash[:success] = "投稿完了"
      redirect_to root_url
    else
      @q = Micropost.none.ransack
      @feed_items = current_user.feed.paginate(page: params[:page])
      render'static_pages/home'
    end
  end

```

・追加するのは投稿が失敗した際の処理のみです。
・失敗した場合だけmicropostContorollerからホームのviewをrender(redirect_toではなく)しているた め、@qが必要になります。

-----------------------------------------------------------------------------------
・viewに戻って最初に作った_microposts_search_form.html.erbをhomeに挿入します。

```app/views/static_pages/home.html.erb
<% provide(:title,"ホーム") %>

<h1>ホームページ</h1>
<p>パパっ子</p>

<h1>解決した投稿</h1>

<% if logged_in? %>

  <section class = "user_info">
    <%= render'shared/user_info' %>
  </section>
  
  <section class = "micropost_form">
    <%= render'shared/micropost_form' %>
  </section>
  
  <h3>投稿</h3>
  <div class="search_form">
  <%= render 'shared/microposts_search_form' %>
　</div>
  <%= render 'shared/feed' %>

<% end %>

```

・こんな感じです。終わりです。
[Drupal]特定のノードの最新リビジョンを取得する

まずNIDから最新リビジョンのリビジョンIDを取得する

```php
$vid = \Drupal::entityTypeManager()
  ->getStorage('node')
  ->getLatestRevisionId($nid);
```

次にリビジョンIDからリビジョンを取得する

```php
$node = \Drupal::entityTypeManager()
  ->getStorage('node')
  ->loadRevision($vid);
```

[Getting The Correct Node Revision In Drupal 8](https://www.phase2technology.com/blog/getting-correct-node)

最新リビジョンかどうかチェックする方法はこちら

```php
// 最新リビジョンの場合はTRUE.
$node->isLatestRevision();
```
[Drupal]特定のバンドルのエンティティを参照しているフィールドのリストを取得する

## やりたいこと
「記事」ノードのフィールドのうち、「タグ」というボキャブラリーのタクソノミーを参照しているフィールドのマシン名とラベルのリストを取得したい

```php

$field_definitions = [];

$definitions = \Drupal::service('entity_field.manager')->getFieldDefinitions('node', 'article');

foreach ($definitions as $field_name => $definition) {
  if (
    $definition->getType() == 'entity_reference'
    && $definition->getSetting('target_type') == 'taxonomy_term'
    && current($definition->getSetting('handler_settings')['target_bundles']) == 'tags'
  ) {
    $field_definitions[$field_name] = $definition->getLabel();
  }
}

var_dump($field_definitions);
```

## 結果
```
[
  "field_main_tags" => "メインタグ",
  "field_other_tags" => "その他のタグ",
]

```
gooseパッケージの取得に失敗する（goose not found）




### 事象
- gooseパッケージを以下のように取得しようとすると失敗してしまう

```
$ go get -u -v bitbucket.org/liamstask/goose/cmd/goose
$ which goose
goose not found
```

### 原因
- GOPATHを設定していなかった

### 対応
- 以下のようにGOPATHを通す

```
$ echo 'export GOPATH=$HOME/go' >> ~/.zshrc 
$ echo 'export PATH=$PATH:$GOPATH/bin' >> ~/.zshrc 
$ source ~/.zshrc  // 設定を保存する
```

- 再度、go getしてみる。そしてPATHが通っているか確認してみる。

```
$ go get -u -v bitbucket.org/liamstask/goose/cmd/goose
$ which goose                              
/Users/[userName]/go/bin/goose
```
go get でインストールしたツールの実行ファイルは /Users/ユーザ名/go/bin 配下に配置されます。
無事にgooseがあることを確認できました！
【Rails6】ActiveRecord::RecordInvalid: Validation failed:の対処法

<h2>症状</h2>
rails db:seedを実施したところ下記エラーが表示されてしまい、テストデータの作成ができませんでした。(Rails6.0.3)

```terminal:ターミナル
bundle exec rails db:seed
rails aborted!
ActiveRecord::RecordInvalid: Validation failed: Foods is invalid
C:/Users/ユーザー名/environment/プロジェクト名/db/seeds.rb:23:in `block in <main>'
C:/Users/ユーザー名/environment/プロジェクト名/db/seeds.rb:8:in `times'
C:/Users/ユーザー名/environment/プロジェクト名/db/seeds.rb:8:in `<main>'
bin/rails:4:in `<main>'
Tasks: TOP => db:seed
(See full trace by running task with --trace)
```

```rb:seeds.rb
3.times do |n|
    restaurant = Restaurant.new(
      name: "testレストラン_#{n}",
      fee: 100,
      time_required: 10,
    )
  
    12.times do |m|
      restaurant.foods.build(
        name: "フード名_#{m}",
        price: 500,
        description: "フード_#{m}の説明文です。"
      )
    end
  
    restaurant.save!
  end
```

```rb:restaurant
class Restaurant < ApplicationRecord
    has_many :foods
end
```

```rb:food
class Food < ApplicationRecord
    belongs_to :restaurants
end
```

エラーメッセージを見ると、Foodsで何かしらエラーが発生してそうです。

<h2>解決方法</h2>
belongs_toの後に、sをつけていたためエラーが起きていたようです。
1対nの関係で、1のほうが複数形になると、validateエラーになってしまうようです。

```rb:restaurant
class Food < ApplicationRecord
    belongs_to :restaurant
end
```
<h2>参考</h2>
【Rails 5】ActiveRecord::RecordInvalid: Validation failed: Hoge must exist
https://qiita.com/jagio/items/5510917f80ca130cbd33
ラビットチャレンジ　Stage1 応用数学　統計学1　　レポート

#1.集合とは
 <dt>集合とは何か？</dt>
　　物の集まりのことである。
　　数学的に記載すると
   $$ S = \left\\{ a,b,c,d,e,f,g \right\\} $$
　　と表す。
　　上記は、「Sという**集合**はa~gまでの**要素**でできている」と表されている。
　　また、その他に「aはSの中に含まれている」といった事を表す式がある。
   $$ a \in S $$
　　この式は反転させても問題なく、
   $$ S \ni a $$
　　という書き方であれば同じ意味である。
　　集合の中にある「**要素**」というのは明確に区別することができる。
　　
　　もし、この集合Sの中に違う集合Mがあった場合、以下のように表すことができる。
   $$ M \subset S $$
   
　　さらに、集合に含まれるor含まれないということも明確に区別ができ、以下で表される。
    $$ h \notin S $$

　　確率・統計に登場する「**事象**」は「**集合**」として取り扱うことができる。

 <dt>和集合と共通部分</dt>
　　ある、集合AとBが存在した時、「AまたはBに含まれている」状態の事を「**和集合**」という。
　　さらに、「集合Aと集合Bのどちらにも含まれている」状態の事を「**共通部分**」という。

　　数式で表すと以下になる。
　　・和集合
　　 $$ A \cup B $$

　　・共通部分
    $$ A \cap B $$

 <dt>絶対補と相対補</dt>
　　和集合と、共通部分とは別に、
　　「全ての事象の中で集合A以外の全て」の状態を「**絶対補**」と呼ばれたり、
　　「集合Aと集合Bの中で集合Aを除いた」状態を「**相対補**」と呼ばれている。

　　・絶対補
　　$$ U \setminus A = \overline{A} $$

　　・相対補
   $$ B \setminus A $$

　　と表したりする。

#2.確率
 <dt>確率とは</dt>
　　確率の考え方には２つの考え方が存在する。
　　
　　１.頻度確率（客観確率）
　　　・発生する頻度
　　　例：「10本のうち一本だけ当たりのクジを引いて当選する確率は10％である」という事実
　　
　　２.ベイズ確率（主観確率)
　　　・信念の度合い
　　　例：「あなたは40%の確率でインフルエンザです」という診断
 
　<dt>確率の定義</dt>
   
   ```math
     P(A) = \frac{n(A)}{n(U)} = \frac{事象Aが起こる数}{全ての事象の数}
   ```
 <dt>条件付き確率</dt>
　　・ある事象Bが与えられた上で、Aとなる確率
　　　　例:雨が降っている条件下で交通事故に遭う確率
　　

  ```math
   \begin{eqnarray}
    P(A|B) = \frac{P(A \cap B)}{P(B)} \\
           = \frac{n(A \cap B)}{n(B)}
   \end{eqnarray}
  ```
 <dt>独立な事象の同時確率</dt>
　・お互いの発生には因果関係のない事象Aと事象Bが同時に発生する確率
　　

  ```math
   P(A \cap B) = P(A)P(B|A) = P(A)P(B)
  ```

 <dt>和集合の確率</dt>
　　

  ```math
    P(A \cup B) = P(A) + P(B) - P(A \cap B)
  ```
　　
　　和集合は単に、P(A) + P(B)するだけでは、事象Aと事象Bが重なっている部分が二重に
　　数えられてしまうので、最後に、$ P(A \cap B) $を除いてあげる必要がある。
　　もし仮に、事象Aと事象Bが重なることがなければ、単純に、P(A) + P(B)で良い。

  <dt>ベイズ則</dt>
　　例題：ある街の子供たちは毎日1/4の確率で飴玉をもらうことができ、
　　　　　飴玉をもらうと1/2の確率で笑顔になるという。
　　　　　その街の、笑顔な子供が飴玉をもらっている確率を求めよ。
　　　　　（ただし、この街の子供達が笑顔でいる確率は1/3である。)
　　
　　考え方：一般的に事象Aと事象Bに対して・・・
　　

   ```math
     P(A)P(B|A) = P(B)P(A|B)
   ```

　　　　　　と考えることができる。

　　　　　　内容を整理すると
　　　　　　$P(飴玉) =  \frac{1}{4} $　　$P(笑顔|飴玉) = \frac{1}{2}$ 　$P(飴玉) =  \frac{1}{3} $

　　　　　　このように内容を整理すると、以下のことが導き出される。
　　

   ```math
    \begin{eqnarray}
     P(笑顔|飴玉) × P(飴玉）= P(笑顔 \cap 飴玉) \\
     \\
     P(笑顔、飴玉）= P(飴玉、笑顔） \\
     \\
     P(飴玉 \cap 笑顔) = P(飴玉|笑顔) × P(笑顔）
    \end{eqnarray}
   ```

　　　　　　 整理した内容に実際の数字を入れると・・・
　　

   ```math
       \frac{1}{2} × \frac{1}{4} = \frac{1}{8} \\
       \\
       \frac{1}{8} = P(飴玉|笑顔) × \frac{1}{3}
       \\
       P(飴玉|笑顔） = \frac{3}{8}
   ```
　　　　　　となる。
VMware 上で MikanOS をブートする際に気を付けるポイント

こんにちは(((o(*ﾟ▽ﾟ*)o)))

みかん本『ゼロからのOS自作入門』についてのメモです。

ゼロからのOS自作入門 ではテスト環境としてQEMUというエミュレーターと実機で実行する方法が紹介されていますが、やっぱりなじみがある仮想マシンは VMwareですよね？（みゆき的には Microsoft の VirtualPC が好きでした）

気をつけるポイントと言っても、VMwareで起動させる際に、なかなかうまくいかなくて勝手にはまってただけだったかもしれません。

もし、VMware上で動かしたいのにうまくいかない！という方がいたらこのページにある__4つのこと__を一度試してほしいです。

それと、今のところ起動にUSBメモリ必須です...。
本当はWindowsのインストーラーみたいにisoイメージからブートさせたかったのですが、ダメでした>_<（メモリマップの書き込みにファイル書き込みが発生するからでしょうか・・・？ブートローダー側の工夫でもしかしたら可能になるかもしれないですがまだやってないです。）

vmdkからもブートできるかもしれませんが、未検証です(´；ω；｀)ｳｯ…

動作環境は Windows10 20H2です。

（あと、みかんちゃん（MikanOS擬人化キャラクター）描いたのでよかったらツイッターきてみてみて>_<)

# VMwareのバージョンとWindowsのバージョンをチェック
![スクリーンショット 2021-03-29 103915.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/270838/c79bb87b-3060-4074-5235-cef9650efad0.jpeg)
上画像のエラーは Windows10 バージョン2004以降で WSL2 を使っているかつ、古いバージョンのVMWareを使っていると出てくるエラーのようです。
WSL2はCPUの仮想化技術(VT-x)を使っているので競合しないようにVMWare側が対応したバージョンまでアップデートする必要があります。

記事を書いているときの最新はVMware Workstation 16 Player ↓
https://www.vmware.com/jp/products/workstation-player.html

# VMwareの設定をUEFI BIOSにする
VMWareの初期設定ではレガシーBIOSモードになっています。MikanOSはUEFIモードのみ対応なので切り替える必要があります。
UEFIモードへの切り替えの方法はOSインストールフォルダ（ワーキングディレクトリ）にある.vmxファイルに`firmware = "efi"`の一文を追加することでできます。
以下の記事を参考にしました。
https://freesoft.tvbok.com/freesoft/virtual/vmware_cd_bios.html

# 設定でUSBコントローラの追加する際のコツ
今回はUSBフラッシュメモリーからのブートなので、VMwareにUSBメモリを認識させる必要がありますが、本来VMwareはUSBブートに対応していないらしく少し難しいです。
USBフラッシュメモリーからブートする方法は[この解説ページ](https://4thsight.xyz/24850)の手順で行えば良いのですが、私の環境だとF2キーを押して表示されるUEFIのメニューが若干違うのと（バージョン差？）MikanOSのブートローダーが入ったUSBメモリを挿しても反応がありませんでした。

なので、一度UEFIのメニューからReset the systemを選択して再起動（USBメモリを挿したまま）してください！
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/270838/bbcbd2dc-28bd-dd93-c025-527b0e681f2d.png)
それからまたF2キーを押してUEFIメニューが表示されたところで、USBメモリを抜いて挿しなおすと....
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/270838/daa3c61f-9f08-eb21-99ad-1ac559729529.png)
無事、USBメモリが認識しました！あとは仮想マシンに接続にチェックをいれてOKを押すだけです(∩´∀｀)∩ﾜｰｲﾜｰｲ

# Windowsの回復ドライブを活用
ここまできても、「なぜかVMWareで起動しない！」という方は最後の手段？裏技です。
WindowsにはWindows自体がトラブルで起動しなくなったときのために、Windows自体を回復させるための小さなOSをUSBメモリ上に作る機能があります。
これは、MikanOSの仕組みとほぼ同じなのでこれを利用し、不要なファイルを削除してMikanOSのブートローダーを配置するともしかしたらうまくいくかもしれません。
### Windowsの回復ドライブの作り方
Windowsのサーチボックスに回復ドライブと入れて回復ドライブを開きます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/270838/27b2891b-6e95-3fff-d0de-304e5e8b055c.png)
「システムファイルを回復ドライブにバックアップします。」→チェックボックスを外します。
（チェックボックスをつけているとWindowsOS本体のイメージもインストールされてしまいます）
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/270838/b15ebcaa-cf6b-f66a-bcee-8d941a67868a.png)
最後に作成ボタンをクリックすると、回復ドライブの作成が始まって、USBフラッシュメモリーが自動的にFAT32にフォーマットされ中身が全て消え回復ドライブの内容に置き換わります。大体3分～5分くらいで作成されます。
### 回復ドライブの中身をMikanOSのブートローダーに置き換える
USBメモリ/EFI/Microsoft フォルダを削除します。
USBメモリ/EFI/Boot/bootx64.efi をMikanOSのブートローダーで置き換えます。
あとはカーネルファイルも配置して...OKです！
テックキャンプを卒業してから考えるメリデメ

## 概要
実務未経験からテックキャンプ（半年間の夜間転職コース）に通い、1年間の学習期間を経てエンジニアへ転職をすることができました。
現在転職するために独学で学習されている方、これから学習は始めようとしている方の参考になればと思い記事にします。

## 結論
個人的には満足しています。
もし、今から0ベースで転職を見据えた学習を始めるとすれば、
①オンラインサロンで情報収集(月額1000〜3000円程度)
②転職までのロードマップを作る
③Progate、dotinstall、Udemyなどで基礎学習開始(無料〜数千円)
④MENTA契約してポートフォリオ作成（30000円程度/月）
⑤転職サポートつきのオンラインサロンを利用して転職活動開始。

といった方法が一番コスパ良いのかなと思います。


## 良かったこと
- すべきことがが明確になる

これが一番大きな恩恵かなと思います。特にIT業界未経験や身近にエンジニアがいない人にとっては、どんな手順で学習や転職のステップを踏めば良いのか不明確な部分や不安が大きいと思います。事実、私もprogateで独学をしていた時には、Ruby基礎が終わったらPHP基礎、それが終わったらJavaの基礎、Goの基礎...といったように学習しており、方向性が定まっていないことにすら気付いていませんでした。ロードマップなんて検索すればいくらでも出てくるんですが、「それが必要」という事すら当時はわかりませんでした。

- メンター、スタッフが良い人
MENTAも利用して感じたんですが、テックキャンプのメンターは技術力 ＜ 教える力 に重きを置いているだけあって、安心感があり、質問のハードルを下げてくれます。

- モチベーションを維持できる
週に数回、学習状況を共有するイベントがあったり、定期的にライフコーチが相談に乗ってくれるため、モチベーションを保ちやすいです。
 
- 教室で学習ができる
今はオンラインで完結するスクールも多い印象ですが、自分は自宅ではなく外で学習したい派だったのでとても助かりました。
移動時間のコストはかかるけど、メリハリがついて集中できました。

- チーム開発ができる
- 一緒に学習する友達ができる
- 質問待機時間はほとんどなかった

## 悪かったこと
- 料金が高い
テックキャンプに入る前は、高いと思いつつも、「自己投資だと思って、、、と」納得してました。サービス自体には概ね満足しているんですが、それでも料金には見合っていないと感じます。

- 学習言語がRuby
主観ですが、福岡の求人はPHPが多い印象でした。実際に自分も内定をいただいた企業はPHPの案件が多く、入社までの期間で必死に勉強しています。東京以外の人は特に、転職を見据えて学習する言語を選択すべきだと思います。

- 個人開発は質問不可
- スクールの成果物はポートフォリオとして使えない
- スクールから斡旋してもらえる求人が少ない
正直、この３点が大きいかなと思います。転職活動にはポートポリオが必須ですが、「スクールでの制作物は不可」と明示している企業もいくつかあり、ある程度オリジナル性が問われます。しかし、自分が学習していた時点では個人開発の質問は不可であり、転職で最も重要な武器であるポートフォリオの作成のサポートが受けられないのはなかなかしんどかったです。

## まとめ
悪い点もいくつか挙げましたが、個人的には十分満足できるサービスだったと思います。そもそも当時の福岡では、１年以上仕事を続けながら、かつ教室で学習させてくれるスクールはテックキャンプしかなかったので、独学を諦めた時点でテックキャンプに行った事は間違いじゃなかったと思います。
switchbotをRaspberry Piで動作させる。

# 1. この記事は

SwitchbotをRaspberry piで動作させる方法をメモします。

Switchbotは下記サイトに説明があります。リモートで物理的にボタンを押すことができます。
https://www.amazon.co.jp/dp/B07B7NXV4R?ref=ppx_pop_mob_ap_share

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/150223/4cfd6015-7ae7-905a-a754-8a6c2f9bc7fc.png)


# 2. 方法

(注)下記に説明する方法は、Raspberry Pi4では動作しないようです。Raspberry Pi3であればOKでした。

### 2-1 (準備)Raspberry Pi3に関連モジュールをインストールします。

製造メーカーが作成したサイト

https://github.com/OpenWonderLabs/python-host

下記のコマンドを実行してください。

```console:example
sudo apt-get update
sudo apt-get install python-pexpect
sudo apt-get install libusb-dev libdbus-1-dev libglib2.0-dev 
sudo apt-get install libudev-dev libical-dev libreadline-dev
sudo pip install bluepy
git clone https://github.com/OpenWonderLabs/python-host.git
cd python-host
```




### 2-2  Switchbot本体のMACアドレスを調べる

スマホに下記のアプリをインストールする。
https://play.google.com/store/apps/details?id=com.theswitchbot.switchbot&hl=ja

下記図のとおり操作するとSwitchbot本体のMACアドレスが分かる。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/150223/0c4da6dd-7036-a5e2-97fa-751115fbcd87.png)

### 2-3 Raspberry Pi本体とSwitchbotをbluetooth接続する。

![346.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/150223/bbbba76e-717d-07cf-3a22-54b659927669.jpeg)


### 2-4  Raspberry Pi3からSwitchbotに信号を送る




Raspberry Piからコマンドを送り以下のとおり「Complete」となればOK

```console:example
pi@raspberrypi:~ $ cd python-host
pi@raspberrypi:~/python-host $ sudo python switchbot.py
Usage: "sudo python switchbot.py [mac dev_type cmd]" or "sudo python switchbot.py"
Scanning...
Scan timeout.
(' 0', [u'd1:xx:xx:xx:xx:xx', 'Bot', 'Press'])
Input the device number to control:0
[u'd1:xx:xx:xx:xx:xx', 'Bot', 'Press']
Preparing to connect.
Connection successful.
Complete
```
'd1:xx:xx:xx:xx:xx'はSwitchbot本体のMACアドレスを示します。
transformersからTFGPT2LMHeadModelをインポートできない(cannot import name 'TFGPT2LMHeadModel' from 'transformers')件について

# はじめに
最近技術調査でHuggingFaceのサンプルコードを動かしているのですが、なかなか動かないことが多く(公式のものでも)、今回は動くようにするところまでできたので、まとめたいと思います。

# 問題
[こちら](https://note.com/npaka/n/n5d296d8ae26d)の記事を参考にハンズオンをGoogle Colabratory`で行っていたところ、

```
import tensorflow as tf
from transformers import TFGPT2LMHeadModel, GPT2Tokenizer


tokenizer = GPT2Tokenizer.from_pretrained("gpt2")

# 警告を避けるために、EOS トークンを PAD トークンとして追加
model = TFGPT2LMHeadModel.from_pretrained("gpt2", pad_token_id=tokenizer.eos_token_id)
```

この最初の箇所で以下のようなエラーが発生しました。

```
---------------------------------------------------------------------------
ImportError                               Traceback (most recent call last)
<ipython-input-23-4d671ac52c7c> in <module>()
      1 import tensorflow as tf
----> 2 from transformers import TFGPT2LMHeadModel, GPT2Tokenizer
      3 
      4 
      5 tokenizer = GPT2Tokenizer.from_pretrained("gpt2")

ImportError: cannot import name 'TFGPT2LMHeadModel' from 'transformers' (unknown location)
```

また、いくつかの[サイト]()をみたところtensorflow==2.0.1を入れると使えるよというissueがあったが動きませんでした。

# 原因
同様の報告がバグとして報告され、installationの記事が追加されたようです。
https://github.com/huggingface/transformers/issues/3396

```
This repository is tested on Python 3.6+, PyTorch 1.0.0+ (PyTorch 1.3.1+ for examples) and TensorFlow 2.0.

You should install 🤗 Transformers in a virtual environment. If you're unfamiliar with Python virtual environments, check out the user guide.
```

他のライブラリが影響しているようでColabratoryのようなライブラリがたくさんある環境では、ほかのライブラリの影響のせいで`importできない`らしいです。

詳しい原因はまだわかっていないが、自分で作成した環境で実行したところ記事通りのコードで動作した。

# おわりに
FuggingFaceを理解するためにとりあえずColabで動かすという流れをしていますが、Colabで動かないことがあることがよくわかりました。引き続きいろいろ試してHuggingFaceを理解したいと思います。

# 参考サイト
https://note.com/npaka/n/n5d296d8ae26d  
https://github.com/huggingface/transformers/issues/3396
Vue.jsでテーブルを並び替え

###はじめに
Vue.jsでソートはどうやるのか気になったので備忘録として。



##環境設定
今回はCodePenを使って実装します。またテーブルのデータはjsonplaceholderからaxiosを使って取得して使用します。
Vue.jsは2.6.11を使用しています。

![1619434240443.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1111652/dc050a27-9dc0-f984-8810-2042ed215b9e.png)

CodePenのセッティングでvue.jsとaxiosを読み込みます。

<p class="codepen" data-height="553" data-theme-id="light" data-default-tab="js,result" data-user="rm5912" data-slug-hash="ZELPboK" style="height: 553px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="Vue.js vue-sort">
  <span>See the Pen <a href="https://codepen.io/rm5912/pen/ZELPboK">
  Vue.js vue-sort</a> by morioka (<a href="https://codepen.io/rm5912">@rm5912</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://cpwebassets.codepen.io/assets/embed/ei.js"></script>


```html:HTML
<div id="app">
  <h1>{{ message }}</h1>
  <h2> {{ sort_key }}: {{ sort_asc ? '昇順' : '降順'}}</h2>
  <table>
    <thead>
      <tr>
        #v-onディレクティブのクリックイベントでv-bindディレクティブのaddClassを発火してます。
        <th @click="sortBy('name') " :class="addClass('name')">Name</th>
        <th @click="sortBy('email')" :class="addClass('email')">Email</th>
        <th @click="sortBy('website')" :class="addClass('website')">Website</th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="user in sort_users" :key="user.id">
        <td>{{ user.name }}</td>
        <td>{{ user.email}}</td>
        <td>{{ user.website }}</td>
      </tr>
    </tbody>
  </table>
</div>
```

```css:CSS
table {
  border-collapse: collapse;
  width: 100%
}
td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}
th {
  color:white;
  background-color: #1E90EF;
}

.asc::after {
  content: "↓"
}

.desc::after {
  content: "↑"
}
```

```javascript:JavaScript
new Vue({
  el: '#app',
  data: {
    message: 'Sort Column IN Table',
    users: [],
    sort_key: "",
    sort_asc: true
  },
  mounted(){
    axios.get('https://jsonplaceholder.typicode.com/users')
    .then(response => this.users = response.data)
  },
  methods: {
    sortBy(key) {
      this.sort_key === key
      ? (this.sort_asc = !this.sort_asc)
      : (this.sort_asc = true)
      this.sort_key = key
    },
    addClass(key) {
      return {
        asc: this.sort_key === key && this.sort_asc,
        desc: this.sort_key === key && !this.sort_asc
      }
    }
  },
  computed: {
    sort_users() {
      if(this.sort_key != "") {
        let set = 1;
        this.sort_asc ? (set = 1) : (set = -1)
        this.users.sort((a, b) => {
          if (a[this.sort_key] < b[this.sort_key]) return -1 * set;
          if (a[this.sort_key] > b[this.sort_key]) return 1 * set;
          return 0;
        })
        return this.users
      } else {
        return this.users
                        }
    }
  }
})
```

>参考サイト
[vue.jsでテーブルの列をソート(並べ替え)する方法]("https://reffect.co.jp/vue/vuejs-table-sort")
【Python】日付の代入や入力内容の削除を行う。

pythonを使用してExcelファイルの操作を勉強しています。
本日の気づき(復習)は、日付の代入や入力内容の削除に関してです。
pythonでExcelを操作するため、openpyxlというパッケージを使用しています。

発注書とかの書類をエクセルで作ってある場合って多いと思います。
新しいブックを作成するたびに前回のブックをコピーして内容を消して・・・。
そこまでの手間ではありませんが、プログラムで行った方がミスも減るのでお勧めかなとは思います。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/927441/4cce02f1-b279-6cdb-e298-7c184d470c3d.png)

と言う訳で、上の様なブック「申請書」を

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/927441/7fac92a5-6ff0-3def-411d-8a062eb69b75.png)

この様に初期化して、日付だけ当日のモノを入力しておきたいです。

# date.todayメソッド

```python
cell.value = date.today()
```

日付の入力にはdatetimeモジュールを使います。

時刻も記入したい場合は

```python
cell.value = datetime.now()
```

上記のようにdatetime.nowメソッドを使用します。

# 入力内容削除

```python
cell.value = None
```

Noneを代入することで、内容を削除します
セルを削除する訳では無いのでそこは安心です。

# 最終的なコード

```python
from datetime import date, datetime
from openpyxl import load_workbook

wb = load_workbook('申請書.xlsx')
ws = wb.active

ws['D4'].value = '営業部'
ws['D5'].value = '田中一郎'
ws['D6'].value = date.today()

for row in ws.iter_rows(min_row=9, max_row=ws.max_row-6, min_col=2, max_col=7):
    row[0].value = None
    row[4].value = None
    row[5].value = None

wb.save('申請書_初期化.xlsx')
```

セルの記述を「=TODAY()」にしておいてもいいのですが、
そちらだと、日付をまたいだ時がめんどそうですね。
Xcodeで予測変換候補が出なかった時の対処法

#対処法
1.メニューバーの Xcode > Preferences > Text Editing > Editingへ移動
2.「Suggest completion while typing」のチェックマークを外す
3.Xcodeを再起動する。
4.再度「Suggest completion while typing」にチェックマークを入れる

#ショートカット
1.のショートカットは「command + ,」
3.のショートカットは「command + q」
sql-jsの導入部分でハマった

Node.jsではなく、Chrome Extensionなどのブラウザ上でのjavascriptでの利用を想定。

GitHub: https://github.com/sql-js/sql.js
CDN: https://cdnjs.cloudflare.com/ajax/libs/sql.js/1.4.0/dist/sql-wasm.js

## 導入方法(initSqlJs)

ここだけが難関でした。
外部依存のwasm(Web-Assembly...)を利用するための手続きらしいです。
このfileの先の戻り値が適切な値でないと動きません。

```javascript
SQL = await initSqlJs({locateFile: file =>
     `https://cdnjs.cloudflare.com/ajax/libs/sql.js/1.4.0/dist/${file}`});
```

## sql読み込み・操作
dataはbinary dataの形で引き渡します。

```javascript
//dl with github rest api
data = await fetch("https://api.github.com/repos/XXXXXX/XXXXXXXX/git/blobs/XXXXXXXXXXXX")
    .then(d=>d.json()).then(d=>atob(d.content));
//読み込み
db = new SQL.Database(data)

//SQLの操作
texts = db.exec("select * from texts")
```
C++ | Segmentation faultについて

##原因
Core Dump/Segmentation fault is a specific kind of error caused by accessing memory that “does not belong to you.
When a piece of code tries to do read and write operation in a read only location in memory or freed block of memory, it is known as core dump.
It is an error indicating memory corruption.
https://www.geeksforgeeks.org/core-dump-segmentation-fault-c-cpp/
##How to debug
https://stackoverflow.com/questions/3718998/fixing-segmentation-faults-in-c
Lambda上でLaravelを動かしてs3にアクセスしようとしたが出来ない時のメモ

# 環境
AWS Lambda
bref
Laravel
thephpleague/flysystem-aws-s3-v3

# 結論
公式ドキュメントは良く読むこと。
https://bref.sh/docs/frameworks/laravel.html#file-storage-on-s3

# 解説
Lambdaは関数実行時に実行ロールから以下の情報を環境変数に設定する。
AWS_ACCESS_KEY_ID
AWS_SECRET_ACCESS_KEY
AWS_SESSION_TOKEN
上の情報を使用しないとs3にアクセス出来ない。

デフォルトのLaravelだと上２つはconfigで渡してくれるが、
AWS_SESSION_TOKENは渡してくれないので下のように追記する必要がある。

```
        's3' => [
            'driver' => 's3',
            'key' => env('AWS_ACCESS_KEY_ID'),
            'secret' => env('AWS_SECRET_ACCESS_KEY'),
+           'token' => env('AWS_SESSION_TOKEN'),
            'region' => env('AWS_DEFAULT_REGION'),
            'bucket' => env('AWS_BUCKET'),
            'url' => env('AWS_URL'),
        ],
```

Lambdaが勝手に設定してくれるので.envにAWS_ACCESS_KEY_ID、AWS_SECRET_ACCESS_KEY、AWS_SESSION_TOKENを追記する必要は無い。

# 参考
https://qiita.com/kenji0302/items/fec0c3fd79ceeabaf5fd
https://docs.aws.amazon.com/ja_jp/lambda/latest/dg/configuration-envvars.html#configuration-envvars-runtime
https://github.com/laravel/laravel/pull/5138
MacBook(m1)のpython環境構築メモ

#MacBook(m1)のpython環境構築
WindowsPCが壊れて新しくMacBookを購入
調べて環境構築したときの自分用メモです

##環境
・PC：13インチMacBook Pro (Apple M1チップ)
・OSバージョン：11.2.3
・ターミナル：iTerm2
・ARMアーキテクチャ

情報だと、homebrewを使用するためにはRosettaに切り替えないといけないとのことだったので(m1買ったのに...)condaで構築しました
構築には[こちらのサイト](https://zenn.dev/osuzuki/articles/380be0f682d72d)を参考にしました

https://zenn.dev/osuzuki/articles/380be0f682d72d



#condaの導入
##1. 「Rosetta上なのか」「ARMアーキテクチャ上なのか」を確認する
・ターミナル上で`uname -m`と入力
・arm64と出力 : ARMアーキテクチャ　(こちらで構築)
・x86_64と出力 : Rosetta or Intelアーキテクチャ 

##2. miniforgeインストール
arm64に対応しているminiforgeをインストールしてconda環境を構築していきます(理由は[参考サイト](https://zenn.dev/osuzuki/articles/380be0f682d72d)参照)

1. [github](https://github.com/conda-forge/miniforge) から「Miniforge3-MacOSX-arm64」をダウンロード
![スクリーンショット 2021-04-26 18.55.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/254218/12dc7b0d-6ee9-9b08-75a9-090a00bd8a32.png)

2. ターミナルで`bash Miniforge3-MacOSX-arm64.sh` と打つ
3. すべて「yes」で答える

ターミナルのシェルがbashからzshになったらOK

##3. condaの初期化処理
1. コマンド `source ~/.zshrc` で .zshrc を読み込む
・するとcondaのbase環境が有効化される
・コマンドラインの頭に(base)がつく

2. ターミナルを立ち上げるたびにcondaのbase環境が起動しないようにする(任意)
・`conda config --set auto_activate_base false`


#conda環境操作メモ
1.起動〜停止
・`conda activate` : conda環境(base)起動

・`conda create -n [name] python=3.9` : 環境を作る(pythonのバージョンは各自合ったものを)

・`conda activate [name]`　: [name]というconda環境を起動する

・`conda deactivate` : 起動しているconda環境停止

2.その他(パッケージ系)
`conda info -e` : 起動しているconda環境の情報をみる

`conda list` : インストール済みのパッケージの確認

`conda install [pakcage name]` : パッケージのインストール

`jupyter notebook` : jupyterNotebook 起動
 ※jupyter終了時には必ずブラウザで「終了」を押す(qが使えなかった...)

---
※あくまで自分用メモなのであまり詳しく書いてません。詳しく知りたい方は参考サイトか他でググってください

[参考]M1 MacにPythonインストールして開発環境構築してみた[https://zenn.dev/osuzuki/articles/380be0f682d72d]
【Ruby】クラスとインスタンスの違い

※2022年から技術系の記事は[個人ブログ](https://yamaday0u.net/category/programmer/)に投稿しております。ぜひこちらもご覧ください→[yamaday0u Blog](https://yamaday0u.net/category/programmer/)

今回はRubyにおけるクラスとインスタンスの違いを整理します。

## 結論：クラスは設計図・仕様、インスタンスは個別のデータ
クラスは設計図・仕様、インスタンスはクラスを元に生成される個別具体的なデータです。
逆に言えば、クラスは個別具体的なデータを生成するための設計図・仕様とも言えますね。

## クラスとは
クラスは、個別のデータ（値）の生成するための設計図・使用を指します。
この設計図・仕様では共通の属性と処理（メソッド）を定義します。

> オブジェクト指向では、互いに関連するデータと、データを操作するメソッドを一つのオブジェクトと呼ばれる単位に一体化（カプセル化）して取り扱う。あるオブジェクトがどのようなデータとメソッドから作られるのかを定義した、言わば雛形にあたるものをクラスという。（[IT用語辞典 e-Words](https://e-words.jp/w/%E3%82%AF%E3%83%A9%E3%82%B9.html)より）

たとえば「人クラス」という、人を作るための設計図を作るとします。

人には以下のような**属性**が与えられます。

- 名前
- 性別
- 年齢
- 身長
- 体重

これらをプロパティと言います。

また、人は以下のような**動作**をすることができます。

- 歩く
- ジャンプする
- 投げる
- しゃべる

これらの動作（処理）を定義したものをメソッドと言います。

これらの属性や動作は人に関する共通の情報としてまとめたものをクラスと言います。

クラスで共通の情報をまとめ、個別の情報は各データごとに分けることで、アプリケーションサービスの開発・管理・保守がし易くなるという利点があります。

上記のとおり、クラスは共通の属性と処理を決めるだけで、個別のデータがありません。
つまり、具体的な人という姿を持っていません。
そこでインスタンスが登場します。

## インスタンスとは
インスタンスとは、クラスを元にして作られる個別具体的なデータのことです。

> オブジェクト指向プログラミングで、クラス定義に基いてメモリ上にデータと手続きの集合として実体化されたオブジェクトのことをインスタンスという。クラスからインスタンスを生成することを「インスタンス化」（instantiation）という。（[IT用語辞典 e-Words](https://e-words.jp/w/%E3%82%A4%E3%83%B3%E3%82%B9%E3%82%BF%E3%83%B3%E3%82%B9.html)より）

インスタンスは、クラスと異なり実体を持ちます。

先ほどの「人クラス」の例で、ぼく（yamaday0u）を作るとすると以下のようになります。

- 名前：yamaday0u
- 性別：男
- 年齢：27才
- 身長：165cm
- 体重：58kg

これらは属性という、ぼくの基本情報で、必要に応じて「歩く」「ジャンプする」「投げる」「しゃべる」という動作（メソッド）を実行するわけです。

そして、属性はメソッドの中に組み込むことができます。
「自己紹介する」というメソッドを定義して実行すれば、以下のように動作することができます。

```rb:human.rb
class Human
  def initialize(name)
    @name = name #属性（プロパティ)を定義
  end

  def introduce #自己紹介のメソッドを定義
    puts "ぼくの名前は#{@name}です" #メソッドの中に属性(プロパティ)を入れている
  end
end

yamada = Human.new("yamaday0u") #インスタンスを生成
yamada.introduce #自己紹介のメソッドを実行
```

```zsh:ターミナル
$ ruby human.rb #human.rbを実行
ぼくの名前はyamaday0uです #実行結果
```

## まとめ
冒頭の、**「クラスは設計図・仕様、インスタンスはクラスを元に生成される個別具体的なデータ」**、という結論の意味がつかめたでしょうか？

最後のところで使用している`Human.new`や`yamada.introduce`のようなクラスメソッド、インスタンスメソッドについて過去に記事を投稿しているので、ご興味があれば読んでみてください。

関連投稿記事:[【Ruby】クラスメソッドとインスタンスメソッド、クラス変数とインスタンス変数の違い（Qiita)](https://qiita.com/yamaday0u/items/c95175e8c687065a4235)
## 参考資料
[【Ruby】クラスとかインスタンスについて改めて学習してみた（Qiita）](https://qiita.com/ksk_lack/items/734b4961e9e6c7480d33)
[クラス（IT用語辞典 e-Words）](https://e-words.jp/w/%E3%82%AF%E3%83%A9%E3%82%B9.html)
[インスタンス（IT用語辞典 e-Words）](https://e-words.jp/w/%E3%82%A4%E3%83%B3%E3%82%B9%E3%82%BF%E3%83%B3%E3%82%B9.html)
SAMで環境ごとに異なるパラメータを設定してみた

SAMからデプロイする際にパラメータを環境ごとに手動で設定してませんか？

設定ファイルに記載すると一発で環境に応じたパラメータが適応されます！

## 前提

- SAMコマンドが使用可能な状態であること

## ではさっそく

#### 検証環境(stg)と本番環境(prd)ごとに異なるLambda名をつけてみましょう。

- 検証環境のLambda名→`stg`-lambda-test
- 本番環境のLambda名→`prd`-lambda-test



まず、今回使用する「template.yaml」です。

`Env`という変数に環境ごとに応じた値を設定します。

```
AWSTemplateFormatVersion: '2010-09-09'
Transform: AWS::Serverless-2016-10-31
Description: >
  sam-app

  Sample SAM Template for sam-app

Parameters:
  Env:
    Type: String

Globals:
  Function:
    Timeout: 3

Resources:
  HelloWorldFunction:
    Type: AWS::Serverless::Function
    Properties:
      CodeUri: hello_world/
      Handler: app.lambda_handler
      Runtime: python3.8
      Role: XXXXXXXXXXXXXXXXXXXXXXXXX # Lambda実行ロールのARN
      FunctionName: !Sub ${Env}-lambda-test
```



「template.yaml」と同じ階層に「samconfig.toml」を作成します。

```
[xxxxxxx@sandbox02 sam-app]$ touch samconfig.toml
[xxxxxxx@sandbox02 sam-app]$ ls -l
total 32
drwxr-xr-x 2 xxxxxxx xxxxxxx 4096 2021-04-08 17:37 events
drwxr-xr-x 2 xxxxxxx xxxxxxx 4096 2021-04-08 17:37 hello_world
-rw-r--r-- 1 xxxxxxx xxxxxxx    0 2021-04-08 17:37 __init__.py
-rw-r--r-- 1 xxxxxxx xxxxxxx 8349 2021-04-08 17:37 README.md
-rw-r--r-- 1 xxxxxxx xxxxxxx  659 2021-04-08 17:47 samconfig.toml
-rw-r--r-- 1 xxxxxxx xxxxxxx 1704 2021-04-08 17:47 template.yaml
drwxr-xr-x 4 xxxxxxx xxxxxxx 4096 2021-04-08 17:37 tests
```



「samconfig.toml」は、sam deployコマンドを実行する際にデフォルトで読み込まれるファイルになります。

[parameter_overrides]にパラメータを設定していきます。※複数ある場合はスペース区切り。

```
version = 1.0
[default]
[default.deploy]
# 検証環境用
[stg.deploy.parameters]
stack_name = "xxxxxx"  # スタック名
s3_bucket = "xxxxxx" # s3バケット名
s3_prefix = "xxxxxxx" # s3バケットのフォルダ名
region = "ap-northeast-1"
profile = "xxxxxxx" # profile名
confirm_changeset = true
capabilities = "CAPABILITY_IAM"
parameter_overrides="Env=stg"
# 本番環境用
[prd.deploy.parameters]
stack_name = "xxxxxx"
s3_bucket = "xxxxxx"
s3_prefix = "xxxxxxx"
region = "ap-northeast-1"
profile = "xxxxxxx"
confirm_changeset = true
capabilities = "CAPABILITY_IAM"
parameter_overrides="Env=prd"
```



あとはビルドしてデプロイするだけです！

sam deployコマンドのオプションに設定した環境を指定するだけで環境ごとに設定できます！

- 検証環境用

  ```
  sam build
  sam deploy --config-env stg
  ```

- 本番環境用

  ```
  sam build
  sam deploy --config-env prd
  ```



# 結果

検証環境、本番環境用それぞれsam deployコマンドを実行した結果です。

stg、prdの名前を持つLambdaが作成されていることがわかります。

![](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1167819/cd0fac5f-6dbe-dc42-59dd-e6200b039af8.png)

環境に応じた可変パラメータはよくあるので外出しにすることでパラメータ変更による事故も起こりにくくなって便利ですね～

以上です。

### 参考

[AWS SAM CLI 設定ファイル](https://docs.aws.amazon.com/ja_jp/serverless-application-model/latest/developerguide/serverless-sam-cli-config.html)
第1回　Djangoを使ってみた

##背景
これまで趣味でSwiftやらPythonやらフロント系言語を触ってきたトンコツラーメンです。
大学4年生の私は、来年4月からPythonのフレームワークであるDjangoを使用して自社開発を行う企業にエンジニアとして就職することが決まりました。よーし、就職までにDjangoを勉強するぞ！そこで、今回から備忘録も兼ねてDjangoの勉強の軌跡を残したいと思います。大雑把に書くので、気になる人は、「Python Django3 超入門」を読みながらやってみてください。

##環境
・OS: macOS Big Sur バージョン11.2.3
・Python3
・VSCode バージョン1.52.1
・Django3.2
・Python Django3 超入門　掌田　津耶乃　著

##前提
今回はDjangoを使用して、「プロジェクト作成」をしたいと思います。前提として、「VSCodeは既にセットアップしてあること」「Python/Djangoはインストールしてある」ことを挙げておきます。また今回は、「Python Django3」に沿って学習していきます。当書籍の第二章から学習を始めます。

##重要事項
###①プロジェクト作成コマンド集
``` python
#プロジェクト作成
django-admin startproject プロジェクト名
#プログラムの実行（プロジェクトが作成されているファイルに移動後）
python manage.py runserver
#ブラウザでアクセス
"http://localhost:8000/"
#アプリケーションの作成
python manage.py startapp 名前
```
###②プロジェクト作成中コマンド/メソッド集
``` python
#path設定
path(アクセスするアドレス, 呼び出す処理)
#include関数
include('指定したいモジュール') #→引数に指定したモジュールを読み込むもの
```
##Webサーバーに表示させてみた
以下の手順でちょちょっとDjangoをいじって、"Hello,Django"と表示させてみました！
①helloというフォルダを作る
②hello内のurls.pyをいじる
③ターミナルでpython manage.py runserverを叩く
④http://localhost:8000/hello で検索

すると、
![スクリーンショット 2021-04-25 18.58.30.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1111025/5d5c1f53-bb7d-b81f-9f0b-3f5008e9ac52.png)
と表示されました！

##クエリーパラメーター
クリエイターパラメーターとは、利用者との間で値をやり取りするためのものです。クエリーパラメーターは、以下のように記述します。

" http://普通のアドレス?キー=値&キー=値 "

``` python
#request
request.GET['値']
#→ 辞書型で帰ってくる
```
##見かけの改行
文末に「\」を入れると、次の行に記した内容もこの行の続きとして扱ってくれる。
##まとめ
今日から少しずつではありますが、Django を勉強していきます！
初めて触った感じは、ちょっとこれまで触ってきた言語やフレームワークと違ってムズそう、って感じでした。まぁ、最初はなんでもそうですよねー…
これからも引き続き勉強していきます！
一緒に頑張りましょう！
Figmaでとりあえず手を動かしてポートフォリオ制作！

## はじめに
今回は、Figmaという、ブラウザ上でデザインを作成できるツールを使用して、
デザインを設計してから実際にWebページを作ってみる。ということをしてみました。

制作したWebページというのは標記にもあるとおり、長年放置してきたポートフォリオです。

## デザイン作成
こんな感じで作成しました。

https://www.figma.com/file/diZX5tZejroppEea7VrSiO/Portfolio?node-id=4%3A17

## Figmaのいいところ（共有）
Figmaの強いところはWeb上で制作できるので、アカウント登録しておけば、
他のPCからでもデザインを見たり、作ったりできるというのが強いですね。

また、他の人との共有も、リンクを貼ればば簡単に共有できますし
すごく利便性が高く驚きました。

今回は自分のポートフォリオ作成という目的だったのであまり他の人に
見せることはありませんでしたが、チームでこれから作成していこうという状況で、
さらに輝きそうだなと思います。

## Figmaのいいところ（機能）
そもそもデザインツールを初めて使用したので、他のツールがどうなのかは
分かりませんが、様々な便利機能があります。
（それゆえ初見ではどこに何があるかチンプンカンプンでした...笑）

その中でも特に便利だなと思ったことを書いていきます。

①グループ化
複数の要素の並べ方を調整したりする際便利です。
例えば、Webページでflexやgrid機能を使用したいな、と思うような場面で使えます。

グループ化した要素は、「Auto layout」という機能が使用できるようになります。
この機能によって
・縦並びか横並びか
・それぞれの要素をどのくらいの間隔で配置するか
等が簡単に設定できます。

解除も簡単にできるので綺麗に並べたい！と思ったらとりあえずグループ化しても良さそうです。

②コンポーネント化
似たような要素を複数作成するというような場面で重宝します。
今回作成したもので言えば、「推薦者の声」の右側の部分です。

「画像を表示する円」、「氏名」、「推薦文」の３要素から構成されたものをいい感じに並べた
ものをひとまとまりとして、それを５つ作成しなくてはいけません。

これを作成する際、まず最初に思いつくのが1つ作ってコピぺ。

それでも勿論できるのですが、ここで最初に作ったものをコンポーネント化してから
コピペしましょう。

コピペした要素はそれぞれ画像やテキストを変更しても他のひとまとまりの要素に何も影響を
与えません。
しかし、最初に作成し、コンポーネント化した要素だけは、他のコピペした要素にも
変更を加えることができます。

例えば後で見返した際に、もう少し氏名のテキストを大きくしたいと思ったら、
コンポーネント化した要素のテキストの大きさを変更するだけで他のコピペした
要素全ての氏名のテキストも同じ大きさに自動で変更されます。

コンポーネント化を使用してささっと要素を作成し、並べる際にグループ化する。

このコンボがとても便利です。

③ページ遷移やアニメーションの表現
この機能はあまり使わずに終わったので、次作成するときに
使ってみようかなと思っていますが、
ページ遷移hoverの際の表現もできるみたいです。
右上の方にある「Prototype」を選択して、要素と要素を紐付けることで
詳細設定のポップが出てくるので色々設定すれば、より具体的に
どう動くのかイメージできていいなと感じました。

## 気をつけるとより快適になること
使っていてすごくいいなと感じるのですが、やはり事前にググって使い方を
簡単にでも確認してから使うことをお勧めします。

初見ではそもそもどうやって始めたらいいかすら分からなかったので。

あと、Figmaで作成した要素は左側でファイルやフォルダのように並んでいて
名前をつけたりして確認できますが、並び順によって優先順位が変わります。

上に並んでいる方が強いので、スクロールして要素の位置が重複するような場面で
要素が隠れて困る時は上に並べる。

また他の人のデザインをコピペして拝借できるらしく、画面上部にある
電池残量やWifi電波強度などを表すようなテンプレ要素をコピペする際、
そのコピペ要素がきちんと配置したいFlame内に収まっているか。など

ファイルの並びはきちんと見たほうがいいなと思います。

## ポートフォリオ完成
作ったデザインを見て、実際にポートフォリオを作成しました。

https://github.com/nunununun1031/Portfolio

Figmaを使ってみて思ったことは、とりあえず手を動かして
作るのは効率がいいなということと、
自然とコンポーネント単位で考えることが多くなるので、
アトミックデザイン等と相性が良いと感じました。

Figmaで作りながら考えていると、いつの間にか興が乗って、
勢いで作成できたので、今後もデザインから設計する方法を
使っていこうと思います。
Embulkでembulk Error: OutputPlugin 'bigquery' is not foundのエラー対処

EmbulkでMySQL → BigQueryに転送しているのですが、とある環境で久々に実行してみたらエラーが出ました。

```
embulk Error: OutputPlugin 'bigquery' is not found
```

よくよく見てみると以下のエラーでrubyのバージョンがfaradayに対応していないよとのことです。

```
[91mERROR: Error installing embulk-output-bigquery:
faraday-net_http requires Ruby version >= 2.4.0.[0m[91m
```

<br>
[output-bigquery GitHub Issue](https://github.i.agoralab.co/embulk/embulk-output-bigquery/issues/131)に記載がありました。




今回はDockerにて動作させているので、Dockerファイルに以下を記載し問題解決となりました:grin:

```
#Embulkをインストール
RUN wget -q https://dl.embulk.org/embulk-latest.jar -O /bin/embulk \
    && chmod +x /bin/embulk

# 今回のerror対応
RUN embulk gem install representable -v 3.0.4
RUN embulk gem install faraday -v 0.17.4

# 使いたいプラグインを入れる
RUN embulk gem install embulk-input-mysql
RUN embulk gem install embulk-output-bigquery
・・・
```