OmniAICreator/Qiita-1.07M huggingface dataset:
【備忘録】メモリ

#メモリ#
32bitCPUとかRAMとかROMとか訳が分からなくなったのでまとめます。

##メモリの種類##
上から順にCPUから遠くなります。

・レジスタ
・キャッシュ
・主記憶
・補助記憶

###レジスタ###
CPUのなかにあるメモリですね。
引用もってきますね。
>「演算の対象や演算結果」を記憶するために使用される。


>この記憶装置を「レジスタ」と呼ぶが、このレジスタのサイズが16bitならば「16bitCPU」となりサイズが64bitならば「64bitCPU」となる。
https://eng-entrance.com/32bit-64bit

任天堂64の64は64bitCPUの64的な話はここら辺の話です。
ちなみに、32bitCPUは4GBしか扱えないっていう話なんですけど、
どう計算しても計算があわなかったのでこちら見ました。
https://tech.nikkeibp.co.jp/it/pc/article/knowhow/20100222/1023106/


###キャッシュ###
レジスタと主記憶(メインメモリ)の間に入ってデータのやりとりを高速にするもの。
頻繁にしようするデータを保持して、主記憶へのアクセスの回数を減らせます。

CPUに入ってるのが一次で他に入ってるのが二次とか三次とかってなるとかならないとか。

###主記憶###
CPUが直接やりとりするメモリです。

###補助記憶###
HDDとかSSDとかですね。
ちなみにSSDの方が起動が速いんですが、それはなぜかといいますと、
PCが立ち上がる際に不揮発性のメモリ(電気なくてもデータ消えない)からOSを読み込む訳ですが、そのときの速さがSSDの方が速いから立ち上がりも速いってことですね。
http://www.asahi-net.or.jp/~sy7t-ymj/bootup.htm

さらにちなみに、SSDはUSBと同じフラッシュメモリでできてるとかできてないとか。
https://www.pro.logitec.co.jp/about_hdd/hddssd/0718/

##メモリをいろんな点で分類##
一通り、まとめたので次はいろんな点から分類していきます。

###揮発性###
そもそも揮発性って何って話ですが、
揮発→電源ないとデータ消える
不揮発→電源なくてもデータ消えない
って感じです。どれがどれか下にまとめます。

|        |       揮発性 |    不揮発性    |
|:-----------------|:-----------------:|:------------------:|
| レジスタ            |              ◯ |                |
| キャッシュ           |            ◯|            |
|主記憶|◯||
|補助記憶||◯|

###RAMかROMか###
そもそもRAMとROMって何よって話ですが、
RAM　→　Random Access Memory
ROM　→　Read Only Memory
って感じです。英語は聞いてないんだよって人は[こちら。](https://www.itmedia.co.jp/news/articles/1706/01/news051.html)
まあ簡単に言うと、ROMがストレージ(容量)で馬鹿でかいメモリで、
RAMがCPUの性能に関わってくるやつですね。
ではどのメモリがどれなのか表にまとめました。

||RAM|ROM|
|:--:|:--:|:--:|
|レジスタ|SRAM(フリップフロップのやつ)||
|キャッシュ|SRAM(フリップフロップのやつ)||
|主記憶|DRAM(コンデンサのやつ)||
|補助記憶||ROM|
Androidの通知チャンネル作成でGroupIDとChannelIDを一緒にするとバグる

アプリを配信していたある日*「アプリの通知設定が変更できなくなった」*という事象が発生しました。
**通知のON / OFFはできるものの、バイブレーションの切り替え**など詳細な変更ができなくなったとの事です。

対象はAndroid8系以上、通知チャンネルの機能を実装しているバージョンでした。

# 通知チャンネルとは（簡単な説明）
通知チャンネルはAndroid8から採用された端末で通知を行う際の機能です。
targetSdkVersionをOreoに上げた場合、通知チャンネルを作成して通知を行わないとアプリでの通知が行えなくなります。

■通知の概要
https://developer.android.com/guide/topics/ui/notifiers/notifications?hl=ja

この機能より前は、アプリで通知の設定変更画面などを準備し、通知の詳細を変更できるようするのが一般的でした。（しかも結構面倒）
しかしこの機能が登場し、通知チャンネルを作成することで端末の設定画面の各アプリから通知の詳細な設定が行えるようになりました。（アプリから直接設定画面へ遷移させることも可能）

**便利だ！！**

通知チャンネル自体はたくさんの記事があがっているので、割愛します。
# バグの原因：通知チャンネルのID設定がよくなかった
通知の詳細変更ができなくなったというバグ。

原因は、通知チャンネルを生成する際に必要な`GroupID` と `ChannelID` が一緒だったことでした。
これらを一緒にすると、 **通知チャンネルのグループは表示されるが、通知チャンネルの詳細が表示されなくなる**らしいです。

# 解決方法

**GroupIDとChannelIDを一緒にしない**

当たり前といえば当たり前ですね...元々の実装がよくなかっただけではありますが、こんな落とし穴があるとは...

今回は管理の都合上、GroupIDとChannelIDを全くの一意のものにするのは面倒なので、プレフィックスをつけるなどして解決しました。

皆さんもお気をつけください。

# おまけ
通知チャンネルは更新が行えない（一度作った通知チャンネルに再度IDなどをセットしても何も起こらない）ので、一度削除して再度作り直す必要がありました。

この場合、通知設定画面に「〇〇件のカテゴリが削除されました」のように残ります。また、チャンネルの設定は基本的に引き継げるものの、「重要な通知設定」という項目は引き継げないのでご注意ください。（これらの表記は端末によってかなり異なります。）
Simulink API (3) モデルの主要3要素

# Simulink モデルの主要3要素

find_systemを使い倒す前に、Simulink モデル(以下モデル)を構成しているオブジェクトを抑えておく必要があります。

今回は、その中でもモデルの "振る舞い" に影響する重要な3つのオブジェクトを挙げます。
この3つのオブジェクトの関係性を理解することは、find_system関数の後に説明するget_param/set_param関数を使うときに非常に効力を発揮します。

1. Block (Simulinkブロック)
2. Port (Simulinkブロックの入出力口)
3. Line (Simulinkブロック同士を接続する信号線)

何れも、名称(ラベル) を付与することができ、固有のハンドル値を持っています。
このハンドル値を使い、MATLABのプログラムを作成することが多いと思います。

次のモデルを例に、これら3つのハンドル取得を例示します。
今回ご紹介するハンドルを取得するだけでは、具体的に何か出来るわけではありませんが、
今回の記事の目的は、「モデルの構成要素が何かと、リスト方法を理解すること。」に留めます。

![SLAPI3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/324583/2c707925-7b4f-8f31-dae3-820f67bb28c4.png)


1. Block 
---
Inport, Outport, UnitDelay, Gain, Add, ... などオプションのブロックセットを含めると数百種類はあると思います。ブロックはその種別により 'BlockType' という固有のプロパティ値を持っています。
モデル内のブロックハンドルをリストするには、find_system関数を使います。

```matlab:qiita.matlab
blockHandle = find_system('myModel', 'FindAll', 'on', 'type', 'block')
blockHandle =

   1.0e+03 *

    4.0510
    4.0550
    4.0590
```

2. Port
---
Simulinkブロックには、入力、出力ポートを持っています。
ブロック種別によっては、イネーブル、リセット、トリガー、Ifアクションなどの特殊なポートを持つものもあります。

モデル内のポートハンドルをリストするには、find_system関数を使います。
Inportブロックの出力ポート1つ
Gainブロックの入力ポート1つ
Gainブロックの出力ポート1つ
Outportブロックの入力ポート1つ
計4つのポートがモデル内に存在します。

```matlab:qiita.matlab
portHandle = find_system(gcs,'FindAll','on','type','port')
portHandle =

   1.0e+03 *

    4.0520
    4.0560
    4.0570
    4.0600
```

3. Line
---
Simulinkブロック同士を接続する信号線です。
信号線は、スカラ、ベクトル、バスといった種別があり、バス信号は信号線の入れ子構造(階層化)が可能です。
また、モデル上で信号線が分岐した場合、信号線オブジェクトに親子関係が作られます。
信号線の階層は少しだけ難しい話になるので、もう少し先に話をします。
(今回の記事の目的は、「モデルの構成要素を理解する」に留めます。ということでご容赦ください)

```matlab:qiita.matlab
lineHandle = find_system(gcs,'FindAll','on','type','line')
lineHandle =

   1.0e+03 *

    4.0620
    4.0610
```

まとめ
---
1. モデルを構成する主要3オブジェクトは、Block、Port、Lineです。
2. 3オブジェクトのハンドル値は、何れもfind_system関数で取得できます。
Flutterに入門して実機Androidでアプリを使うための方法メモ

# なにこれ
Flutterに入門したのでメモ
Flutterのチュートリアルアプリを作成して、CI/CDサービスを利用して、手持ちの端末でアプリを動かすところまで
実機で動かせるようにならないとモチベーション保てないよね

半日もあればできちゃうし、Flutterの入門敷居低くていいですね👍


# やること
- Flutterのチュートリアルを行って簡単なアプリを作成する
- CI/CDの設定を行う
- Androidにアプリをインストールする


# Flutterのチュートリアルを行って簡単なアプリを作成する
入門はFlutterの公式を読んで手を動かす。
公式のチュートリアルを進めていくと、名前ジェネレーター的なアプリができちゃいます。
[どんなものができるかgitでイメージつかめます](https://codelabs.developers.google.com/codelabs/first-flutter-app-pt2/#0)

### 手順
1. [Flutter公式](https://flutter.dev/)をサクッと眺める
2. 公式のGet Startedでチュートリアルに沿って手を動かす  
チュートリアルはGoogle Developers Codelabsの[Write Your First Flutter App, part 1](https://codelabs.developers.google.com/codelabs/first-flutter-app-pt1/#0)と同じなのでそっちを見てもOK
3. [Write Your First Flutter App, part 2](https://codelabs.developers.google.com/codelabs/first-flutter-app-pt2/#0)をやる

これでエミュレータ上でそれっぽいアプリができる。
iOS, Androidアプリを作ったこと無くても特にハマるところ無く進める。
Dartの言語仕様も読んでないけど他プログラミング言語わかれば都度調査で問題なさそう。
FlutterのWidgetとかよく分かってないけど、まずは動く様になればOK。理解は後からします。


# CI/CDの設定を行う
実機で操作したいので、ビルドして手持ちの端末にインストールしたいですね。
調べたら[Codemagic](https://codemagic.io/start/)というFlutter特化のマネージドサービスがあるので、それを利用する。

### 手順
1. チュートリアルで作成したアプリをリポートリポジトリにプッシュする
2. CodemagicにGitHubアカウントで登録する
3. リポジトリの一覧が表示されている事を確認する
4. 対象リポジトリの`Start your first build`ボタンを押す
5. ビルド完了まで待つ
6. アカウント設定ページ(https://codemagic.io/settings )でSlack連携を行う
7. workflowの設定ページ(https://codemagic.io/app/[hogehoge]/settings )で[Publish]->[Slack]の設定を操作する  
通知先のチャンネルを指定して、ビルド完了時、終了時に通知するようにする。設定は以下のような感じ

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/181482/2bc76c57-8ca8-adc6-2d01-0bb0baac8545.png" width="600">

これで再度Codemagicからビルドを行うとSlackに通知が行くようになって、ビルド完了後に手持ちの端末にアプリを入れれば動く。 Slackにはこんな感じで表示される
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/181482/74a1ad99-3ca1-d02d-dfdc-468b26fdbd92.jpeg" width="200">


# Androidにインストールする
この記事を参考に自分のAndroid端末にアプリをインストールした。
https://kuroyagikun.com/apk-download-install/

1. Slackからapkをダウンロードできるようになるのでダウンロードする
2. ファイルエクスプローラでダウンロードしたapkファイルを選択する
3. 警告が出るがインストールを進める
4. インストールが完了したらホームにアプリが追加されている



# 感想
Flutter自体はまだ全然理解できていないけど、最低限自分の端末で使えるアプリをすぐに届けられるのは体感が良いです😃
dockerのlog-driverでjournaldを使ったときにコンテナ名を表示させる

# はじめに

docker [create|run]させるときにlog-driverオプションにてロギング方法を色々と切り替えることができる。
この辺は他のQiitaの記事でも散々既出だと思うので詳細は割愛。

私はlog-driver journaldを多用しているのだが、普通にドライバーを切り替えただけだと、ログの中にCONTAINER_IDしか入っておらず、どのコンテナから出力されたものなのかがイマイチよくわからない。やはりコンテナ名がログに載って欲しい。そっちの方が絶対わかりやすい。

まぁ特定コンテナのログを見たい、という観点で言うならば、`docker logs`使うとか、`journalctl CONTAINER_NAME`を使うとか方法はあるのだけど。

個人的に困ったのは、journaldからsyslog転送されて/var/log/messagesに流れてきた場合。この場合、ログの中身でしか"どのコンテナがどういったログを出力したのか"を判断できない。そうなったときに、やはりログの中にコンテナ名が記載されていると非常に便利なわけだ。

ということで、それを実現するための設定についての記事。


# デフォルトの挙動
`--log-driver jounarld`を指定し、単に"hogehoge"と出力させるコンテナを動かしてみる。

```console
$ docker run --log-driver journald --name test-container centos:7 echo hogehoge
hogehoge
```

journalctlを使って特定コンテナのログを確認してみる。この場合、明示的にコンテナ名でフィルタリングしているわけだから、まぁログの中にコンテナ名が記載されていなくても特に問題はないだろう。なぜならコマンド実行時点で特定のコンテナを指定しているのだから、表示されるログは常にそのコンテナからのものであると言い切れる。

```
$ journalctl CONTAINER_NAME=test-container
-- Logs begin at Sun 2019-12-29 13:30:27 JST, end at Sun 2019-12-29 13:46:13 JST. --
Dec 29 13:41:06 test-svr 0c642bc6d137[5193]: hogehoge
```

RHEL/CentOSだと、特に何も設定しなくてもjournaldからsyslog転送されて、自動的に/var/log/messagesにまで流れてくる。私の場合、全てのコンテナのlog-driverをjournaldにすることで、全てのログを/var/log/messagesに集約し、そこに対してエラーログ監視をしていたりする。
この場合、どのコンテナが出力したものかがわからない。ログの中にある"0c642bc6d137"はコンテナIDだが、いちいち自分が作ったコンテナのIDを記憶している人間はいないだろう。

```console
$ grep hogehoge /var/log/messages
Dec 29 13:41:06 test-svr 0c642bc6d137: hogehoge
```


# 解決策

`--log-opt tag="{{.Name}}"`を指定する。--log-optは本来ログドライバーに対して様々なオプション設定を行うものである。その--log-optの`tag`に対して、任意文字列を与えると、ログの中でその文字列が表示される。もちろん、スタティックな文字列でも構わないのだが、今回の場合、正しいコンテナ名を動的に入れて欲しい、ということでコンテナ名を表すテンプレート要素である`{{.Name}}`を指定している。つまり、`tag="test-container"`としても、同じ結果になる。

```console
$ docker run --log-driver journald --log-opt tag="{{.Name}}" --name test-container centos:7 echo hogehoge
hogehoge
```

# 動作確認

journalctlで確認してみる。確かに以前はコンテナIDであった部分がコンテナ名に置き換わっている。

```console
$ journalctl CONTAINER_NAME=test-container
-- Logs begin at Sun 2019-12-29 13:30:27 JST, end at Sun 2019-12-29 13:54:18 JST. --
Dec 29 13:41:06 dev-harvest 0c642bc6d137[5193]: hogehoge
Dec 29 13:54:18 dev-harvest test-container[5193]: hogehoge
```

肝心の/var/log/messagesでも確認してみる。当然、こちらもコンテナ名に置き換わったログで流れてきている。

```console
$ grep hogehoge /var/log/messages
Dec 29 13:41:06 dev-harvest 0c642bc6d137: hogehoge
Dec 29 13:54:18 dev-harvest test-container: hogehoge
```

# docker-composeの場合

こんな感じ。

```text:docker-compose.yml
version: "3"
services:
  test-container-service:
    image: centos:7
    container_name: test-container
    logging:
      driver: journald
      options:
        tag: "{{.Name}}"
```

# 参考

* [https://docs.docker.com/config/containers/logging/journald/](https://docs.docker.com/config/containers/logging/journald/)
株式会社サーキュレーションのWEB研究

[株式会社サーキュレーション](https://circu.co.jp/)

## 事業内容

- プロ人材の経験・知見を活用して経営課題の解決を支援する[「プロシェアリング」](https://circu.co.jp/pro-sharing/)
- 新規事業立ち上げ支援サービス[「Open Idea」](https://open-idea.jp/)
- スポットコンサルティングサービス[「Open Research」](https://open-research.jp/)
- CTO/エンジニア/デザイナー支援サービス[「flexy」](https://flxy.jp/)
- 「人・組織」「成長戦略」の観点から事業承継をサポート[「人がつなぐ事業承継」](https://circu-shoukei.jp/)
- 1分でフリーランスとして活躍できる可能性がわかる[「フリーランス診断」](https://freelance.circu.co.jp/)
- 副業/複業時代の新しい働き方メディア[「nomad journal」](https://nomad-journal.jp/)
- フリーランス向け福利厚生制度[「サーキュレーションベネフィットプラン」](https://circu.co.jp/benefits/)
- 社会課題解決のためのプロシェアリング[「SOCIAL DEVELOPMENT by CIRCULATION」](https://social-development.circu.co.jp/)

## WEBサイトの内容

- ページ全体の形がとてもスッキリしていて綺麗
- ファーストビューの収まりが良い
- 輪のアニメーションが解決、巡らせる、創るなどの想像力を掻き立てている
- 人同士が向かい合っているという作りも素晴らしい
- SVG viewBoxで動きを入れているのがわかる

[SVGのviewBoxをわかりやすく紐解く｜NEWS｜株式会社INDETAIL（インディテール）](https://www.indetail.co.jp/blog/13002/)

- 下記のようにビデオで映像を入れているのが参考になった

[https://circu.co.jp/wp-content/themes/theme-circulation/assets/movie/heart.mp4?v=1.0.0](https://circu.co.jp/wp-content/themes/theme-circulation/assets/movie/heart.mp4?v=1.0.0)

[](https://circu.co.jp/wp-content/themes/theme-circulation/assets/anim/brain.png?v=0.1.0)

![https://circu.co.jp/wp-content/themes/theme-circulation/assets/anim/brain.png?v=0.1.0](https://circu.co.jp/wp-content/themes/theme-circulation/assets/anim/brain.png?v=0.1.0)

[](https://royal-fummy.com/blog/wordpress-blog-titlelogo-svg/)

- これはSVGのアニメーションなのか？**謎...。**
- スライドの形もフルで気に入った
- リンクの残し方が好き

![https://s3-us-west-2.amazonaws.com/secure.notion-static.com/fade5876-6dc9-4f14-a05e-df16ed3526b6/_2019-12-28_23.06.08.png](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/fade5876-6dc9-4f14-a05e-df16ed3526b6/_2019-12-28_23.06.08.png)

- 画像をきちんと用意していて、真似できないオリジナリティがある
Djangoでbitflyerの収支管理アプリを作ってみる（00.事前準備とプロジェクトを作成する。）

まずは準備からやっていきましょう。
忘れそうなので、触ったとこは全部メモる勢いで作業していきます。

```
# コマンドプロンプト上で実行

# 仮想環境を構築
>conda create -n test python=3.6.9

# 仮想環境を起動
>activate test

# 必要な色々をインストール
>pip install numpy
>pip install pandas
>pip install matplotlib
>pip install Django
```
ここまでは環境構築の諸々です。
testという名前の仮想環境を作成し、testの中に必要なライブラリをインストールしていきます。
こうしておくと、test環境が具合が悪くなったり不要になった際でも簡単に破棄ができます。

---

続いてプロジェクト作成を行います。

```
# プロジェクトを作成するディレクトリに移動(あらかじめ作っておく)
>cd Desktop\bitflyer_monitor

# [bfmonitor]という名前のプロジェクトを作成
>django-admin startproject bfmonitor

# ディレクトリの中身を確認してみる
>dir

2019/12/29  13:07    <DIR>          .
2019/12/29  13:07    <DIR>          ..
2019/12/29  13:07    <DIR>          bfmonitor

# [bfmonitor]の中に移動
>cd bfmonitor

# ディレクトリの中身を確認してみる
>dir

2019/12/29  13:07    <DIR>          .
2019/12/29  13:07    <DIR>          ..
2019/12/29  13:07    <DIR>          bfmonitor
2019/12/29  13:07               650 manage.py

# もう1階層下に、同名のディレクトリ[bfmonitor]が出来ているので、さらに中に入ってみる
>cd bfmonitor

2019/12/29  13:07    <DIR>          .
2019/12/29  13:07    <DIR>          ..
2019/12/29  13:07               411 asgi.py
2019/12/29  13:07             3,217 settings.py
2019/12/29  13:07               772 urls.py
2019/12/29  13:07               411 wsgi.py
2019/12/29  13:07                 0 __init__.py

# 今いるディレクトリ↓
# C:\Users\Owner\Desktop\bitflyer_monitor\bfmonitor\bfmonitor>
# [bfmonitor]の中に[bfmonitor]が出来ている、紛らわしいので要注意！
```

ここまでで、「デスクトップのbitflyer_monitorというディレクトリの中に、bfmonitorというプロジェクトを作成する」という作業を実行してきました。

---

続いてディレクトリの中身を一つ一つ確認してみます。
まずは下の階層から。

```
asgi.py
サーバープロセスに読み込ませるファイル？
今回は触らなくて済みそうなので、とりあえずそのまんま置いておきます。

settings.py
プロジェクトの設定情報を記述してあるファイル。

urls.py
プロジェクトで使うURLを管理するファイル。

wsgi.py
アプリケーションのメインプログラムとなる部分。

__init__.py
プロジェクトを実行するときの初期化処理を行うファイル。
```

それぞれのファイルの中身については、編集するときに確認していきます。

上の階層に入っているファイルはmanage.pyのひとつだけでした。

こちらはプロジェクトで実行する機能に関するプログラムです。
あれこれ実行する際にmanage.pyを呼び出すことが多くありますが、当面はなんか便利に色々呼び出してくれるファイルだと思っておけば良いっぽいので深く掘り下げないことにします。

では、webサーバーを起動してアクセスしてみます。

```
# manage.pyがあるディレクトリに移動
>cd ..

# 一応ファイルの所在を確認
>dir

2019/12/29  13:07    <DIR>          .
2019/12/29  13:07    <DIR>          ..
2019/12/29  13:07    <DIR>          bfmonitor
2019/12/29  13:07               650 manage.py

# manage.pyがちゃんと置いてあったので、サーバー起動を実行
>python manage.py runserver

Watching for file changes with StatReloader
Performing system checks...

System check identified no issues (0 silenced).

You have 17 unapplied migration(s). Your project may not work properly until you apply the migrations for app(s): admin, auth, contenttypes, sessions.
Run 'python manage.py migrate' to apply them.
December 29, 2019 - 13:48:33
Django version 3.0.1, using settings 'bfmonitor.settings'
Starting development server at http://127.0.0.1:8000/
Quit the server with CTRL-BREAK.

```

こんなメッセージが出ればwebサーバー起動成功です。
ブラウザを起動してアクセスしてみましょう。

アクセス先は以下です。

```
http://localhost:8000/
```

なんかロケットが飛んでる画面が表示されれば準備完了です。
webサーバーを終了するには、コマンドプロンプト上でCTRL+BREAKを押します。
(確かターミナルだとCTRL+Cだった)

```
^C
(test) C:\Users\Owner\Desktop\bitflyer_monitor\bfmonitor>
```

はい、ちゃんと帰ってきましたね。
環境構築はこれで完了です。

次はURLマッピングを行っていきます。
Imagemagickでosx appのアプリアイコン用にリサイズするワンライナー

```shell
echo "1024 512 256 128 64 32 16" | tr ' ' '\n' | while read i; do convert -resize $i appicon.png "appicon$i.png" ; done
```

正方形の画像を用意して、
横幅サイズをスペース区切りで渡して、trで行ごとに分割、それぞれのサイズで `convert -resize`にかけている

ちなみにPhotoShopをお持ちの方は


```
20x20 ios/20.png,29x29 ios/29.png,40x40 ios/40.png,58x58 ios/58.png,60x60 ios/60.png,76x76 ios/76.png,80x80 ios/80.png,87x87 ios/87.png,120x120 ios/120.png,152x152 ios/152.png,167x167 ios/167.png,180x180 ios/180.png,1024x1024 ios/1024.png
```

みたいに
ファイル名を工夫して 生成 > アセットを生成 にチェックを入れて保存
すると一気に生成してくれるみたいなのがあります
Swiftメモ：Xcodeで文字列を置換する(ALL/選択範囲内)

## Xcodeで文字列を置換したい
WindowsのPCでExcel等を使用して文字列置換というと
**Ctrl + H**
を使用すると思いますが、Xcode上で
**⌘(command) + H**
を使用するとウィンドウの非表示が働いてしまいます。
いきなりXcodeが閉じてビビる😭

##文字列置換のショートカット
Xcodeの文字列置換は
**option + ⌘ + F**
を押すと↓の画面が表示されます

<img width="783" alt="スクリーンショット 2020-01-07 0.01.23.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/489221/ae56584d-3f7a-ee8e-5dba-88a6ed1a7137.png">


Replace 部分に置換したい文字列
With 部分に置換後の文字列
を入力して実行すれば良いみたいです。

##選択範囲のみを文字列置換したい！
↑の方法だとコードの全てを対象に文字列置換をしてしまうので
選択した範囲のみを置換したい場合は、
対象を選択し、先ほどのショートカットを押した後に
**optionを押すと All→All in Selection にかわるので押す**
<a href="https://gyazo.com/68d28612382bf7976d53596d1fa91706"><img src="https://i.gyazo.com/68d28612382bf7976d53596d1fa91706.gif" alt="Image from Gyazo" width="780"/></a>
ことで可能です。
【Laravel】バリデーションを利用しよう

#はじめに
今回はバリデーションの使い方について説明します。
バリデーションとは**フォームから入力された値がルールを守れているかチェックすること**です。
ルールを設けることで意図していない形式の入力を防ぐことができます。

#バリデーションの使い方
では、バリデーションの使い方について説明します。
下記のコードで基本的なバリデーションはできます。
フォームから値が送信されるアクション（`post`）内の記述です
入力フォームから`name`,`mail`,`age`の3つの値が送信されます

```php:app/Http/Controllers/コントローラ
public function post(Request $request)
    {
        $validate_rule = [
            'name' = 'required',
            'mail' = 'email',
            'age' = 'numeric|between:0,150',
        ];
        $this->validate($request, $validate_rule);
    }
```

* `$validate_rule`
バリデーションのルールを定義するための配列です。

* `'name' = 'required'`
`name`に`'required'`を設定しています。
`'required'`は必須項目というルールです

* `'mail' = 'email'`
`'email'`はメールアドレスとして正しいかをチェックしています

* `'age' = 'numeric|between:0,150'`
`'numeric|between:0,150'`は数字でかつ0~150の間であることをチェックしています。

* `validate($request, $validate_rule)`
`$request`（フォームの入力値が含まれる）に対して`$validate_rule`のルールでバリデーションします。

以上でバリデーションの実装は完了です。

#おまけ
これからは付随するおまけの話になります
##エラーメッセージの表示
バリデーションは完了しましたが、
エラーでリダイレクトされてもエラーの原因がわからなければ、修正しにくいですね
エラーメッセージを表示させる方法について書きます。
エラーメッセージは`$errors`にまとめて入っています。
よって、以下のような感じで表示させるといいと思います。

```html
{{$errors}}
```

##古い値を使う
エラーでリダイレクトした時に以前の入力値がフォームに入っていないと一から入力し直さなければなりません。
それはめんどくさいので、あらかじめ以前の値を入力されている状態にしておきましょう
下記の例を参考にしてください

```html
<input type="text" name="mail" value="{{old('mail')}}">
```

**疑問、気になるところがございましたら、質問、コメントよろしくお願いします！！！**
CSSのアウトプット

#cssについて学んだことまとめ
初学者がCSSを学ぶ上で、最初に使い方を悩むであろうものについてまとめてみる

##aタグ、buttonタグで使われる状態を表現するCSS

**:link**
**:visited**
**:hover**
**:active**
**:focus**

**LVHAF**の順番で記述の優先度を覚える
:link-:visited-:hover-:active-:focus

**:link**
通常の状態での表現

**:visited**
既にクリックされている（訪問されている）リンクの状態

**:hover**
カーソルをリンクの上に置いた時の状態

**:active**
ボタンが押されている間だけの状態
第1ボタン、つまり右手用のマウスではふつう一番左のボタンにのみ適用すべき

**:focus**
タッチデバイスでタップした時、tabキーで移動した時などの状態
基本的にはform関連、ユーザビリティ的にある方がよい



##::before,::after
HTMLには書かれていない要素もどきをCSSで作ることができる

**::before**は要素の直前に要素もどきが入る

**::after**は要素の直後に要素もどきが入る

###具体的な使い方
出力結果：吾輩は、猫である

```
<h1>猫である</h1>

h1::before {
  content: ‘吾輩は、’;
}
```

###メリット
・SEOを気にせずにユーザーのための自由な表現ができる
（UIに出したいけどSEOとして不要な要素をCSSから画面に当てる）
・アイコンやフォントを疑似要素で表示できる
・position: absoluteで絶対配置にして、自分の好きな位置に配置が可能

###具体的な使い方
ブログとかのカード要素の右上のラベルとかに使われている
<img width="359" alt="スクリーンショット 2019-12-29 12.46.31.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/371389/31e73ea2-0f1d-4a0f-a96a-bffb62448798.png">
*ブログ：まじまじパーティーより引用*






##::backdrop-filter（IE未対応）
背景にfilterを使える

###具体的な使い方
背景のすりガラスの表現等


###使えるコード種類
| コード | 意味 |
|:-----------|------------:|
| blur      | ぼかし（pxで指定）        |
| brightness     | 明るさ（単位なし）    | 
| contrast       | コントラスト（％で指定） | 
| grayscale         | モノトーン（％で指定） | 
| invert       | 階調反転（％で指定） | 
| hue-rotate    | 色相（degで指定） | 
| opacity	| 不透明度（％で指定） |
| sepia | セピア調（％で指定） |
| saturate | 彩度（％で指定）|
| drop-shadow | ドロップシャドウ（pxで指定） |


###メリット
1つの画像の別々の部分に、別々のフィルターを使える（表現性が豊富）
内側の要素に影響がない
::filterとコーディング法は同じ

###デメリット
対応ブラウザが少なく、実験状態




##calc
css上で計算ができる

###具体的な使い方
横幅が1/6になる

```
.hoge{
	 width: calc(100% / 6);
}
```


###メリット
calc() はマージン設定を持つボックス配置、フォーム要素のサイズ変更等
【Git】別リポジトリにpushする

cloneしたリポジトリとは別のリポジトリにpushしたいとき
そのままpushしようとすると下記のようなエラーになる

```
! [remote rejected] master -> master (shallow update not allowed)
error: failed to push some refs to 'git@github.com:{別のリポジトリ名}'
```

## 1. 履歴が空のブランチ（orphan branch）を作成する

 ```
git checkout --orphan tmp
```
## 2. 履歴が空のブランチにコミットを作成する

```
git commit
```

## 3. 空のブランチからmasterブランチを作成する
```
git checkout -b master
```

## 4. pushするリモートブランチを設定する

```
git remote add origin {別のリモートブランチURL}
```

## 5.リモートブランチへpushする

```
git push origin master
```

これで無事pushできた！

commit履歴を一旦空にすることで新しいリポジトリにpushすることができた！
（リモートブランチにないコミット履歴が入っていたから怒られた？わかったら追記:writing_hand:）


###参考にさせていただいた記事

https://www.greptips.com/posts/1270/
はじめてのウェブサイト運用備忘録　第二弾

#ターミナルからファイルを操作できるようにしたい！
前回は、サーバーにファイルを上げられたら、みたいなことを言っていました。ですが、その前にターミナルからサーバーに接続してファイルを編集できるようにしたほうが絶対楽じゃん、と思い立って設定をはじめました。

##sshを有効にしよう
ターミナルからサーバー接続する際にはsshが必須になります。
sshとは、サーバーに接続して遠隔操作するための仕組みなのですが、ロリポップサーバーではこのようにしてsshを有効にすることができます。

![ページ 1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/556712/0d3368f0-513b-56a3-1f5e-2acbcc13912d.png)


##公開鍵、秘密鍵でパスワード入力を楽にしよう！
正直、サーバーに接続するたびにパスワード入力を求められるのは面倒です。
というわけで、公開鍵、秘密鍵を使ってサーバーへの接続を楽にしてみました。
やり方はこの方の記事を参考にさせていただきました。

参考URL1 : https://qiita.com/nnahito/items/dbe6fbfe347cd66ae7e6

正直ここに書かれていることの半分くらいわからなかったので、調べたら別の記事でまとめていこうかと思います。

##と、思ったらつまづきました……
ここに書いてあるとおりにやればいいんだ！ と思ったそこのあなた。
もし、ロリポップサーバーを使っているなら、このままやると確実に最初の一行でつまづきます。
なぜなら、ロリポップサーバーにはポート番号が指定されているからです。
じゃあどうやってポート番号を指定すればいいんだ！
という方のためにポート番号を指定したバージョンでの書き方をご紹介します。

#ポート番号とは……
僕もふんわりとしか分かっていなかったので、一度調べてみました。

参考URL2 : https://wa3.i-3-i.info/word171.html

この方のサイトは、きっとITに業界初心者の方にはかなりわかりやすい書き方をしてくださっているのでおすすめです。
もう少し込み入った説明がほしいときは、詳しく調べる必要がありますが、とりあえず何を言っているのか理解したいときなどには非常に助かります。

では、ポート番号が何か大体分かったところで、どうやってターミナル上でポート番号を指定するのかを書いていきます。

##サーバー接続する際には
参考URL1のやり方その1のところには

```command
$ ssh [ログインユーザID]@[サーバアドレス]
```

と書かれていますが、

```command
$ ssh [ログインユーザID]@[サーバアドレス] -p [ポート番号]
```

と書いてください。
この際、 p が小文字であることに注意してください。
そうすれば、サーバーに接続することができるはずです。
ポート番号自体はロリポップサーバーの先程参考に上げた画像の「ポート接続」の部分で確認してください。

##サーバーから秘密鍵を転送してくる際には
参考URL1のやり方その4のところで、scpコマンドでサーバーから秘密鍵を落としてくる部分があります。
そこでもポート番号は必要になります。

```command
$ scp [ログインユーザID]@[サーバアドレス]:~/.ssh/id_rsa ~/.ssh/
```

と書かれていますが、

```command
$ scp -P [ポート番号] [ログインユーザID]@[サーバアドレス]:~/.ssh/id_rsa ~/.ssh/
```

と書いてください。
この際、 P が大文字であることに注意してください。
先程は小文字でしたが、ここで小文字にしてしまうとコマンドが通りません。
また、先程の p を大文字にしてもコマンドが通りませんので注意してください。

##最後に
参考URL1でサーバーに再度接続する際にも、

```command
$ ssh –i ~/.ssh/[鍵の名前] [ログインユーザID]@[サーバアドレス]
```

と書かれていますが、

```command
$ ssh –i ~/.ssh/[鍵の名前] [ログインユーザID]@[サーバアドレス] -p [ポート番号]
```

としてください。
ここでの p は小文字です。
このようにすれば、ポート番号が指定されているときでも、鍵の設定を行うことができます。
【JavaScript】桁指定して四捨五入・切り上げ・切り捨て

そんなの誰でも知ってるよって声が聞こえてきそうですが、自分がはまったことを晒すのは人の時間の節約に繋がるはずと信じて。

【注】結論だけ見たい人は、一番下まですっ飛んでいってください。

### JavaScriptで用意されている関数
まず単純な四捨五入、切り上げ、切り捨てから。

```JavaScript
const value = 123.45
console.log("四捨五入: " + Math.round(value))
console.log("切り上げ: " + Math. ceil(value))
console.log("切り捨て: " + Math. floor(value))
```

```text
四捨五入: 123
切り上げ:124
切り捨て:123
```

残念な所としては、少数点第一位で処理して整数になるところでしょうか。
融通が効かない子で、これ以外やってくれません。

### 任意の桁で行うには？
ここでは、1の位でやってみます。

```JavaScript
const value = 123.45
console.log("四捨五入: " + Math.round(value/10)*10)
console.log("切り上げ: " + Math. ceil(value/10)*10)
console.log("切り捨て: " + Math. floor(value/10)*10)
```

```text
四捨五入: 120
切り上げ: 130
切り捨て: 120
```

上手くいきました。少数点第1位で処理されることを逆手にとって、10で割って少数点をずらした後、結果に10を掛けることで再び元の位に戻したというものです。

### 関数にしておこう！
ここでは四捨五入を例にしてみます。

```JavaScript
function round(value, base) {
  return Math.round(value / base) * base
}
```

#### これで123.5を手に
```JavaScript
console.log("四捨五入: " + round(123.456, 0.1))
```

```text
四捨五入: 123.5
```

無事に成功！

#### ついでに123.46も
```JavaScript
console.log("四捨五入: " + round(123.456, 0.01))
```

```text
四捨五入: 123.46000000000001
```
なんか様子が違います。バグってませんか？JavaScriptさん状態。

### 何故なのか【飛んできた人、ここだけ読んでください】

原因は、JavaScriptの浮動小数の計算に丸め誤差があることを忘れてしまっています。
2進数を用いた近似値で計算している弊害のようです。

せっかくMath.round()で計算したあとで、0.01という少数を再び計算に参加させていますね。

試しに以下のようなテストをしてみます。

```JavaScript
function round(value, base) {
  return Math.round(value / base) * base;
}
function round2(value, base) {
  return Math.round(value * base) / base;
}
console.log("四捨五入: " + round(123.456, 0.01))
console.log("四捨五入: " + round2(123.456, 100))
```

この処理は脳内では同じになるのですが、実際にやると

```text
四捨五入: 123.46000000000001
四捨五入: 123.46
```

こうなります。

車輪の再発明をしても仕方ないので、万能な？round関数の自作は差し控えたいと思います...

*まだもう一段?間違いを犯しているかも知れませんが、お気づきの点がありましたら、やさしく教えてください。*
Gram-Schmidt の正規直交化法の証明

# Gram-Schmidt の正規直交化法とは？
>計量ベクトル空間に属する線形独立な有限個のベクトルが与えられたとき，それらと同じ部分空間を張る正規直交系を作り出すアルゴリズムの一種．
（[Wikipedia](https://ja.wikipedia.org/wiki/%E3%82%B0%E3%83%A9%E3%83%A0%E3%83%BB%E3%82%B7%E3%83%A5%E3%83%9F%E3%83%83%E3%83%88%E3%81%AE%E6%AD%A3%E8%A6%8F%E7%9B%B4%E4%BA%A4%E5%8C%96%E6%B3%95) より引用）

# 記号
$V$：計量ベクトル空間
$(v,w)$：$v,w\in V$ の内積
$|v|=\sqrt{(v,v)}$：$v\in V$ のノルム
$v_1,v_2,\cdots,v_n\in V$：線形独立なベクトル

# 方法
## 直交化
$u_1:=v_1$ とする．また $j=2,3,\cdots,n$ に対して

```math
u_j:=v_j-\sum_{k=1}^{j-1}\frac{(u_k,v_j)}{(u_k,u_k)}u_k
```

と定める．このとき $u_1,u_2,\cdots,u_n\in V$ は直交系である．

### 証明
数学的帰納法により証明する．
$u_1=v_1$ は零ベクトルでない．また $v_1,v_2$ は線形独立であるから $u_2=v_2-\frac{(u_1,v_2)}{(u_1,u_1)}u_1=v_2-\frac{(u_1,v_2)}{(u_1,u_1)}v_1$ は零ベクトルでない[^1]．さらに

```math
(u_1,u_2)
=\left(u_1,v_2-\frac{(u_1,v_2)}{(u_1,u_1)}u_1\right)
=(u_1,v_2)-\frac{(u_1,v_2)}{(u_1,u_1)}(u_1,u_1)
=0
```
である．従って $u_1,u_2$ は直交系である．
[^1]: もし零ベクトルであるとすると $v_2=\frac{(u_1,v_2)}{(u_1,u_1)}v_1$ となり，$v_1,v_2$ は線形従属ということになるが，これは矛盾である．

次に $u_1,u_2,\cdots,u_j$（$j=2,3,\cdots,n-1$）が直交系であると仮定する．$v_1,v_2,\cdots,v_n$ は線形独立であるから

```math
u_{j+1}=v_{j+1}-\sum_{k=1}^{j}\frac{(u_k,v_{j+1})}{(u_k,u_k)}u_k
```
は零ベクトルでない．また $i=1,2,\cdots,j$ に対して

```math
\begin{align}
(u_i,u_{j+1})
&=\left(u_i,v_{j+1}-\sum_{k=1}^{j}\frac{(u_k,v_{j+1})}{(u_k,u_k)}u_k\right) \\
&=(u_i,v_{j+1})-\sum_{k=1}^{j}\frac{(u_k,v_{j+1})}{(u_k,u_k)}(u_i,u_k) \\
&=(u_i,v_{j+1})-\frac{(u_i,v_{j+1})}{(u_i,u_i)}(u_i,u_i) \\
&=0
\end{align}
```
である．従って $u_1,u_2,\cdots,u_{j+1}$ は直交系である．
以上より $u_1,u_2,\cdots,u_n$ は直交系である．

## 正規化
$u_1,u_2,\cdots,u_n$ を用いて，各 $j=1,2,\cdots,n$ に対して

```math
e_j=\frac{1}{|u_j|}u_j
```
とすれば $e_1,e_2,\cdots,e_n\in V$ は正規直交系である．

# 付録: 直交系の定義と性質
## 定義
$v_1,v_2,\cdots,v_n\in V$ が **直交系** であるとは，各 $i=1,2,\cdots,n$ に対して $v_i$ が零ベクトルでなく，かつ $i\neq j$ のとき $(v_i,v_j)=0$ となることを言う．

## 線形独立性
直交系 $v_1,v_2,\cdots,v_n\in V$ は線形独立である．

### 証明
$\sum_{k=1}^nc_kv_k=0$ とする．このとき，$v_1,v_2,\cdots,v_n$ が直交系であることに注意すると，$j=1,2,\cdots,n$ に対して

```math
0
=(0,v_j)
=\left(\sum_{k=1}^nc_kv_k,v_j\right)
=\sum_{k=1}^nc_k(v_k,v_j)
=c_j(v_j,v_j)
```

となるから $c_j=0$ である．
rubyで標準入力から与えられる値に整数と文字列が混在してる時に整数なら数値型、文字列なら文字列型にしたい

## 背景
paizaスキルチェックで標準入力から与えられる値に数値と文字列が混在していて煩雑になったので、良い方法を探してみました。

調べてみると正規表現を使って判別する方法がほとんどで、

Kernel#Integerを使う方法が少なかったので今回は、Kernel#Integerを使った方法です。

## やりたいこと
```ruby
# 標準入力
SET 1 40

# こうしたい
["SET", 1, 40]
```

## Kernel#Integerを使う方法
```ruby
# 標準入力
a = gets
SET 1 40
=> "SET 1 40\n"

# 変換
a.split.map{ |v| Integer(v, exception: false) == nil ? v : Integer(v) }
=> ["SET", 1, 40]
```

## 説明
Kernel#IntegerのKernelは、全てのクラスから参照できるメソッドを定義しているモジュールなので、どこからでもモジュール関数を呼び出せます。

Kernel#Integerは、下記のように使えます。

```ruby
# 数値型
Integer(1234567890) # => 1234567890
# 文字列型で整数表現
Integer("1234567890") # => 1234567890
# 文字列型で文字列
Integer("apple") # ArgumentError
# 文字列で文字列 + 整数表現
Integer("ザ・ベストハウス123") # ArgumentError

```

Ruby2.6からKernel#Integerのオプションで`exception: false`とすることで、例外を発生させる代わりにnilを返せるようになりました。

```ruby
# 文字列型で文字列
Integer("apple", exception: false) # nil
# 文字列で文字列 + 整数表現
Integer("ザ・ベストハウス123", exception: false) # nil
```

厳密には違いますが(わかりやすくするため)、数値型や文字列型の整数表現以外はnilを返すので、それを条件に使っています。

厳密に知りたい場合は下記を参照してください。
[module function Kernel\.\#Integer \(Ruby 2\.6\.0 リファレンスマニュアル\)](https://docs.ruby-lang.org/ja/latest/method/Kernel/m/Integer.html)


## 参考
[rubyで数値を表す文字列だったら数値型、それ以外は文字列のままにするメソッド – t4traw\.net](https://www.t4traw.net/blog/2014/12/ruby%E3%81%A7%E6%95%B0%E5%80%A4%E3%82%92%E8%A1%A8%E3%81%99%E6%96%87%E5%AD%97%E5%88%97%E3%81%A0%E3%81%A3%E3%81%9F%E3%82%89%E6%95%B0%E5%80%A4%E5%9E%8B%E3%81%9D%E3%82%8C%E4%BB%A5%E5%A4%96%E3%81%AF%E6%96%87%E5%AD%97%E5%88%97%E3%81%AE%E3%81%BE%E3%81%BE%E3%81%AB%E3%81%99%E3%82%8B%E3%83%A1%E3%82%BD%E3%83%83%E3%83%89/)
Jenkins 下流ジョブから上流ジョブのパラメータを取得する方法

Docker Imageをビルドしている上流ジョブの終了をトリガーに、
できたてほやほやのイメージ使ってテストするジョブを作ろうと思い、下流ジョブから上流ジョブのビルドパラメータを取る方法を調べたのでカキコ

### 準備
1. [Jenkinsの管理] -> [In-process Script Approval] をクリック
2. 以下のように"method hudson.model.Run getEnvironment"と"method org.jenkinsci.plugins.workflow.support.steps.build.RunWrapper getRawBuild"を承認欄に追加
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/114213/dc411887-3b81-ce64-9259-13e7b9e36840.png)

### スクリプト
以下の行ををジョブに組み込めば、環境変数経由で上流ジョブのパラメータの取得が可能

```groovy
stage('Get Upstream Parameter') {
    steps {
        script {
            upstreamBuilds = currentBuild.upstreamBuilds
            if (upstreamBuilds.isEmpty()) {
                // Job is run by manually -> Do nothing.
            } else {
                // Job is run by trigger of upstream success.
                def upstream = upstreamBuilds[0].rawBuild
                def upstreamEnv = upstream.environment
                echo upstreamEnv["container_name"]
                echo upstreamEnv["branch_name"]
            }
         }
     }
}
```

### 方法２：上流ジョブから、パラメータ付きで下流ジョブを実行
こっちは簡単で、以下のように書くだけでOK。

```groovy
build job: 'DownstreamJob', parameters: [
    [$class: 'StringParameterValue', name: 'container_name', value: "${params.container_name}"]
]
```

ただ、上流側に呼び出し処理を実装すると、
今回のDocker image buildみたいに不特定多数のテストジョブの上流になる場合、
テストジョブが増えるたびに上流スクリプトに更新がかかることになるので、
「上流から下流へパラメータつきでジョブを実行する」のか「下流から上流のパラメータを取りにいく」のかは、作ろうとしてるテストから考えた方がよさそう

### 参考資料
Jenkinsの仕様を扱った資料少ないなぁ思ってたけど、探してみると意外と出てきますね(単なる勉強不足だった..)

- [Global variable reference](https://opensource.triology.de/jenkins/pipeline-syntax/globals)
- [JavaDoc (hudson.model.Run) ](https://javadoc.jenkins-ci.org/hudson/model/Run.html)
古くて解像度の低いWindows7のノートPCをubuntuで生まれ変わらせる

#概要
2020年まであとわずか。
日本中のいたるところでWindows7端末のWindows10への更新、または廃棄が行われていることと思います。

**今回は、廃棄されるWindows7のノートPCを、ubuntuで生まれ変わらせるのが目的です。**

主に以下の性能のノートPCと用途を前提に話を進めます。

性能
画面サイズ　15.6インチ
ディスプレイサイズ　1,366×768ドット

用途
ソフトウェア開発
FPGA回路開発

また、開発用のソフトウェアがLinux向けにも用意されているものとします。

#解像度によって最初に困ること
これは実際に開発を行うとすぐにぶつかる壁なのですが、解像度が1920×1080未満では、開発において多くの不都合があります。
ソフトウェア開発のIDEや、CADやFPGA回路設計のソフトウェアは、大きくて解像度の高いディスプレイを前提としたUIデザインになっているからです。
結果として、1,366×768ドットの画面で開発用ソフトを立ち上げると、必要な面積の5分の3くらいしか表示されていない状態となるのです。これでは開発に集中することができません。

**そもそも低解像度PCは事務用であり、開発用途ではありませんが、気にしないでください。**

~~国内のIT企業が低解像度ノートPCを開発用にも使えると言って売っているので、騙されて買った人たち向けの記事としてこれを書いています。~~ ←不穏な文のため気にしないでください。


#一般的な対応方法
低解像度のディスプレイで、高解像度用のUIを持つソフトウェアを利用する場合、以下の方法を取ることができます。

1. 機器やOSが用意している画面縮小表示機能を利用する
2. OSのデフォルトの各種サイズを小さくする
3. 開発用ソフトウェア側のUI設定を変更したり、フォントサイズを小さくする

各対応方法について、ubuntu19.10(gnome)の場合を例にとって説明していきます。

#事前準備
現在の解像度の確認と設定
Settings => Devices => Displays => Resolution
選択可能な最高解像度にしてください。


#1.機器やOSが用意している画面縮小表示機能を利用する
ここでの画面縮小機能とは、表示スケールの変更が当てはまります。
が、残念なことに手元のノートPCとubuntu19.10の組み合わせでは、SettingsのDisplaysでScaleを変更することができませんでした。
昔はあった機能なので、実は別で用意されているか、ディスプレイのドライバの問題かもしれません。ご存知の方はぜひ教えてください。

確認をしてみて、スケール変更機能があり、縮小することができれば貴方はラッキーです。ぜひ利用してください。


#2.OSのデフォルトの各種サイズを小さくする
画面のアイコンやメニューバー、フォントなど、それぞれの画面構成比を変更するためにいくつかの設定ができます。

- Dock
- Fontスケール変更

##Dock
主にアイコンサイズ設定をします。
Settings => Dock => Icon size
デフォルトが48だった場合、縮小するための数値の目安は32や24です。

##Fontスケール変更
変更用ソフトを使う場合（例: Tweaksの場合）

- 画面左上のActivities => tweakと入力 => GNOME Tweaksをクリック => Ubuntuソフトウェアが起動するのでインストール

TweaksのFontsから設定を行うことで、分かりやすく変更できます。
**一番大事なのはScaling Factorです。**
Scaling Factorを0.8にしてみてください。必要なら、もっと小さくできます。
ただ、小さくしすぎても効果は限定的なので、色々試して、最適な数値を探ってください。

フォントサイズやスケールの変更ですが、Bashなどで以下のコマンドを打つことでも変更できます。
gsettings set org.gnome.desktop.interface text-scaling-factor 0.8
このコマンドは、TweaksでScaling Factorを変更するのと同じ効果があります。
gnomeの持つ設定に詳しくなることで見える世界は広がります。
詳しく知りたい場合はgnomeについて調べてください。プロジェクトとしてデカイので、深いところまで調べていたら、いくら時間があっても足りませんが……。

また、個別のフォント設定などもBashから行えます。
gsettings set org.gnome.desktop.interface monospace-font-name 'Monospace 10'
gsettings set org.gnome.desktop.interface font-name 'Noto Sans 9'
gsettings set org.gnome.desktop.interface document-font-name 'Noto Sans 10'
gsettings set org.gnome.desktop.wm.preferences titlebar-font 'Noto Sans Bold 10'

設定をリセットする場合は、setの部分をresetにしてください。resetではフォント名やサイズを渡す必要はないので以下のようになります。
gsettings reset org.gnome.desktop.interface monospace-font-name

面倒なのでTweaksを使うといいかと思います。（雑）

#3. 開発用ソフトウェア側のUI設定を変更したり、フォントサイズを小さくする
開発用ソフトウェアは多様であり、設定があるものや無いものもあります。
例として、VivadoではTools => Settings => Displayから各種変更が行えます。
また、設定からUIのLayoutを選べる開発用ソフトウェアも多いです。色々と探してみてください。

#終わりに
長々と画面縮小方法について書いてみましたが、古いノートPCはミドルスペック以上でない限りはゴミなので、GUIソフトでの開発に使うものではありません。
ちゃんとした開発用のPCを買ってください。

以上
製薬企業研究者がscikit-learnについてまとめてみた

# はじめに

ここでは、機械学習用ライブラリscikit-learnの基本的な使い方について解説します。
機械学習アルゴリズムについては、別の記事で取り上げる予定です。
Python3系の使用を想定しています。

# ライブラリの読み込み

他のライブラリと同様に、`import`で読み込めますが、下にも書いている通り実際に使う時は`import`と`from`で読み込むことが多くなります。

```scikit-learn_1.py
import sklearn
```


# データセット

scikit-learnには、機械学習に使えるデータセットが色々用意されています。
どんなデータセットがあるかは以下のコードを実行すれば分かります。

```python:scikit-learn_2.py
import sklearn.datasets
[s for s in dir(sklearn.datasets) if s.startswith('load_')]
```

# データセットの準備

ここでは、上記のデータセットの中で`iris`（アヤメ）のデータセットを使うこととします。
ガクの長さからガクの幅を線形回帰を使って予測することを考えます。
まずはデータの下準備です。

```python:scikit-learn_3.py
from sklearn.datasets import load_iris
import pandas as pd


data_iris = load_iris()
X = pd.DataFrame(data_iris.data, columns=data_iris.feature_names)
x = X.iloc[:, 0] # アヤメのガクの長さ
y = X.iloc[:, 1] # アヤメのガクの幅
```

# 機械学習（ここでは線形回帰）

データの準備が終わったら、線形回帰を実行します。

```python:scikit-learn_4.py
from sklearn.linear_model import LinearRegression
from sklearn.metrics import r2_score
import matplotlib.pyplot as plt
%matplotlib inline


X_train = [[5.1], [4.9], [4.7], [4.6], [5.0], [5.4], [4.6], [5.0], [4.4], [4.9]]
y_train = [3.5, 3.0, 3.2, 3.1, 3.6, 3.9, 3.4, 3.4, 2.9, 3.1]

model = LinearRegression()
model.fit(X_train, y_train) # 線形回帰モデルを作成

print(model.coef_) # 傾き
print(model.intercept_) # 切片

X_test = [[5.4], [4.8], [4.8], [4.3], [5.8]]
y_test = [3.7, 3.4, 3.0, 3.0, 4.0]

y_pred = model.predict(X_test) # 予測
print(y_pred)

fig, ax = plt.subplots()
ax.scatter(X_test, y_test, label='Test set') # 実測値の散布図
ax.plot(X_test, y_pred, label = 'Regression curve') # 回帰直線
ax.legend()
plt.show() # 予測に使ったデータを図示
plt.savefig('scikit-learn_4.png')

print(r2_score(y_test, y_pred)) # R^2値
```

テスト用のデータと回帰直線を図示すると以下のようになります。

![scikit-learn_4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/517951/a5a4773b-4ce9-fe61-df6d-bf9eeb570569.png)

最後のR^2値は、モデルのあてはまり具合を示すものですが、回帰なのか分類なのか、その他目的によって見るパラメータは変わってきます。

# まとめ

ここでは、scikit-learnの基本的な部分について解説してきました。
データセットの準備、データの前処理、予測モデルの作成、モデルの検証という流れをざっくりとでも押さえておくと良いでしょう。


# 参考資料・リンク

[今さら聞けない！機械学習って何？なぜPythonが使われるの？](https://pharma-engineer.com/machine-learning/ai-summary/)
【Angular】ngx-translateをLazyLoadされるModuleでも使用したい

## はじめに
「[ngx-translate](https://github.com/ngx-translate/core)」を使って多言語化対応するとき、LazyLoadされるModuleのTemplateで`translate`を記述しても翻訳されない。その時どうしたら良いかを共有していく。

## 前提
`ngx-translate`の設定が`app.module.ts`等でされていること。
[参考サイト](https://github.com/ngx-translate/core#aot)

ちなみに、`app.component.ts`で多言語の初期設定も書いておく

```typescript:app.component.ts
import { Component } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.scss'],
})
export class AppComponent {

    constructor(private translate: TranslateService) {
        this.translate.setDefaultLang('en');
        this.translate.use('en');
    }
}
```

## 各LazyLoadModuleにimportされる`TranslateSharedLazyModule`を作成する
ポイントとしては`forChild()`を記述する部分。
`useFactory`の部分をnullにしているが、これは`app.module.ts`と同じ多言語の設定を利用するならnullで良い。
※これをimportしたmoduleがロードされるたびにインスタンスが生成されるため。と言っても最初の初回のロードのみ。

```typescript:src/shared/translate-shared-lazy.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';

@NgModule({
    declarations: [],
    imports: [
        CommonModule,
        TranslateModule.forChild({
            loader: {
                provide: TranslateLoader,
                useFactory: null,
            },
            isolate: false,
        }),
    ],
    exports: [TranslateModule],
})
export class TranslateSharedLazyModule {}
```

あとはこれを`translate`したいModuleでimportしてやればいい。

```typescript:example-lazy.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';

import { TranslateSharedLazyModule } from '../../shared/translate-shared-lazy.module';

@NgModule({
    declarations: [],
    imports: [CommonModule, TranslateSharedLazyModule],
})
export class ExampleLazyModule {}
```

## 参考
- [.forChild() usage with lazy loading routes](https://github.com/ngx-translate/core/issues/425#issuecomment-467418951)
Xcode11以上の初期画面の設定方法メモ

初期画面の設定方法メモ(参考にどうぞ)
Main.storyboardではなく、別のstoryboardを初期画面に設定したい！って時にGUIで設定するやり方がXcode11以降で異なるので記録。

#従来のやり方
Main interfaceの値をMainから指定したいstroyboard nameに変えていました。以下のスクショの赤枠です。
または、info.plistにある、`Main storyboard file base name`の値を変えるだけでいけました。
<img width="823" alt="スクリーンショット 2019-12-29 11.32.54.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/477704/cfb3c1f9-d430-2875-a998-7f1a7602cc6a.png">

#Xcode11以降
info.plist(下のスクショ)で`Application Scene Manifest`に記載されている`Scene Configuration > Application Session Role > Item0`にある`Storyboard name`の値を指定したいstoryboard nameに変えるとできます。
<img width="848" alt="スクリーンショット 2019-12-29 11.43.11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/477704/7015c23d-2ea5-68db-b409-3b8588d46a6b.png">

##参考
参考にさせていただいた記事の方がわかりやすいので深く知りたい人向けにどうぞ。
https://qiita.com/rc_code/items/795ddadb98dfa09d10e6
【備忘録】クラス、モジュール、パッケージ、ライブラリ

#はじめに#
Pythonを前提に話をすすめていきます。たぶん。
とりあえず用語をまとめて最後に包含関係をまとめます。

##クラス##
クラスは*属性*をもっています。
属性とは*データ属性*と*メソッド*のことです。

###データ属性###
クラスにある*データ(変数)*のことです。
データメンバ(C++)とかフィールド(Java)とかプロパティ(JavaScript)みたいなやつ。
いろんな言語でいろんな呼び方するから何が何だかって感じですね。

###メソッド###
クラスにある*関数*のことです。
いろんな処理をする子ですね。

##モジュール##
拡張子が`.py`の*Pythonファイル*のこと。
このファイルにいろんな定義(変数や関数)が書かれています。
他には実行文(モジュールを初期化するためのもの)も書かれています。

##パッケージ##
複数のモジュールをひとまとめにしたもの。
>モジュール名前空間を "ドット付きモジュール名" を使って構造化する手段
https://docs.python.org/ja/3/tutorial/modules.html#packages

つまりこのパッケージのおかげでいろんなモジュールが参照できて、同じ名前の関数とかがあっても上手くつかえるってわけですね。ありがたやありがたや。

ちなみに、`pip`はパッケージ管理ツールです。

##ライブラリ##
複数のパッケージをひとつにまとめたもの。

##包含関係##
*ライブラリ ⊇ パッケージ ⊇ モジュール*って感じですね。

#何が紛らわしかったのか#
ドット演算子でモジュールを参照できるのが、オブジェクトの参照っぽくてクラスと似てたことですかね。
あとは名前が多すぎってことですかね。

#参考#
[Python公式ドキュメント(日本語)](https://docs.python.org/ja/3/tutorial/)
[なんか違う気がするけど一応参考にさせていただいた](https://ai-inter1.com/python-module_package_library/)
[Python におけるモジュールとパッケージは「名前空間」](https://qiita.com/sukobuto/items/15c1173b3f37f0306dd5)
【Rails】 RDB の VIEWとモデル継承を使ってMTIを実装する （Scenic 応用編）

Railsでモデルを継承する場合、デフォルトではSTI(Single Table Inheritance)を使うことが多いと思います。この時に、同じような振る舞いをするから継承するが、長期的なDBの運用を考えるとテーブルを分けたい場合がしばしばあります。そういった場合のために、MTI(Multi Table Inheritance)というデザインパターンを用いた実装を紹介したいと思います。
また、Scenicを使いサブクラスのテーブルを統合したデータを取得する方法も取り上げます。[Scenicについて](https://qiita.com/Samemura/items/82f3d017dcdc260be940)

[STIなどの実装パターンについて](https://qiita.com/yebihara/items/9ecb838893ad99be0561)
[MTIの参考](https://medium.com/@User3141592/when-to-use-single-table-inheritance-vs-multiple-table-inheritance-db7e9733ae2e)

# ゴール

例として以下のような設計になる実装をしてみます。

|モデル|DB|
|:---|:---|
|Account|accountsビュー|
|CorporateAccount|corporate_accountsテーブル|
|PersonalAccount|personal_accountsテーブル|

# 実装

```ruby:account.rb
class Account < ActiveRecord::Base
  self.primary_key = :id
  def read_only?; true; end
end
```

```ruby:coporate_account.rb
class CorporateAccount < Account
  self.table_name = 'corporate_accounts'
  def read_only?; false; end
end
```

```ruby:personal_account.rb
class PersonalAccount < Account
  self.table_name = 'personal_accounts'
  def read_only?; false; end
end
```

Migrationは、`CorporateAccount` と `PersonalAccount` のみ通常どおりテーブルを定義しておきます。
`Accout` はScenicで以下のようなviewを作成します。

```Ruby
SELECT corporate_accounts.id,
       corporate_accounts.name,
       corporate_accounts.created_at,
       corporate_accounts.updated_at,
       'CorporateAccount'::text AS type
FROM corporate_accounts

UNION ALL

SELECT personal_accounts.id,
       personal_accounts.name,
       personal_accounts.created_at,
       personal_accounts.updated_at,
       'PersonalAccount'::text AS type
FROM personal_accounts
```

# 実行

この設計で、`CorporateAccount`と`PersonalAccount`を通常どおりCRUDします。
`Account.all`で統合したレコードを取得することができ、それぞれのActiveRecordオブジェクトはサブクラスとしてインスタンス化されるため、それぞれの振る舞いをそのまま使うことができます。Decoratorで表示を分けることも可能です。

# おわりに

今回の例では想定しづらいですが、MTIの目的としてレコード数が多くなったときのパフォーマンス改善も見込めますが、統合レコードを取得するケースは劣化するため個別テーブルで取得するケースを優先したい場合には有効な手段になると思います。
統合レコードの取得の劣化は、PostgreSQLのMaterialized Viewを使う方法もあり、より冗長性の高い手法になります。
Springのプロファイル機能、そしてSpring Bootのapplication.properties

# Springのプロファイル機能
プロファイルとは、DIコンテナ内のBeanのグループです。任意のグループ名を指定できます。

Beanにプロファイルを指定するには、 `@Profile` アノテーションを利用します。

```java:DevBean.java
@Profile("dev")
@Component
public class DevBean {
}
```

```java:ProductionBean.java
@Profile("production")
@Component
public class ProductionBean {
}
```

`@Profile` が付加されていないBeanは、特定のプロファイルに所属しません（デフォルトプロファイルとも呼ばれます）。**プロファイル無しのBeanは、実行時にどんなプロファイルを指定しても常に有効化されます。**

```java:DefaultBean.java
@Component
public class DefaultBean {
}
```

## 複数プロファイルの指定
`@Profile` の `value` 要素は配列なので、1つのBeanに対して複数のプロファイルを指定可能です。複数指定した場合は、いずれかのプロファイルが実行時に指定された場合に有効化されます（全部のプロファイルが実行時に指定される必要は無いです）。

```java
@Profile({"profile1", "profile2"})
@Component
public class FooBean {
}
```

## 論理演算子の利用
`!` (否定)、 `&` (かつ)、 `|` (または)を利用することもできます。

```java:profile1以外で有効化される
@Profile("!profile1")
@Component
public class FooBean {
}
```

```java:実行時にprofile1とprofile2が両方指定された場合に有効化される
@Profile("profile1 & profile2")
@Component
public class FooBean {
}
```

```java:実行時にprofile1またはprofile2が指定された場合に有効化される
@Profile("profile1 | profile2")
@Component
public class FooBean {
}
```

> `&` と `|` が混在する場合は、必ず丸括弧 `()` が必要になります。
> ❌ `@Profile("profile1 | profile2 & profile3")`
> ⭕ `@Profile("profile1 | (profile2 & profile3)")`

# 実行時のプロファイル指定
実行時に「今回はこのプロファイルを使うよ！」と指定する方法はいろいろあります。よく使うのは下記3つです。上のものほど優先順位が高くなります。

1. JUnitテストクラスに `@ActiveProfiles("プロファイル名")` を付加する
    - 複数指定時は配列指定 `@ActiveProfiles({"profile1", "profile2"})`
2. `java` コマンドに `-Dspring.profiles.active=プロファイル名` を付加する
    - 複数指定時はカンマ区切り `-Dspring.profiles.active=profile1,profile2`
3. 環境変数 `SPRING_PROFILES_ACTIVE` にプロファイル名を指定する
    - 複数指定時はカンマ区切り `SPRING_PROFILES_ACTIVE=profile1,profile2`

前述の通り一番の注意点は、**実行時にどんなプロファイルを指定しても、プロファイル無しのBeanは常に使われるということです。**

# Spring Bootのapplication.properties
Spring Boot利用時は、設定ファイルapplication.propertiesもプロファイルが利用できます。application.propertiesはプロファイル無し、application-プロファイル名.propertiesはそのプロファイル指定時のみ使われる設定になります。

つまり、 **application.propertiesに書いた設定は、どんなプロファイルを指定しても使われるということです。**

プロファイルを指定した上で、application.propertiesとapplication-プロファイル名.propertiesに同名のプロパティがあった場合は、**後者の値が優先（＝上書き）**されます。

```properties:application.properties
sample.value1=Default1
sample.value2=Default2
```

```properties:application-dev.properties
# devプロファイル指定時はこちらの値が使われる
sample.value1=Dev1
```

# Spring Bootを利用した場合の実行時プロファイル指定
Spring Bootを利用している場合は、前述の指定方法に加えてコマンドライン引数で指定する方法があります。

```bash:コマンドライン引数でのプロファイル指定
$ java -jar target/spring-boot-profiles-sample-0.0.1-SNAPSHOT.jar --spring.profiles.active=dev
```

IntelliJ IDEA(Ultimate Editionのみ)の場合は、実行設定に指定することができます（実行時に `-D` で追加されます）。

<img width="1073" alt="スクリーンショット 2019-12-29 10.50.03.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/58650/405484bd-2fef-2136-2c7d-3a59c826268f.png">


# サンプルコード
https://github.com/MasatoshiTada/spring-profile-sample

# 参考資料
- [Spring Reference Documentation - Core Technologies](https://docs.spring.io/spring/docs/current/spring-framework-reference/core.html)
- [Spring Boot reference Documentation - 4.2. Externalized Configuration](https://docs.spring.io/spring-boot/docs/current/reference/htmlsingle/#boot-features-external-config)
journalctlで特定コンテナのログを狙い撃ちで表示させる

# はじめに

`docker [create|run]`するときに`log-driver journald`を使った場合、当然だがログはsystemd-journaldに転送されるため、journalctlで簡単にログを表示できる。
このとき`journalctl -xu docker`とすると、確かにコンテナが出力したログを確認することができるのだが、全てのコンテナからのログがごちゃ混ぜで表示されてしまう。
というか、dockerのデーモン自体が出力したログも入っている。これでは何とも使い勝手が悪い。
というわけで、journalctlで特定コンテナのログだけを表示させたいときのTips



# 準備

まずはhogehogeと出力させるだけのコンテナを一発実行。

```console
$ docker run --log-driver journald --name test-container centos:7 echo hogehoge
hogehoge
```

# 方法

`journalctl CONTANINER_NAME=[container_name]`を使うと、特定コンテナを狙い撃ちにできる。

```console
$ journalctl CONTAINER_NAME=test-container
-- Logs begin at Sat 2019-02-02 08:29:38 UTC, end at Sun 2019-12-29 01:44:56 UTC. --
Dec 29 01:44:56 ubuntu-bionic 98ece5257dc7[1017]: hogehoge
```

今回はコンテナ名つまりCONTAINER_NAMEを使ったが、CONTAINER_IDでもOK

# 余談

`journalctl -o json`を使って詳細情報を表示させると、CONTAINER_NAME以外の属性値も確認できる。と言っても、CONTAINER_NAMEやCONTAINER_IDくらいしか使うことはないと思うが。

```console
$ journalctl -o json CONTAINER_NAME=test-container | jq 
{
  "__CURSOR": "s=6afb2a3be4b044a1aeb269e270aded83;i=8de88;b=b81e15b81ec04ea1839e7027bc5df5ca;m=20071659f;t=59acddfc18d7d;x=73e78ea64ae3ee63",
  "__REALTIME_TIMESTAMP": "1577583896530301",
  "__MONOTONIC_TIMESTAMP": "8597366175",
  "_BOOT_ID": "b81e15b81ec04ea1839e7027bc5df5ca",
  "PRIORITY": "6",
  "_TRANSPORT": "journal",
  "_UID": "0",
  "_GID": "0",
  "_CAP_EFFECTIVE": "3fffffffff",
  "_SELINUX_CONTEXT": "unconfined\n",
  "_MACHINE_ID": "b01b43c28d6c4150a4a097c673e8415e",
  "_HOSTNAME": "ubuntu-bionic",
  "_SYSTEMD_SLICE": "system.slice",
  "_PID": "1017",
  "_COMM": "dockerd",
  "_EXE": "/usr/bin/dockerd",
  "_CMDLINE": "/usr/bin/dockerd -H fd:// --containerd=/run/containerd/containerd.sock",
  "_SYSTEMD_CGROUP": "/system.slice/docker.service",
  "_SYSTEMD_UNIT": "docker.service",
  "_SYSTEMD_INVOCATION_ID": "e75cc9d178354d2f9d434cd8772bd866",
  "MESSAGE": "hogehoge",
  "IMAGE_NAME": "centos:7",
  "CONTAINER_NAME": "test-container",
  "CONTAINER_TAG": "98ece5257dc7",
  "SYSLOG_IDENTIFIER": "98ece5257dc7",
  "CONTAINER_ID": "98ece5257dc7",
  "CONTAINER_ID_FULL": "98ece5257dc7ad81be764ffbbebfb0af78c67e4b942e8ef497d286dc5e6e9156",
  "_SOURCE_REALTIME_TIMESTAMP": "1577583896529406"
}
```


# あとがき

まぁ特定コンテナのログ見たいだけなら`docker logs`でいいやんけって話ではある。場合によってはjournalctlを使いたいシーンもあるだろう。実際、フィルタリングなども容易なので私はjournalctlを使うことが多い。

# 参考

* [https://docs.docker.com/config/containers/logging/journald/](https://docs.docker.com/config/containers/logging/journald/)
エンジニアだけどポートフォリオサイト作ってみた話

# ポートフォリオサイトを作ってみた
こんにちは、ntakahashiと言います。エンジニアですがポートフォリオサイトを作って公開してみました。HTML、CSSは初心者のためまだまだ作りは荒いですが今後改良していこうと思っています。こうした方がいいよとか、このブラウザだと見にくいとかありましたらコメントいただければ幸いです。

[ntakahashi's Portfolio](http://ntakahashi016.github.io/default.html)

転職活動のためいろいろ調べていたところ、エンジニアもポートフォリオとして自分の作成物を公開したほうが良さそうと思ったので自分も作ってみることにしました。実際に転職活動のために使うことはありませんでしたが、フロントエンドの技術の習得や趣味で作ったプログラムの紹介などしたいと思っていたのでいい機会になりました。

# 使用技術
- HTML5
- CSS
- bootstrap
- Git
- GitHub
- GitHubPages



# 参考にしたページ
- [naoto portfolio](https://nsuzuki7713.github.io/portfolio/)
- [エンジニアでポートフォリオ作りました](https://qiita.com/turmericN/items/76559f0b70983469e7c7)
- [Yusuke Ito's Portfolio](https://i-yusuke.com/portfolio/)
- [【参考例あり】高評価を受けるエンジニア未経験者のポートフォリオとは？必要なレベルも公開](https://memorandumrail.com/engineer-portfolio-example/)
- [NAMIZATO SERVERSIDE-ENGINEER](https://namizatork.com/)
#Rails のマイグレーションにロジックを書く。ActiveRecord のメソッドを直接実行する。

migrationではモデルのメソッドを実行するなどして、ロジックを直接記述することも可能である。

```rb
class AddCreatedAtToUser < ActiveRecord::Migration[5.2]
  def up
    add_column :users, :created_at, :datetime, null: true
    User.update_all(created_at: Time.current)
    change_column :users, :created_at, :datetime, null: false
  end

  def down
    remove_column :users, :created_at
  end
end

```

# Original by Github issue

https://github.com/YumaInaura/YumaInaura/issues/2884








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->