はじめに

Chrome 拡張機能で CSV ファイルを生成してダウンロードする方法について整理した。

TL;DR

ほぼ JavaScriptでファイルダウンロード処理を実現する - Qiita の通り

  • new Blob でオブジェクトを生成
  • createObjectURL で URL に変換
  • <a href="..." download="hoge.csv"> でダウンロード
続きを読む

はじめに

Vue CLI + Vue Router で作成したプロジェクトを GitHub Pages で公開する方法についてまとめた。

TL;DR

  • vue create 時点で Vue Router を使う設定にしておくと楽
  • vue.config.js でビルドファイルの出力先などを設定
  • ビルド&プッシュしてリポジトリの設定を変更すれば OK
続きを読む

はじめに

Twitterデータの tweet.js を読み込んで全ツイート履歴を表示するツール「tweet.js loader」の紹介 で作った tweet.js loader の技術面について整理した。

TL;DR

  • 主に埋め込み用ツイートの表示で苦労した話をまとめた
  • Vue + GitHub Pages の設定例についても少しまとめた
続きを読む

はじめに

OSS の CSS Framework Bulma を使って、メルカリ風のレスポンシブなデザインを構築する方法について整理した。

「メルカリ風のレスポンシブなデザイン」というのは、

  • デスクトップなどでは「サイドバー」+「コンテンツ」
  • モバイルでは「サイドバー」が非表示になり、クリック(タップ)で表示される

というような構成を意味している。

TL;DR

  • モバイル表示時には隠したい部分に is-hidden-mobile クラスを付与する
  • モバイル表示時に隠した要素を表示するためのボタンなどに is-hidden-tablet クラスを付与する
  • 上記ボタンをクリックした時に is-hidden-mobile をトグル(On/Off)する
  • 全体のデザインは columns + column + is-<n>-<device> で調整する
続きを読む

はじめに

Node.js でミリ秒よりも高精度のタイマーやタイムスタンプを利用する方法について整理した。

TL;DR

  • マイクロ秒オーダーでの Unix Timestamp を使いたい場合は microtime (node-microtime) を使う
  • Performance Timing APIperformance.now()perfomance.timeOrigin を組み合わせてもマイクロ秒オーダーで Unix Timestamp が取得できる
  • process.hrtime() でナノ秒オーダで計測が可能
続きを読む

はじめに

Vue.js プロジェクトで vue-svg-loader を使って SVG ファイルを描画する方法について整理した。

TL;DR

  • npm i -D vue-svg-loadervue-svg-loader をインストール
  • vue.config.js に設定を追加
  • xxxx.vueimport して components に登録して <YourSvgIcon /> で描画
続きを読む

はじめに

GitHub で公開されているソースコードをベースにして、プライベートリポジトリで何かを作りたい時にクローンする方法を調べた。

※書いた後に「clone して、remote set-url で変更するだけで良いのでは?」と思ったが検証してない。

TL;DR

  • Create a New Repository でプライベートリポジトリを作る
  • git clone --bare <src repo> でクローン
  • git push --mirror <dest repo> でプライベートリポジトリにプッシュ
続きを読む

r17n


Softwear Engineer


Fukuoka