WebUSB API

Chrome now supports the WebUSB API, allowing web apps to communicate with peripherals given a user’s consent. This enables all the functionality provided by these devices, while still preserving the security guarantees of the web. https://…

SystemJS

SystemJS があれば動的にモジュールを呼び出せる。 var SystemJS = require('systemjs'); // loads './app.js' from the current directory SystemJS.import('./app.js').then(function (m) { console.log(m); }); すごい。

selectionStart でキャレットの位置を取得する

selectionStartを使う。 selectionStart - Mozilla | MDN イベントと組み合わせて使う。 イベント DOM API 結果 keydown selectionStart 直前の位置を取得 keyup selectionStart 直前の位置を取得 jQuery だとこう。 $('input.selector').on('keyup', functi…

改行によるスペースを非表示にする方法

親要素にfont-size: 0; を指定する方法がいちばんスマート。 Android2.3 のようなゴミでありながら化石と化した端末はスルー。 でもいちいちCSSでfont-size 指定するのもあれだからコンセンサスが取れていれば他のやり方でもいい。 詳細 改行しない ソースが…

ブラウザシェアのデータが欲しいとき

statcounter

枠線なしのinput text を埋め込んでタグ登録のUIを改善する

BacklogのAPIを使って自分が抱えているアクティブなチケットを取得したい

やりたいこと BacklogのAPIを使って自分が抱えているアクティブなチケットを取得したい。 検討 理想は、チケットのお知らせユーザー一覧のAPIが提供されていればいいのだが見つけられなかった。 そのため、既存のAPIを使って自分が抱えているアクティブなチ…

Nodeのツリー構造としてのドキュメント

Node └ Document └ Element └ Text

疑問

エネルギー量の多いところほど生物は繁栄する 北極圏と熱帯雨林を見ればその差は明らかだ。 では、なぜ溶岩の中には生物はいないのか。 そこには莫大なエネルギーであふれているのにもかかわらず。

nodistを使ってNodejsをインストールしている場合gulp watch を叩くとエラーになる

現象 Windows 環境でnodistを使ってNodejsをインストールしている場合、 コマンドで gulp watch を叩くと以下のエラーが出力される。 $ gulp watch Sorry, there's a problem with nodist. Couldn't resolve version spec %s: %s nodev7.8.0 Unexpected char…

prototypeと__proto__

prototype prototype プロパティは、Function() のインスタンスを生成する際にJavascript が自動的に付与するオブジェクトです。 役割 インスタンス固有のオブジェクト proto proto プロパティは、オブジェクトインスタンスとそのコンストラクタ関数をつなぐ…

ユーザー

ゴール目的:何ができるのか 動機:どんなときに訪れるのか 行動:何をするのか

devDependenciesのパッケージをインストール

npm install パッケージ名 --dev devDependencies に追記したものは開発時にのみ使うパッケージを指定するのに使う。そのパッケージの利用者にとっては不要で、開発者のみが使うため、利用者が npm install パッケージ名 するときはこの依存パッケージはイン…

LINE Bot

それぞれ部門があって評価基準は以下の通り。 ライフスタイル部門 普及、浸透する可能性が高いものを表彰します。 ゲーム部門 botとの対話をUXの軸にしたゲームを表彰します。 グループトーク部門 人格を判断しながら文脈に沿った発言をするのは難易度高め …

php の連想配列操作

array('sp' => '')); $bbbb = array('1000_A' => array('pc' => '')); var_dump(array_merge($aaaa, $bbbb)); // array(1) { // ["1000_A"]=> // array(1) { // ["pc"]=> // string(0) "" // } // } var_dump($aaaa + $bbbb); // array(1) { // ["1000_A"]=…

常に人ではなく「構造」に原因を求める

なにか会社や組織で問題が起こったときに、たとえそれが人に起因する問題でも「これはあの人ができないからダメですね」と言ってそこで議論を終わらせてしまうのではなく、常に人ではなく「構造」に原因を求めるように思考を働かせて、その構造的問題を見抜…

JavaScript で空のオブジェクトの判定方法

Object.keys(object).length

フロントエンドエンジニア区分

フロントエンドの開発者には HTML, CSS に特化している人 (coder, markup engineer) JavaScript は得意だけど CSS はちょっと弱い人 (javascripter) HTML, CSS, JavaScript 全てを統べる者 (frontend engineer) といった様々なタイプのエンジニアがいます. …

デザインパターン

Adapter インターフェイスを揃えるためのWrapper 。

Today I learned

Webpack というのはjsの依存関係をチェックしてくれる便利なツールだ。 かつてはBrowserifyも人気だったが最近ではWebpack が圧倒的に人気だ。 Webpack, Browserify - Google トレンド

Javascriptファイルをモジュール化するには(CommonJS使わない)

ある程度スクリプトの規模が大きくなってきた場合、よく使う機能を集約して、モジュールとして切り離すことがある。 jsファイルを作りHTMLを介して複数読込することで実現する方法をここに記述する。 以下のようなファイル構成だとして // Root直下にhtmlとj…

名前空間使ってモジュールをObjectにまとめるグローバルの変数の濫用を避ける"古の"ベストプラクティス

ここではLoggerを実装してみる。 window.Logger = window.Logger || {}; window.Logger = { LEVEL: { RUN : 0, ERROR : 1, WARN : 2, LOG : 3, INFO : 4, DEBUG : 5, FULL : 5, }, level: null, init: function(level) { console.log(this.LEVEL.FULL) this.…

Tilt 3D

起動 CTRL + SHIFT + L 余談 CTRL + SHIFT + M でレスポンシブモードに切り替わる

Classぽく書く

// Classぽく書く function Foo(hoge) { this.hoge = hoge; } Foo.prototype = { method_a: function() { console.log(this.hoge); }, method_b: function() { } } var gege = new Foo("hoge"); gege.method_a();

ChromeでYoutube再生時のショートカット

ChromeでYoutube再生時のショートカット [K]で一時停止&再開 [J]で10秒戻す、[L]で10秒送る (一時停止時に)[,]で1コマ戻す、[.]で1コマ送る [F]で全画面表示、もう一度押すと解除 [M]でミュート、もう一度押すと解除

Pokemon go 有用情報

ポケモンの巣 ・東京都の主要なポケモンの巣(常時2匹以上同じポケモンが居座っている特定地域) ピカチュウの森→新宿御苑 戸山公園 ミニリュウの巣→世田谷公園 ブーバーの巣→上野動物園 東村山中央公園 ストライクの巣→駒沢オリンピック公園 イーブイとフシ…

地価は上がれども物販店は増えず 福岡・西新

西新の商店街は、空き店舗が目立つわけではない。かつて生鮮品や食品、生活雑貨などを扱う個人商店が多かったが、いまはチェーン中心の飲食店が目立つ「夜の街」になった。地下や家賃の上昇で、物販よりも飲食店に貸したほうが利益が出るようになったからだ…

キャッチボールが初めて怖いと思った

先輩の川崎宗則選手の紹介で一緒に自主トレをする機会があったんですが、キャッチボールが初めて怖いと思いました。そんなに会話もなく淡々と。最後にノックを打ってもらって、終わった後に大の字に倒れました。口の中、血の味がしました。 プロ野球選手にキ…

先頭に`javascript:`を追加するnpmモジュールをつくりたい

gulp から.js を minify するタスクを走らせているのだが、先頭のjavascript:が削除されてしまう。 おそらくは構文的に正しくないためじゃないかと思われる。 そのためnpmモジュールを作成してこんな風にタスクに追加したい。 gulp.task('uglify', function(…

入れ子の関数とクロージャ

入れ子の関数がどういう意味を持つのか 関数 - JavaScript | MDN の入れ子の関数とクロージャで理解できた。

なんでbabelみたいなトランスパイラを使うのか

なんでbabelみたいなトランスパイラを使うのかイマイチよくわかっていなかったがこいつを見てようやく理解できた。 Node.js ES2015/ES6 support Node.js がまだES6に対応できていない/--harmony optionをつけて実行しなければいけないためES6→ES5に変換するb…

メダカ、ビオトープブログ

メダカ池 大きさコンクリ製の1メートル四方 深さ80cm 流水環境 ドジョウ、タナゴなども共生 メダカの卵をミナミヌマエビといっしょに入れてカビが付くのを防ぐ

野草

カンアオイ ワタスゲ チャルメルソウ トキソウ

Node.js のWindows環境構築

Node.js のWindows環境構築 インストールする順番 nodist Node.jsのサイトTOPに表示されているLTSを入れる Node.js インストールするものの説明 nodist バージョン管理 Node.js 本体 nodistがインストールしてくれる 参考 nodistでNode.jsをバージョン管理 -…

Redux メモ

Redux Reactの課題である、ステートの管理を実現する Storeのステートツリー Redux data flow Action Creators -> Actions -> Middleware -> Reducer -> Store -> Views - ↑ ↓ ------------------------------------------------------------------- AC A M …

VS Code にextension を追加する

Cmd+p(Windowsなら F1) キーを叩く text 入力エリアに "ext install xxx" とタイプする(xxxはextensionの名前) VS Codeを再起動する

sshトンネルとかProxy Serverとか

ネットワークについて qiita.com Proxy Server のアクセス遮断回避 通信の傍受からの防御 前者は半分ネタ、後者については実用性ある。 Proxy Server がポート番号を80, 443 番しか開放していないならssh のポート番号を443に設定したサーバーを自分で用意す…

次世代 Web カンファレンスのメモ

次世代 Web カンファレンス についてのメモ。 メモ書き&知見に乏しいため発言の内容が正しくない可能性あります。 11:10-12:30(80) js_next JSはなんで書いてる? @vvakame TypeScript → ES5でかく ES6ターゲットではない @constellation C++書いてるw @t_…

packer についての内容

https://github.com/boxcutter/centos # ディレクトリ移動 cd ~/dev/me/packer/boxcutter_centos66 # 設定ファイルがgithub にあるのでclone する git clone git@github.com:boxcutter/centos.git cd centos http/ks7.cfg も以下の設定に変更する lang ja_JP…

「gulp なしの Web フロントエンド開発」の感想や疑問点

gulp なしの Web フロントエンド開発 の感想や疑問点などを書く。 疑問点 その1 package.json と npm だけでgulpと同じことをやる。 →gulpは具体的になにをやっているのか。 package.json と npm だけで○○を行うみたいに言えるようになりたい。 その2 そもそ…

3人の懐疑論者

ブラックスワンの第4章で登場する3人の懐疑論者たち ヒューム ヒューム 人間本性論〈第1巻〉知性について作者: デイヴィッドヒューム,David Hume,木曾好能出版社/メーカー: 法政大学出版局発売日: 2011/05メディア: 単行本 クリック: 1回この商品を含むブロ…

やる気(覇気)をなくす要因

禅とオートバイ修理技術から 禅とオートバイ修理技術〈上〉 (ハヤカワ文庫NF)作者: ロバート・M.パーシグ,Robert M. Pirsig,五十嵐美克出版社/メーカー: 早川書房発売日: 2008/02メディア: 文庫購入: 11人 クリック: 51回この商品を含むブログ (44件) を見る…

rbenv について

rbenv でバージョン管理すると Ruby のバージョンをrbenv global [version] 切り替えられるようになる。 rbenv └ system └ 2.2.0 └ 2.2.2 ... gem が各バージョンのRubyにそれぞれ個別にインストールされる。 rbenv └ system └ gem list #1 └ 2.2.0 └ gem li…

他の言語の知ってる場合のJSの学習方法の最短コース

他の言語の知ってる場合のJSの学習方法の最短コース、JS:GoodPartsのBadPartsの章読んだ上でbabelとmochaでnodeの組み込み型のテストを何個か書いてみてそうやって作ったモジュールをbrowserifyでビルドしてブラウザで動くのを確認するのがいいと思う— イカi…

機械学習について

数学を避けてきた社会人プログラマが機械学習の勉強を始める際の最短経路 - Qiitaqiita.com プログラマの皆さんにおいては、ゲームとかソフトウェアとかマニュアル見なくてもなんとかなることが多くて、とりあえず動かしてそれから考えよう的な思考回路が形…

Amazon VIrtula Private Cloud(VPC)

Amazon VIrtula Private Cloud(VPC) Amazon VPC (仮想プライベートクラウド Amazon Virtual Private Cloud)| アマゾン ウェブ サービス(AWS 日本語)aws.amazon.com 概要 AWS のネットワーク内に論理的に分離した仮想ネットワークを作成できるサービス。 …

良い黒い白鳥と悪い黒い白鳥

世の中には予想外がいい結果をもたらすものと逆に悪い結果をもたらすものがある。 前者は、映画とか、発明の特許とかそういうものだ。 後者は、プロジェクトの進捗とか銀行の融資とかそういうものだ。 これをそれぞれ「良い黒い白鳥」、「悪い黒い白鳥」と呼…