axios を async/await で書き直した時の課題をメモ

## 概要
request が deprecated になっており、トレンドも axios に移っているようだ。

* [axios vs request | npm trends](https://www.npmtrends.com/axios-vs-request)

なので、コードの置き換えを検討している。async/await にすると可読性があがるかもと試した内容を記載する。

## 結論

結論からいうと因果関係のある処理を async/await に置き換えると異常でも後続する処理が動くため微妙。
因果関係がある場合、論理的にも入れ子で正しいし、今回検証したパターンだと入れ子のままでいいと思う。

## サンプルコード: then()を使う

ユーザー認証をして得たトークンを元にリクエストをする例。
簡単すぎるコードでは検証にならないのでやや複雑なコードになっている。

“`javascript
‘use strict’

const axios = require(‘axios’);

axios(
{
url: ‘https://httpbin.org/

Google Shopping Listにいつも買うものを自動で追加する

# あらまし

Google Shopping Listにいつも買うものをワンクリックで追加する、テンプレート機能的なものを実装するために以下のスクリプトを書きました。

[Function to a given item to Google Shopping List. Paste the code in the DevTools’ console!](https://gist.github.com/igrep/a41d2f9678621b5bb5e5e0d7c79ae6e5)

適当に編集してブックマークレットにするなりして用法用量を守りながらお使いください。

# 動機

コロナ禍によって外出をできるだけ減らす努力をした結果、食料の買い出しが週一回程度になった。
➡️ 毎度決まって買うものがはっきりしてきた。
➡️ 同じものを繰り返し買い物リストに追加するのは面倒だし、テンプレート機能的なのがほしい。
➡️ Google Homeから使うのが一番楽なのはなんやかんや[Google Shopping List](https://shoppinglist.google.c

【JavaScript】関数における、引数値を定数で定義することの利点

同じ変数を用いる複数の関数を実行したい場合、引数値を定数で定義すべき、という内容。

例）

“`js
//関数１
function intro(name, food) {
console.log(`私の名前は${name}です。好物は${food}です。`);
}

//関数2
function lunch(food) {
console.log(`今日の昼ごはんは${food}を食べます。`);
}
“`
どちらの関数も、仮引数`food`を使っている。

これらに対して、引数で定義し出力をする場合は、

“`js
intro(“田中”,”カレー”); //仮引数(name,food)に引数を与え、関数の実行。
lunch(“カレー”); //上記と同様。
“`

となる。
一方で、引数で定義するのではなく、定数で定義し出力する場合は、

“`js
const name = “田中”; //定数nameに文字列”田中”を代入。
const food = “カレー”; //上記と同様。
intro(name,food); //仮引数(name,food)に定数(na

jscodeshift with TypeScript

# はじめに

以前、[jscodeshit](https://github.com/facebook/jscodeshift)という `JavaScript`および`TypeScript`コードのリファクタリングツールの紹介記事を書きました。

[JavaScriptのリファクタリングツール「jscodeshift」の使い方](https://qiita.com/toshi-toma/items/93f1dfdf0a820fe6fccc)

このツールは、ASTベースでコードを自在に変換でき、とても便利です。`jscodeshift`は、Transform File（変換処理を記述するファイル）として変換処理を書くのですが、これまで`JavaScript`で変換処理を書くことが多かったです。

しかし、Transform Fileは`TypeScript`で書くことが可能です。

最近、`TypeScript`で変換処理を書いた際、その開発体験がとても良かったので紹介します。ASTベースのコーディングに`TypeScript`の型推論や補完があると、開発が快適になることは想像しや

AngularとCesium.jsを使って3Dモデルを動かすところまでやってみた

Cesium.jsをAngularアプリケーションの中で使うことになったので、知見を共有しようと思います。
割と基礎的な内容ですが、英語のドキュメントを読むのに辛い思いをしたので備忘録を兼ねて投稿します。願わくば誰かの役に立たんことを……。
# Cesium.jsとは？
Cesium.jsの説明についてはこちらの記事で基本的なところは解説しているので、省きます。
https://qiita.com/keijipoon/items/615ebaf7561a27d744f5

# 準備
まずは新しいAngularのプロジェクトを作ります。
`ng new cesium-project`

プロジェクトに移動し、ng serveでサーバが起動しているかを確認します。
`cd cesium-project`
`ng serve`

確認したらサーバを停止し、AngularCLIからライブラリを追加。ここまでやったら準備は一旦完了です。
`ng add angular-cesium`

npmコマンドでマニュアルインストール可能だが、設定が面倒くさい。何かの理由でマニュアルインストールする場合は

アイデアの相互評価ができるidea streamerを作りたかったああああ

#アイデアの評価むつかしい問題
最近世の中でアート思考だとかデザイン思考だとかがもてはやされるようになった気がします。
でも誰か知り合いが出したアイデアって、__忖度なしで評価するの結構難しい__と思うんですよね。
例えば上司のアイデアだったら「いいですね！」と言ってしまいそうですし、斬新なアイデアであっても、「こいつ生意気やんけ」といって評価を下げてしまう人もいるかもしれません。

今回は「__ひたすらアイデアを投稿しまくって__」「__それを知らない誰かに評価してもらえる__」__idea streamer__というプラットフォームを作ってみました。
途中バグがあったり画面遷移がうまくいかなかったりで、超未完成ですが一旦振り返りの意味で投稿してみたいと思います。
「__アイデアの相互評価__」という意味で面白い仕組みだと思うので、何か刺激になればなと思います。

アプリは[こちらから入って、](https://idea-takusan-dasunjai.ml/)途中で画面遷移が切れるのでアイデア評価からは[こちらからお願いします！](https://idea-takusan-das

JavaScriptを学ぶ：スラスラ読めるJavaScript Chapter1

# はじめに
[@kuromailserver](https://twitter.com/kuromailserver?ref_src=twsrc%5Egoogle%7Ctwcamp%5Eserp%7Ctwgr%5Eauthor)さんの『会津わろ法則』に参加。
その中で紹介された学習書の中でとりかかりやすく読破できそうな『スラスラ読めるJavaScript』をチョイス。
この投稿は本書を読んで自分なりのノートとしてまとめていく。

注：本書では表なども使って丁寧に解説されているがそれを持ってこれないので他サイトのリンクを載せている。

# 文字の表示

プログラミングの第一歩、画面に文字を表示。
コンソールへの表示は**console.logメソッド**（メソッド＝コンピューターに対する命令文)を使用。
`console.log(‘表示させたい文字’);`で表示させたい文字がコンソールに表示される。

“`JavaScript:コンソール
console.log(‘Hello’);
“`

>Hello

コンソールにHelloの文字が表示された。

# 演算子を使って計算

人が

@babel/parser を console.log デバッグする

気軽に `console.log` デバッグがしたかったときのメモ。

Prettier と違って Flow で書かれてるのでそのまま Node.js では動かないのでビルドする必要がある。

“`sh
$ make watch
“`

で変更を監視してビルドして、`/packages/babel-parser/lib/index.js` を見れば良い。

なんか適当なファイルを作って

“`js
// tmp.js
const { parse } = require(“./lib/index.js”);

const code = `const foo = “foo”;`;

const result = parse(code, { plugins: [“typescript”], errorRecovery: false });

console.log(JSON.stringify(result));
“`

とか好きな内容にして

“`sh
$ node ./tmp.js
“`

すればうごく。最初はビルドするのがめんどくさいから flow-node で実行しようと

javascriptで関数をwrapする

javascriptで関数をwrapしたいときー
例えば、非同期処理の完了を待つまでなんかしたいときとか

“`javascript
const wrapper = function(func) {
/*** なんか処理 ***/
let result = func();
/*** なんか処理 ***/
};
“`

async/awaitバージョン

“`javascript
const wrapper = async function(func) {
/*** なんか処理 ***/
let result = await func();
/*** なんか処理 ***/
};
“`

普通ですね

つかうときー

“`javascript
// 引数を取らない関数の場合
wrapper(funcA)

// 引数を取る関数の場合 ここが特殊！
wrapper(funcB.bind(null, “unko”))
“`

[JavaScript] 文字列のアルファベット大小文字考慮した辞書順ソート

# アルファベット順、大文字小文字無視したソート

次のようなコードがよく紹介されていました。

“`js
var source = [‘a’, ‘B’, ‘A’, ‘b’, ‘aa’, ‘Aa’, ‘AA’, ‘aA’, ‘aB’, ‘ab’, ‘Ab’, ‘AB’]
source.sort((a, b) => {
a = a.toLowerCase();
b = b.toLowerCase();
if (a < b) { return -1; } else if (a > b) {
return 1;
}
return 0;
})
console.log(source);
// [ ‘a’, ‘A’, ‘AA’, ‘aA’, ‘aa’, ‘Aa’, ‘aB’, ‘ab’, ‘Ab’, ‘AB’, ‘B’, ‘b’ ]
“`

このコードだとある程度は文字列を並び替えられるのですが、大文字と小文字は同一視されているので、どちらかが優先されることがないです。

いわゆる辞書順を考えると、大文字を優先するか、小文字を優先するか、を判断したいとこ