Post

javascript

2017-12-25 23:19:03

モダンなJSの話──アロー関数

※この記事はInnovator Japan Engineers’ Blogで掲載されている記事を転載したものです。 アロー関数ってなに?ざっとまとめると、 ES2015から追加された新しい構文 通常のfunction式よりも短くかける thisの値を語彙的に束縛することができる(=文脈からthisの値を把握しやすい) 常に匿名関数 アロー(=>)を使ってかく関数式で、"thisの値を語彙的に束縛することができる"という点が大きなポイントです。 アロー関数を使うと、今までこう書いていたものが・・・ const foo = function() { console...

プログラミング

es5 es6 javascript

2016-10-03 21:06:21

Laravel+React+ES6+Browserify

ちょっと前の記事で、bowerでReactの環境をセットアップするという話をしたのですが、npmでReactのパッケージ管理をしたほうがスマートだし、ES6かけるようになっといた方がこの先お得よねということで環境を再構築しました。 ES5からES6で書き方が色々変わるのでその辺の改修がちょっと面倒でしたが、さほど難しいことはないので気負いしなくとも良さそうです。 環境 Laravel5.2・・・5.1とか5.2ユーザーはelixirのバージョンを最新(5.3のそれと同じ)に上げとくといいかもです。 Browerify(Elixirについてるやつ) React ES6 Reactをnpmで用意...

プログラミング

react javascript npm webpack es6 browerify es5

2016-10-03 21:01:26

Google ExtenstionのPluginをつくってみた

英語版のGoogleで検索したい時には、ブックマークを利用してアクセスしていたのですが、プラグインで便利にできないかなーと思い、作ってみました。 デフォルトのブックマークが非表示で、Bookolio(ブクマを見やすくするやつ)とかいうプラグインを使っているニッチな人だと多少便利なプラグインかもしれません←自分 環境 Google Chrome Javascript 仕様プラグインの種類は色々ありますが、今回つくるのはこれです↓ 【プラグインの画像】 プラグインのアイコンを押すと、Googleの英語版を新規タブで開いてくれるだけの超単純な機能です。 超単純なだけに伸びしろのある仕様ですね()...

プログラミング

javascript google chrome extension

2016-11-04 21:05:27

ES6のExportとImportについて

ES6のexportとimportについて把握しきれていないところがあったので調べてみました。 exportの使い方 export 文は、指定したファイル (またはモジュール) から関数、オブジェクト、プリミティブをエクスポートするために使用 引用元:MDN - Export ここでいうエクスポートとは、何かを定義するという意味合いに近いかと思います。 エクスポートには2種類の方法があります。 名前付きエクスポートexport { hogeFunction };  // 宣言済みの関数をエクスポート export const hoge = 1; // 定数をエクスポート letやvarも可。...

プログラミング

javascript es6

2017-05-06 20:58:17

dotEnvの環境変数をクライアントサイドでも使えるようにする - dotenv-webpack

dotenv-webpackは.envファイルに用意された環境変数をクライアントサイドでも利用したい時に便利なライブラリです。 導入npm install dotenv-webpack --save-dev webpack.config.jsにpluginとして設定します。 const Dotenv = require('dotenv-webpack'); module.exports = [ ~~~ゴニョゴニョゴニョ~~~ { plugins: [new Dotenv({ path: 'path/to/.env',...

プログラミング

javascript npm webpack