OmniAICreator/Qiita-1.07M huggingface dataset:
UILabel .adjustsFontSizeToFitWidth 使用記録

#今回の内容

* `.adjustsFontSizeToFitWidth`についてのメモになります。

#コードと簡単解説

## .adjustsFontSizeToFitWidth = false

```Swift:
import UIKit

class ViewController: UIViewController {
  
    @IBOutlet weak var label: UILabel!
    
    override func viewDidLoad() {
        super.viewDidLoad()
    
        label.adjustsFontSizeToFitWidth = false
        
        label.text = "adjustsFontSizeToFitWidthを使用"       
    }

}
```

###結果

<img width="150" alt="D08DC079-AF97-4127-82ED-B1696FD3D66A_1_201_a.jpeg" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1466343/772c4b10-ef77-8409-33ec-64c17b784c1a.jpeg">


## .adjustsFontSizeToFitWidth = true

```Swift:
import UIKit

class ViewController: UIViewController {
  
    @IBOutlet weak var label: UILabel!
    
    override func viewDidLoad() {
        super.viewDidLoad()
    
        label.adjustsFontSizeToFitWidth = true
        
        label.text = "adjustsFontSizeToFitWidthを使用"       
    }

}
```

###結果

<img width="150" alt="4B653302-C756-4816-9F24-748E6E72D795_1_201_a.jpeg" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1466343/8300f575-dd00-9a0e-022b-aeabb4f75caa.jpeg">


# 終わり
ご指摘、ご質問などありましたら、コメントまでお願い致します。
「ERESOLVE unable to resolve dependency tree」エラーについて

#はじめに
Laravel×reactで開発を行っていて、「npm install 〜」でパッケージをインストールしようとしたら、以下のエラーとに遭遇しました。
参考になれば幸いです。
 
#エラー内容
npmでreactパッケージをインストールしてみようとすると、
 
```react:ターミナル
***@*** docker-laravel % docker-compose exec web npm i --save mapbox-gl @mapbox/mapbox-gl-language react-mapbox-gl react-mapbox-gl-language
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: undefined@undefined
npm ERR! Found: mapbox-gl@0.29.0
npm ERR! node_modules/mapbox-gl
npm ERR!   mapbox-gl@"*" from the root project
npm ERR!   peer mapbox-gl@"^0.29.0" from @mapbox/mapbox-gl-language@0.9.2
npm ERR!   node_modules/@mapbox/mapbox-gl-language
npm ERR!     @mapbox/mapbox-gl-language@"*" from the root project
npm ERR!     peer @mapbox/mapbox-gl-language@"^0.9.0" from react-mapbox-gl-language@1.0.1
npm ERR!     node_modules/react-mapbox-gl-language
npm ERR!       react-mapbox-gl-language@"*" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer mapbox-gl@"^0.39.1" from react-mapbox-gl-language@1.0.1
npm ERR! node_modules/react-mapbox-gl-language
npm ERR!   react-mapbox-gl-language@"*" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! See /root/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2021-11-16T14_24_44_936Z-debug.log
 
```
 
これは、reactのバージョンとインストールしようとしているパッケージのreact推奨バージョンが違う際に発生するようです。

##対処法
エラー文によると、installの際に--legacy-peer-depsを追加することで強制的にインストールできるみたいです。

```react:ターミナル
npm ERR! this command with --force, or --legacy-peer-deps
```

##実行結果
 
```react:ターミナル
***@*** docker-laravel % docker-compose exec web npm i --legacy-peer-deps --save mapbox-gl @mapbox/mapbox-gl-language react-mapbox-gl react-mapbox-gl-language

added 8 packages, and audited 1214 packages in 16s

66 packages are looking for funding
  run `npm fund` for details

25 vulnerabilities (14 moderate, 11 high)

To address issues that do not require attention, run:
  npm audit fix

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
 
```
 
#今回は「ERESOLVE unable to resolve dependency tree」エラーの対処法についてまとめてみました。
エラーの際はびっくりしますが、エラー分の中に正解はあります。
参考になれば幸いです。
gem 'date'のReDos脆弱性についての内容と対応の注意点 [CVE-2021-41817]

# はじめに
この記事の内容は以下のページを機械翻訳したものを一部引用しています。合わせて原文も参照すると理解が深まると思います。

https://www.ruby-lang.org/en/news/2021/11/15/date-parsing-method-regexp-dos-cve-2021-41817/
 
# 脆弱性の内容

`Date.parse`は、内部でRegexpsを使用しており、その一部は正規表現のサービス拒否に対して脆弱です。
このようなメソッドを信頼できない入力に適用するアプリケーションとライブラリが影響を受ける可能性があります。

## 脆弱性に対する修正内容

この修正により、正規表現を変更する代わりにデフォルトで入力長が最大128バイトに制限されます。
これは、'date' gemが多くの正規表現を使用しており未発見の脆弱な正規表現がまだ存在する可能性があるためです。
互換性を維持するには次のようにlimitキーワードに明示的にnilを渡すことで制限を取り除くことができますが解析に時間がかかる場合があることに注意してください。

```ruby
Date.parse(str, limit: nil)
```
# 脆弱性への対応

#### 💡 2021-11-25追記: 2021-11-25 にruby 3.0.3がリリースされました。このリリースには、gem 'date'の3.1.3がバンドルされています。
そのため、まだこちらの対応をしていない場合はrubyのバージョンアップのみで対応できます。
既に対応している場合は、rubyのバージョンアップを行うことでGemfileから明示的なgem 'date'の指定を削除できます。

```diff:Gemfile
- ruby '3.0.2'
+ ruby '3.0.3'

- gem 'date'
```


#### 💡2021-11-19追記: 以下「この対応をしたことにより新たに発生するエラーと注意点」に記載した`TypeError`が発生それバグが修正されバージョン`3.2.2`がリリースされたので今からインストールされる際には`3.2.2`以上を指定してください

'date' gemをバージョン3.2.1、3.1.2、3.0.2、および2.0.1以降に更新してください。
`gem update date`コマンドを実行して更新することができます。
bundlerを使用している場合は、Gemfileに以下を追加してください。

```
gem "date", ">= 3.2.2"
```

# この対応をしたことにより新たに発生するエラーと注意点

#### 💡2021-11-19追記: こちらのバクはバージョン`3.2.2`で修正されています。

https://github.com/ruby/date/compare/v3.2.1...v3.2.2

`Date#_iso8601`で引数に`nil`が指定された場合に空のハッシュ`{}`が返却されていましたが、この変更により`TypeError`が発生します。

```ruby
# Before
>> Date._iso8601(nil)
=> {}

# After
>> Date._iso8601(nil)
(irb):2:in `_iso8601': no implicit conversion of nil into String (TypeError)
```

この問題はすでに`ruby`, `rails`では報告されており対応がされています。

* https://github.com/ruby/date/issues/39
* https://github.com/ruby/date/pull/40
* https://github.com/rails/rails/pull/43643

他にも`Faraday`など複数のgemで同様のエラーが発生するようになった報告がコメントされています。

> this breaks some applications and gems like faraday.

https://github.com/ruby/date/issues/39


## 引用

* https://github.com/advisories/GHSA-qg54-694p-wgpp
* https://www.ruby-lang.org/en/news/2021/11/15/date-parsing-method-regexp-dos-cve-2021-41817/
【Linux】ファイルとディレクトリのデフォルトパーミッション

## Linuxのパーミッション
ファイルを作成したときは「666」、ディレクトリを作成したときは「777」からumaskの値を引いたパーミッションがデフォルトのパーミッションになる。


```ruby:(例)
umask = 0027
# ファイルの場合
666 - 0027 = 640
# ディレクトリの場合
777 - 0027 = 750
```

## tomcat起動時
Tomcat8.5系以降では、catalina.shによってumaskのデフォルト値に「0027」が設定される。
Tomcat7系（もしくは初期の8系）の場合と同様のパーミッションを指定したい場合は、下記ファイルに環境変数設定を追記する必要がある。

設定ファイル：/etc/init.d/tomcat

参考: [tomcatのumaskについて](https://doc.support-dreamarts.com/%E3%81%B2%E3%81%B3%E3%81%8DSm@rtDB/V42/%E3%81%B2%E3%81%B3%E3%81%8DSm@rtDB_Ver.4.2_%E9%81%8B%E7%94%A8%E3%82%AC%E3%82%A4%E3%83%89/appendix/96000/index.html)
「適格請求書発行事業者公表システムWeb-API機能」利用の覚書

# はじめに
令和5年10月1日からいわゆるインボイス制度と呼ばれたりもする適格請求書発行方式が始まります。内容はともかく、今まで通りに商売を続けるためには届け出をして「登録番号」をとらなければならないようです。この登録番号は今まであった13桁の「法人番号」の頭にTを付けた14桁の番号で、法人番号同様に公表されるのです。

https://www.invoice-kohyo.nta.go.jp/web-api/index.html


# 環境準備
1. 上記のサイトから申請できるアプリケーションIDを準備しますが、法人番号APIで使ったアプリケーションIDがそのまま流用できるそうなので、そのまま利用しました。

https://qiita.com/talomina/items/3af845b3eec511ab55fe

1. Python環境を準備します。今回もAmazon lambdaを利用しました。

# 実装
作成したコードです。登録番号を元にAPIから取得した会社名や住所を表示します。法人番号との主な違いは下記のようなところです。
* 法人番号は全て頭にTを付けて登録番号に変更する
* 今回XMLで取得しましたが、タグ名が変わったり項目自体の変更があったので、プログラムを修正。
* 取得方式の選択肢も変わってJSONが登場。

```python:get_tekikaku_info.py
import json
import requests
import xml.etree.ElementTree as ET

def lambda_handler(event, context):
    url='https://web-api.invoice-kohyo.nta.go.jp' + '/1/num'
    
    payload = {
        'id': 'AAAAAAAAAAAAA', #Application key
        'number': [
            'T1180301018771', #Touroku Number
            'T9020001031109',
            'T8030001046841',
        ],
        'type': 11, #01:CSV(UTF8) 11:XML(UTF8)
    }
    # Request to API    
    r = requests.get(url, params = payload)
    # Perse XML to ET
    root = ET.fromstring(r.text)
    #
    for announcement in root.findall('announcement'):
        sequenceNumber = announcement.find('sequenceNumber').text
        registratedNumber = announcement.find('registratedNumber').text
        name = announcement.find('name').text
        address = announcement.find('address').text
        print(sequenceNumber,registratedNumber,name,address)

    return {
    'statusCode': 200,
    'body': json.dumps(r.text)
    }
    
```

実行結果です。

```
1 T1180301018771 トヨタ自動車株式会社 愛知県豊田市トヨタ町１番地
```

トヨタ、ホンダ、日産を検索したところ、まだトヨタしか出てきませんでした。令和5年までまだ時間はあるので、届け出中でしょうか。

# おわりに
これからしばらくは適格請求書を巡っていろいろなビジネスが始まりそうな予感がして楽しみです。
インフラエンジニア学習1116

４つの通信方式
・ユニキャスト：１対１の通信
・ブロードキャスト：１対不特定多数の通信
・マルチキャスト：１対特定グループの通信
・エニーキャスト：１対特定グループ内の通信

UTPケーブル：LANケーブル
・100 BASE-TX
・1000 BASE-TX
・10 GBASE-T
※Tがあることで、UTPと判断する。

レイトコリジョン
・レイト＝遅れる
・コリジョン＝データ衝突

光ファイバーケーブルの特徴
・高価
・取り回しが難しい
・距離は最大数10km
・シングルモードとマルチモードに分けられる

○シングルモード
・コアが細い
・高速、超長距離

○マルチモード
・コアが太い
・中速、中長距離



PDU：各層で扱われるデータの単位の総称
・データ＝メッセージ
・データ＋L4＝セグメント
・データ＋L4＋L3＝パケット
・トレーラ＋データ＋L４＋L3＋L2＝フレーム
ELFのSection header string table indexセクションの中を表示する

`$ readelf -h <elf_object>`で、elf_objectのheaderを表示

例:

```sh
$ readelf -h a.o
ELF Header:
  Magic:   7f 45 4c 46 02 01 01 00 00 00 00 00 00 00 00 00 
  Class:                             ELF64
  Data:                              2's complement, little endian
  Version:                           1 (current)
  OS/ABI:                            UNIX - System V
  ABI Version:                       0
  Type:                              EXEC (Executable file)
  Machine:                           Advanced Micro Devices X86-64
  Version:                           0x1
  Entry point address:               0x401060
  Start of program headers:          64 (bytes into file)
  Start of section headers:          16840 (bytes into file)
  Flags:                             0x0
  Size of this header:               64 (bytes)
  Size of program headers:           56 (bytes)
  Number of program headers:         11
  Size of section headers:           64 (bytes)
  Number of section headers:         33
  Section header string table index: 32
```


`$ readelf -x <Section header string table index> <elf_object>`で、Section header string table index sectionの中身を表示

例: 

```sh
$ readelf -x 32 a.o

Hex dump of section '.shstrtab':
  0x00000000 002e7379 6d746162 002e7374 72746162 ..symtab..strtab
  0x00000010 002e7368 73747274 6162002e 696e7465 ..shstrtab..inte
  0x00000020 7270002e 6e6f7465 2e676e75 2e627569 rp..note.gnu.bui
  0x00000030 6c642d69 64002e6e 6f74652e 4142492d ld-id..note.ABI-
  0x00000040 74616700 2e676e75 2e686173 68002e64 tag..gnu.hash..d
  0x00000050 796e7379 6d002e64 796e7374 72002e67 ynsym..dynstr..g
  0x00000060 6e752e76 65727369 6f6e002e 676e752e nu.version..gnu.
  0x00000070 76657273 696f6e5f 72002e72 656c612e version_r..rela.
  0x00000080 64796e00 2e72656c 612e706c 74002e69 dyn..rela.plt..i
  0x00000090 6e697400 2e746578 74002e66 696e6900 nit..text..fini.
  0x000000a0 2e726f64 61746100 2e65685f 6672616d .rodata..eh_fram
  0x000000b0 655f6864 72002e65 685f6672 616d6500 e_hdr..eh_frame.
  0x000000c0 2e696e69 745f6172 72617900 2e66696e .init_array..fin
  0x000000d0 695f6172 72617900 2e64796e 616d6963 i_array..dynamic
  0x000000e0 002e676f 74002e67 6f742e70 6c74002e ..got..got.plt..
  0x000000f0 64617461 002e6273 73002e63 6f6d6d65 data..bss..comme
  0x00000100 6e74002e 64656275 675f696e 666f002e nt..debug_info..
  0x00000110 64656275 675f6162 62726576 002e6465 debug_abbrev..de
  0x00000120 6275675f 6c696e65 002e6465 6275675f bug_line..debug_
  0x00000130 73747200                            str.
```
beautiful soup4のインスタンス生成時に、lxmlを指定するとスクレイピング時にデータが欠落した問題

# 現象
30件データを取得したいにも関わらず、14件しか取得できません。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/630191/0681174a-11ac-c8b9-d9e1-920985e18d93.png)

# 解決策
パース前にパース対象を下記のコードのように、shift-jisからutf-8に変換しておく必要があります。

```
soup = BeautifulSoup(c.decode("CP932"), "lxml")
```
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/630191/7b4d1c0c-0730-9091-c972-a0803a4184c3.png)
ゼロから作るDeep Learning ３周目くらい(4.5.1 ２層ニューラルネットワークのクラスまで)

[言語処理100本ノック 2020年版](https://nlp100.github.io/ja/)が行き詰まってきた、
というか「第８章：ニューラルネット」に入ったので
基礎をおさらいするために「[ゼロから作るDeep Learning](https://www.amazon.co.jp/dp/4873117585/)」を３周目くらいの再再読。

学習の成果は[Github](https://github.com/marzg510/study-dl-from-scratch.git)に公開しています。

４章は「数値微分」が面白いです。こんなやり方があったのか、って感じです。
５章の「逆誤差伝播法」も面白いです。いつも大体このへんで分かった気になって、やめます。

気がつけば４巻まで出ていたのですね。

２巻が自然言語処理編なのでそこまで頑張って追いつきます。
C# log4net でログ出力

#概要
・C#でのログ出力について、備忘的な感じで残す。
・今のところ、ほぼ参考先のままなので、後で自分なりの設定が決まったら修正する。

##開発環境
・Visual Studio 2019 Community

##詳細
**関連ソース一覧**

| ファイル | 概要 | 
|:--------------------|:------------|
| AssemblyInfo.cs     | 最初からあるファイル、ログの定義ファイルの場所を記述しておく         |
| Log4net.xml         | ログの定義を記述するファイル※       |
※プロパティの「出力ディレクトリにコピー」を「常にコピーする」にしておく。

```c#:AssemblyInfo.cs
using System.Windows;

[assembly: ThemeInfo(
    ResourceDictionaryLocation.None, //where theme specific resource dictionaries are located
                                     //(used if a resource is not found in the page,
                                     // or application resource dictionaries)
    ResourceDictionaryLocation.SourceAssembly //where the generic resource dictionary is located
                                              //(used if a resource is not found in the page,
                                              // app, or any theme specific resource dictionaries)
)]
// Log4Net用設定ファイル
[assembly: log4net.Config.XmlConfigurator(ConfigFile = "./Resources/Log4net.xml", Watch = true)]
```
↑最後のところに追加する。

```xml:AssemblyInfo.cs
<?xml version="1.0" encoding="utf-8" ?>
<configuration>
  <log4net>
    <appender name="systemlog" type="log4net.Appender.RollingFileAppender">

      <appendToFile value="true" />
      <StaticLogFileName value="false" />

      <rollingStyle value="Date" />
      <!-- 出力先 -->
      <file value="C:\logs\systemLog-" />
      <DatePattern value='yyyyMMdd".log"' />
      <lockingModel type="log4net.Appender.FileAppender+MinimalLock" />

      <filter type="log4net.Filter.LevelRangeFilter">
        <param name="LevelMin" value="INFO" />
        <param name="LevelMax" value="Error" />
      </filter>
      <layout type="log4net.Layout.PatternLayout">
        <ConversionPattern value="%date [%thread] [%-5level] %logger - %message%n" />
      </layout>
    </appender>
    <root>
      <level value="ALL" />
      <appender-ref ref="systemlog" />
    </root>
  </log4net>
</configuration>
```

##動作確認
```C#:ログ呼び出し.cs
ILog log = LogManager.GetLogger(System.Reflection.MethodBase.GetCurrentMethod().Name);

log.Info("INFOで出力");
log.Warn("WARNで出力");

```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/834885/866f6e88-8607-a79c-c231-0631800b2029.png)

```text:ログファイルにはこんな感じで出力される
2021-11-16 22:55:11,692 [1] [INFO ] DBAccess - INFOで出力
2021-11-16 22:55:11,700 [1] [WARN ] DBAccess - WARNで出力
```
↑「DBAccess」のところは、呼び出し元の関数。

##感想
log4jと使い方的にはそこまで変わらないかなという印象でした。


## 参考
https://itsakura.com/csharp-log4net
Arduinoの勉強　第3弾：PWM（擬似的アナログ出力）

# #PWM（擬似的アナログ出力）
##はじめに
ハードウェアの勉強のためにArduinoを復習も兼ねて参考教材に沿って，勉強する．細かな部分の理解までして，自在に扱えるようになることが目的である．その第3弾として，「PWM（擬似的アナログ出力）」を扱う．

##アナログ出力
![slide1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/951300/438e493c-4109-9a03-7c7c-1521e2eb8a01.png)

## PWM（擬似的アナログ出力）
![slide2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/951300/77d22cca-0a8c-8b76-7f26-5398991d713a.png)

## 感想
Arduinoでアナログ出力を使っているつもりだったが，正確には擬似的なアナログ出力であった．PWMは改めてまとめたことで，整理できたと思う．次回はアナログ入力について整理する．

## 参考文献
- 電子部品ごとの制御を学べる！Arduino電子工作実践講座 改訂第2版 福田和宏 著 ソーテック社
物流管理からエンジニアになってみて

### 前職の内容
前職では物流業に従事していました。
高校卒業後、約10年間勤めていました。
係長兼物流センター副センター長を任せていただいていました。
業務内容は大きく分けて２つあります。<br>
1. 物流センターの管理、運営業務
物流センターの副センター長として、収支管理や従業員の管理、センター内の安全管理など
物流センターの管理、運営業務に携わりました。<br>
2. 配達ドライバーの管理
配達ドライバーの運行計画、緊急時対応や安全に係る業務や収支改善など
輸送管理する業務に携わりました。

### エンジニアになろうと思ったきっかけ
物流業界はアナログな面も少なからずあり、業務の改善を進める中でITの力はとても大きかったです。
例として、紙ベースのもの(シフト表や集荷リスト)のシステム化や在庫分析システムなど。
さらには、今後業界の人員不足からトラックの自動運転やロボットによる集荷などのIT化が予想されており、
今後はますますIT技術が必須だと感じ、自身も基本情報技術の学習を始めました。
仕事の後に毎日2時間、休日は６時間ほどを約半年続けました。
学習を進めていくうちにエンジニアになりたい！と思い、エンジニアになるべく上京。
そしてポテパンキャンプを受講し、基礎を一から学びました。

### エンジニアとして働いてみた感想
ポテパンキャンプを通して基礎を学び、紹介していただいた企業に今は勤めています。
入社してからすぐ開発に参加させてもらえて良い経験ができています。
業務未経験からの挑戦なので大変なことも多いですが、何より楽しいです！
しっかりと自分の時間も取れるようになり、その中で学習を続け業務に活かせています。
エンジニアになって、学ぶことの楽しさを改めて実感しています。
そして未経験の私を採用してくれた会社に一刻も早く利益をもたらせるよう精進します。

### 今後はどんなエンジニアを目指したいか
言語を限定せずバックエンドを極め、インフラを極めることが今の目標となっています。
そのためには、Webの知識、SQL、プログラミングなどまだまだ足りないところがありますが、
終業後や休日を使ってしっかりキャッチアップしていきたいと思っています。
今は何が分からないか分からない状態もたまにありますが、まずは業務を一人前にこなせるようになります。
ゆくゆくはチームリーダー、プロダクトリーダーなど任せてもらえるほど頑張ります！
Pega備忘 Job Scheduler

#Job Scheduler
　メール通知や、Pegaノードのクリーンナップなど定期的に行われるバックグランド処理のこと。
　Activityが動作し、Activityは色々なルールを実行する。

　Pega7まで、エージェントルール(advanced agent)を使用してバックグランド処理を実現していたが、
　メンテナンス性、性能の観点からPega8ではJob Schedulerで実現されるようになった。


##使い方
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/130008/b32711cd-c546-c8f7-e3a7-aae0d87405d1.png)

　１，Enable JobScheduler：有効か無効か
　２：Associated with node types：下の画面みたいに複数のノードタイプから選択できる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/130008/8df8d99b-e446-5fde-14c7-9a4220774bf6.png)
　３．Run on：２つから選択できる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/130008/6b5aa73f-8c56-1848-06d0-ccbc238df779.png)
　４．Schedule：日次、週次などの実行サイクルを指定する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/130008/30f7372e-a82e-6abe-d2aa-0b3d8b84a2ae.png)
　５．Context：
　６．Class/Activity：ジョブスケジューラで動作させるActivity

##動作確認
　動作させるActivity
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/130008/ff537a61-3f1b-a58c-89d4-a130b0fb418a.png)

　Job Schedulerの設定
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/130008/0a5faf69-32f3-ba80-1e96-d0fae131f246.png)
　
　結果
　　PegaRulesLogに1分間隔でメッセージが出力されている
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/130008/eca1979c-9623-dd77-c2b4-49e2fc4e563b.png)

##補足
　APP Adminからも確認することができる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/130008/5daa0e58-ba63-fe0e-8499-44b859749245.png)
　実行した結果も確認することができる
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/130008/2ebead12-33e1-46d8-259e-6a855d176768.png)
pyenv + venvを使ったpython仮想環境（Windows向け）

# 前提

- Windows10
- Python3.8.2インストール済
- pipが実行可能
- Power Shellで操作した

# 目指す環境

- pyenvで好きなバージョンのpythonを利用できる
- venvで複数のプロジェクトごとのライブラリを管理できる

※python純正のvenvだけで仮想環境作りたかったが、プロジェクトごとにpythonのバージョンも異なるのでpyenvも併用することにした。

# pyenv インストール

WindowsにインストールしてあるPython3.8.2を使ってpyenv-winをインストールした。

```console
pip install pyenv-win --target $HOME\\.pyenv
```

### 環境変数設定

```console
[System.Environment]::SetEnvironmentVariable('PYENV',$env:USERPROFILE + "\.pyenv\pyenv-win\","User")
[System.Environment]::SetEnvironmentVariable('PYENV_HOME',$env:USERPROFILE + "\.pyenv\pyenv-win\","User")
[System.Environment]::SetEnvironmentVariable('path', $env:USERPROFILE + "\.pyenv\pyenv-win\bin;" + $env:USERPROFILE + "\.pyenv\pyenv-win\shims;" + [System.Environment]::GetEnvironmentVariable('path', "User"),"User")
```

PowerShellを一度再起動する。

### pyenvバージョン確認

```console
pyenv --version
```

### pyenvで任意バージョンのpythonをインストール

利用するバージョンのpythonをインストールする。

```console
pyenv install 3.9.2
```

### プロジェクトで利用するpythonバージョンを指定する

```console
pyenv local 3.9.2
```

### pythonのバージョンを確認してみる

```console
python --version
```

## よく使うpyenvコマンド

|コマンド|説明|
|---|---|
|pyenv install [version]|指定バージョンのPythonをインストール|
|pyenv uninstall [version]|指定バージョンのPythonをアンインストール|
|pyenv local [version]|指定バージョンのPythonを特定のディレクトリで使う|
|pyenv global [version]|指定バージョンのPythonをデフォルト利用にする|
|pyenv --version|pyenvのバージョンを確認|
|pyenv versions|インストールしたPythonバージョンの一覧を確認|
|pyenv version|カレントディレクトリで有効なPythonのバージョンを確認|
|pyenv install --list|インストールできるPythonバージョンの一覧を確認|

# venvで仮想環境をつくる

```console
python -m venv [ディレクトリ名]
# 例)
python -m venv venv
```

### venv環境をアクティブにする

```console
.\venv\Scripts\activate
```

### pipのバージョンを最新にする

```console
python -m pip install --upgrade pip
```

### pipでライブラリインストール

```console
pip install [ライブラリ]
# 例
pip install Django
```

または

```console
pip install -r requirements.txt
```
Python_変数を文字列に展開

# format
```
hello = "Hello"
world = "World"
print("{} {}".format(hello, world))

```
> Hello World

# fstring
* formatより少し早い


```
hello = "Hello"
world = "World"
print(f"{hello} {world}")
print(f"{type(hello)}")
```
> Hello World
<class 'str'>
Mac Finderで切り取りを使う方法

MacでWindowsのような切り取り機能を使うときはcommand+Cを押した後、貼り付けたい階層に行きcommand+Option+Vで貼り付けることができる。

またフォルダやファイル名を変更するときはトラックパッドを押したときにもう一段階強く押すことでファイル名の変更ができる。

またvsコードやkeynoteなどで一つ前の操作に戻りたいときは、command+Zを押すことで戻ることができる。
Androidアプリで使用できる言語またはフレームワーク

# はじめに

以前 JavaScript で作成していたアプリを Android 向けにリリースしようかと考えています。
候補としては、Kotlin, ReactNative, Flutter の 3 つになります。
ということで、それぞれの特徴を調べて、自分用のメモとして以下に纏めてみました。

※これまでたくさんの方が比較されてきたかと思いますが、自分で書いてみた次第。

# Kotlin
- Java Virtual Machine 上で動作するオブジェクト指向言語。
- Java と比較すると、簡潔で安全性が高い。
- Java と互換性が高い、JVM 言語の一種。
- Java のプログラムやJava用のライブラリ、フレームワークなどを流用できる。
- プログラム作成後はコンパイルして使用する。(変更から反映まで時間を要する場合がある。)

# React Native
- JavaScript のライブラリであるため、iOS/Android 両方のアプリを開発可能。
- ホットリロードと言って、コードの変更点を保存して瞬時に反映することができる。
- React を使用した人には学習が容易である。(逆に、Java 開発経験者は、JavaScriptをいちから学習する必要がある。)
- 発生するエラーが、ReactNative と JavaScript の階層でのエラーがあり、解決に時間を要する・エラー箇所特定のしにくさがある。

# Flutter
- iOS/Android 両方のアプリを開発可能。
- ReactNative と同様、ホットリロード機能がある。
- Dart といいうプログラミング言語を新しく習得する必要がある。(ただし、設計は JavaScript を踏襲しているとのこと。)
- 情報が少ないために解決に時間を要する場合がある。
- Googleのスマートディスプレイの OS 「Cast OS」の後継と考えられるFuchsia にて、アプリ開発のフレイムワークとして採用されている。

# 結論

Android だけでなく iOS での開発を考慮することができ、JavaScript を触ったことがある私としては、React Native が良いかなーとなりそうでした。
しかし、発生するエラーがどの階層かすぐに判断できず解決に時間を要することがあるということと、将来性を考えると、Flutter が最適と考えました。

# 最後に
Flutter はこれから機能が充実してくるため、勉強していくのが楽しみです。

# 参考

#### Kotlin
・[Kotlin 公式ページ](https://dogwood008.github.io/kotlin-web-site-ja/docs/reference/)
・[Wikipedia](https://ja.wikipedia.org/wiki/Kotlin)
・[TOPSIC](https://products.sint.co.jp/topsic/blog/kotlin-language-overview)

#### React Native
・[React Native 公式ページ](https://reactnative.dev/)
・[Udemyメディア](https://udemy.benesse.co.jp/development/app/react-native.html)

#### Flutter
・[Flutter 公式ページ](https://www.flutter-study.dev/introduction/about-flutter)
・[Qiita](https://qiita.com/engineerhikaru/items/b61a2db9120c4d83f91a)
【iOS15】UITableViewのCell間に妙な隙間ができる件について

#iOS15からUITableViewのCell間に隙間ができる
iOS15からUITableViewにHeaderを設定していると、上部に隙間ができていました。
原因はiOS15から追加された**sectionHeaderTopPadding**というプロパティが追加されたのが原因のよう、ちなみにデフォ値は-1が設定されていました。
対応策は以下のように０を設定してあげると、今まで通り表示されます。

```swift
if #available(iOS 15, *) {
    tableView.sectionHeaderTopPadding = 0.0
}
```

#参考
https://qiita.com/yuringo_mm/items/e86aaa80bd3ae9e35fbd
httpのステータスコード 418 とは？

## 勉強前イメージ

エイプリルフールネタだった気がする

## 調査

###  httpのステータスコード 418 とは？

httpのステータスコードは 200番のOK だったり、404番のNot Foundだったり
アクセスに対するサーバかからの応答になります。
大まかに分類すると、以下になります

- 100番台 : 情報
- 200番台 : 成功
- 300番台 : リダイレクト
- 400番台 : クライアントのエラー
- 500番台 : サーバのエラー

上記の中に、418番にもステータスコードがあります。
418番のステータスコードは I’m a teapot と書かれており、 私はティーポット という意味になります。
1998/04/01に発行されたエイプリルフールRFCで定義されたステータスコードになります。
ただのエイプリルフールネタですが、googleでは [こちら](https://www.google.com/teapot) のようにwebがあります。
意味としては、ティーポットにコーヒーを入れさせようとして、拒否された場合に返すステータスコードのようです。
418番はHTTPの拡張の HTCPCP(Hyper Text Coffee Pot Control Protocol:ハイパーテキスト・コーヒーポット制御プロトコル)で実装されていて、
HTCPCPに関しても同様に1998/04/01に発行されたエイプリルフールネタになり、コーヒーポットの制御、監視、診断を行うための通信プロトコルになります。

ちゃんとgoogleでみてもstatusが418になってますね

![1Error 418 (I’m a teapot)!_ - Google Chrome 2021-11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/129517/0924917c-0199-c11c-ee35-1a93ac7ec64f.png)

## 勉強後イメージ

正直こういうときくらいじゃないとちゃんとRFC読まない・・・
個人的にはコーヒーかすをインターネットの配管に入れると詰まるって真面目に書いてるのが好きです

## 参考

- [Hyper Text Coffee Pot Control Protocol (HTCPCP/1.0)](https://datatracker.ietf.org/doc/html/rfc2324)
- [謎のHTTPステータスコード”418 I’m a teapot”が出た時の対処方法](https://cpoint-lab.co.jp/article/201802/1317/)
シンプルな JSON 書き出し Java サンプル (jackson-databind 利用)

JSON をちょっと Java で書き出したい時のサンプルをメモしておきます。

JSON書き出しには [RFC 4180](https://www.rfc-editor.org/info/rfc8259) を実装する必要がありますが、一般的にはライブラリ利用により実現します。
この例では、 `jackson-databind` を利用した JSON書き出しサンプル記述を残しておきます。

# Maven (pom.xml)

まず最初に、JSON書き出しを実現するためのライブラリである `jackson-databind` をビルドに組み込みます。 pom.xml ファイルの <dependencies> に以下の Maven Repository 記述を追加します。 (ビルドでの自動ダウンロードの実現のためには、インターネットに接続されている必要があります)

```xml
<dependency>
    <groupId>com.fasterxml.jackson.core</groupId>
    <artifactId>jackson-databind</artifactId>
    <version>2.13.0</version>
</dependency>
```

# POJO 作成

`jackson-databind` はデータの書き出しに Java の POJO クラスを利用します。この POJO クラスは一般的にはツールを用いて自動生成します。ここでは、`jsonschema2pojo` を利用して、JSON文字列を入力に Java ソースコードを自動生成します。

* https://www.jsonschema2pojo.org/

`jsonschema2pojo` サイトは以下のような画面のイメージです。

![json2java.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/105739/e348d5cd-e5a2-d68d-a0ce-9aabef3d165f.png)

## 生成ソースコードの設定例

* JSON文字列を貼り付け
* `Package` に生成後 Javaソースコードのパッケージ名を入力。この例では `pojo` と入力
* `Class name` に生成後 Javaソースコードのクラス名を入力。この例では `Climate` と入力
* `Source type` を `JSON` に設定
* `Annotation style` を `Jackson 2.x` に設定
* チェックボックスは、`Include getters and setters` のみチェック

`Zip` をクリックして、そして Java ソースファイルを ZIP ファイルとしてダウンロードします。

# Java 記述

生成した POJO (`Climate.java`) を利用して JSON データを書き出すプログラミングをします。

* 書き出したい情報を POJO に設定
* `ObjectMapper` インスタンスを作成
* インデントありのJSON出力を設定
* POJOを入力に writeValueAsString を呼び出して、JSON出力を文字列として取得

```java
import java.io.IOException;

import com.fasterxml.jackson.databind.ObjectMapper;
import com.fasterxml.jackson.databind.SerializationFeature;

import pojo.Climate;

public class App {
    public static void main(String[] args) throws IOException {
        Climate climate = new Climate();
        climate.setPublishingOffice("お天気庁");
        climate.setReportDatetime("2021-11-15T16:36:00+09:00");
        climate.setTargetArea("東京村");
        climate.setHeadlineText("はれ.");
        climate.setText("明日は晴れ.");

        final ObjectMapper mapper = new ObjectMapper();
        mapper.enable(SerializationFeature.INDENT_OUTPUT);
        final String json = mapper.writeValueAsString(climate);
        System.err.println("data: " + json);
    }
}
```

# 文書情報

* 初出: 2021-11-16

## 関連情報

* [シンプルな JSON 読み込み Java サンプル (jackson-databind 利用)](https://qiita.com/igapyon/items/14c6ff9430c5d8727e91)
* [シンプルな JSON 書き出し Java サンプル (jackson-databind 利用)](https://qiita.com/igapyon/items/384b88d364e0d241f91b)
* [シンプルな HTTP クライアント Javaサンプル (Apache HttpComponents 4.5系を利用)](https://qiita.com/igapyon/items/b0f9918db992c308949b)
Packet TracerでNetFlowを設定してみる

使用環境
Packet Tracer version 8.0.1.0064

既に出来上がっているOSPFネットワークにNetFlowの設定を入れてみたいと思います。
以下の図の構成からスタートします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/800227/fa0ce648-aa88-5d0f-15e7-48c18bed5602.png)

Area0(オレンジ色)内にあるRouter0にArea2(緑色)からArea3(ピンク色)へ流れるトラフィックをNetflowの対象にしたいと思います。
Netflow出力先はArea2にあるPC4にしたいと思います。

では、まず、PC４にてNetflow Cllectorのサービスをオンにしましょう。

↓デスクトップでNetflow Collectorを選択
![Screen Shot 2021-11-16 at 10.21.30 PM.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/800227/ef94b173-73bc-b8f4-9fe7-696922c6039b.png)
↓ServiceがOffになっているので、Onにしましょう。
![Screen Shot 2021-11-16 at 10.20.54 PM.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/800227/0e58fbb4-fd53-c623-e72f-59dcd671ba03.png)

次にRouter0の設定をします。
インターフェイスは以下のような設定になっています。

![Screen Shot 2021-11-16 at 10.27.51 PM.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/800227/43444295-c902-803c-0af8-60fdfa0792b4.png)

ip flow ingressをGigabitEthernet0/0に設定することでそのポートに入ってくるトラフィック、ip flow egressをGigabitEthernet0/2に設定することでそのポートから出ていくトラフィックの情報を監視できるわけです。つまり、Area2からArea3へ流れるトラフィックのことですね。

あと、Netflowの出力先、Flowモニタを設定します。
以下のコマンドを入れればいいです。
![Screen Shot 2021-11-16 at 10.28.14 PM.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/800227/7767cf0b-f20e-4c41-a4c6-9f49974e6101.png)

設定完了後、PC4からPC6へpingを飛ばします。
ping成功したら、PC4のNetflow Collectorに情報が表示されるはずです。
![Screen Shot 2021-11-16 at 10.37.13 PM.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/800227/f3fdc664-0185-60e6-197e-8313c9a39fa5.png)
Pythonによるメール配信(SMTPAuthenticationError )

環境：Windows10 pro
python 3.9
VsCode

勉強の為に
pythonからコードを書いてメールをテスト送信しました。

````
from email import message
import smtplib

smtp_host = 'smtp.gmail.com'
smtp_port = 587
use_smtps = any
from_email ='#####@gmail.com'
to_email = '####@outlook.jp'
username = '####@gmail.com'
password = ''

msg = message.EmailMessage()
msg.set_content('Test email')
msg['Subject'] = 'Test email sub'
msg['From'] = from_email
msg['To'] = to_email

server = smtplib.SMTP(smtp_host, smtp_port)
server.ehlo()
server.starttls()
server.ehlo()
server.login(username, password)
server.send_message(msg)
server.quit()
````
パスワードはメールアカウントのパスワードと思い入力しました。
しかし、以下のエラーが発生。

````
例外が発生しました: SMTPAuthenticationError (534, b'5.7.9 Application-specific password required. Learn more at\n5.7.9  https://support.google.com/mail/?p=InvalidSecondFactor ot7sm2836890pjb.21 - gsmtp')
````
以下が参考になりました。
[Pythonでメール(gmail)を送信できない場合の解決法](https://www.gocca.work/python-mailerror/)

パスワードはgoogleはメールのパスワードではなくアプリパスワードを入力する。
````

````
password = 'googleアプリパスワード'
````
Gmailにメールが送信できました。
Visual Studio: 閲覧中のソースをソリューションエクスプローラーでアクティブに

エクスプローラーだと、開いてるパスにフォルダペインを同期するオプションがあって便利なのに、何故 VS にはないんだろう？と思っていたら・・単純に Default 設定でなかった、というだけの記録

VS だと編集中のソースをソリューションエクスプローラーで表示してくれるので、知らないプロジェクトなんかで威力を発揮します。
今まで無駄なことしてたなぁ・・

アプリの設定は、たまには眺めて便利な機能ないかなぁって探さないと！

# エクスプローラーの設定
![2021-11-16_22h09_54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120072/d5fad3d6-639a-4dfe-501b-263f46da9d4d.png)

# VS の設定
![2021-11-16_22h09_02.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/120072/715d2a7a-001f-d217-10f6-1c58b7c3e558.png)
Android StuidoでGit Logが文字化けした時の対応

![スクリーンショット 2021-11-16 22.14.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1740384/1078615d-5251-41ad-c6ec-164d0488ea3e.png)

Android StudioでGit Log箇所を選択した際に文字化けしたときの解決方法を記入します。（なんて書いてあるかわからないw）

#原因
######以前に日本語対応した為、文字フォントを使用していない

#対応方法
#####1.Android StudioからPreferencesを選択する。
![スクリーンショット 2021-11-16 22.15.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1740384/789f6a79-3896-c931-40c7-b01acf426570.png)

#####2.Appearanceを選択し、Use custom font:にチェックを入れ日本語に対応しているフォントに選択する。
その後、OKボタンを押して設定した内容を適応する。
![スクリーンショット 2021-11-16 22.15.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1740384/6f1bbbcc-d524-74c1-0cd5-c46895e0cba6.png)

#結果
これで文字化けしていないか確認した結果・・・
無事に文字が表示されました〜＾＾
![スクリーンショット 2021-11-16 22.31.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1740384/21703b78-1a48-3570-bf91-7af5ccaf35a3.png)

この記事見ている方は解消されましたか〜？
【Firebase(ver8)】Firestore DatabaseでCRUD基本入門

ご無沙汰してます、おおのんです。

フロントエンドからFirestoreのデータ取得・登録・編集・削除(CRUD)する場合のサンプルです。
たまに使うときに忘れがちなのでメモとして残します。

公式の硬い文書にやられがちな人が早見表的に使っていただければ幸い。
まあ結局は公式ドキュメントを見ることになるんだけど、とっかかりが大事よ。

今回の環境はReact(Next.js) × TypeScript × Firestore という構成で書いた一部を抜粋してます。
**※あくまでdbとのやり取り部分の参考なのでその他はおまけです。ご留意ください。**
**※Firebase(ver8)のセットアップは済んでいる前提です。**

## Firestore Databaseの例
コレクション名が　**todo**　、
その下にランダムで　**ドキュメントID**　を採番し、
それに紐づく　**title**　が保存されています。
![todo_sample.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/207237/e1f1da47-9783-fb27-3f96-b47824827a23.png)


## 参考コード 
```typescript:
import React, { useState, useEffect } from 'react';
import { db } from '../firebase'

const Sample: React.FC = () => {
  const [todo, setTodo] = useState([{ id: '', title: '' }])
  const [documentId, setDocumentId] = useState('')
  const [input, setInput] = useState('');
  const [editItem, setEditItem] = useState({ id: '', title: '' });

  // 取得の例
  useEffect(() => {
    // コレクション名を指定しonSnapshotでリアルタイムに値を取得する。
    db.collection('todo').onSnapshot((snapshot) => {
      setTodo(
        snapshot.docs.map((doc) => ({ id: doc.id, title: doc.data().title }))
      );
    });
  }, []);

  // 登録の例
  const newTodo = (e: React.MouseEventHandler<HTMLButtonElement>) => {
    // コレクション名・ドキュメントIDを指定しaddメソッドで値を登録する。
    // add, setどちらも可。addは一意なIDを生成してくれる。
    db.collection('todo').add({ title: input });
  };

  // 編集の例
  const editTodo = (documentId: string) => {
    // コレクション名・ドキュメントIDを指定しsetメソッドで値を更新する。
    db.collection('todo').doc(documentId).set({ title: editItem.title });
  };

  // 削除の例
  const deleteTodo = (documentId: string) => {
    // コレクション名・ドキュメントIDを指定しdeleteメソッドで消去する。
    db.collection('todo').doc(documentId).delete();
  };

// 以下略...
```

もうver9がリリースされてるので、いずれそちらも。
[Anaconda Tips] conda env list や conda activate をもう打ちたくない！!

# はじめに
- 対象者：
    - WindowsでAnacondaを使っている人
    - 「conda activate」とか「conda env list」などを打つのが地味にめんどくさいと思っている人
    
# Anaconda標準エイリアス
WindowsでAnacondaをインストールして`conda init`を実行すると、PowerShellでは以下のようなエイリアスが使えるようになっています。
`conda env list`や`conda activate` `conda deactivate`といった頻出コマンドが登録されています。


| エイリアス | 内容 | ちゃんとコマンドを使う場合 |
|:---------:|:---------:|:---------:|
|conda|いつものやつ（詳細は省略します）|`Invoke-Conda`|
|**etenv**|環境アクティベート<br/>(= `conda activate`)|`Enter-CondaEnvironment`|
|**exenv**|環境非アクティベート<br/>(= `conda deactivate`)|`Exit-CondaEnvironment`|
|**genv**|環境一覧表示<br/>(= `conda env list`)|`Get-CondaEnvironment`|

実際にどのようなエイリアスが登録されているかを確認するには、PowerShellで以下のコマンドを実行すれば確認できます。

Conda関連エイリアス確認用コマンド(PowerShell)
`get-alias | ?{$_.Source -match 'Conda'}`

## うまく使えない場合の対処法
正直単なるエイリアスですので何とでもなるかと思います
### Linux/Mac環境だよ  
  ⇒手動でシェルにエイリアスを登録すればできます(わざわざこのコマンド名を登録する必要性はあまり無い気はしますが。。😑）
### PowerShellだけどうまくいかないよ
  ⇒ 「スタートメニューにあるAnacondaターミナルで[conda init](https://qiita.com/yniji/items/668f805a72a6ced6a2bd)を実行しなおす」「[$PROFILEにSet-Aliasで手動でエイリアス登録する](http://www.vwnet.jp/windows/PowerShell/2020100601/PsAlias.htm)」のいずれかで何とかなるかと思います
### コマンドプロンプトだけどうまくいかないよ  
  ⇒パス上の好きな場所に各コマンドを打つバッチファイルを置けば実行できますが、それよりはPowerShellに移行することをお勧めします（コマンドプロンプトはもう開発終わってます）

# まとめ
正直単なるエイリアスの紹介でしたが、デフォルトで登録されてるエイリアスですのでマシンを変えても設定し直さずに使えるという点ではうれしい機能かと思います
NavGraphで共有するViewModelでAssisted Injectをする

NavGraphのidで共有しているViewModelをAssistedInjectで生成したく、なおかつ今まで通り別フラグメントに共有したい要件がある際の解決方法を、どこにも記事がなかったため備忘録として残します。

:::note warn
今回は該当箇所のみを扱い、Dagger-Hiltの導入方法などは説明しません。
:::

Hilt導入の公式ドキュメント -> 
https://dagger.dev/hilt/gradle-setup



## 動作環境
- Dagger-Hilt 2.39
- Navigation 2.3.0

## 前提
AssistedInjectを楽にするためにFragmentの拡張関数としてtakahiromさんの記事を参考に作成しています。
 [ステップバイステップでDaggerを使った引数ありのViewModelの初期化を理解する](https://qiita.com/takahirom/items/f28ceb7a6d4e69e4dafe)


``` kotlin:assistedViewModels
inline fun <reified T : ViewModel> Fragment.assistedViewModels(
    owner: ViewModelStoreOwner = this,
    crossinline body: () -> T
): Lazy<T> {
    return viewModels({ owner }) {
        object : ViewModelProvider.AndroidViewModelFactory(this.requireActivity().application) {
            override fun <T : ViewModel?> create(modelClass: Class<T>): T {
                @Suppress("UNCHECKED_CAST")
                return body() as T
            }
        }
    }
}
```

## 結論
findNavController().getViewModelStoreOwner(R.id.exampleGraphId)をViewModelStoreOwnerとし、親FragmentでAssistedInject、子Fragmentでは今まで通りViewModelProviderでStoreOwnerを上記のfindNav~ としてViewModelを取得する。

ViewModel

```kotlin:SampleViewModel.kt
class SampleViewModel @AssistedInject constructor(
    @Assisted private val sampleId: String,
    private val sampleRepository: SampleRepository
) : ViewModel() {

    @AssistedFactory
    interface Factory {
        fun create(sampleId: String): SampleViewModel
    }
}
```

親Fragment

```kotlin:ParentFragment.kt
class ParentFragment: Fragment() {
    private val args: ParentFragmentArgs by navArgs()

    @Inject
    lateinit var viewModelFactory: SampleViewModel.Factory

    // ここが肝(わかりやすいように変数で切ってます)
    val owner: ViewModelStoreOwner = findNavController().getViewModelStoreOwner(R.id.exampleGraphId)

    private val sampleViewModel: SampleViewModel by assistedViewModels(owner) {
        viewModelFactory.create(args.sampleId)
    }
```

子Fragment

```kotlin:ChildFragment.kt
class ChildFragment: Fragment() {
    // ここが肝(ParentFragmentで指定したOwnerと一緒のものを指定する)
    val owner: ViewModelStoreOwner = findNavController().getViewModelStoreOwner(R.id.exampleGraphId)

    private val sharedViewModel: SampleViewModel by viewModels(
        ownerProducer = { owner }
    )
```
blenderのコンポジットでアイリスアウトを設定する

## やること
blender2.9のコンポジットを使って、アイリスアウト（画面を丸く閉じながら暗転させる）を実行

## 環境
Windows10
blender2.9



##ノード設定

Compositing画面で、

以下の２つのノードを追加
・楕円マスク（追加～マット、で選択）。「幅」と「高さ」に対して、縮小を開始させたいフレームで、値１でキーフレームを打ち、完全に暗転させるフレームで、値０をキーフレームに打つ。
・ミックス（乗算）（追加～カラー～ミックス、で選択して、初期表示で「ミックス」になっている選択項目を「乗算」に変更）。

それらを、下図のように接続する。

![20211116-01-0000000000.omposite.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/684864/496f32fd-7dce-702a-e282-49b3c5db99e9.png)


## 実行結果
ここでは、30FPS、全60フレームとして、「幅」と「高さ」について、１フレーム目で値１、20～40フレーム目で値0.2、60フレーム目で値0とした
![20211116-01-0000000000.omposite.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/684864/5eb13e0c-dd99-c65f-8f01-e571f8e6b8ac.gif)

とほほ～、もうblenderはこりごりでごザ～ル
【Cocoon、WordPress】Cocoonでダークテーマとライトテーマで配色を使い分ける方法をメモ書いておく

## はじめに
自分で開設しているブログをダークテーマにも対応するようにしたときのメモを残しておきます。

## 設定方法
### headタグにmetaタグを追加する。
以下のHTMLをheadタグ内に入れることで、ライトテーマとダークテーマを規定できます。

```HTML
<meta name="color-scheme" content="light dark" />
```

そして、どうやったらCocoon上で設定できるかというと、
Cocoon設定の「アクセス解析・認証」タブ内で追加できます。
「ヘッド用コード」に書きたいmetaタグを書けばそれが追加されます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/265324/87f8e6bf-dd53-bb24-6b77-72c87bba4ed0.png)

そして、追加した後のページのソースコードにあることを確認。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/265324/edc60561-20a7-a6f9-4305-266e15e580f2.png)

### CSSを書く。
次にCSSを書けば反映されます。Cocoon上のテーマエディターで書けば反映されます。
書くコードは以下の感じです。

```CSS
@media(prefers-color-scheme: dark){
    /* ダークテーマのときのスタイル */
}
@media(prefers-color-scheme: light){
    /* ライトテーマのときのスタイル */
}
```

## おしまい
是非、お役立て下さい！
【iOS15】UITableViewの罫線が表示されなくなった件

#iOS15からUITableViewの罫線が表示されなくなった
iOS15からUITableViewの罫線が自動で表示されなくなったので、メモ。

#対応方法
tableViewに対してスタイル、カラー、罫線間隔を設定するとiOS14以前と同じように描画されます。

```swift
tableview.separatorStyle = .singleLine
tableview.separatorColor = .lightGray
if #available(iOS 15.0, *) {
   tableview.fillerRowHeight = 50
}
```

#参考
https://developer.apple.com/forums/thread/691284
はじめまして、SQLさん

本日、初めてSQLにお会いして、progateで軽い顔合わせをしたところで、まだ相手の本性はよくわかっていない。
とりあえず、大元のデータから必要なデータが取り出せることが分かった。
まだまだ先が長いので、もちろんそれだけではないだろうが。

<用語まとめ>

データベース
テキストや数値などのデータを保存するためのツール
表でデータを管理している

テーブル
データベースがデータを管理している表

縦の列
ガラム

横の列
レコード

クエリ
データベースからデータを取得するためデータベースに送る命令
SQLとはクエリを書くためのげん言語
pandasで使えるテクニックをひたすらまとめる

## 概要
実務でどうやるか詰まった時の解決リンクをメモがてらひたすらまとめます。

## gruopby関連

- 「日付をkeyにして週次・月次・年次でgroupbyをしたい！」って時：[【Python】pandas.Grouperで時系列データを楽々groupby！](https://hesma2.hatenablog.com/entry/2021/01/22/003526#%E6%9C%88%E6%AC%A1%E3%81%AE%E9%9B%86%E8%A8%88monthly)
- groupbyは`.groupby("<カラム名>")`だけじゃなくて、`.groupby(<series>)`みたいなやり方もできるよって話。 [Python pandas アクセサ / Grouperで少し高度なグルーピング/集計](https://sinhrks.hatenablog.com/entry/2014/10/30/233606)

順次更新予定。
Markdownとの出会い

#Markdownnの書き方

**改行**
「半角スペース」を「２個」
***
**見出し**
「♯」
「♯」の数で見出しの大きさを変えられる
***
**箇条書き**
「*」
***
**ナンバリング**
「数字.」
***
**水平線**
「*」または「-」または「_」を３つ以上入力
***
**強調**
「*」２個ずつで囲む
***
**斜体**
「*」1個ずつで囲む
***
**テキストカラー**
HTMLタグを記述
vue+typescript+js-api-loaderでのgooglemap使用方法【'google' is not defined】

色々ハマったのでメモ。

# 型定義パッケージを追加してtsconfig.jsonのtypesに追加

```shell:terminal
npm i -D @types/google.maps 
```

```javascript:tsconfig.json
"compilerOptions": {
//////省略//////////
    "types": [
      "google.maps", //追加
    ],
//////省略//////////
}
```

#Loaderをインストール

```shell:terminal
npm install @googlemaps/js-api-loader 
```

```typescript
import { Loader } from "@googlemaps/js-api-loader"
```

ここまでは公式通り

https://developers.google.com/maps/documentation/javascript/overview#js_api_loader_package

#トラブルシューティング（'google' is not defined）
const google=window.google;を追加

```javascript:Map.vue
  mounted() {
    const loader = new Loader({
      apiKey: "YOUR_API_KEY",
      version: "weekly",
    });

    let map: google.maps.Map;

    loader.load().then(() => {
      const google=window.google; //追加
      map = new google.maps.Map(document.getElementById("map") as HTMLElement, {
        center: {lat: -34.397, lng: 150.644},
        zoom: 8
      });
    })
  },
```
【Rails】seedファイルについて

## はじめに
今回Railsのアプリを作成中に多くのユーザー情報が必要となったことをきっかけに、
seedファイルを使用したので、備忘録です。
今回はuserの作成をします。devise導入済み。

## seedファイルとは
開発を進めていく中で、データを一件一件登録することはとてもめんどくさいですよね。
そのようなときにseedファイルを作成することで、初期データが作成できます。
大量なユーザー情報等を一気に作成することができるので、とても便利です。

## 導入してみる
簡単なものであれば特別なことは必要なく、ファイルに記述するのみです。
単体であれば

```db/seeds.rb
User.create!(
   email: "test@test.com",
   name: "test1",
   passward: "111111"
)
```
複数であれば

```db/seeds.rb
10.times do |n|
  User.create!(
    email: "test#{n + 1}@test.com",
    name: "test#{n + 1}",
    passward: "111111"
  )
end
```
上記であれば10人分作成します。
n+1の部分は1ずつ増えていきますので、test1,test2,test3......
とユーザーが作成されていきます。
記述が終われば

```
$ rails db:seed
```
で完成です。
seedファイルもバリデーションがかかるので、
もし、一度ユーザーの登録していれば注意してください。

今回はユーザーでseedファイルを作成しました。
投稿等も作成はできますが、内容を考えるのがめんどくさいですね。
そのようなときはリアルなデモデータを作成してくれるgemがありますので、そちらを使用した方が良さそうです。

ちなみに、私が今回作成したものは

```db/seeds.rb
10.times do |n|
  User.create!(
    name: Faker::Name.unique.first_name,
    email: "test#{n + 1}@test.com",
    introduction: "よろしくお願いします。",
    industry_id: rand(1..14),
    prefecture_id: rand(1..47),
    password: "111111"
  )
end
```
nameはFakerというgemを使用して、リアルな名前の登録を被らないように作成しています。
職業欄と都道府県は「Active　Hash」で登録するようになっていますので、idを入力しています。
rand(1..14)は1~14の間でランダムに選択する記述です。

## リアルなデモデータを作成したい場合
「FAKER」もしくは「gimei」というgemを使うと簡単にできます。
詳しくはそれぞれのgitを見ていただいた方がわかりやすいと思うのでリンクを貼っておきます。
「FAKER」
  https://github.com/faker-ruby/faker
「gimei」
  https://github.com/willnet/gimei

今回はこれで終了です。
簡単にできることはどんどんやっていきたいですね。
【Linuxコマンド集】

#はじめに#
　現役エンジニアの方に、Linuxコマンドだけはやっとけと言われましたので、転職後苦労しないよう勉強してきました。今回は基本的なコマンドをまとめていきます。

#Linuxコマンド集#
##cdコマンド##

```
 $ cd [ディレクトリのパス]
```
　change directoryの略です。今いるディレクトリを移動することができます。
ディレクトリのパスの指定方法は相対パスと絶対パスの２パターンがあります。
・絶対パス・・・ルートディレクトリから目的のディレクトリまでの経路を示す。
・相対パス・・・ユーザーが作業しているディレクトリ（カレントディレクトリ）から目的のディレクトリまでの経路を示す。

##pwdコマンド##

```
 $ pwd
 /Users/[ディレクトリ名]
```
print name of working directoryの略です。
カレントディレクトリを表示するコマンドです。

##lsコマンド##

```
　$ ls [ディレクトリ・ファイル名]
```

指定したディレクトリの中のファイルやディレクトリを表示するコマンドです。

##mkdirコマンド##

```
 $ mkdir [作成するディレクトリ名]
```

ディレクトリを作成するコマンドです。

##rmdir##

```
 $ rmdir [ディレクトリ名]
```

ディレクトリを削除するコマンドです。
ただし、削除できるのは空のディレクトリのみで、中にファイルやディレクトリがある場合はエラーになります。

##catコマンド##

```
 $ cat [ファイル名]
```
ファイルの中身を表示するコマンドです。

##lessコマンド##

```
 $ less [ファイル名]
```
ファイルの中身を表示するコマンドです。
ただ表示するのではなく、スクロール表示してくれます。
長いファイルなどを表示するのに便利です。

##touchコマンド##

```
 $ touch [作成するファイル名]
```
ファイルを作成するコマンドです。

##rmコマンド##

```
 $ rm [ファイル名]
```

ファイルを削除するコマンドです。

##mvコマンド##

```
 $ mv [ファイル名１][ファイル名２・ディレクトリ名]
```

ファイルの移動またはファイル名を変更するコマンドです。

##cpコマンド##

```
 $ cp [コピー元][コピー先]
```

ファイル・ディレクトリをコピーするコマンドです。

##lnコマンド##

```
 $ ln [リンク元ファイル名][リンク名]
```

リンクを張るコマンドです。
オプションがなければハードリンク、-sオプションをつけるとシンボリックリンクになります。

##findコマンド##

```
 $ find [検索開始ディレクトリ][検索条件][検索アクション]
```
ファイルを検索するコマンドです。

#終わりに#
　今回挙げたのは超基本的なコマンドになりますのでしっかり覚えておきましょう！
そのためにも、意識的にコマンドを使っていくことが大事ですね。
MotionBoard のプラグインアイテムを作成してみた


# はじめに
MotionBoard には、「プラグインアイテム」という JavaScript でチャートを描画することできるアイテムが用意されています。
※ MotionBoard や「プラグインアイテム」の詳細については、下記を参照ください。

https://www.wingarc.com/product/motionboard/index.html

https://cs.wingarc.com/manual/mb/6.2/ja/UUID-9eb03fce-ce92-3963-e914-3450dff24a42.html

JavaScript で、Canvas API の Context2D に対する描画（context.fillRect など）を実装することにより、MotionBoard で用意されているチャート以外に、独自の見た目のアイテムを表現することができます。
HTML・CSS の組み合わせでの描画とは異なるため、注意が必要です。

まずは、MotionBoard のプラグインアイテムの基本的な作成方法を説明します。

# 手順
1. テンプレート JS ファイルをダウンロードする
1. テンプレート JS ファイルにプログラムを記述する
1. 作成した JS ファイルをアップロードする
1. MotionBoard でプラグインアイテムを作成する

## 1．テンプレート JS ファイルをダウンロードする

ボードメニューの［管理］－［システム設定］－［全般］－［プラグイン］から、テンプレート JS ファイルをダウンロードすることができます。
［テンプレート出力］ボタンをクリックし、表示された画面でクラス名を入力します。
※ 指定したクラス名は、JS ファイルのファイル名として使用されます。
![JSPluginSample_Qiita_1.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/630903/6a768302-4239-deaa-14a6-b2fb6cdd7255.gif)

## 2. テンプレート JS ファイルにプログラムを記述する

ダウンロードしたテンプレート JS ファイルを開くと、下記のようなプログラムが用意されていて、「Please write your program.」の箇所が編集可能であることが分かります。
function JSPluginSample(canvasId) がコンストラクタ、
JSPluginSample.prototype.updateDisplayList = function (width, height) が、アイテム描画時に呼び出されるメソッドです。
ここに、Context2D に対する描画を実装していけば良さそうです。
![JSPluginSample_Qiita_2.PNG](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/630903/af0d9d04-d955-9e17-aa09-173101ef8e58.png)

まずは簡単に、102 行目の fillText で描画するテキストを「はじめてのプラグインアイテム」に変更して、JS ファイルを保存します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/630903/5d3c2297-6431-2f09-3173-79af438614bf.png)

## 3. 作成した JS ファイルをアップロードする

［プラグイン］画面で、作成した JS ファイルをアップロードます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/630903/23884b16-60cc-528b-82f2-14366a07100d.png)

## 4. MotionBoard でプラグインアイテムを作成する

MotionBoard の編集画面において、アイテムツールバーの［プラグイン］を選択します。
アイテムの配置場所を指定し、使用するプラグインアイテムとして、アップロードした JS ファイルを選択すると、JavaScript 記述により Context2D に対して描画した結果が MotionBoard ダッシュボード画面上に表示されることが分かります。
![JSPluginSample_Qiita_3.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/630903/0ea26d12-fe7a-33f7-0081-0ffbf327c214.gif)

# 最後に
本記事では非常に簡単なプラグインアイテムの使い方を紹介しましたが、もちろんデータソースを利用することができるため、MotionBoard の表現の幅が更に広がりそうですね。
今後もプラグインアイテムを触ってみて、プラグインアイテムの Tips を紹介していきたいと思います！
テキストフィールドに入力した文章を画面に表示するだけのアプリを作りました。

# 作ったアプリ
https://quizzical-chandrasekhar-d0adff.netlify.app/
画面中央のテキストフィールドに文章を入力してSubmitしたら、画面に入力した文章が表示されます。
新しい文章を入力したら、その前の文章は消えて新しい文章に置き換わります。
ライブラリやフレームワークは使わずに作成しましたが、リセットCSSと`box-shadow`の部分だけサンプルコードを流用しました。
[こちら](https://dev.to/codefoxx/25-beginner-javascript-project-ideas-3m9h)のProject No.4を元ネタにさせてもらいました。

# 特記事項
### 文章がはみ出る問題
作成中に試しにaaaaaaaaa...と入力してみたら、次のように文章がはみ出てしまいました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/681683/eb4afc91-85a5-0877-5725-e875739db82e.png)
これはCSSの`word-break`というプロパティに`break-all`という値を設定すると解決できるようです。

```css
p.output {
    text-align: center;
    word-break: break-all; 
}
```

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/681683/82f48dd9-b206-2a21-dc01-159296c48383.png)
ちゃんと改行される。ただし、これをやると英単語の途中でも問答無用で改行されるので、特別な事情がなければ設定しないほうがいいかもしれません。上記のアプリでも最終的に設定するのやめました。

### フォームを送信したら文章が一瞬だけ表示されてすぐ消える
語りつくされている問題だと思いますが、`e.preventDefault()`をちゃんと入れておきます。
フォームを送信したとき、（今回の場合）ページ全体がリロードされるのがデフォルトの動作になりますが、そうすると、入力した文章が表示されてすぐにページがリロードされるので、文章が一瞬だけ表示されてすぐ消えることになります。そこで、イベントハンドラ内でイベントオブジェクトを受け取って、`e.preventDefault()`でページ全体がリロードされるのを防ぎます。

```javascript
const displayMessage = e => {
  e.preventDefault()
  const input = document.getElementById('message')
  paraMessage.textContent = input.value
  input.value = ''
  input.focus()
  paraMessage.style.display = 'block'
}

submit.addEventListener('click', displayMessage)
```

# 参考にさせていただいたところ
[css – ブロックレベルから文字がはみ出してしまう](http://memorandum-plus.com/2018/04/03/css-%E3%83%96%E3%83%AD%E3%83%83%E3%82%AF%E3%83%AC%E3%83%99%E3%83%AB%E3%81%8B%E3%82%89%E6%96%87%E5%AD%97%E3%81%8C%E3%81%AF%E3%81%BF%E5%87%BA%E3%81%97%E3%81%A6%E3%81%97%E3%81%BE%E3%81%86/)
[JavaScript 要素を表示/非表示にするサンプル(displayとvisibility)](https://itsakura.com/javascript-display)
[Beautiful CSS box-shadow examples](https://getcssscan.com/css-box-shadow-examples)
フォームボックスの`bos-shadow`はこちらのコードを参考にさせてもらいました（ていうか、コピペしました）。

そして、もちろん[MDN](https://developer.mozilla.org/ja/)