KAEDE Hack blog

JavaScript 中心に ライブラリなどの使い方を解説する技術ブログ。

Dev.to への移行

dev.to dev.to に移行しました。 理由は マージン左右にあって、中央揃えでテキストが書きやすい デフォルトでダークモードがある 画像のアップロードが速い などです。

書籍を読む

リーダブルコード エンジニア必読の書 5 章まで読み、解釈した 一部コードが理解できてない クリーンアーキテクチャ 序盤しか読んでない なかなか頭に残らない スタートアップ系 僕は君の熱に投資しよう 佐藤アンリさんの VC 目線の起業家の話 リーンスター…

サブスク整理 2022-04

年度が切り替わるのでサブスクの整理をする LIFE 配送 -- 770 yen 食材の配送。価値がある 来年度からの値上げ幅次第だが継続予定 YouTubeMusic && YouTube -- 1600 yen? 音楽は生活に欠かせないので継続する 好きなアーティストさんが多く、UI が良い ビジ…

5 万以下のAndroid スマフォを比較する

why kei-s-lifehack.hatenablog.com 前回の記事で Mi9 が故障してから次に買うスマフォで Mi11 Pro Mi11T Pro Mi11 の Xiaomi の機種と 1+9 Pro 1+9 1+8T の Oppo Oneplus を比較し OnePlus 8T を Aliexpress で購入した しかし、到着したものの電源が入らず…

再び目を休める趣味を持つ

以前は YouTube で令和の虎、ホリエモンch、武井壮、メンタリストDaiGo、ひろゆき、などと目をつぶっていても聞けるし為になる放送を流すのが趣味だった。 しかし、何時からか Ark の実況ばかりを見て、実際に自分でも Ark をプレイする趣味になってしまって…

シンプルな React TS Express ハンズオン

https://youtu.be/Lam0cYOEst8 シンプルに顔見ながら見れるのをまとめる

カーネギーの 人を動かすを読んで

今まで読んだ中で1番の名著 3 章 具体的な多くのビジネスでの実例と、自分の要求を言わず、相手の利益を明示しての提案がいかに効果的かをじっくりと解説してくれている。 いかに一般的なビジネスマンが自分がしたいことを相手に押し付けているか、客の立場…

オススメ レトルト 食品リスト

# サンフーズ ## サンフーズ クリームシチュー サンフーズ ごろっと具材のクリームシチュー https://www.amazon.co.jp/dp/B07XKRF8GF/ref=cm_sw_r_cp_apan_glt_i_FHMHPAFM3Y0P03DAG11K 単価 248 円 抜群にうまい ## サンフーズ ビーフシチュー サンフーズ ご…

UI Note

Select Item Hatena / Select Photos to Upload 右上に+ Upload Photo ボタン クリックすると青い枠で覆われ、選択した順番に右上に青四角背景の数字がついていく Hatena / Select Articles to Delete 最初からチェックボックスがついている ひとつでも有効…

次に使うスマフォの選定 -- OnePlus 8T 52k に決定.

why Mi9 を落として踏んだら起動しなくなった result OnePlust 8T を 52k で AliExpress で購入。 T シリーズは無印のオトク版 元々使っていた Mi9 のスペック Xiaomi 製 ワイヤレス充電 20W 1080 x 2340px snapdragon 855 シングルスピーカー 新スマフォに…

使ってよかった 棚などの家具。

キッチンの棚 14,000 CJIMM 購入設置済み www.amazon.co.jp とても便利。 しかし、そのままおくと上の小棚に炊飯器の蒸気が被る。 それを逃すために前目に設置する必要がある。 黒く、足踏みで開けられ、静かに閉まる両開きの 45L ゴミ箱 リス 3800 円 Amazo…

技術キャッチアップに js py の最新カテゴリを見る

why teratail.com こういうのをちょいちょいみておくと仕事で出た時にすぐ対応できると感じた どうするか 週一くらいで js, py の Teratail, Qiita, Reddit, StackOverFlow, の最新質問を見て、それのピックアップを記事書くようにする また、以前から思って…

検討 便利家電リスト

食器 洗濯 乾燥 機 https://panasonic.jp/dish/p-db/NP-TCM4.html パナの分岐水栓 必要な食洗機 感想機能付き。 3万? 衣服 洗濯 感想 機 https://www.irisohyama.co.jp/washing-machine/hdk832a/ アイリスのドラム式 洗濯乾燥機 99k 節水で洗える 乾燥が完…

オススメ服リスト

着心地が良く便利な装備のメモ UNIQLO エアリズム コットンシャツ L 長袖の白Tシャツ。 スーツの中に切るのに重宝する。 M でもいけるが、L の方が脱ぎ気が楽 UNIQLO Women's ジーンズ ウェスト 71cm これが一番フィットする 青山スーツ ブランド名 3万

一人暮らし 最初に揃えたものリスト

優先して買うもの 電動昇降机 74k ベッド 17k 冷蔵庫 24k オフィスチェア x 2 なんらかしらの棚 1. 仕事デスク 1-1. Flexispot E7 -- メインの 電動昇降机 74k flexispot.jp FLEXISPOT E7B Standing Desk, Electric Elevation Desk https://www.amazon.co.jp…

MySQL start しない PID ファイルがないエラーを socket ファイルが入っている /tmp の所有者とグループを _mysql に変えることで解決した

マシン 2020 M1 Mac 状況 brew install mysql ==> Installing mysql ==> Pouring mysql--8.0.26.arm64_big_sur.bottle.1.tar.gz ==> /opt/homebrew/Cellar/mysql/8.0.26/bin/mysqld --initialize-insecure --user=ka ==> Caveats We've installed your MySQL…

tmux 便利なコマンド

基本的に ctrl b + c で 仮想タブ ( window ) の作成 ctrl b + % で 左右に分割 して新しいペインを作成 ctrl b + " で 上下に分割 して新しいペインを作成 ctrl b + n/p で 仮想タブの左右移動 ctrl b + o で ペインの移動 これらで操作する prefix d / tmu…

Vue Editor を作る

要件 Vuetify を使用 3 つの components からなるようにする www.justinmind.com これを参考に作る アプリの作成 vue create editors Vue CLI v4.5.13 ✨ Creating project in /Users/kaede0902/code/editors. Initializing git repository... ⚙️ Installing…

React Router を試す

CRA reactrouter.com npx create-react-app react-router Success! Created react-router at /Users/kaede0902/code/react-router Inside that directory, you can run several commands: yarn start Starts the development server. create-react-app で作…

Django を環境構築して View にルーティングする

docs.djangoproject.com 環境構築 python@3.8 が入っていることが前提。 pip@19 から @21 に更新 pip は 使う python を切り替えたりできるバージョン管理ツール node とは違ってサーバーを動かす機能はない。 最初に入っている@19は Django の要件に満たな…

M1 Mac 環境構築 -- 開発環境、プログラミング言語編

dev.to に移行しました

Redux -- Modern React with Redux の Udemy Course 221~230 をやってみた

what is Redux Vuex の React 版? Vuex と同じで、グローバルな状態変数管理のライブラリのハズ。 redux.js.org 公式サイトによれば、Actions, Reducers, Store, Dispatch, Selectors, がある Reference redux.js.org 公式サイト Modern React with Redux |…

M1 Mac 環境構築 -- デスクトップ編

立ち上げからデスクトップに行くまでの設定 指示通りに進める。Apple ID などのログイン。 Wifi で transfer settings は遅すぎるのでしない。設定ファイルのみの transfer でも 40min たっても数ミリしか進まなかった。手動でやる。 Setting App カーソル移…

JS object への property の新規追加 とアクセスの仕方 -- obj.name, obj['name']

Problem JS の obj のプロパティにアクセスするには obj.propName obj['propName'] この2つのやり方がある 前者はお馴染みの内部のプロパティへのアクセスの仕方。 後者は連想配列としてのアクセスになる。 const array = [ 'hoge', 'foo', 'bar',] const pe…

Nuxt Axios Firebase Realtime DB の Vuetify v-simple table での一覧表示

前回の記事 kei-s-lifehack.hatenablog.com Firebase と Nuxt Axios で input から id と data を取り込んだ 追加と上書きを試した 最終的にやりたいこと モーダルカードのエディタを作りたい 今回やること リンク付きのデータの一覧画面と、そこから詳細の…

Nuxt Axios Firebase Realtime DB の値を一覧表示して input から追加して、追加後の一覧表示を出す

why 手軽で無料な Firebase を使ってなんかの管理システムを動くように作って それで私が作れる機能を全て盛り込んだ 入力システムを見せられる形で作りたい 参考 Nuxt.js Vue.js 超入門 Chapter 6, 396ページ what to do kei-s-lifehack.hatenablog.com 前…

Firebase Real Time Database を作成してブラウザで json を表示したり、axios で取ってきたりする

why Nuxt で使う準備。 コンソールで作成 Firebase Cloud Console から Create Database でデータベースを作成する 全公開設定の test で作成する。 person を作って中身を入れる person の中に senkyo, takeshi, の年齢と電話番号のデータを作成する ブラウ…

Nuxt Axios で ~/static/ のファイルと json place holder のサンプルデータを get する

参考 Vue.js Nuxt.js 超入門 Chapter-6 外部サービスを利用しよう why 書籍にあったから使えるように理解しておく axios を入れる shimablogs.com axios とは、http 通信を非同期で行えるライブラリ 400 や 500 のエラーを reject してくれるらしい。 npm i …

Vue Vuetify v-dialog モーダルが開いているか閉じているかの状態を取る

前提 Vue のプロジェクトなら vuetify を使って css を書かずにモーダルを作ることができる。 しかし、このコンポーネントには isOpen のような状態が見れる変数はない。 なので、開いているかどうかで処理を変えたい、例えば開いている時はリロードで警告処…

Vue モーダルエディタの入力途中離脱対策をする

参考 qiita.com created に addEventListener と Vue 特有の beforeRouteLeave がある Window Add Event Listener の before unload に confirm を登録する とりあえず moutned で確認を仕込む この記事を見ると、window.addEventListener で beforeunload …