OmniAICreator/Qiita-1.07M huggingface dataset:
【Java】今更知ったAtomicIntegerでラムダ式内処理結果をカウント

以下のように実装できます。

```Java
AtomicInteger successCount = new AtomicInteger(0);
// 何かしらのデータ取得処理
List<ClassA> dataList = getDataList();
dataList.stream().forEach(data -> {
    try {
        // 何かしらの処理
        process(data);
        successCount.incrementAndGet();
    } catch (Exception e) {
        throw e;
    }
});
```

ラムダ式を使うとローカル変数のインクリメントによるカウントができないため、
非常にダサいですが元々は以下のように成功するたびにListにtrueを追加して、その数をカウントしていました。

```Java
List<Boolean> successList = new ArrayList<>();
// 何かしらのデータ取得処理
List<ClassA> dataList = getDataList();
dataList.stream().forEach(data -> {
    try {
        // 何かしらの処理
        process(data);
        successList.add(true);
    } catch (Exception e) {
        throw e;
    }
});
```
【初制作】小売業で身近な困りごとをLINEBotでひとつ解決してみた。【初心者】


小売業で副店長をしており、日々時間に追われて品出しやら雑用をこなしております。同業種のみなさま！お疲れ様です！
最近ちょっと時間がかかったことをLINEBotが解決してくれそうなので作ってみました。

# 会社の連絡先を教えてくれる、シンプルな電話帳bot

先日あった事務所でのわたくしの困りごと

本社の電話番号は・・・何番？誰か教えて！（誰も教えてくれません・・・）
パソコンをごそごそしたり、どこかに書いてある紙を探したり（定位置管理なのになぜか休み明けにない）
~~あったらいいなをお値段以上！（いや無料だけども！！）~~
3名ほどの他店の副店長からは「かゆいところに手が届く的なやつ！」と共感していただいております。パスワード管理にも使えるとか使えないとか・・・

# 完成品（動画は試作品）

![20220716_204327.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2723058/870e1044-6879-2b3d-3f17-b9e978179e55.gif)



# 使用ツール

・[Make](https://eu1.make.com "make Home")
・[SSSAPI](https://sssapi.app "SSSAPI Home")
・Googleスプレッドシート
・LINE

# Makeのシナリオはシンプルに
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2723058/b12ae11c-f282-c29c-ab8e-758724cc3f10.png)



ポイント：とにかく実用性を重視（技術は後からついてくる・・・はず）

先輩達がたくさん記事を書いていますので今回は自分が知りたかった部分に画像で備忘録的に残しておきます。

:::note info
つまづいたポイント
・オウム返しされない！右のLINEの玉（Send a Reply Massage）にもChannel Access Token入れたら解決しました。
・いつまでもエラーが消えない！右のLINEの玉（Send a Reply Massage）のエラーは最初からやり直すと消えました。何が原因かは不明。
:::

まずはここから！！

ようかんさんが非常にわかりやすくまとめられています！！

IntegromatはMakeの旧名です。



https://zenn.dev/inoue2002/articles/3067c574b3a605



![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2723058/ee2ce406-7e71-4b9e-7656-65e32b58733f.png)

↓API化している中身

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2723058/d986ee8f-437d-ca57-385b-fa234b62f7e0.png)

JSON
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2723058/b5e5fb63-2cfb-afa5-8648-454b7b0e481a.png)

LINE
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2723058/7a119756-3af9-d21e-f7b9-3011fae8c680.png)



:::note info
イメージが形なる瞬間は1000ピースパズルを完成させるような達成感が味わえます。ドーパミン出ます！！とにかくやってみることが大事！！
誰かに聞ける環境にある人はググって15分考えてわからなければ、わかる人に聞きましょう！！真夜中に迷子なりました。
:::


コーヒーを相棒にして書いておりますが、なんてことのない作業がこの世界を回り回って何処の誰かも知らない人の笑い声を作ってゆく　ミスチルの彩りが心に染みました。

年齢を言い訳にせず変化を恐れず、変化を楽しめる人になりたい！！

最後までお読みいただきありがとうございました！！
options_from_collection_for_selectですでに選択されている値を呼び出す

`form_for`ヘルパーで`select`を利用する際に、`options_from_collection_for_select`を利用した。その際、すでに保存されている値を呼び出す方法につまづいたので、メモを残しておく。

NG例。`selected`で指定しようとしても取れない。

```ruby
  = f.select :id, options_from_collection_for_select(Users.all, :id, :username), {include_blank: true}, class: "form-control", selected: user.id
```

OK例。`options_from_collection_for_select`の第三引数に指定してあげればOK

```ruby
  = f.select :user_id, options_from_collection_for_select(Users.all, :id, :username, user.id), {include_blank: true}, class: "form-control"
```
Macで HHKB（英語配列）→ 通常のKB（英字配列）への乗り換え

## 概要

かれこれ 10年程HHKBを利用している。しかし最近通常のキーボードも使いたくなったので、その手順をメモしておく。因みに戻りたくなった理由は次の通り。

- HHKB Professional2 のコトコト音が 家での作業するには少し甲高い（主観）
- type-s を買うのも悪くないが、量販店で黒軸キーボードを触ったら凄く良かった
- 元々 FILCOの黒軸にハマったのがキッカケで高級なキーボードに目覚めたので原点回帰してみたい

最初は FILCOの黒軸を買いなおそうと考えていたが、随分前に `ARCHISS`の [Progress Touch Retro Tiny](https://www.amazon.co.jp/dp/B072ZNPQF4/) という似たようなキーボードを買っていたのを思い出し、引っ張り出して触ってみると意外と黒軸っぽい感触だったのでこれを利用することに。

## 設定

設定は [Karabiner Elements](https://karabiner-elements.pqrs.org/) を使う。

### Simple modifications
以下のような設定にする。
- 左右の Option (ALT) コマンドを Macの Command に割り当てておく (xxx_option -> xxx_command)
- Optionコマンドも必要なので Winキーを Option (ALT) に割り当てておく (left_command -> left_option)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/375665/e1af9260-f024-0048-439d-24b394491221.png)

### Complex modifications
以下のような設定にする。
- HHKB でも利用していた左右のCommandキーによる「英数」「かな」変換を有効にしておく
- HHKB のホームポジションから大きく手を離さない矢印キー操作が便利だったので、右command (物理では右ALT) + hjkl での vim 操作でのカーソル移動を可能にする

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/375665/def8ddb0-bfd7-5823-0f5d-b9d060a68942.png)


## まとめ

Karabiner Elements を使えば割と簡単に通常のキーボードで HHKBと遜色ない使い勝手にすることができた。
図形と方程式「14年 福島大 理工 3」をsympy でやってみた。

オリジナル

https://kamelink.com/blog/2022/07/16/4-1-14-fukusimadai-rikou-3/

# sympyで
```python
from sympy import *
var('x y')
def myLineEquation(P1,P2):
    return solve(sympify(str(Line(P1,P2).equation())),y)[0]
A=Point(-6, 0)
B=Point( 0,-8)
C=Point(15,28)
print("#(1)",myLineEquation(A,B),",",myLineEquation(A,C))
print("#(2)",Triangle(A,B,C).area)
print("#(3)",Point(A).distance(B),Point(B).distance(C),Point(C).distance(A))
print("#(4)",Triangle(A,B,C).inradius)
print("#(5)",Triangle(A,B,C).incenter)
print("#(6)",myLineEquation(B,Triangle(A,B,C).incenter))
#(1) -4*x/3 - 8 , 4*x/3 + 8
#(2) 168
#(3) 10 39 35
#(4) 4
#(5) Point2D(-1, 0)
#(6) -8*x - 8
```

# sympyで(値を後から代入でもできました。)
```python
from sympy import *
var('x y')
var('Ax Ay Bx By Cx Cy')
def myLineEquation(P1,P2):
    return solve(sympify(str(Line(P1,P2).equation())),y)[0]
A=Point(Ax,Ay)
B=Point(Bx,By)
C=Point(Cx,Cy)
print("#<1>",myLineEquation(A,B),",",myLineEquation(A,C))
print("#<2>",Triangle(A,B,C).area)
print("#<3>",Point(A).distance(B),Point(B).distance(C),Point(C).distance(A))
print("#<4>",Triangle(A,B,C).inradius)
print("#<5>",Triangle(A,B,C).incenter)
print("#<6>",myLineEquation(B,Triangle(A,B,C).incenter))
mySubs={Ax:-6,Ay:0,Bx:0,By:-8,Cx:15,Cy:28}
print("#(1)",myLineEquation(A,B).subs(mySubs),",",myLineEquation(A,C).subs(mySubs))
print("#(2)",Triangle(A,B,C).area.subs(mySubs))
print("#(3)",Point(A).distance(B).subs(mySubs),Point(B).distance(C).subs(mySubs),Point(C).distance(A).subs(mySubs))
print("#(4)",Triangle(A,B,C).inradius.subs(mySubs))
print("#(5)",Triangle(A,B,C).incenter.subs(mySubs))
print("#(6)",myLineEquation(B,Triangle(A,B,C).incenter).subs(mySubs))
#<1>～<6>出力省略
#(1) -4*x/3 - 8 , 4*x/3 + 8
#(2) 168
#(3) 10 39 35
#(4) 4
#(5) Point2D(-1, 0)
#(6) -8*x - 8
```


# 参考
myLineEquation関数作成のため

https://stackoverflow.com/questions/73002593/sympyplease-tell-me-about-the-line-equation
Azure Devops (Artifacts) を無償、無料で使う

# はじめに

記載情報は CI/CD に関連します。  
実務上関わった環境・機能を身近な情報としてお届けしたく、投稿をはじめました。  
各学習上、お金のかからない方法を選択していきます。

以下の手順を実施することで、ライブラリ開発者やアプリ開発者が作成した成果物を納め、他チームへ提供可能な環境が整います。  
組織、プロジェクトを跨いで成果物を共有して行く上で活用できます。  
後続手順の準備工程につき情報が限定的となりますが、もしよろしかったら後続手順もご参照ください。

## 対象者と関連環境・機能

この記事は下記のような人を対象にしています。

- CI/CD 初学者
- プログラミング初学者
- 駆け出しエンジニア

記載している環境・機能は以下です。

- Azure DevOps
- Azure Artifacts

## 必要作業

|  No | 作業                                                      | 必要手順                                                                                                                  |
| --: | --------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------- |
|   1 | マイクロソフトアカウントを作成する                        | [Azure DevOps 始めてみる](https://qiita.com/mstakaha1113/items/2abdebd86f9e9cee89fd)                                      |
|   2 | Azure DevOps で組織(organization)とプロジェクトを作成する | [Azure DevOps 始めてみる](https://qiita.com/mstakaha1113/items/2abdebd86f9e9cee89fd)                                      |
|   3 | Azure Artifacts を利用できるようにフィードをを作成する    | [パブリック フィードを作成する](https://docs.microsoft.com/ja-jp/azure/devops/artifacts/concepts/feeds?view=azure-devops) |

## 関連作業

- [CI/CD とは?](https://qiita.com/wf-kenji-ikeda/items/bfb6d5e21b33d0cca83b)
- [Azure Devops (Artifacts) を無償、無料で使う](https://qiita.com/wf-kenji-ikeda/items/9c21859d8b5b6a63246e)
- [Spring Tool Suite 4 インストール、Spring Initializr 、gradlew の利用](https://qiita.com/wf-kenji-ikeda/items/d00766da8a4076ec43ed)
- [Spring Boot Web アプリケーションを作る](https://qiita.com/wf-kenji-ikeda/items/1e64e44094ce8a1d997f)
- [Jar の Library を作り、Azure Artifacts を利用して成果物を配布する](https://qiita.com/wf-kenji-ikeda/items/696bda335a8933abfcb3)
- [ライブラリ開発者より指定されたバージョンを利用してアプリを作る](https://qiita.com/wf-kenji-ikeda/items/5bf06ce19c52e73a5463)
- [アプリを Docker 、Docker Compose でコンテナを動かしてみる](https://qiita.com/wf-kenji-ikeda/items/e6604ea6ae257f3925a7)
- [Azure Devops (PileLines) を無償、無料で使う](https://qiita.com/wf-kenji-ikeda/items/451838da3b4ac45a8d65)
- [Azure Devops (PileLines) でテスト、ビルド、イメージプッシュをする](https://qiita.com/wf-kenji-ikeda/items/5ddf6158bb98c4174db9)
- [minikube(kubernetes) でコンテナを動かしてみる](https://qiita.com/wf-kenji-ikeda/items/95604d83850a17b91c46)
- [nginx のコンテナを Docker や minikube(kubernetes) で動かし、静的コンテンツ公開工程を模倣](https://qiita.com/wf-kenji-ikeda/items/bf6cb1b7a047f562d309)

## 参考記事

[Azure DevOps 始めてみる](https://qiita.com/mstakaha1113/items/2abdebd86f9e9cee89fd)  
[パブリック フィードを作成する](https://docs.microsoft.com/ja-jp/azure/devops/artifacts/concepts/feeds?view=azure-devops)
[Microsoft] ASP.NETで、PII (personally identifiable information) ログ出力が有効にならない時の対処方法

# 起きたこと

Microsoft.Identity 関係のパッケージを使用しているとき、例外やログに以下のようなメッセージが出力されることがあります。

```
PII logging is OFF. See https://aka.ms/IdentityModel/PII for details.
```

プロダクション環境で情報を隠してくれるのはありがたいですが、開発時には困ります。

# 有効ではない解決策

メッセージに従って https://aka.ms/IdentityModel/PII を見に行くと、以下のようにしろと書いてあります。

```c#
IdentityModelEventSource.ShowPII = true;
```

ではということで、`Program.cs` にこんなふうに追記しても解決しません。
 
```c#
var builder = WebApplication.CreateBuilder(args);

IdentityModelEventSource.ShowPII = true;

// (snip)
```

# 原因

次のクラスの中で、上記プロパティを上書きしています。

https://github.com/AzureAD/microsoft-identity-web/blob/master/src/Microsoft.Identity.Web/MicrosoftIdentityBaseAuthenticationBuilder.cs

```c#
LoggingOptions logOptions = new LoggingOptions();
configurationSection?.Bind(logOptions);
IdentityModelEventSource.ShowPII = logOptions.EnablePiiLogging;
```

# 正しい解決策

環境変数や`appsettings.Development.json`ファイル等で、EnablePiiLogging が true になるようにします。

例えば、このようにします。

```json:appsettings.Development.json
{
  "AzureAd": {
    "EnablePiiLogging": true
  }
}
```

:exclamation: 注意: `AzureAd` の部分は、使用するAuthenticationによって変わります。例えば`AzureAdB2C`等があります。

# 最後に

解決するまで、GitHub をぐるぐると3時間ほど見て回りました。
やっぱりオープンソースは最高だね！
Mcomixでavif形式をサポート

# はじめに

python3ベースでforkしているmcomixに手を加えてavif形式の画像表示を可能にした。

# 環境
Linux Mint 19.3(おそらく他のものでディストリビューションでも問題ない)
git
python 3以上
pillow-avif-plugin1.2.2以上（公式web: https://pypi.org/project/pillow-avif-plugin/）

# mcomix(python3)ソースの取得
git cloneにて参考になるソースを自分の作業ディレクトリに移行する。

```
$git clone https://github.com/multiSnow/mcomix3.git
```

# ライブラリのインストール
avif形式のサポートはpillow-avif-pluginを導入する

```
$pip3 install pillow-avif-plugin
```

# avif-pluginのコードを追加
PILライブラリをインポートしているあたりに追加する

```mcomix/lib/image_tools.py
import pillow_avif
```

# 感想
avifの画像形式が利用されるようになってきた。PILライブラリを利用している場合は簡単にavifを導入できるためやってみた。mcomixは自動でサポート形式を判定しているためavif-pluginを導入すれば即avif形式を判定できた。

# 参考
Mcomix公式 https://sourceforge.net/projects/mcomix/
Mcomixのフォーク(python3ベース) https://github.com/multiSnow/mcomix3
avifの参照元: https://avif.io/blog/tutorials/pillow/
今回のコードを適用したgithub https://github.com/mimaburao/mcomix3
DjangoでGraphQLを触ってみる Part.1

# はじめに
最近になって初めてGraphQLを知りました。やっぱりまずは触ってみたい気持ちがあったのでメモ書き程度でDjangoでGraphQLの実装方法をまとめました。

記事では、ローカル環境の想定で書いておりますが、[元のソース](https://github.com/abemaru/my_graphql_demo)はコンテナを利用しているので環境構築は面倒な方はそちらをご利用ください。

# パート解説
#### Part1 : 入門向け環境構築と基本的な書き方 ←イマココ
#### Part2 : [GraphQLでリレーションなしの絞り込み実装](https://qiita.com/abemaru/items/cc862c548cdec65fa640)
#### Part.3 : [データの追加、削除、編集(Mutation)を実装](https://qiita.com/abemaru/items/6f396991a0de716d1684)

# 環境構築
まずはdjangoでプロジェクトを作成するときのおまじないです。
```terminal
% django-admin startproject mysite .
% django-admin startapp graphql_sample
```
上記コマンドを実行後、**`mysite/settings.py`の`INSTALLED_APPS`を更新することを忘れないでください。**(私は忘れて1時間解決策を探しました)
```mysite/settings.py
INSTALLED_APPS = [
    'django.contrib.admin',
    'django.contrib.auth',
    'django.contrib.contenttypes',
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles', # GraphQLを使うために追加する
    'graphene-django', # GraphQLを使うために追加する
    'graphql_sample', # 追加したapp名を追記する
]

# GraphQLを適応させたいスキーマを選択する
GRAPHENE = {
    # これから書くschema.pyの場所を追記する
    "SCHEMA": "graphql_sample.schema.schema",
}
```

`urls`にGraphQLを使うところを追記しましょう。
```./myurls/urls.py
from django.contrib import admin
from django.urls import path
from graphene_django.views import GraphQLView

urlpatterns = [
    path('admin/', admin.site.urls),
    # /graphqlでは、GraphQLを使う宣言
    path("graphql", GraphQLView.as_view(graphiql=True)),
]
```

# `All()`だけのGraphQLを一旦実装
実装部分を全て書くと大変なので、`schema.py`のみ抜粋します。
[他のコードはこちら](https://github.com/abemaru/my_graphql_demo)にありますので、参考にしていただけると嬉しいです。
```./graphql_sample/schema.py
import graphene
from graphene_django import DjangoObjectType
from graphql_sample.models import User, Item


class UserType(DjangoObjectType):
    class Meta:
        model = User


class ItemType(DjangoObjectType):
    class Meta:
        model = Item


class Query(graphene.ObjectType):
    user = graphene.List(UserType, id=graphene.Int())
    item = graphene.List(ItemType, id=graphene.Int())

    def resolve_user(self, info, **kwargs):
        return User.objects.all()

    def resolve_item(self, info, **kwargs):
        return Item.objects.all()


schema = graphene.Schema(query=Query)
```

サンプルデータも今回作成したので、以下のコマンドを打って初期設定を行います。
```terminal
% python3 manage.py makemigrations
% python3 manage.py migration
% python3 manage.py loaddata ./graphql_sample/fixtures/test.json
```
もし、`force_text`を含むエラーが出たら以下を試してみるか、コンテナでの利用をおすすめします。
https://qiita.com/abemaru/items/b5cdfb136306b3203ca2


正常にテストデータを入れることができたら`runserver`を実行して、[localhost:8080/graphql](http://127.0.0.1:8000/graphql)へアクセスしましょう。
```terminal
% python3 manage.py runserver
```
左上の枠を記入して再生ボタンを押すと、クエリの結果が返ってきます。以下のようになれば成功です。
![スクリーンショット 2022-07-16 18.13.31.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/326068/58fbfe7a-1f4d-97d3-ab2f-cf85e942fd79.png)

# さいごに
全部やろうとしたら思ったより時間がかかったので、Part2で、本格的にクエリを書こうと思います。

続き -> https://qiita.com/abemaru/items/cc862c548cdec65fa640
TypeError: Intl.Segmenter is not a constructorの対処法

# `TypeError: Intl.Segmenter is not a constructor`発生の経緯
文字数を数えるChrome拡張を作成中にユニットテストを導入しようと、jsのテストライブラリ`mocha`でテストを書き始めたところで上記エラーが発生しました。

ちなみに作成したChrome拡張はこちら👇

https://chrome.google.com/webstore/detail/character-counter/inbkndchoofidndibcgbijbfmmnkmoem?hl=ja&authuser=0

## `Intl.Segmenter`とは？
`Intl.Segmenter`はロケールに応じたテキストの分割を可能にし、文字列から意味のある項目 (文字列、単語、文) を取得できるAPIになっています。

> The Intl.Segmenter object enables locale-sensitive text segmentation, enabling you to get meaningful items (graphemes, words or sentences) from a string.
[MDNのWebドキュメント](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Segmenter)

詳しい挙動は@suinさんの記事に書かれていますのでそちらをご参照ください。

https://qiita.com/suin/items/3da4fb016728c024eaca

# 解決策
早速解決策です。
（僕の場合、）Nodeをバージョン16以上にアップグレードすることで解決できました。
自分は`nodebrew`を使用しているので下記コマンドでアップグレードしました。
```bash
$ node -v
v14.18.1

$ nodebrew install latest
Fetching: https://nodejs.org/dist/v18.4.0/node-v18.4.0-darwin-x64.tar.gz
############################################################# 100.0%
Installed successfully

$ nodebrew use latest 
use v18.4.0

$ node -v
v18.4.0
```

# エラー原因は対応バージョン
[MDNのWebドキュメント](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/Segmenter)を見てわかるようにNodeではバージョン16以上でないと動作しません。
しばらくホスト環境を使っていないうちにNode(v14.18.1)がだいぶ古くなっていたようです😢
昨今のDockerでの開発ブームにより、ホスト環境のアップグレードを忘れてしまうことが多いのでみなさんバージョンには注意しましょう！
Bolt+glitchで、投稿に自動でスタンプを押すSlack botくんを開発した

# Slack botくんはスタンプが押せるのか
前回の記事の続き的なものになります。そもそもBoltってどう使うの？glitchって？みたいな人は下の記事から見てください。

https://qiita.com/KojoBarbie/items/7897db9d5e8ba3dc935d

## 作ろうと思った理由
Slackで下の画像みたいに軽ーく日程調整したいときってあると思うんですけど、こういう時にスタンプを使って意思表示をしてもらうのに自分がいちいちぽちぽちするのめんどくさいなって思ったので、botくんに押してもらえたら少し便利だなという感じで作ってみることにしました。

![スクリーンショット (20).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/671694/2ded61ff-ab82-966c-8a46-12002e41f63f.png)

## 完成のイメージ
下の画像のように、ある特定の絵文字を押したとき、自動で○・×・考え中の3つのスタンプが押されるようにします。

![スクリーンショット (21).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/671694/8e9ab137-4722-21f3-21c9-5280776e24e5.png)


## 作るぞ！
### 1. glitchのコードを修正する
前回のコードから追加してみます（新しいプロジェクトを立ち上げる必要はありません）。glitchに次のようなコードを追加してみてください。追加する場所は一番最後の```(async () => {```みたいな行よりも前です。

```index.js
// 特定の文字列（絵文字）に反応してスタンプをつける
app.message(':man-tipping-hand:', async ({ message, client }) => {
  console.log(message);
  let channelId = message.channel;
  let timestamp = message.ts;
  // スタンプをつける（以下3か所全部同じ）
  await app.client.reactions.add({
    token: process.env.SLACK_BOT_TOKEN,
    channel: channelId,
    timestamp: timestamp,
    name: 'man-raising-hand'
  });
  await app.client.reactions.add({
    token: process.env.SLACK_BOT_TOKEN,
    channel: channelId,
    timestamp: timestamp,
    name: 'woman-gesturing-no'
  });
  await app.client.reactions.add({
    token: process.env.SLACK_BOT_TOKEN,
    channel: channelId,
    timestamp: timestamp,
    name: 'thinking_face'
  });
});
```

app.client.reactions.addでリアクションをつけることができます。それぞれのメソッドでnameのところにあるものを変えると違うスタンプも打つことができます。

#### 注意点
コードに書かれているスタンプは英語でないと反応してくれません。[こちらのサイト](https://belltree.life/slack-emoji-smailly-human/)などを見て打ってほしいスタンプの名前を英語に変換してコードに書くようにしましょう。

### 2. Slackアプリの権限を追加する
次にSlackアプリのほうにも変更を加えなければいけないので、いつものページ（https://api.slack.com/apps ）に行きましょう。
自分のアプリを開いたら、「Event Subscription」を開いて、以下の操作を行ってください。

+ 「Enable Events」をOnにしましょう。
+ その下のRequest URLにはInteractivityで入れたリンクをそのまま入れます。
+ その下の「Subscribe to bot events」で「message.channels」をEventとして追加してください。

出来たら、「Permission」のところに行き、「Scopes」で「reactions:write」を追加し、アプリを再インストールしてください。  
これで作業は完了です！テストしてみましょう！

### 3. テストしてみる
今回は「:ご案内_男性:」というスタンプを打つとbotくんが反応してくれます。試しに打ってみましょう。

![スクリーンショット (17).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/671694/40d40721-f4be-acea-5fbc-9d0acdeb832e.png)

おお、ちゃんと反応してくれていますね。

## おわりに
今回は自動でスタンプを打ってくれるbotくんを作ってみました。polyとかを使えばよくね？って言われればそれまでなんですが、こういう小さな自動化って毎日が少し楽しくなりますよね。  
みなさんもBoltを使ってちょっとしたアプリを作ってみてはいかがでしょうか。

### 参考にしたもの
https://slack.dev/bolt-js/ja-jp/tutorial/getting-started
HTMLメモ

# カレンダー表示
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/234809/88817dbb-c68b-fb3a-28d5-616938b14776.png)

```html
<p>日付を入力してください。</p>
<input type="date" value="2022-07-16">
```
value値にデフォルトの日付をセットしてあげます。

# 画像の遅延ロード
```html
<img src="hoge.jpg" loading="lazy" alt="">
```    

# スムーススクロール
```css
html {
    scroll-behavior: smooth;
}
```

# アスペクト比固定
```css
img {
    aspect-ratio: 16/9;
    width: 100%;
    height: 100%;
}
```
Next.jsとReactの違いについて

# Next.jsとReactの違いについて簡単にまとめ


| Next.js       |       React |
|:-----------------|------------------:|
| サーバーサイドレンダリング (SSG SSR)             |             クライアントでレンダリング (CSR) |
| サーバーサイドレンダリングなので手元の端末スペックに依存しない |  手元の端末スペックに依存する |
| HTMLを先に出力するので表示スピード速い（プリレンダリング）           |            js css htmlを同時にコンパイル |
| ルーティング設定が楽 |  react-router-domで色々設定が必要 |
デジタル初心者がシフトの提出をLINEBOTで済ませる方法を作りました！！

# 自己紹介
私は小売業でチーフとして働いています。パートさんや、アルバイトさんを束ねるお仕事です。
毎月シフトを作成するのも私の仕事ですが、従業員が多く苦労しております。
現在は、紙に書いた休み希望表を投票箱みたいなものにいれてもらい、それを開封し、PCに打ち込みながら作っています。
なので今回は、紙の提出→PCへの打ち込みといった作業を簡単化する方法を考えました。

## 使用ツール
・make
・Googleスプレッドシート
・LINE
以上の３つだけです。

## 作成手順
まずmakeのシナリオがこちら
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724112/5b2f477d-270e-3324-87a8-631e412c074f.png)

中身はこちら

![無題a.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724112/de1b16cd-ca54-f14f-568a-e83568cf436f.png)

## 実際に動かしてみる
<blockquote class="twitter-tweet"><p lang="zxx" dir="ltr"><a href="https://t.co/lAxWcHn5De">pic.twitter.com/lAxWcHn5De</a></p>&mdash; 川田健史 (@takeshijranpb) <a href="https://twitter.com/takeshijranpb/status/1548234317788479488?ref_src=twsrc%5Etfw">July 16, 2022</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

ここで入力したものが
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724112/ad6554b2-1685-73b7-c668-639ccaf921a3.png)

ちゃんとスプレッドシートに自動で入力されました。何とか成功です。

## 今後の課題

時間表記が日本時間になっていないことと、ユーザーの名前がうまく取得できませんでした。
長々としたアルファベットの取得は出来ましたが、これではパッと判別できません。

## 最後に
初心者で全くわからない状況でも既存の物を使えば色々と便利になると学びました。
これからもどんどん、身近な物をデジタル化して発信していきたいです。
Javaのモジュールを作ってみる

資格試験の勉強をしていて、モジュールを実際に実装したことがないと思ったのでやってみました。

```php:HelloOya
package oya;

public class HelloOya {
	public void hello() {
		System.out.println("Hello Oya!");
	}
}
```

```php:KoMain
package ko;

import oya.HelloOya;

public class KoMain {

	public static void main(String[] args) {
		HelloOya ho = new HelloOya();
		ho.hello();
	}

}
```
```php:moduleoya
module moduleoya {
	exports oya;
}
```
```php:moduleko
module moduleko {
	//requires moduleoya;
	
	exports ko;
	
	requires transitive moduleoya;
}
```
exportsでプロジェクトを他のパッケージからアクセスできるようにし
requiresでモジュールを読み込みます。
子クラスを実行すると

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2725725/2c37911e-c411-0d14-3fd9-db7a0591539c.png)
別パッケージの親クラスの内容が実行できていることがわかります。
数珠玉表記

一度に説明しても簡単だが、要点を分けて１つずつ説明する  

# 数珠玉表記の代表的な例

👇 以下のような表記があるとする  

```plaintext
128.0.0.1
```

👇 `.` を `o` に変換する  

```plaintext
128o0o0o1
```

これが 数珠玉表記 だ  

# もととなる符号化の考え方

以下のように対応する

| 演算優先順位 | 置換前 | 置換後 |
| -----------: | ------ | ------ |
|            1 | `;`    | `j`    |
|            2 | `:`    | `i`    |
|            3 | `(`    | `q`    |
|            3 | `)`    | `p`    |
|            4 | `,`    | `g`    |
|            5 | `*`    | `x`    |
|            5 | `/`    | `y`    |
|            6 | `+`    | `t`    |
|            6 | `-`    | `n`    |
|            7 | `.`    | `o`    |
|            8 | ` `    | `u`    |

（演算順）  

数珠玉表記では基本的に `o` だけ使う。 このPythonパッケージでは `o` をサポートする。  
拡張で `q`, `p`, `g` が必要になってくるケースがあるかもしれない  

## 備考

* 大文字，小文字は区別しない（Ignore case）

# 数珠玉表記 の格納構造

タプルを使う  

👇 以下のような数珠玉表記があるとする  

```plaintext
-21o-1o0o1o21
```

👇 大文字に揃える  

```plaintext
-21O-1O0O1O21
```

👇 `O` でスプリットする  

```plaintext
[-21, -1, 0, 1, 21]
```

👇 タプルに変換する  

```plaintext
(-21, -1, 0, 1, 21)
```

# 複数のベクトルを 数珠玉表記 に変換する手順

👇 複数のベクトルがあるとする  

```plaintext
[2 1] [4 3]
```

👇 各ベクトルの要素は `.` 区切りにする。間隔は詰める  

```plaintext
[2.1] [4.3]
```

* これにより，数珠玉表記では小数を扱えない  

👇 ベクトル間は `,` 区切りにする。間隔は詰める  

```plaintext
[2.1],[4.3]
```

👇 角かっこは、丸かっこへ置換する  

```plaintext
(2.1),(4.3)
```

👇 ここで、`.` より `,` は優先順位が高いことから、丸かっこは外せる。だから外す  

```plaintext
2.1,4.3
```

👇 以下の置換ルールを適用する  

* `,` は `g` へ  
* `.` は `o` へ

```plaintext
2o1g4o3
```

これが 数珠玉表記 だ  

## 備考

* 整数とベクトルの結合でも同様

# TODO 入れ子ベクトル

👇 入れ子のベクトルがあるとする  

```plaintext
[  [  1  2  ]  3  ]
```

👇 一番内側の角括弧に着目  

```plaintext
[  [  1  2  ]  3  ]
   ----------
```

👇 数字間のスペースを `o` に置換して詰める  

```plaintext
[  [  1o2  ]  3  ]
   ---------
```

👇 その角括弧は一番外側ではない。  
この場合、 `[`, `]` は `q`, `p` に置換して詰める  

```plaintext
[  q1o2p  3  ]
   -----
```

👇 一番外側の角括弧に着目  

```plaintext
[  q1o2p  3  ]
--------------
```

要素間で 数字が隣合うことはない  

👇 要素間のスペースを詰める  

```plaintext
[  q1o2p3  ]
------------
```

👇 一番外側の角括弧は消す。間隔は詰める  

```plaintext
q1o2p3
------
```

これが入れ子の 数珠玉表記 だ  

# 関連する記事

## 辞書順記数法

👇 組み合わせて使える

📖 [辞書順記数法 Crieit版](https://crieit.net/posts/Dictionary-Ordinal-Number-Notation) - ブログ  
📖 [辞書順記数法 Qiita版](https://qiita.com/muzudho1/items/95852145eceddecd1503) - 固い記事  

## 数珠玉表記

📖 [数珠玉表記 Crieit版](https://crieit.net/posts/Beads-Nested-Number-Notation) - ブログ  
📖 `数珠玉表記 Qiita版` - この記事

## 電脳向量表記

👇 辞書順記数法と 数珠玉記数法を組み合わせたもの  

📖 [電脳向量表記 Crieit版 ブログ](https://crieit.net/posts/Cyber-Number) - ブログ  
📖 [電脳向量表記 Crieit版](https://crieit.net/posts/Cyber-Number-Notation) - 固い記事  

## Pythonコード

Example: 📖 [beads-vector-notation](https://github.com/muzudho/beads-vector-notation)
jacksonを使ってjson生成時に先頭文字を大文字にしたい

## やりたいこと

以下のようなクラスがあった場合に、

```Java
@Getter
public class SampleClass{
    private String propertyA;
    private String propertyB;
}
```

オブジェクトを変換すると、
`{"propertyA":"hoge","propertyB":"fuga"}`
のようになると思うのですが、
諸事情あって、以下のように送信したかったことがありました。
`{"PropertyA":"hoge","PropertyB":"fuga"}`

いちいち`@JsonProperty()`を書くのは面倒・・・

## 解決法

`ObjectMapper`のオプションで解決できました。

```Java
    ObjectMapper mapper = new ObjectMapper();
    // 以下のオプションを有効化！！
    mapper.setPropertyNamingStrategy(PropertyNamingStrategies.UPPER_CAMEL_CASE);
    try {
      String jsonData = mapper.writeValueAsString(form);
      System.out.println(jsonData);
    } catch (JsonProcessingException e) {
      e.printStackTrace();
    }
```

他にもスネークケースなどなどの変換も用意されていたので、お困りの方は見てみると楽できるかもしれません！
【React】React.children.mapでボタン間に自動でマージンをいれる

# はじめに
React(およびReact Native)で複数ボタンを縦に配置する際、ボタンごとにmarginTop(marginBottom)をあてるのは少々面倒です。

React.children.mapを利用して、childrenにボタンをいれたとき、ボタンの数に関わらずに間にマージンをいれてくれるようなラッパーをつくってみました。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/569054/eae25d06-28b5-3b86-3c68-5bac026c671f.png" width="300">

# 実装
Children.mapをつかうことで、children内の各要素を制御することができます。
今回の場合、一番上(index = 0)のボタン以外に、cloneElementでmarginTopをスタイル(containerStyle)に加えています。

```tsx:AutoSpacingWrapper.tsx
import React, {
  Children,
  ReactNode,
  cloneElement,
  isValidElement,
  useMemo,
} from "react";

type Props = {
  children?: ReactNode;
};

const AutoSpacingWrapper = ({ children }: Props) => {
  const buttons = useMemo(() => {
    return Children.map(children, (child, index) => {
      if (index > 0 && isValidElement(child)) {
        return cloneElement(child, {
          containerStyle: { ...child.props.containerStyle, marginTop: 15 },
        });
      }
      return child;
    });
  }, [children]);

  return <>{buttons}</>;
};
```

作成した`AutoSpacingWrapper`をつかう際は、childrenにボタンを加えていくだけでOKです。

```tsx
      <AutoSpacingWrapper>
        <Button onPress={handlePressButton1}>ボタン1</Button>
        <Button onPress={handlePressButton2}>ボタン2</Button>
        <Button onPress={handlePressButton3}>ボタン3</Button>
      </AutoSpacingWrapper>
```

# 参考資料

https://ja.reactjs.org/docs/react-api.html#reactchildrenmap
PostgreSQLで勧告的ロックをしたいのでUUIDをBIGINTに変換する

# 目的
[排他制御のためだけに Redis 渋々使ってませんか？データベース単独でアドバイザリーロックできるよ！](https://zenn.dev/mpyw/articles/rdb-advisory-locks)という記事をみて、ちょうどポイントを賞品に交換するというストアードプロシージャが複雑なロックが必要になったので、勧告的ロックを使ってみました。

# 関数
pg_try_advisory_xact_lock_sharedの引数は1つのBIGINTまたは2つのINTになります。自分はテーブルの主キーをUUIDにしているのでそのまま使うことができません。なんらかの方法で変換する必要があります。色々探したところ以下のようなコードを見つけました。

```sql
('x' || translate(gen_random_uuid()::TEXT, '-', ''))::bit(64)::BIGINT
```

UUIDは128bitでBIGINTは64bitなので、半分捨ててしまうことになりますが、本人が同時にポイント交換させないという目的には十分だと考えました。

# コード
賞品を交換する雰囲気のストアードプロシージャは以下のようになります。
```sql
CREATE OR REPLACE FUNCTION exchange_item (
  p_user_uuid UUID DEFAULT NULL
  ,p_item_uuid UUID DEFAULT NULL
) AS $FUNCTION$
DECLARE
BEGIN
  -- 勧告的ロック
  IF NOT pg_try_advisory_xact_lock(
    ('x' || translate(p_user_uuid::TEXT, '-', ''))::bit(64)::BIGINT
  ) THEN
    RAISE SQLSTATE 'U0001' USING MESSAGE = 'advisory lock';
  END IF;

  -- 複雑な状況チェック

  -- ポイント交換処理
END;
$FUNCTION$ LANGUAGE plpgsql;
```

# 追記
このままのコードだとシステム全体で1っか所でしか使えないので、複数で使いたい場合、数字を足せばよいです。
例えば4か所で使うなら使う場所ごとに+1, +2, +3, +4すれば同じuser_uuidでも同時に使えます。
同じ人に同時に処理させたくないという目的ならこれで問題無いと思います。

```sql
IF NOT pg_try_advisory_xact_lock(
  ('x' || translate(p_user_uuid::TEXT, '-', ''))::bit(64)::BIGINT + 1
) THEN
  RAISE SQLSTATE 'U0001' USING MESSAGE = 'advisory lock';
END IF;
```
clamp()にてfont-sizeをレスポンシブ対応にする際の計算方法とScss関数

clamp()関数を使うと最小サイズと最大サイズとその間の変化を指定できます。

ウィンドウ幅が320pxから1200pxまでで、フォントサイズの16pxから24pxに変化する場合以下のように設定できます。

```css
.paragraph {
    font-size: clamp(1rem, 0.636rem + 1.82vw, 2rem); 
}
```

## clamp()にて上記のように設定する方法の解説

左端の値は最小サイズ。
右端の値は最大サイズ。
真中は変化する値を入れます。

スムーズに変化するには最小サイズと最大サイズと最小viewportと最大viewportから値を計算します。

まずは真ん中の右の変化する値の計算方法を解説します。

## フォントが変化する量をvw単位にする計算

1. 最大font-sizeから最小font-sizeを減算しフォントサイズの変化する幅を求める
2. 最大viewportから最小viewportを減算しウィンドウの変化する幅を求めておく
3. フォントが変化する量をvwにするために2を1で徐算し100をかける（切り上げ）

例）ウィンドウ幅が320pxから1200pxまでで、フォントサイズの16pxから24pxに変化する場合の値をvw単位で求める計算式

$$
(24-16)/(1200-320)*100
$$

## フォントが変化しない部分をrem単位にする計算

1. 変化するサイズ（vw）が最小viewport時に何pxになるか計算する
2. 最小フォントサイズから1の数値を減算する
3. 2はpx単位の変化しない部分のサイズとなるので0.0625を掛けてremにする

例）ウィンドウ幅が320pxから1200pxまでで、フォントサイズの16pxから24pxに変化する場合の値をrem単位で求める

$$
(16-(24-16)/(1200-320)*320)*0.0625
$$

## 上記を簡単に計算してくれるサービスサイト

[Min-Max-Value Interpolation](https://min-max-calculator.9elements.com/)

ややこしい計算をしなくともこちらのサイトで簡単に計算してくれます。

ただしいちいち全部こちらで計算するのは面倒になってくると思うので、Sassのfunctionを作成すして対応しても良いかと思います。

## Scssの関数にて簡単に出力する方法

いちいちサイトに行き計算をするのも面倒になるので、Scssを使用している場合は以下のような関数にて出力させるという方法もあります。

```scss

@use "sass:math";

@function responsiveFontSizeClamp($minFontSize, $maxFontSize, $minViewport, $maxViewport) {

    //最大font-sizeから最小font-sizeを減算しフォントサイズの変化する幅を求める
    $fontSizeRate: $maxFontSize - $minFontSize;
    //最大viewportから最小viewportを減算しウィンドウの変化する幅を求めておく
    $viewportRate: $maxViewport - $minViewport;

    //フォントが変化する量をvw単位にする計算(小数点２桁で丸める)
    $changingSize: math.div(math.round(math.div($fontSizeRate, $viewportRate) * 10000 ),100);

    //フォントが変化しない部分をrem単位にする計算
    $fixedSize: math.div(math.round(($minFontSize - math.div($fontSizeRate, $viewportRate) * $minViewport) * 62.5), 1000);

    //最小フォントサイズをrem単位にする計算（小数点3桁で丸める）
    $minRemFontSize: math.div(math.round($minFontSize * 62.5 ),1000);

    //最大フォントサイズをrem単位にする計算（小数点３桁で丸める）
    $maxRemFontSize: math.div(math.round($maxFontSize * 62.5),1000);

    //出力
    @return clamp(#{$minRemFontSize}rem, #{$fixedSize}rem + #{$changingSize}vw, #{$maxRemFontSize}rem);
}

.paragraph {
    font-size: responsiveFontSizeClamp(16,32,320,1200);
}
.description {
    font-size: responsiveFontSizeClamp(14,24 ,320 ,1200 );
}
```
gradleのビルドレポートを作成する方法

# はじめに
歴史のあるプロジェクトだとビルドの速度が気になったりしませんか？
ビルド速度が遅いとなかなかしんどいですが、原因を探るのも辛いですよね。
上記原因を探るための機能がAndroidStudioには色々ありますが、今回はgradleのビルドレポートを作成する方法をまとめておこうと思います。

# レポート作成方法
レポート作成には以下の設定が必要です。

``` gradle.setting
kotlin.build.report.enable=true
```

設定は以上になります。
上記を設定した状態でビルドを作成すると、以下ディレクトリにレポートが作成されます。
![スクリーンショット 2022-07-16 15.25.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/354522/02eb09ac-0887-cef6-564a-0f40a2436844.png)

上記textファイルにはそれぞれのタスクでかかった時間など、詳細に記載されていますので、時間がかかりすぎているものに関しては対応策を探すなどの対応が可能になります。

# さいごに
毎回ビルドが遅いと確認も億劫になりますし、非常にストレスになりますよね。
集中力も散漫になってしまいますので、ビルドが遅いと感じはじめたら早めの対策を行っていきたいところです。
名もなき仕事の負担軽減！この店番どこ？を解決する店番検索LINEbot

# はじめに

膨大なエクセルデータと戦いながら、効率化に悩む毎日…
こんにちは、私は小売業界で働く定時帰宅マンになりたいサラリーマンです。
200店舗以上の店舗の商品在庫や売上の管理をしています。

店舗は店番という番号に置き換えられ、データとして処理しています。
データを見ながら店舗に連絡したくても、**店番だけではどこの店舗か分からない。**

**都度調べ、電話番号を打つのは意外と面倒な作業…**
**その店番の店長、担当ＳＶを調べるのだって割と大変…**

なので店番を打ったら店舗情報が出てくるLINEbotを作成しました！


# 使用ツール
+ [LINE Developers](https://developers.line.biz/ja/)
+ [Make](https://www.make.com/en)
+ Googleスプレッドシート


# 作り方

1. スプレッドシートに店番、紐づける店舗情報、グーグルマップ上で店舗名を検索した結果のURLを記入
1. LINEで知りたい店番を入力
1. 該当する店番の店舗情報、グーグルマップのURL、店舗情報が変わった場合の問い合わせ先を表示
1. 該当する店番がなければ、「店番が正しくありません。正しい店番を入力してください。」と表示


## スプレッドシートの設定

![スプレッドシート.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2730713/0a790749-135d-247a-925f-64759825ad79.png)

1. D列に店番、E列に店舗情報、F列にグーグルマップ上で店舗名を検索した結果のURLを記入
1. A3セルにLINEから知りたい店番が入力される
1. B3セルでA3セルを検索値としてIFERROR及びVLOOKUP関数を使用し店舗情報を抽出
1. エラーの場合はE2セルを反映
1. C3セルでA3セルを検索値としてVLOOKUP関数を使用しグーグルマップの検索値を抽出




## Makeシナリオ

+ シナリオ全体図及びグーグルシートの処理
![シナリオ.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2730713/bbf463d0-1fe3-ef36-5f4f-bcae9b1077f6.png)

+ ルーターを用いて店番が正しく入力されていない場合と正しく入力されいる場合で条件分岐をする

:::note info
条件分岐をすることで、正しく店番が入力されていない時に
マップのURLのN/Aと、店舗情報が変わった場合の問い合わせ先を非表示にし、
正しい店番の再入力を求めることができます。


:::


![ルーター分岐.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2730713/b428ecfa-94e9-357a-a443-bf4652da5050.png)

+ 店番が正しい場合に店舗情報、グーグルマップのURL、店舗情報が変わった場合の問い合わせ先を表示させる
![返信.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2730713/7c10ea2c-79db-41ca-e5aa-4738911655ab.png)

# 実装
なんとか実装できた～！！
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">実装できた～🎉<a href="https://twitter.com/hashtag/protoout?src=hash&amp;ref_src=twsrc%5Etfw">#protoout</a> <a href="https://t.co/AvundR48gZ">pic.twitter.com/AvundR48gZ</a></p>&mdash; K@DX関連情報収集用 (@study_dx) <a href="https://twitter.com/study_dx/status/1548221730514018304?ref_src=twsrc%5Etfw">July 16, 2022</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>


# 最後に
初めて作ってみて分からない事も多く、実装までにだいぶ時間がかかってしまいました。

返信が表示されるまでに時間がかかったので、検索数が増えるほど処理速度が落ちるのではないかと感じました。

今回グーグルマップはURLで検索値を表示させることにしましたが、グーグルマップのAPIもありました。
ただ、使用条件などがあったため今回は見送りました。検索値を表示させることとAPIを使用することでどのような違いがあるのかを検討していきたいです。

店舗情報が間違っていた場合に担当者へ連絡するようにと表示させたのですが、LINEbot内で完結できるようになればと思いました。
例えば新しい情報を店番と共に入力すると、スプレッドシートに入力内容が保存されるなど。
今後の課題としたいです。

最後までご覧いただきありがとうございました！
サブディスプレイ時、BlenderのUIのちらつきを軽減する。

# 環境
Mac OSX 12.4 (M1 pro)
Blender 3.0.0（Apple用）
2画面

# 事象
２画面時のサブディスプレイ上で
特にTexture Paintなどを操作中にNキーで表示されるパネルなどが、ちらつく。

おそらく同じ原因
https://developer.blender.org/T92586

# 対策
![b.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/128851/93e78004-40a3-5a34-d0ef-b070eda5ad99.png)

Interface＞Region Overlapのチェックを外すと、やや抑えられた。
（しかし、TimeLineなどはちらつく）
または、本体のディスプレイで作業する。
MakeとLINE messagingAPIを使って勤怠スケジュールを手軽に確認できるようにしてみた

# はじめに
はじめまして。小売業の仕事をしています。
仕事の都合上、休日が不定休で、次の休日がいつなのか忘れてしまう事が多々あるのですが、
勤怠の確認のためにわざわざ会社のPCを起動する必要があり、手間がかかっていました。
そこで、会社のPCを起動することなく、LINEに日付を打つと勤怠スケジュールを返してくれる自分用の簡単なbotを作成しました。
# 使用ツール
[Make](https://www.make.com/en)
[LINE Develpoers](https://developers.line.biz/ja/)
[SSSAPI](https://sssapi.app/)
Google スプレッドシート

# 作り方
### スケジュールを記載したGoogleスプレッドシートの作成
![スプレッドシート.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2728254/87c631ab-2a70-98ff-0135-4e2d9ebb283a.png)
作りはとってもシンプルで、A列に日付、B列に返してほしい文章を打ちます。
B列の文章を工夫すれば仕事以外のプライベートの予定も管理できて、工夫次第でさらに便利に出来るかも？
~~遊び要素もこれから色々入れていきたい~~
### SSSAPIを用いて作成したGoogle スプレッドシートをAPI化![API.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2728254/134deafd-3379-45dd-2330-d36ed22f010b.png)


[SSSAPI](https://sssapi.app/)を使い、作成したGoogle スプレッドシートをAPI化し、JSONコードを作成します。
（上図は作成が完成したもの）
スプレッドシートのURLをコピーするだけで簡単にAPIが作成できて便利です。
作り方は[こちら](https://sssapi.app/help/add_api)より。

### シナリオの作成
![全体像.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2728254/54911eac-0d56-1fc3-bcc7-1d29fdc8d009.png)
全体像は上図のようになります。
HTTPモジュールに先ほど作成したAPIのURLを貼り付けて、JSONモジュールで中身を取り出します。
各モジュールの設定は次の通り
![素材1.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2728254/ad4e28a7-f593-9a23-32ed-1548f178ad5f.png)
![素材2.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2728254/5917d6f6-bd5d-b49a-1577-1bb94b3fe275.png)
![素材3.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2728254/47aa73f3-f6e4-14b2-04ba-5e8c84656ec2.png)

![素材4.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2728254/3b0cf08c-f407-3305-5ec3-25cf0cad685f.png)
![素材5.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2728254/88b156b5-8fe4-83a9-3286-89d41eda7600.png)

# いざ実装
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">パワー！！！！ <a href="https://twitter.com/hashtag/protoout?src=hash&amp;ref_src=twsrc%5Etfw">#protoout</a> <a href="https://t.co/ycSiOwWKpj">pic.twitter.com/ycSiOwWKpj</a></p>&mdash; やまかず (@nobita_gkb) <a href="https://twitter.com/nobita_gkb/status/1548208016423469056?ref_src=twsrc%5Etfw">July 16, 2022</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

しっかり返ってきました。
~~きんに君も無事実装完了~~


# あとがき
MakeやLINE bot等、何もかもが初めて作るものだったので、ここまで作るのも非常に苦労しましたが、
これからも新たな技術を学んで色んな課題を解決できるツールを作っていけたら良いなと思います。
ここまで読んでいただき、ありがとうございました。
合格しました

今年の春に行われた基本情報技術者試験、応用情報技術者試験ともに合格しました。

どちらの試験も覚えることは多いですが、合否を大きく分けるのは過去問の演習量だと感じました。
軽くテキストで必要事項を網羅した後は、演習に取り掛かってわからないところや弱点を詰めていけば効率的に合格に近づけるのではないでしょうか。
ドメイン駆動設計について

「ドメイン駆動設計 モデリング／実践ガイド」を参考にドメイン駆動設計についてまとめます。

# ドメイン駆動設計とは
DDDはドメインモデリングによってソフトウェアの効率的・効果的な開発を行うための開発手法の一つである。

### 用語の意味
- ドメイン
対象となる業務領域
- ドメインモデル
ドメインの問題を解決するためのモデル
- ドメインエキスパート
ドメインに詳しい人間
- ドメイン知識
ドメインに存在するルール・制約
- 境界づけられたコンテキスト
あるモデルを同じ意味で使い続ける範囲
- ユビキタス言語
開発者だけでなく、ビジネス側の人間と共通して使う言葉
- 戦術的設計パターン
エンティティやリポジトリなどを使った具体的なソフトウェア設計

モデルには以下の種類がある
- ドメインモデル（ドメインの問題を解決するためのモデル）
- データモデル(データの永続方法を決めるためのモデル)

ドメインモデリング → 実装 → 戦術的設計パターンにリファクタリング

# ドメインモデリング
- RDRA(リレーションシップ駆動要件分析)
- ICONIX
上記方法がDDDと相性が良いとされている。

また、ユースケース図とドメインモデル図を使ってモデリングを行うとスタートしやすい。

### DDD固有のモデリング手法
##### 集約について
強い整合性が必要なオブジェクトは１つの集約にまとめる。
集約ごとに親となるオブジェクトを決め、「集約ルート」と呼ぶ。
１トランザクションによって集約内のオブジェクトは全て更新される。
##### 境界づけられたコンテキスト
境界づけられたコンテキストは範囲の定義であり、この範囲内ではモデル、言語を統一する。

### 基本設計
ソフトウェアは高凝集・低結合を目指すと特性が改善するとされている。
凝集度と結合度は「モジュール」単位（機能をひとまとめにした単位）で考える。

##### 高凝集な実装の特徴
- クラス名が「何をするものなのか」が明確である
- クラス名と関連が明確なデータ
- クラス名とデータと関連が明確なメソッド
上記の項目を満たすと、可読性や保守性が高まる。

##### 低結合な実装
２つのメソッドで、一つのメソッドの結果がもう一つのメソッドの内部状態に依存しする状態は高結合となる。
２つのメソッド間の関係を受け渡す引数のみとし、それぞれのメソッドの内部に変更があっても影響を受けない状態にすると結合度は低くなる。

### アーキテクチャ
- ドメイン層
ドメイン知識を表現する。ドメインモデルとそれを利用するクラスが存在している。
- ユースケース層
ドメイン層が公開している操作を組み合わせてユースケースを実現させる。
- プレゼンテーション層
アプリケーションの外部との入出力を実現させる。コントローラーや入出力を定義するクラスがある。
- インフラ層
下位のレイヤーで定義されているインターフェイスを実現させる。リポジトリの実装クラスがある。
##### レイヤードアーキテクチャ
ビジネスロジック層を「ユースケースを実現する層」と「ドメイン知識を実現する層」に分割する。
ドメイン層にリポジトリを置くと、インフラ層に依存してしまうという課題がある。

##### オニオンアーキテクチャ
レイヤードアーキテクチャを依存関係の逆転の原則によりドメイン層とインフラ層の依存を逆転させたアーキテクチャ。シンプルでDDDに適している。

##### ヘキサゴナルアーキテクチャ
オニオンアーキテクチャとクリーンアーキテクチャの基本となるアーキテクチャ。
アプリケーションが外とコミュニケーションする際は専用のポートとアダプターを作成して通信させるという思想。

##### クリーンアーキテクチャ
ヘキサゴナル、オニオンやその他のアーキテクチャの概念を結合しようとしたもの。

### 参考
https://qiita.com/little_hand_s/items/721afcbc555444663247

「ドメイン駆動設計 モデリング／実践ガイド」
[AWS認定 合格記]ソリューションアーキテクトプロフェッショナル（SAP）

# 私のスペック
某CIer所属のインフラエンジニア
実務歴は1年と3か月
AWSアソシエイト（SAA,SOA,DVA）は取得済み
IPA: 基本情報（FE）
大学は情報系を専攻（学士）

# 流れ
1.おすすめ教材
2.勉強法
3.まとめ

# 1.おすすめ教材
[参考書]
https://amzn.to/3OhbTh8
AWS認定ソリューションアーキテクト－プロフェッショナル～試験特性から導き出した演習問題と詳細解説～
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2584969/876d8b56-b5d4-994f-cba6-fae005c35ed3.png)

ほかのみなさんも軒並みおっしゃっているとおり一周はすべき書籍です。まずはこちらで概要をつかむのがいいと思います。

# 2.勉強法
**koiwa club（web問題集）**
**AWS公式のドキュメント**
正直この二つを組み合わせて勉強するのが最強だと思います。

koiwaがなぜ優秀なのか、それは**AWSドキュメントに導いてくれるからです！！**
しかも7問一括りで隙間時間できます。
koiwaは3か月で6000円ほどしますが、初学者であれば使わない手はないです。

# まとめ
とにかくkoiwaと公式ドキュメントを読んでください！！
koiwaやってない人はいますぐ課金して！AWS公式ドキュメントを読んで！！
以上、合格記でした。
Dockerイメージ導入・削除

### 1.利用できるDockerイメージの確認
インストールできるイメージを探す
[公式イメージ検索用サイト](https://hub.docker.com/search?q=&image_filter=official "docker hub")
*$ docker search XXX*
```
$ sudo docker search centos
NAME                                         DESCRIPTION                                     STARS     OFFICIAL   AUTOMATED
centos                                       The official build of CentOS.                   7243      [OK]       
kasmweb/centos-7-desktop                     CentOS 7 desktop for Kasm Workspaces            21                   
continuumio/centos5_gcc5_base                                                                3                    
dokken/centos-7                              CentOS 7 image for kitchen-dokken               2                    
dokken/centos-stream-9                                                                       1                    
couchbase/centos7-systemd                    centos7-systemd images with additional debug…   1                    [OK]
spack/centos7                                CentOS 7 with Spack preinstalled                1                    
datadog/centos-i386                                                                          0                    
dokken/centos-8                              CentOS 8 image for kitchen-dokken               0                    
dokken/centos-6                              CentOS 6 image for kitchen-dokken               0                    
```

### 2.Dockerイメージのダウンロード
*$ docker pull XXX*
```
$ sudo docker pull centos
Using default tag: latest
latest: Pulling from library/centos
a1d0c7532777: Pull complete 
Digest: sha256:a27fd8080b517143cbbbab9dfb7c8571c40d67d534bbdee55bd6c473f432b177
Status: Downloaded newer image for centos:latest
docker.io/library/centos:latest
```

### 3.Dockerイメージ確認
*$ docker image ls*
```
$ sudo docker image ls
REPOSITORY   TAG       IMAGE ID       CREATED         SIZE
centos       latest    5d0da3dc9764   10 months ago   231MB
```

### 4.Dockerイメージ削除
*$ docker image rm -f XXX*
```
$ sudo docker image rm -f centos
Untagged: centos:latest
Untagged: centos@sha256:a27fd8080b517143cbbbab9dfb7c8571c40d67d534bbdee55bd6c473f432b177
Deleted: sha256:5d0da3dc976460b72c77d94c8a1ad043720b0416bfc16c52c45d4847e53fadb6
```
cronの日時指定の書き方

### はじめに
業務でcron設定をする際、ついつい忘れてしまうため、備忘録として投稿

### cronの場所
cronび設定ファイルは以下になります。
```
/etc/crontab
```
### 書式

```
#crontabの書式
# （行頭の # マークはコメント行を示す）
# +------------ 分 (0 - 59)
# | +---------- 時 (0 - 23)
# | | +-------- 日 (1 - 31)
# | | | +------ 月 (1 - 12)
# | | | | +---- 曜日 (0 - 6) (日曜日=0)
# | | | | |
# * * * * * 実行されるコマンド
```

- 分は0～59の数字で指定
- 時は0～23の数字で指定
- 日は1～31の数字で指定
- 月は1～12の数字で指定
- 曜日に関しても数字で指定し、0と7が日曜日、1以降は順に、月、火、水、木、金、土となる
- コマンドは、設定ファイルでパスを通していないものに関してはフルパスで指定するかカレントディレクトリからの相対パスで指定しなければならない

＊曜日設定が分かりづらいので表にまとめました。
| 曜日 | 設定 |
|:-:|:-:|
| 日曜日 | 0(または7) |
| 月曜日 | 1 |
| 火曜日 | 2 |
| 水曜日 | 3 |
| 木曜日 | 4 |
| 金曜日 | 5 |
| 土曜日 | 6 |

例）5分おきに/home/hoge/hoge.shを実行するという例

```
*/5 * * * * /home/hoge/hoge.sh
```

### 時間の書き方例

```
40 23 * * *               23:40に実行
34 04 * * * 　　          04:34に実行
0 19 * * *                19:00に実行
0 18 * * 1                毎週月曜の 18:00に実行
0 17 * * 0,2,3         毎週日,火,水曜の 17:00に実行
0-10 17 1 * *             毎月 1日の 17:00から17:10まで 1分毎に実行
0 22 * * 1-6　　          月曜日から土曜まで 22:00に実行
0,10,20,30,40,50 * * * *　10分おきに実行
*/10 * * * * 　　　　　　 10分おきに実行
* 1 * * *　　　　　　　　 1:00から 1:59まで 1分毎に実行
0 * * * *　　　　　　　　 毎時 0分に 1時間毎に実行
2 8-20/3 * * *　　　　　　8:02,11:02,14:02,17:02,20:02に実行
30 6 1,15 * *　　　　　　 1日と 15日の 6:30に実行
0 17 * * *　　　　　　　　 毎時 0分に 1時間毎に実行
00 5 10 7 5　　　　　　　　 7月10日の5:00または　金曜日の5:00に実行
```
※全部 * だと毎分実行される。
※日にち指定と曜日の両方を設定するとOR条件になる。
会話しているようにお客様から注文を受けるLINE Botをつくってみた

はじめに
-------
私は某会社で移動スーパーを担当しています。
<strong>移動スーパーとは、</strong>店舗の売り場から食品を軽車両に積み込んで
中山間部を中心にお買い物が不便な地域を移動しながら販売する業態です。

店舗型のスーパーとしては新業態となるため、仕組み化されていないことも多く<br>いかんせん手作業が多いのが実態です。。。
紙で集めて、エクセルに入力して集計、、、
営業面でも、時間を問わず受注が入れば売上が増えそう？？？

そういうわけで、今回LINE Botを勉強して<strong>LINE Botの作成にチャレンジ</strong>してみました！

<strong>「こちらがおすすめしたい商品（ドーナツの予約販売商品）を<br>お客様が自分で入力し、それを自動で集約するというLINE Bot」</strong>

作成にあたり心掛けたことは、ちょっとした会話のやり取りになることです。
一方的な発信で無視されるよりも、いらない場合は「いらない」と言ってもらえる
ほうが<strong>次につながる</strong>気がしますしね。

実装
-
https://twitter.com/marching02/status/1548203231087431680?s=20&t=QooNqBi6yjeqR7UYmlnJuw

構成
-
<strong>全体図</strong>
![スクリーンショット (34).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724492/55cdeeb1-28c1-fb68-1d49-9d2fbb382739.png)

<strong>分岐</strong>
![スクリーンショット (39).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724492/155ea152-c994-609c-6ff6-32dd03beb698.png)

<strong>Google Forms</strong>
![スクリーンショット (36).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724492/50ad5b53-427b-d827-fe7e-b491a63f673d.png)

<strong>Google Spread Sheet</strong>
![スクリーンショット (40).png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2724492/9ffc8651-af6c-d7e6-9326-963a5d174637.png)


使用したもの
-
・LINE Developers
・withMake
・Google Forms

作り方
-
<dt>会話のやりとりはこんな感じです。<dd>

<dd>１、はじめ（ここからスタート）<dd/>

<dd>【Bot】ドーナツの予約注文をはじめました！<sdd/>

【Bot】ご注文いただけますか？
　　　はい/いいえ

<dt>分岐（はいの場合）<dd>

【相手】はい　
【Bot】ありがとうございます！こちらからご注文下さい
　　　　Google FormsのURLを添付
【Bot】（フォームの入力後）ご注文ありがとうございます。
<dt>分岐（いいえの場合）<dd>
【相手】いいえ

【Bot】残念です。またの機会をお待ちしています！

あとがき
-
初めてのLINE Botの作成だったので課題だらけ:weary:です。
注文内容の確認を最後に入れたかったのですが、何度やってもうまくいかず
もう少し知識を深堀りしてアップデートしようと思います。
ただ、なんか調べながら作っているうちになんか色々なことができそう
という感覚:smirk:はありました。
Feature フラグをドキュメントする (doc_cfg)

# Feature フラグの存在を伝える

[syn クレートのドキュメント](https://docs.rs/syn/latest/syn/) より:

![doc_cfg.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/594390/a017bd04-ac37-2dfa-01d4-bf1a4c00a66a.png)

`buffer` モジュールは `parsing` フラグが有効な場合のみ利用できると一目で分かります。

## `Cargo.toml`

docs.rs で `doc_cfg` 属性を有効にします:

```toml:Cargo.toml
[package.metadata.docs.rs]
all-features = true
targets = ["x86_64-unknown-linux-gnu"]
rustdoc-args = ["--cfg", "doc_cfg"]
```

## ソース

[#\[cfg(doc(..)\]](https://doc.rust-lang.org/beta/unstable-book/language-features/doc-cfg.html) が feature を表示する機能です。 Unstable なフィーチャーなので有効化します:

```rust:src/lib.rs
#![cfg_attr(doc_cfg, feature(doc_cfg))]
```

> `cfg_attr` ガードにより、 `doc_cfg` が未定義の場合は無視しています。

`buffer` モジュールの宣言は:

```rust:src/lib.rs
#[cfg(feature = "parsing")]
#[cfg_attr(doc_cfg, doc(cfg(feature = "parsing")))]
pub mod buffer;
```

これで docs.rs では冒頭のように表示されます:

![doc_cfg.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/594390/a017bd04-ac37-2dfa-01d4-bf1a4c00a66a.png)

# ローカルでも `doc_cfg` フィーチャーを使う

コメントで教えていただきました。ありがとうございます！

```sh
$ # ドキュメント生成
$ cargo +nightly rustdoc -- --cfg doc_cfg

$ # ビルド後にブラウザで開く
$ cargo +nightly rustdoc --open -- --cfg doc_cfg
```

Nightly を使っているなら、以下のようなエイリアスも有効です:

```toml:.cargo/config
[alias]
d = "rustdoc -- --cfg doc_cfg"
do = "rustdoc --open -- --cfg doc_cfg"
```

> ただしクレートによって `#[doc(cfg(..))]` に使っている属性名は異なります！
> `doc_cfg` の他に `docsrs` も一般的な名称です。
辞書順記数法

一度に説明すると複雑なので、要点を分けて１つずつ説明する  

# 零，または正の整数を 辞書順記数法 に変換する手順

👇 零，または正の整数があるとする

```plaintext
0  1   21    321     4321
-  -   --    ---     ----
```

👇 `桁数×2-1` の横幅があると考えてほしい

```plaintext
0  1   21    321     4321
-  -  ---  -----  -------
```

👇 `前A` で埋める

```plaintext
0  1  A21  AA321  AAA4321
-  -  ---  -----  -------
```

これで正の数は辞書順に並ぶ  

## 備考

* アスキーコードの順を考えると A(大文字) が好ましいが、 a(小文字) でも構わない  

# 負の整数を 辞書順記数法 に変換する手順

👇 負の整数があるとする  

```plaintext
  -1     -21      -321       -4321
  --     ---      ----       -----
```

👇 負の符号を除去する  

```plaintext
   1      21       321        4321
   -      --       ---        ----
```

👇 `桁数×2` の横幅があると考えてほしい  

```plaintext
   1      21       321        4321
  --    ----    ------    --------
```

👇 `その数を1桁増やした数の最小の数` を求め、上に置く  

```plaintext
  10     100      1000       10000
   1      21       321        4321
  --    ----    ------    --------
```

👇 引き算をする  

```plaintext
  10     100      1000       10000
-  1  -   21  -    321  -     4321
  --    ----    ------    --------
   9      79       679        5679
```

👇 差の横幅を `前_` で埋める  

```plaintext
  --    ----    ------    --------
  _9    __79    ___679    ____5679
```

👇 差を残す  

```
  _9    __79    ___679    ____5679
```

これが負数の表記だ。辞書順で昇順に並ぶ  

## 備考

* 👆 アンダースコア `_` は使いたくなかった。 `0` が Windows ファイルエクスプローラーや Visual Studio 2022 Preview のメソッドの並び順で 辞書順になるなら `前0` にしたかったが、 ならなかった。 分けの分からない挙動なので仕方なく `前_` を使用

# 関連する記事

📖 [Crieit版 辞書順記数法 (Dictionary Ordinal Number Notation) を解説しようぜ（＾～＾）？](https://crieit.net/posts/Dictionary-Ordinal-Number-Notation)  
📖 [数珠玉記数法](https://crieit.net/posts/Beads-Nested-Number-Notation) - 組み合わせて使える  
📖 [電脳記数法](https://crieit.net/posts/Cyber-Number-Notation) - 辞書順記数法と 数珠玉記数法を組み合わせたもの  

Example: 📖 [dictionary-ordinal-number-notation](https://github.com/muzudho/dictionary-ordinal-number-notation)
【コピペ】Qiitaのview数を取得して合計し、スプレッドシートに反映させる方法

#  はじめに
筆者は [大学生限定 プログラミングコミュニティ 『GeekSalon』](https://geek-salon.com/user_trials/new/?utm_source=Direct&utm_medium=attract&utm_campaign=3Q&utm_content=Fukuoka_A1_3Q)で活動している者です！ 

# 完成イメージ
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1081227/43af7cf3-7a96-40e6-8b5f-2974a872a641.png)

# 実装方法
情報を取得したいスプレッドシートからスクリプトを開き以下をコピペしましょう！
```js:
function qiita(){
  const COL_TITLE  = 1;
  const COL_PV     = 2;
  var sheet = SpreadsheetApp.getActiveSheet();
  
  sheet.getRange(1, COL_TITLE).setValue("タイトル");
  sheet.getRange(1, COL_PV).setValue("ビュー");

  const QIITA_TOKEN  = 'あなたのtoken';
  const API_ENDPOINT = 'https://qiita.com/api/v2';
  const API_MY_ITEMS = '/authenticated_user/items';

  var headers = {'Authorization' : 'Bearer ' + QIITA_TOKEN};
  var params = {'headers' : headers};

  var paramstr = "?per_page=100&page=1";
  var res = UrlFetchApp.fetch(API_ENDPOINT + API_MY_ITEMS + paramstr, params);
  var json = JSON.parse(res.getContentText());
  json.forEach(function(item, i){
    sheet.getRange(i + 2, COL_TITLE).setValue(item["title"]);
  });

  const API_ITEM_DTL = '/items';

  json.forEach(function(item, i){
    var resdtl = UrlFetchApp.fetch(API_ENDPOINT + API_ITEM_DTL + "/" + item["id"], params);
    var jsondtl = JSON.parse(resdtl.getContentText());
    sheet.getRange(i + 2, COL_PV).setValue(jsondtl["page_views_count"]);
  });

}
 

```
# Tokenの取得方法
![スクリーンショット 2022-07-16 16.25.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1081227/9bcf824e-0403-2fce-8904-1ea96158876c.png)
![スクリーンショット 2022-07-16 16.26.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1081227/9cead52a-6a98-a025-8624-c17ed5e2a973.png)
![スクリーンショット 2022-07-16 16.26.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1081227/4bea7f43-c044-51cd-4781-5791a1f2846c.png)


##  最後に
いかがでしたでしょうか？
不具合等ありましたらご連絡ください！
詳細の解説はまた時間がある時にやろうと思います！今回はとりあえずコピペで使えるところまで！
それではご覧いただきありがとうございました！