Material UIを使ってカッコいいUIのReactアプリケーションを作ってみたEnglish
Material UI使ってみた - Qiita
Material UIとは Material UI GoogleのマテリアルデザインをReactベースで使えちゃう今時なCSSライブラリ おっ、これかっちょいいと思って少し触ってみました。 日本語の解説記事とかが見当たらなかったので簡単に紹介します。 Get started この辺で解説されているので、公式のドキュメントとともに参考にする感じで。 Componentの使い方とか 大別して3種類のAPIがあります。 Props Events Methods 名前の通りそれぞれ、 reactコンポーネントのrenderで要素を生成する際に利用できるprop 要素で発生するhtmlイベント（onChange,onClickなど） 要素で使える関数 になります。 使い方を見ていきます。 Props これはそのまんま。 render() { return ( <DatePicker hintText
GitHubで署名されたコミットにバッジが表示されるようになったので設定してみる - Qiita
まずはこちらの画像をご覧ください。 GitHubのコミット履歴ですが、コミットのSHAの左に見慣れないものが表示されていますね。 クリックするとこのような情報が表示されます。 実は、2016/4/6からGitHubはGPGによりデジタル署名されたコミットやタグにバッジを表示するようになりました。 この記事はその設定ガイドです。私の環境はWindowsですが、すべてコマンドラインとブラウザ上での操作なのでMacやLinuxでも同じように行えます。 1. GPGのインストール Git for Windowsを使っている場合は、GPGが同梱されているため追加のインストールは不要です。 それ以外の方はパッケージマネージャを使ってインストールするか、こちらからツールをダウンロードします。トップにはソースコードのリンクが掲載されており、バイナリのダウンロードリンクは下のほうにあります。 画面の指示に従
リンクもまるごとキャプチャしてSVGで出力するChromeスクリーンショット拡張をつくりました - #daiizメモ
閲覧しているウェブサイトの選択された範囲のスクリーンショットを撮ってSVG形式でダウンロードできるChrome拡張機能をつくりました．SVGで出力しているため，普通のPNGやJPGと比べると，以下のような少しだけ高度なことができます． スクリーンショットを撮ったページのURLを<svg>のdata属性として保持できる スクリーンショットの範囲内のリンクをそのまま残すことができる． ページ中の<a>の位置に，外部ページヘのリンクを持つ<rect>を挿入しています．クリックするとリンク先のページが開きます． ブラウザで通常リンクと同じように扱われるため，rectをホバーするとChromeの左下にジャンプしようとしているURLが表示されるので，移動先もしっかり確認できます． まだかなり荒いベータ版ですが，GitHubで公開しています．クローンして，そのままChromeの拡張機能管理ページから読み
Docker for Mac プライベートベータを早速使ってみた！ - paiza times
こんにちは、吉岡(@yoshiokatsuneo)です。 DockerはLinux上の軽量コンテナ環境として、飛ぶ鳥を落とす勢いで成長しており、paizaでもジャッジシステムで利用しています。 そのDockerのMac OS X、Windows用クライアントの新製品が、"Docker for Mac"、"Docker for Windows" として先日3月24日に案内されています。 blog.docker.com 従来、Mac OS X, Windows向けクライアントとしては、Docker Toolboxが提供されてきました。 しかしながら、Docker Toolboxは、ある程度Dockerについての知識がないと使いづらい部分がありました。 Docker ToolboxはVirtual Box環境が必要であり、Docker Machineで環境設定を 行わないと利用できませんでしたし
2015年が終わるのでフロントエンド開発に使ってるツールまわりをざっと書き出してみた - ミルク色の記録
題名の通り、ざっと書き出し。 このあたりのことを相談された時に、手元のリポジトリを漁って「こんな感じでやってます」とやってたけど、 とりあえずこのURL渡して参考にしてもらうみたいなことができれば... ご注意 Xubuntu 14.04でやってるのでWindowsやOSXは未確認。 こじんまりした規模の開発で使っている構成なので、規模によっては向いていないかも。 サーバとはJSONとかのAPIでお話するだけの、SPAなフロントエンド用（ルーティングはハッシュチェンジ系向け）。 おしながき 共通用 nodeの管理 JavaScriptのLint プロジェクト用 プロジェクトディレクトリの下準備 タスクランナー HTMLと開発用Webサーバ CSSや画像ファイルなどのスタイルまわり JavaScriptまわり（モジュールバンドラ） プロダクション用のビルド テスト環境 APIサーバとつなぎな
React で使う HTTP クライアント候補として SuperAgent を試してみた - present
React と Redux には HTTP クライアントは含まれていない。 別途ライブラリを使う必要がある。 Web API を呼び出すためだけに jQuery を使うのはバカげているから、 専用のライブラリがいいね。 Browserify でビルドするから、npm にあるライブラリを使えるな。 ってことで、有名どころの SuperAgent を試してみる。 github.com とはいえ、SuperAgent を試そうにも肝心の API サーバーが無いと話にならない。 まずは express をインストール。 npm install --save express 単純な API サーバーをこしらえてみた。 // server.js var express = require("express"); // POST したデータをパースするために body-parser が別途必要 var
Sinon.JSのFakeServerでAjaxをテストする - Qiita
今更感漂うのだけど…… FakeServerを使ってAjax関連のテストを書く機会があまりないので、書いておかないと忘れてしまうのでメモを。 // jQuery + Mocha + expect.js + Sinon.JS suite('API', function() { var server; beforeEach(function() { // 疑似サーバの生成 server = sinon.fakeServer.create(); }); afterEach(function() { // スタブのXHRとかを戻す server.restore(); server = null; }); it('データが返ってくること', function(done) { var res = 200, head = {'Content-Type': 'application/json'}, bod
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Linuxサーバー容量を確認するコマンドdf,duをマスターする！
Cannot mock relative URLs in v3.0.4 · Issue #46 · wheresrhys/fetch-mock