カテゴリー:JavaScript

【JavaScript】Docker上でのnpm/yarnの操作を10倍早くする方法

Dockerでnpm install とか yarn install をすると何か遅いなあと感じたことはないでしょうか? 私はDocker環境上でしかnpmやyarnを使っていなかったので中々気が付かなかったのですが、 先日友人のエンジニアにお前のdocker-comoseいけてないから変えたほうがいいよ、と教えてもらいました。 誇張抜きに10分かかっていた初期のモジュールのインストールが1分未満 […]

【JavaScript】クロスオリジン(CORS)通信チェックポイントまとめ

そもそもクロスオリジン(CORS)通信って? SPA(SinglePageApplication)を中心として、JavaScriptを用いた非同期での情報取得が盛んに行われています。 そんな中で問題になってくるのが、クロスドメイン(CORS)通信というもの。 オリジン間リソース共有Cross-Origin Resource Sharing (CORS) は、追加の HTTP ヘッダーを使用して、あ […]

【JavaScript・Vue.js】v-for=”num in 10″のnumは1から始まる。

基本的なことかつ、ドキュメントにも書いてありますがやや癖があるので知っておいたほうがいいという話。 環境 Vue2系(1系以前もおそらく同じ) 内容 vue.jsのv-forディレクティブは、配列だけでなく整数値もinの後に取ることができます。 https://jp.vuejs.org/v2/guide/list.html#%E7%AF%84%E5%9B%B2%E4%BB%98%E3%81%8D- […]

【JavaScript】元ファイルorサーバーサイドで定義したファイル名を取得する

環境 ・ES2015(ES6)・Babelでコンパイルして動作させています。 ・Axiosでファイルを取得 やりたいこと サーバーサイド側でcsv等を出力した際にファイル名を設定されている場合は、そのファイル名を取得したい。 フロントエンドでゴニョゴニョも出来るけど、まあ望ましくないのできちんと取得するのです。 ファイル名を取得する関数 ファイル名はcontent-dispositionに格納され […]

【JavaScript】汎用的な空値判定クラスを定義する(isEmpty,isNotEmpty)

JavaScriptの判定は融通が効かないという話 JavaScriptで処理を記述する場合、配列や文字列の空チェックを行いたい場面が多々出てきます。 しかし、素直にif (var) というようにすると、期待しているような結果が得られない事があります。 [crayon-64839ea3a8a57065061237/] 言語の仕様からどうしても厳密に入ってくる型を指定できない関係上、凡ミスを防ぐため […]

【JavaScript】Array.mapでArray<object>を作りたい

前提 ・ES2015(アロー関数を使用) ※アロー関数については、この記事が分かりやすい。 やりたいこと ・単純な配列や、オブジェクトの配列などから、新たなオブジェクトの配列を作りたい。 ・(他の部分はアロー演算子に統一されているなどで)ES2015で導入されたアロー関数を使ってモダンな書き方をしたい。 問題 通常のArray.map()は以下のように使う(リファレンスより) [crayon-64 […]

【JavaScript】Axiosを使ってCSVをダウンロードしたい

Vue.jsでボタンを押したらダウンロードってのをいい感じにやりたかった とあるボタンをクリックしたら、別のURLからファイルをしてくるようにしたい。 やりたかったのは、リンククリック→データを集計してCSVを作成→ダウンロードと言う流れ。 ダウンロードに失敗したときなど、もとのページでエラー通知などを出したいので、直接DL用のURLに飛ばすことはしたくない。 こんな事情があったのですが、なかなか […]

  • 2019.01.12

【Vue.js】Production Build でも「Vue.js devtools」を使う方法

環境 Vue.js 2.5 やりたかったこと 公式でもおすすめされている、開発用ツールを導入したかった。 https://qiita.com/hashimoto-1202/items/c81f5d4c271eef16d957 基本的には開発用のツールなので、本番用のビルドをした時は使えなくなるツールです。 しかし、Vue.js+バックエンドのフレームワークを使用していると、ビルドされたcss、js […]