はてなブックマーク

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? TL; DR (要約) Jestの実行時オプション(CLIオプション)と、テストメソッド(it,test)の書き方で、並行処理と順番(逐次)処理をコントロールする方法について、以下の4パターンを図で説明します。 複数のテストファイルを並行処理し、ファイル内のテストは順番に実行する 複数のテストファイルを順番に処理し、ファイル内のテストも順番に実行する 複数のテストファイルを並行処理し、ファイル内のテストも並行実行する 複数のテストファイルを順番に処理し、ファイル内のテストは並行実行する はじめに Jestでは、パフォーマンスのために複数

はじめに Supership Advent Calendar 2018 の７ 日目の記事です。 データソリューションスタジオという開発組織の長をしております。 本日12/7 は私の誕生日です、祝ってください！ 昨年builderscon tokyo 2017 にて同テーマを題材に登壇したのですが 現在新サービスを発表したり 時間の経過と共に面白いと感じる部分にアップデートがかかりましたので 【2018 改訂版】としてこの場を借りて発表する事にしました。 概要 スマートフォンの登場によるパラダイムシフト 私は10 年以上ポータルサービスにおけるウェブ検索に携わっているのですが スマホシフトによってこれまで蓄積した検索クエリデータを元に 以下のような状態遷移を知る事ができました。 スマホを普段何気なく利用されている方も無意識的にひらがなでググったりしませんか？ そしてその後とあるサイト内で同じ

🔰 はじめに 以前のSketchのアップデートでファイル構造形式が変更されたことで、よりデータが軽量化し、Gitによるバージョン管理が容易になりました。これにより「コード」のバージョン管理フローより遅れていたデザインプロセスが劇的に進化することが期待できます。 一方で、現時点（2017/12/02）でも、すでに複数の手段やツールが登場しており、今後も増え続けるでしょう。正直どの手段がベストプラクティスかは悩ましいです。 この記事では「デザインファイルのバージョン管理」をテーマに、代表的な２つのツール「Abstract」「Kactus」を検証比較した上で、デザイナーが開発チームの一員として、プロジェクトにとって有意義な『Design Systems』を構築し、機能横断的なコラボレーションを実現するための考察をまとめてみました。 ※『InVision V7』は表題とは少し異なるので別の機会に

やりたいこと カウントダウンしたい時間をpropsへ与えられる タイマーの進むインターバルをpropsへ与えられる インターバル毎とカウントダウン終了時にコールバック関数を設定できる タイマーロジックとタイマー表示は切り離す ロジック部分を担うコンポーネントを作った 表示は任意の別のコンポーネントを使えるようにする 他に調べたコンポーネント dcousens/react-timers: 公式で非推奨になっているMixinを使ってるのでナシ uken/react-countdown-timer: 表示フォーマットを関数で設定するタイプ。実装は参考にした StevenIseki/react-timer: 表示は固定フォーマット。タイマーの実装サンプルのような感じ troch/react-timer-hoc: HOC(Higher Order Component)による実装。コールバックが無いけ

$ yarn yarn install v0.18.1 $ yarn start yarn start v0.18.1 $ run-s aggregate perform yarn run v0.18.1 $ run-s gengo:aggregate yarn run v0.18.1 $ node lib/02-GengoCandidates/aggregate.js ✨ Done in 0.30s. ✨ Done in 0.89s. yarn run v0.18.1 $ run-s clean mkdir yarn run v0.18.1 $ del dist/* tmp/* ✨ Done in 0.42s. yarn run v0.18.1 $ node -e '[`dist`,`tmp`].forEach(d => { try { fs.mkdirSync(d) } catch(e

はじめに 前回の記事 RailsでReactをサーバサイドレンダリング（use Hypernova by airbnb） - Qiitaでは、ReactコンポーネントをRailsアプリで簡単にサーバサイドレンダリングに対応する方法を書きました。 最近ではReact単体ではなく、コンポーネント群の状態(State)を一元管理してデータの流れを一方向に整える開発技法Fluxを取り入れたRedux(react-redux)を用いたアプリケーションも増えてきました。 前回ご紹介したHypernovaでは、Reactコンポーネントのサーバサイドレンダリングには対応していたのですが、Reduxコンテナ1はうまくレンダリング出来ませんでした。 そこで、この記事ではReduxコンテナのサーバサイドレンダリングに対応したHypernovaのReact/Reduxバインディングであるnoriaki/hyper

はじめに Railsにも対応しているJavaScriptのサーバサイドレンダリング用ライブラリairbnb/hypernovaが、airbnbからリリースされました。 この記事では、シンプルなRailsアプリを構築し、これまたシンプルなReactコンポーネントをサーバサイドレンダリングで表示するまでのチュートリアルを解説します。 ReactによるSPA（シングルページアプリケーション）も増え、Google等の検索エンジンでもある程度はページ内容を解釈してくれるらしいですが、サーバ側でHTMLをレンダリングして出力するサーバサイドレンダリングを利用すると、より正しくページ内容を解釈してもらえます。 Hypernovaとは A service for server-side rendering your JavaScript views Hypernovaは、JavaScriptコンポーネント

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

追記（2017/06/21） 公式からの発表もありました。理由は技術的負債を予防する観点で納得できるものですね。 代わりとしては、絵文字(emoji)を使うと良いのではないでしょうか。 Font Awesome がご利用いただけなくなる点について 前述の通り、今回の変更によってこれまで暗黙的に利用できていた Font Awesome のアイコン指定はご利用いただけなくなります。(繰り返しになりますが、Qiita:TeamやQiitaのOrganizationでは引き続きご利用いただけます） Font Awesome を含めて禁止にしたのは以下の理由です。 Qiita が Font Awesome を利用していることは公式な仕様ではなく、将来にわたって Font Awesome を使い続ける保証がない 将来的に何かしらの後方非互換な変更が Font Awesome に入ったとき、その変更に追

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? その名も「はてブと同時にQiitaストック」です。 はてブと同時にQiitaストック - http://hb2qiita.com/ What's はてブと同時にQiitaストック 名前の通り、はてなブックマークにQiita記事をブックマークすると、自動的にその記事をストックするサービスです。 どんなツール（Web/ブラウザ拡張/アプリ/ブックマークレット/ブックマークボタン/ツイート/メール/その他3rd-partyツール）からブックマークする場合でも、ブックマークしたURLがQiitaの記事であれば自動的にストックします。 以下のよう

これはなに？ タイトルの通りです。Emacsで.logファイルを監視することができるようになる設定です。 .logファイル開いたとき、自動的にtail -f相当の以下のような動きをするようになります。 ファイル更新に追随して自動的にバッファを更新 バッファ更新時とファイルを開いた時、自動的にバッファの末尾へカーソルを移動 設定 ~/.emacs.e/init.elの末尾に追記するか、init-loaderを利用している場合は21-auto-revert-tail-log.elといったelispファイルを作成して下記を記載します。 ;; .logファイルでは自動で auto-revert-tail-mode にする (add-to-list 'auto-mode-alist '("\\.log\\'" . auto-revert-tail-mode)) ;; ファイル更新やバッファオープン時

これはなに？ いわゆるMicrosoft Excelで言うところのPHONETIC関数です。 漢字を含むテキスト・セルを指定することで、読み仮名を出力することができます。読み仮名はひらがなのふりがなでもカタカナのフリガナでも大丈夫です。 典型的な利用シーンとしては、住所録で氏名の読み仮名を自動で（それなりに）ふりたい、というシーンがあります。ちょうど年賀状シーズンの住所録でふりがなが必要になったりしていると思いますが、ローカルのExcelではなくGoogleスプレッドシートで管理している方も多いでしょう。ExcelにはPHONETIC関数があるのにGoogleスプレッドシートには同様の機能が無いのです。 機能 漢字を含むテキスト（セル）をひらがなへ変換 =HIRAGANA(input) 漢字を含むテキスト（セル）をカタカナへ変換 =KATAKANA(input) フラグで変換先（ひらがな/

やりたいこと（困っていること） （あんまり無いけど）途中まで作ったRailsアプリのModelを全部削除して、最初から作り直したいことがあった。 そのときのモデル数は15個くらいあって、モデル名をひとつひとつ入力しては削除するのがめんどくさかった。rails destroyコマンドの引数に渡せるモデル名が1つだけだったのもツライ。 やったこと Dir.globでファイル一覧を取得して、それぞれにrails destroyコマンドを投げた。うまくいった。ハッピー！ [~/path/to/rails/app] % ruby -e 'Dir.glob("app/models/*.rb").each{|f| puts %x|rails destroy model #{File.basename(f, ".rb")}| }' invoke mongoid remove app/models/mode

背景 (Background) Array#deleteやArray#delete_ifでは、条件に一致した 全ての 要素が削除されてしまいます。初めて見つかった要素一つだけを削除したいときに適当なメソッドが無かったので定義してみました。 利用例 (Usage) array = [:a, :b, :a, :b] => [:a, :b, :a, :b] # Array#delete_first : search element by Array#index array.delete_first :a => [:b, :a, :b] array.delete_first :b => [:a, :a, :b] array.delete_first { |elm| elm == :a } => [:b, :a, :b] array.delete_first { |elm| elm == :b }

結論 Numeric#to_s(:delimited)を使うと良いよ。 ActionView::Helpers::NumberHelperのnumber_with_delimiterメソッドと同じものです（内部で呼ばれてる）が、タイプ数が少ない方が良いですよね。怠惰万歳。 ちなみに、検索するとよく出てくるnumber_to_currencyは通貨表示のためのメソッド（頭に$とか¥とか付く）です。なお、こちらも同じくNumeric#to_s(:currency)で使えます。 Numeric#to_s(:delimited)の使い方 要ActiveSupport require 'active_support/core_ext/numeric/conversions' 12345678.to_s(:delimited) # => 12,345,678 12345678.05.to_s(:del

元になった記事 innerHTMLは"をエスケープしてくれるとは限らない -- innerText(textContent)/innerHTMLを使ったHTMLエスケープは充分でないので今すぐやめろ、お前たちはもう終わりだ - TODESKING String#replaceは引数にfunctionを渡せる functionの第一引数はマッチした部分文字列そのものを保持するので、マッピングテーブルオブジェクトに渡して変換するこんな感じでどうだろう。なんかオシャレな気がするので。 function escapeHtml(content) { var TABLE_FOR_ESCAPE_HTML = { "&": "&amp;", "\"": "&quot;", "<": "&lt;", ">": "&gt;" }; return content.replace(/[&"<>]/g, funct

codebreak; コードブレイクは、IT・Webエンジニアのコラボレーションを支援する、Gitホスティングサービスです。 Free Git Hosting | codebreak; コードブレイクの特徴として、無料で無制限にGitリポジトリを持てて、しかもプライベートリポジトリも無制限に作れるので重宝している。 自分のリポジトリに対するPush等にはGithubと同様に、SSH鍵によるアクセスが可能だが設定が必要だったので備忘代わりに載せておく。 設定は以下の2ステップ。 codebreak;にSSH公開鍵を登録 SSH公開鍵のページへアクセスし、自身の公開鍵を適当な名前で登録する。 Githubに登録しているものがあれば、https://github.com/自分のUSERNAME.keysへアクセスすれば確認できるのでコピペでOK。 クライアント側の設定(.ssh/config)

はじめに 自分が困ることや言ってて恥ずかしいことがあるので作りました。 随時更新予定です。特に記載ガイドラインとかは無いので、一人でも読みづらいと思った人がいれば追加する方針です。公式サイト等で規定されている読み方を優先します。複数の読み方があって議論が生じる場合は両方載せます。 追加・修正 用語は網羅できておらず、参考URLや概要も不十分ですので、皆さまからの加筆、追加、修正をお待ちしています！ 加筆、追加、修正は、用語、読み方を書いて編集リクエストまたはコメントまでお願いします。 読み方の記載がある公式（参考）ページURLとその用語の概要も併せて教えていただけると嬉しいです。 読み方が分かりづらいIT用語一覧（用語の辞書昇順） 最終更新：2014/10/13 用語 よみかた ヨミカタ 参考 概要

はじめに herokuアプリを本番用として、ローカル（または開発用サーバ）で開発アプリを動かすためのgit管理方法を備忘として残しておく。 masterは使わない 特にgit cloneしてきたとき、clone元（本家）を保持しておくため。 本家にアップデートがあったときには、まずmasterへgit pullして本家の変更を反映する。Changelog等も参考にしつつ、devへgit mergeする。 dev, prodというブランチを作る branch 位置付け

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?