タグ

2016年1月12日のブックマーク (27件)

  • React ComponentのテストをquerySelectorでやる - Qiita

    Help us understand the problem. What is going on with this article?

    React ComponentのテストをquerySelectorでやる - Qiita
  • ActionCable と react-rails でサンプル作ってみた

    ActionCable と react-rails でサンプル作ってみた Tweet はじめに Rails5 の新機能である ActionCable を試してみて、ついでに、react-rails を使って、WebUI付きの開発用DNSサーバを作ってみました。 作ったのは、オレオレDNSという開発用DNSサーバです。 最初にそのアプリの機能や目的から説明しますが、ActionCableに興味がある方は、後半の「実装について」のところまで飛ばして読んでください。 ActionCableとreact-railsを使うことで、従来の静的なページ中心のアプリのノウハウを活用しながら、SPA的な動的なアプリに段階的に移行していくことができます。それがどんな感じになるのか確かめるのにちょうどいいサイズのアプリだと思います。 オレオレDNS とは オレオレDNS とは、複数の設定を内部に持ち、次のような

    ActionCable と react-rails でサンプル作ってみた
  • SCRIPTY#4 〜フロントエンド紳士・淑女のための勉強会〜 #scripty04

    ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog 先日、定期的に開催しているフロントエンド技術に関する勉強会、SCRIPTYをヤフーで開催しました。 http://scripty.connpass.com/event/22663/ 勉強会で発表されたセッションのスライドを発表者のコメントとともに公開いたします! 発表セッションまとめ 1.Single-page application Zero to One (React/Redux/ES6/Firebase) 発表者:山中 悠 バックエンド専門だったエンジニアが、最新のフロントエンド技術を使ってシングルページアプリケーション(SPA)を作るまでに四苦八苦した話と、実際に作ったサンプルアプリケーションを発表しました。 SPA開発

    SCRIPTY#4 〜フロントエンド紳士・淑女のための勉強会〜 #scripty04
  • Promiseはどう動作するのか – Promiseを実装してみる | POSTD

    目次 1. はじめに 2. Promiseの概念を理解する 幕間:行列が嫌いな女の子 2.1 Promiseとは何か? 幕間:実行順序 2.2 Promiseと並行処理 幕間:式の抽象化 3. Promiseのからくりを理解する 3.1. Promiseで式を順序付けする 3.2. 最小限のPromise実行 4.Promiseとエラー処理 幕間:計算失敗の場合 4.1. エラーをPromiseで処理する 4.2. Promiseの失敗の伝播 5. Promiseの結合 5.1. Promiseを確定的に結合する 5.2. Promiseを非確定的に結合する 6. Promiseの実用的な理解 6.1. ECMAScript Promiseの導入 6.2. .then の分析 7. Promiseとは相性が悪いケースとは? 8. まとめ 参考文献 追加資料 資料とライブラリ 1. はじめに

    Promiseはどう動作するのか – Promiseを実装してみる | POSTD
  • 2015年 / 2016年、UXの現状と展望 | POSTD

    uxdesign.ccのチームは2015年、様々なことを目にしてきました。そして、48回のニュースレターを発行し、384件のリンクを紹介し、世界中のデザイナー6万1,295人に毎週 メール で配信しました。ユーザエクスペリエンスデザインの驚くべき世界でどのようなことが書かれ発表されているか、そのパターンや傾向をチームが把握するには十分なコンテンツでした。 この記事では私たちの視点から、これまでの状況を振り返り、現状を理解し、そして2016年のUXで何が起きるかを展望してみたいと思います。 1. ピクセルに熱中するのはもう終わり 2015年、ついに「UX」というバズワードをLinkedinプロフィールに追加した人もいるかもしれません。しかし作業時間の多くは、いまだ画面上のピクセル操作に費やされていたのではないでしょうか。でも、そんなPhotoshop漬けの日々はもうすぐ終わるかもしれません。

    2015年 / 2016年、UXの現状と展望 | POSTD
  • tmuxを使って同一コンソール内で複数のdocker runを行ったメモ。webpack , karma, gulp + express + socket.io , mongodb. - Qiita

    tmuxを使って同一コンソール内で複数のdocker runを行ったメモ。webpack , karma, gulp + express + socket.io , mongodb.MongoDBExpresstmuxDockerwebpack [前回][link-18]の続き。複数ウィンドウを開くのが面倒なため1つのコンソールを分割する。 (2016/2/4 追記)webpackの設定で、ファイルを更新した時はうまくいくが、新規作成したときに認識しなかったのでgulpを使用する構成に変更。 tmuxでウィンドウを分割 tmuxの設定はコピペ。 [達人に学ぶ.tmux.confの基設定][link-4] #prefix C-aに変更する set -g prefix C-a # C-bのキーバインドを解除する unbind C-b # キーストロークのディレイを減らす set -sg es

    tmuxを使って同一コンソール内で複数のdocker runを行ったメモ。webpack , karma, gulp + express + socket.io , mongodb. - Qiita
  • 【連載01】105.VirtualBox内のLinuxイメージをVagrantBoxファイルに変換する - Qiita

    当記事はケーススタディの連載となっています。目次は【こちら】です。 最新のソースコードは【GitHub】で公開中です。 前提条件 VirtualBoxでVagrantが使用可能な状態になっていること。 前記事「Vagrantを利用する為のインストールと設定(Linux側【VirtualBox内】)」を参照。 Windowsのディレクト構造は以下のようになっていると前提。 download 各種ダウンロードしたファイルを配置 vagrant_box Vagrant実行ルート vagrant_boxfiles Virtualbox仮想イメージをVagrantBoxファイルに変換した物を配置 vb 自作したVirtualbox仮想イメージやVagrantで作成したイメージを配置 ボックスの作成 実行はWindowsにて行う。※VirtualBox内で実行するのではない。 01.powershel

    【連載01】105.VirtualBox内のLinuxイメージをVagrantBoxファイルに変換する - Qiita
  • バッチファイルなどの運用スクリプトの単体テストにserverspecを使ってみた - Qiita

    はじめに スクリプトの単体テストにServerspecを使ってみました。 バージョン 記事作成で用いたOS・モジュールのバージョンはこちらです。 Windows 7 Pro SP1 32bit語版 ruby 2.2.3p173 (2015-08-18 revision 51636) [i386-mingw32] rspec (3.4.0) rspec-core (3.4.1) rspec-its (1.2.0) serverspec (2.26.0) specinfra (2.47.0) ※rubyスクリプトは全て文字コードを「UTF-8」で保存しています。 ※バッチファイルは「Shift-JIS」で保存しています。 テスト対象スクリプト 例として、次のバッチファイルに対してブラックボックステストを実施したいと思います。 @ECHO OFF set PATH_D_SCR=%~dp0

    バッチファイルなどの運用スクリプトの単体テストにserverspecを使ってみた - Qiita
  • Parallellaのスペック

    Parallella概要 Parallellaは、米国Adapteva社が提供するオープンな並列・並行コンピューティング・プラットフォームです。 16コア、または64コアの演算用アクセラレーター、制御用のデュアルコアARMプロセッサとFPGAを搭載した小型の開発ボードの形で提供されます。 Parallellaボード(Gen1.1 大きさはクレジット・カード・サイズ) プロトタイプ(Gen1) 基板上面 基板背面 基板側面 基板裏側の4つのPECコネクタを用いて拡張が可能です。図のように複数の拡張ボードを積み重ねて拡張できる仕組みになっています。 Parallellaには以下のような特長があります。 オープン・アクセス:誰でも開発ボードを購入して使用したりソフトウェアを開発することができます。開発ライセンスや機密保持契約などを締結する必要はありません。アーキテクチャや開発用の資料もWebで公

  • SoftLayerとVyOSでネットワークの基礎を勉強2-(L2TP/IPsecリモートアクセス編) - Qiita

    1. はじめに SoftLayer上のVyOSにL2TP/IPsecリモートアクセスの設定をして、Windows7 / 10クライアントから接続します。 <今回使用したVyOSは1.1.6(Heliun)です。VyOSのL2TPは「最初に接続したユーザが接続状態の時、別のユーザが接続できない」といった問題があります。(一人しか接続できない。) 過去のVyattaでも同じ問題があり、まだ解決していません。 複数ユーザでL2TP/IPsecリモートアクセスを使う場合は、OpenVPNWindows2008/2012を検討したほうが良いと思います。 ちなみに、最初のユーザ(Aさん)が接続している状態で別のユーザ(Bさん)が接続しようとすると、下記メッセージが表示されBさんは接続できませんでした。 2. L2TPについて L2TPはレイヤー2で動作するトンネリングプロトコルで、暗号化の機能はあり

    SoftLayerとVyOSでネットワークの基礎を勉強2-(L2TP/IPsecリモートアクセス編) - Qiita
  • VyOSでL2TP Over IPsecによるVPNサーバ構築 - Qiita

    $ configure # set interfaces ethernet eth0 address [IPADDRESS]/[MASK] # set system gateway-address [GATEWAY ADDRESS] # set system name-server [NAME SERVER ADDRESS] # set system time-zone Asia/Tokyo # delete system ntp server # set system ntp server ntp.jst.mfeed.ad.jp # set service ssh # commit # save # exit

    VyOSでL2TP Over IPsecによるVPNサーバ構築 - Qiita
  • VyOSでIPSec VPNの設定 - Qiita

    やりたいこと リモート拠点(たとえば自宅やクラウド)にあるサーバーにVPNで接続したいとき、ありますよね? そういうときには、オープンソースのVyOSを使って簡単にVPNサーバーの設定をしてしまいましょう こんなイメージです 今回はdesktop-to-site型のリモート接続を設定します 認証方式にはいくつかありますが、今回はL2TP/IPsecのVPNを設定します では、どんな設定があるかみていきます vpn ipsecの設定内容 ●IPSecを張りたいインターフェースを指定 後でグローバルIPを指定しますので、グローバルIPを持っているインターフェースですね

    VyOSでIPSec VPNの設定 - Qiita
  • Rundeck でローカルコマンドを実行する際に sudo パスワードを指定する - Qiita

    Rundeck には Secondary Sudo Password Authentication というのがあって、 リモートノードに SSH した後の sudo で必要になるパスワードを設定することができます。 "sudo -u otheruser /sbin/some-command" ってやつです。 ローカルコマンドを実行する際にもココに書かれている方法で sudo のパスワードが指定できるかと思ったのですが、、、 secondary ぢゃないから無理のようです。 試行錯誤の末、なんとかやり方は見つけたのでメモを残しておきます。 環境 Rundeck 2.6.1 CentOS 6.6 sudo のための準備 RPM パッケージからインストールすると、Rundeck の実行ユーザーは rundeck になります。 まずは rundeck ユーザーを sudoers へ追加し、 (この

    Rundeck でローカルコマンドを実行する際に sudo パスワードを指定する - Qiita
  • Selenium+PhantomJSで意識の低い自動化を改善したお話し - Qiita

    背景 意識の低い自動化をしたお話にて、PhantomJSを使えばブラウザ起動なしで実行できるよ、とのコメントをもらった やってみた 結果 PhantomJSを使用して、ブラウザ起動なしの自動化に改善することができた。(若干の高速化も) やったこと PhantomJSのダウンロード ここからPhantomJSのWindows用のzipをダウンロード 適当な場所に展開 既存のソースを編集 # coding: utf-8 require "selenium-webdriver" # PhantomJSのパスを環境変数に追加すれば以下は不要らしいけど、 # うまくいかなかったのでここで指定 Selenium::WebDriver::PhantomJS.path = 'C:\phantomjs_path\bin\phantomjs.exe' # selenium-webdriver にphantom

    Selenium+PhantomJSで意識の低い自動化を改善したお話し - Qiita
  • 第14回Elasticsearch勉強会を開催しました。 #elasticsearchjp

    あけましておめでとうございます、johtaniです。 第14回Elasticsearch勉強会を開催しました。 スタッフの皆さん、スピーカーの皆さん、会場提供していただいたリクルートテクノロジーズさん、ありがとうございました! 今年もよろしくお願いします!参加していただき盛り上げていただいた参加者の皆さんもありがとうございました。 チェックイン数など チェックインした人:122名 キャンセルしなかった人:58名 でした。 今回も当日の昼の時点でキャンセル待ちがない状態にしていました。 いくつか電車が止まっていたという話を聞いていたので、開始を5分遅らせ、 受付は45分くらいまで開けておくという対応をしてもらいました。 “ココが辛いよelasticsearch” / 株式会社リクルートテクノロジー @tatakaba さん スライド:ココが辛いよelasticsearch 実際にいくつかのサ

    第14回Elasticsearch勉強会を開催しました。 #elasticsearchjp
  • Docker-ComposeでGitLabとRedmineとJenkinsを立ち上げる - Qiita

    書店のコンピュータ関係の棚に、最近、Dockerという言葉をよく見かけるようになったので、年末年始にDockerについて調べてみました。 その中で、RedmineやらGitLabやらのイメージを取り込んで簡単に環境が構築できると知り、試しにやってみましたので、構築手順のメモを残します。 環境 CentOS Linux release 7.2.1511 (Core) 手順 OSの設定 CentOSのアップデート とりあえず OSのアップデートを行います。

    Docker-ComposeでGitLabとRedmineとJenkinsを立ち上げる - Qiita
  • Embulkのソースコードスタイルチェック方法 (Java編) - Qiita

    1 概要 EmbulkJava関連のコードは、Prestoと同じコードスタイル(Airlift codestyle)で記述されていますした。 (Embulk体は、v0.9からGoogle Java Styleの一部修正版が採用されています。(2018/2/8追記)) 下記の手順で、プラグインのソースコードが同じコードスタイルになっているかどうかをチェックすることができます。 Gradleの設定とIntelliJ IDEA 15 CE(OSX)、 の設定それぞれについて解説します。 ちなみに、Gradleの設定は、embulk newしたときに自動的に生成できるようにするPRを作成しました。 [Propose] Add checkstyle settings in Java plugin generator いい悪いどちらでも是非、コメントください。 プラグイン内のコードスタイルをチェッ

    Embulkのソースコードスタイルチェック方法 (Java編) - Qiita
  • 適当にGitクライアントを設定するcookbookを書いてみました。対話式コマンドも自動化 - Qiita

    はじめに よく仮想マシンを立てたりするので、そのたびにgit config --とか書くのが面倒なので、Chefの経験値を積むためにあえてcookbookを書いてみました。 .gitconfをコピーしたらいいじゃない?という真っ当なご意見を言われるとたぶん泣くのでやめてください! 今回のポイント 一応、オプションでssh-keygenで、SSHの認証鍵を生成するのですが、ここをなんとか入力無しにしたいという思惑がありました。調べてみたところautoexpectとexpectというコマンドがあったので、利用してみました。 最初は、一時ファイルを/tmpディレクトリで実行しようとしましたが、foodcriticによると、Chef::Config[:file_cache_path]を使うと良いというので、素直に使用してみました。 参考URL:Chefレシピ逆引きメモ Chefのスタンドアローン実

    適当にGitクライアントを設定するcookbookを書いてみました。対話式コマンドも自動化 - Qiita
  • 漫画で説明する Flux

    Lin Clark 氏が “A cartoon guide to Flux” というタイトルでとてもわかりやすく Flux についての記事を投稿していました。この文章のなかでも書かれていますが Flux はとてもホットな話題です。しかし、まだまだ十分に理解されていない技術なので、著者の Lin Clark 氏に許可を頂いて翻訳させていただきました。何か間違いや分かりにくいところ、より良くするための助言などありましたら気軽に@sota0805 までコメントお願いします。 (以下、2015年9月29日に Lin Clark 氏によって書かれた “A cartoon guide to Flux” の翻訳です。) 漫画で説明する FluxFlux は現在のウェブ開発で最もよく理解されていない話題の1つです。このガイドでは誰もが理解できる方法で説明しようとしています。 問題はじめに Flux が解決

    漫画で説明する Flux
  • Redux勉強用に簡単なサンプルを作ってみた - Qiita

    前々から触りたいと思っていたReduxを遅ればせながら最近触りはじめたので、学んだことを自分用の備忘録としてまとめます。実装や説明について間違っているところがあれば修正します。 自分にとって解りやすいように公式ドキュメントでの Todoアプリ からかなり機能を削りとって、テキストの追加と全削除の機能しか持たない極端に小さいアプリケーションをReduxを使って作ります。 環境 Redux @3.0.5 React @0.14.3 react-redux @4.0.5 babelify @7.2.0 browserify @12.0.1 wachify @3.6.1 使用しているBabelプリセット babel-preset-es2015 @6.3.13 babel-preset-react @6.3.13 babel-preset-stage-2 @6.3.13 完成品 でき上がったものがこ

    Redux勉強用に簡単なサンプルを作ってみた - Qiita
  • reduxの@connectをデコレーター構文そのままにテストする(webpackの場合) - Qiita

    問題 react-reduxの@connectが定義された要素をテストしようとすると、 以下の様なエラーになって実行する事が出来ません。 Invariant Violation: Could not find "store" in either the context or props of "Connect(Login)". Either wrap the root component in a , or explicitly pass "store" as a prop to "Connect(Login)". 対策(公式) これはリファレンスのWriting Testsでも言及されていて、 decoratorを外して、connectされていないオブジェクトをテストする事を推奨されています。 // In order to be able to test the App componen

    reduxの@connectをデコレーター構文そのままにテストする(webpackの場合) - Qiita
  • 「Raspberry Pi Zero」で自分だけのアメダス(的な測定器)を作ろう

    小さな5ドルマイコン「Raspberry Pi Zero」。小型なのでいろいろな用途に使えそうなので、今回はこれを気圧・温湿度計にしてみます。モバイルバッテリーと無線LANアダプターを用意しておけば、簡易的な無人測定器としての利用が可能となります。 2015年11月に発売された「Raspberry Pi Zero」ですが、普通のRaspberry Pi2と比べてほぼ3分の1サイズのため、小型化したモジュールとしていろいろなことに使えそうな気がしてワクワクしています。今回はこれを、気象データを取るためのデバイスとして利用してみることにしましょう(関連記事:5ドルのコンピュータ「Raspberry Pi Zero」初期設定とベンチマーク)。 まずはどのような構成にするかを考えなければいけませんが、ここ1つ、アメダス(の無人観測施設)みたいに、測定機器にもデータを蓄積しつつ、リモートコントロール

    「Raspberry Pi Zero」で自分だけのアメダス(的な測定器)を作ろう
  • http://infinit.sh/

    http://infinit.sh/
  • TensorFlowによるディープラーニングで、アイドルの顔を識別する - すぎゃーんメモ

    以前は MNISTの例を使って画像識別を試してみた けど、次はカラー画像についての識別を試してみる。 「アイドルなんてみんな同じ顔に見える」って 最近も言われてるのかどうか知らないけど、自分もつい5年前くらいまではそう思っていたわけで。その識別を機械学習でやってみよう という試み。 最近はほとんどライブに行かなくなってしまったけど大好きなももいろクローバーZちゃんを題材にしてみることに。 5人のメンバーの顔は機械学習によってどれくらい分類できるようになるのか?? CIFAR-10 CIFAR-10 という、32×32サイズのカラー画像を10種類のクラスに分類する識別課題があり、そのデータセットが公開されている。これを実際にTensorFlowで学習するための畳み込みニューラルネットワークのモデルや関数などがtensorflow.models.image.cifar10パッケージに同梱されて

    TensorFlowによるディープラーニングで、アイドルの顔を識別する - すぎゃーんメモ
  • mrubyボードenziとmyThingsでIoT - Qiita

    ※なお、I2C用のプルアップ抵抗が必要ですのでご注意下さい。 より詳しい情報はenziのピンアサインやスイッチサイエンスさんのBME280搭載 温湿度・気圧センサモジュールの使い方 で確認できます。 myThingsの設定 IDCFクラウドの設定 masatoさんのmyThingsをはじめよう - Part2: IDCFクラウドに「IDCF」チャンネルをセットアップするを参考にIDCFクラウドの設定をします。 IDCFチャンネルの認証 masatoさんのmyThingsをはじめよう - Part4: 「IDCF」チャンネルを認証するを参考にしてIDCFチャンネルを認証します。 トリガーの設定 masatoさんのmyThingsをはじめよう - Part6: 「IDCF」のトリガーからHTTPで「Gmail」のアクションを実行するを参考にしてトリガーの設定を行います。RaspberryPiが

    mrubyボードenziとmyThingsでIoT - Qiita
  • Web界から組み込みに向けられた刺客「mruby」はこう使われている

    Rubyの良さを組み込みに」を合言葉とする開発言語「mruby」は公開以来、着実な進歩を遂げ、さまざまな場面での利用も進んでいます。ここでは「Web界から組み込みに向けられた刺客」(まつもとゆきひろ氏)たる、mrubyの採用事例を紹介します。 mruby(軽量Ruby)は経済産業省「地域イノベーション創出研究開発事業」として2010年に始まり、2012年4月にオープンソース(MITライセンス)として公開された組み込み向け開発言語です。「Rubyの良さを組み込みに」を合言葉に開発されたmrubyは発表よりはや3年、たくさんの人々の協力でさまざまな形の改良がくわえられ、現在ではライブラリは170を超え、デバッガー対応の安定版「mruby V1.2.0」が発表(2015年11月)されるなど着実に進化しています。 Rubyは開発しやすい、生産性の高い言語としてWeb開発などに広く使われている言語

    Web界から組み込みに向けられた刺客「mruby」はこう使われている
  • zabbix_agent staticライブラリ化 - Qiita

    ライブラリ静的化させて既存システムに入っているライブラリ郡を更新したく無い場合や、 バイナリをばら撒いて叩くだけで動かしたい場合など。 稼働しているアプリケーションのサポート条件として インストールライブラリが指定されている場合などの時に zabbix_agentを使いたい場合などに。 今回はzabbix_server側は 別サーバで既に"rpmインストール"している所からテストした。 今回の話からはzabbix_serverのインストール等についてはこちらに記載はしていないのでご了承を。 作成環境 CentOS 6系 Digital Oceanを使い新規で環境作成 Digital Oceanを真っ新から立ち上げて作業する場合は、 wgetなど含め無いのでyumでinstallが必要ですが この辺りも記載はしていません。 作る 1.zabbixのソースを持ってくる *2015/11/20現

    zabbix_agent staticライブラリ化 - Qiita