JavaScript
いきさつ localStrageを使う機会があった。 今までは普通にlocalStrageを使っていたが、 npmにlocalStrageのwrapperがあるのを職場の人が見つけてくれた。 github.com 気になったので少し調べてみた。 概要 ブラウザやそのバージョンによってlocalStrageの扱…
** あとで少し追記する babelのinstall yarn init -y yarn add @babel/cli --dev yarn add @babel/core --dev コンパイルするソース class Hoge { constructor() { } } const hoge = new Hoge(); コンパイル 何も入れず、そのままコンパイルしてみる yarn ru…
要約 僕が間違ってました。すみませんでした。 いきさつ 「Mapを使ったアプリケーションで、Mapの上にMarkerを立てたい」 という要件を満たすために、leafletというOSSを使うことにした。 リポジトリ github.com 公式サイト leafletjs.com インターフェース…
タイトルについて すみません、煽りました。 いきさつ オブジェクト指向で設計した時と、 オブジェクト指向を使わなかった時について、 「単純にコード量だけで」比較してみます。 その上で、オブジェクト指向の利点について再度考えてみます。 つくるもの 1…
いきさつ APIのmockがほしかった。 今までexpressとかで実際にAPIをつくっていたのだが、 ちょっとめんどくさくなってきた。 何かいい方法がないかな〜と思ってたら「json-server」という良さげなものがあったので試してみた。 github.com install npm insta…
いきさつ ソースコードを読んでいたら、 var arr = [1, 2, 3] var arr2 = [4, 5, 6] arr.push(...arr2) とつぜん処理の中で沈黙(...)し始めた。 気持ち悪かったので調べてみた。 ドキュメントを見てみる スプレッド構文を使うと、関数呼び出しでは 0 個以…
いきさつ ログイン前はログインコンポーネントだけ、 ログイン後はアプリケーションに必要なコンポーネントを読み込みたい。 目的は、 ログイン前に読み込むJavaScriptソースコードの軽量化と、 それによるセキュリティリスクの減少。 やりかた はじめ、こん…
いきさつ 職場でVueを使うので勉強する必要がある。 とりあえず vue-cliを使っても良いが、 きちんと理解したいので生で書くことにした。 ルートコンポーネント <html> <head> <meta charset="utf-8"> <title>Vue TEST</title> </head> <body> <div id="app"> <my-component></my-component> </div> <script src="./vue.js"></script> </body></html>
いきさつ Bootstrap、すごい便利。 htmlタグさえドキュメントどおりにおけば*1、 カルーセルは動くわモーダルは開くわアラートは出るわ、、、 いつも本当にお世話になっております。 ただ、、、ただね、 「なんで動くのか」について全然考えたことがなかった…
いきさつ canvasを使って画像のリサイズをしたり、 画像のくり抜きがしたかったので、まずはcanvasで画像を表示できるようにした。 手順 1. input type='file'で画像を登録できるようにする <input type="file" id='file'> 2. fileを登録した時にイベントが発火するようにする /** input要…
ある日の地下アイドル 地ア「は〜あ。今日もライブは3人しかこなかったなぁ」 地ア「きょう来てくれたのは、たっくんと、しのぶんと、ゆっきーか」 地ア「この3人、いつも来てくれるんだよねぇ。大事にしなくちゃ」 地ア「私、ぜったいに売れっ子アイドル…
こういうのがやりたかった 手順 簡単に言うと、 DragEventからDataTransferを取得 DataTransferからFileを取得 FileをFileReaderで読み込み、サムネイルとして表示 という手順になります。 1. dropエリアの準備 1-1. まずはdropエリアを作成する imgは後でサ…