「ブクマばっかしてても手を動かさなきゃ嘘になるぜ」と言われたような気がしたので、ウェッブコンポーネンツを使って、x-markedという要素を作ってみた。x-markedタグの中にMarkdownテキストを書くとHTMLにレンダリングしてくれる。 作ってるときにハマりポイントがいくつかあったので記しておく。 デモ: nakajmg.github.io/x-marked/ ソース: github.com/nakajmg/x-marked ハマりポイント3つ ハマったポイントは以下の3つ。 インポートされたHTMLが指すdocumentオブジェクト <template>に書いた<link rel="stylesheet">の扱い <content>の中身を取るタイミング インポートされたHTMLとインポートしているHTML内でのdocument <link rel="import">で読み込んだ

近年、自分の中で集計／可視化は Fluentd(datacounter)+Growthforecast で定番化していました。 しかしプロダクトで新たに集計／可視化の要件が出てきたことと、 最近可視化ツール周りで 「Kibanaってなんじゃ？」「Graphiteってなんじゃ？」「InfluxDBってなんじゃ？」 など、このツール達は一体何なんだろう…？というのが前々から気になっていました。 今回良い機会なので ◯◯は何をするものなのか？ というのを一つ一つ調べてみました。 いわゆる「触ってみた系」の記事なので だいぶ浅い感じです。 大分類 大きく分けると、可視化ツールは以下の３つに分けられそうです。 ログ収集/集計 時系列DB（＋API）の担当。バックエンド側。 可視化部分の担当。 今回は バックエンド と 可視化部分 に焦点を当ててみます。 バックエンド 全文検索時エンジン+Restfu

CSSはどちらかと言えばやさしく、雑にコードを書いてもなんとかなってしまう言語です。 しかし、雑にコードを書いてしまうと、昨日書いたこのコードなんだっけ？ とか、新しくスタイルを増やすと別のスタイルがおかしくなってしまうことはありませんか？ 大規模なプロジェクト、長期に渡るプロジェクト、複数のメンバーが関わるプロジェクト、そして明日の自分も一年後の自分も使える、メンテナンス性に優れた一覧性のある美しいCSSを書くのに役立つガイドラインを紹介します。 CSS Guidelines 2 CSS WizardryのHigh-level guidelinesの最新版（2014年8月リリース）。 大規模で長期に渡るプロジェクト向けのメンテナンス性に重点をおいたスタイルシートのガイドラインです。スキルの異なる制作者、新規で加わる制作者などでも、統一されたコードでの制作が可能になるのを目的としています。

どの世界にも業界用語というものがありますが、IT業界の人がやりがちなのがカタカナ用語の多用です。 「アライアンスによるインタラクティブかつウィンウィンなスキームでステークホルダーにコンプライアンスを云々・・・」等、やり過ぎるとルー語的になってしまい、相手に「意味がわからない」とか「カッコつけてるの？」と不快感を与えかねません。 ちなみに私事ですが、先日、妻から用事を頼まれたとき、 「土曜はちょっとタイトだわ。日曜ならいいけど、リスケでOK？じゃあ、それでアサインしといて。え、毎週するの？だったらルーチンタスクにしとくほうがよくね？」 って返事したら、 (*｀Д´*)　「日本語で言え！わざわざ横文字にすんな」 （#^ω^） 　「“カタカナ用語使いこなすオレ、かっけー”とか思ってるでしょ？」 と、さんざん毒づかれてしまいました。 というわけで、IT業界で使用頻度の高い（と思われる）カタカナ用語

Spring BootによるAPIバックエンド構築実践ガイド 第2版 何千人もの開発者が、InfoQのミニブック「Practical Guide to Building an API Back End with Spring Boot」から、Spring Bootを使ったREST API構築の基礎を学んだ。この本では、出版時に新しくリリースされたバージョンである Spring Boot 2 を使用している。しかし、Spring Boot3が最近リリースされ、重要な変...

画像をデスクトップの広いスペースではそのまま表示し、スマホやタブレットなどの狭いスペースでは指定した箇所を中心にクロップして表示する、レスポンシブ対応の画像をクロップするjQueryのプラグインを紹介します。 FocusPoint -GitHub 左：オリジナルの画像 右上：画像の中央をクロップ、右下：FocusPointで指定した箇所を中心にクロップ FocusPointのデモ FocusPointの使い方 FocusPointのデモ デモでは、画像をさまざまなサイズにクロップし、指定した箇所を中心に表示しています。 高さが狭い横長だけでなく、幅が狭い縦長でもOKです！

2014年12月16日 便利ツール ファイルのバージョン管理＆プロジェクト管理ができるuniversions。昨年のクローズドベータ版の頃に開発者さんに紹介していただき、かわいらしいデザインと使いやすさからずっと応援していたツールです。「デザイナー向けにGitなどを優しく解説する記事はありますが、どうしても構築の手間や敷居の高さがあるのではないか…」という開発者さんの思いがうまく反映され、使われている言葉もわかりやすく、スッキリとしたデザインになっています。どんな方でも安心して使いこなせるはず。先月ついに正式版がリリースされたので、簡単に紹介します！ ↑私が10年以上利用している会計ソフト！ エンジニアじゃなくても簡単に使える管理システム これまでのバージョン管理システムとは違い、黒い画面になにやら記述しなくても、クリックするだけでファイルの履歴管理ができます。間違えてファイルを上書き保存

本連載は、昨年まで米ビジネススクールで助教授をしていた筆者が、世界の経営学の知見を紹介していきます。 さて、最近は以前にも増して、日本中で起業への関心が高まっています。今年6月に発表された安倍政権の「骨太の方針2014」でも、日本を「起業大国」にすることがうたわれました。実際、最近は会社勤めの方々の中に、将来の目標として「今いる会社を辞めて起業」を意識される方が多く出てきています。 他方で、起業に関心はあっても、及び腰の方も多いのではないでしょうか。起業はリスクが高いですから、会社勤めで安定収入を得ている方には勇気のいることでしょう。実は、最近の経営学では、この起業リスクの軽減となる考え方が注目されつつあります。 それを、ハイブリッド・アントレプレナーシップ（Hybrid Entrepreneurship）と言います。本稿では「ハイブリッド起業」と呼ぶことにしましょう。 ハイブリッド起業家

こんにちは。Tokyo Otaku Mode エンジニアの重岡です。 本ブログを読んだことがある方々は既にご存知かもしれませんが、Tokyo Otaku Modeでは otakumode.com に Node.js と MongoDB を採用しています。フレームワークには Node.js 製の Express.js (3系) を使っています。Express.js は Ruby の Sinatra や Python の Flask と同じような MicroFramework なので、必要な機能は npm で module をインストールする、もしくは自分で Express.js の機能を拡張します。 今回は Express.js に機能拡張した一例として res.render を otakumode.com 向けに使いやすく改良した手順をご紹介します。 View 出力時の共通処理をまとめたい

Written by Mattt July 25th, 2018 (revised) This article has been translated into: 한국어 iOS has a complicated relationship with the web. And it goes back to the very inception of the platform over a decade ago. Although the design of the first iPhone seems like a foregone conclusion today, the iconic touchscreen device we know and love today was just one option on the table at the time. Early protot

こんにちは。LIGブログ編集部です。 LIGのWebデザイナーの業務の一つに、日々更新されるLIGブログ記事の「アイキャッチ画像を作成する」という仕事があります。 今回は、累計1万枚以上のアイキャッチ作成から得た「集客を加速させるアイキャッチのデザイン」をLIGブログ編集部より紹介させていただきます。 ※この記事は2014年に公開されたものを再構成しています。 アイキャッチとは アイキャッチとは、文字通り目を引きつけるもので、Web上ではターゲットユーザーの注意を引き、クリック意欲を刺激してWebサイトやブログに訪問してもらうことを目的としたクリエイティブです。 記事一覧ページのサムネイル画像や、SNSでシェアしたときに表示されるOGP画像などに利用されます。 アイキャッチの必要性 では、なぜWebサイトやブログ記事にアイキャッチが必要なのでしょうか。LIGブログではアイキャッチ作成に力を

SpeechRecognitionとWebRTCでつながる新感覚言葉遊び「コトバツナギ」の技術全て見せます！ 藤岡宏和（株式会社ワン・トゥー・テン・デザイン） 「コトバツナギ」というWebコンテンツを作成し、HTML5 Japan Cup 2014で最優秀賞を頂きました。コトバツナギは、SpeechRecognitionとWebRTCを軸にしたマルチユーザーコンテンツです。このコンテンツで使っている主な技術の解説をしたいと思います。 概要 コトバツナギは、声に出して声で遊ぶマルチユーザーコトバアソビゲームです。 PCサイトを開き、スマートフォンを皆で持って集まって遊ぶゲームになっています。スマートフォンの代わりにマイク機能付きのノートPCでも可です。 WebRTCとwebkitSpeechRecognitionを使っているため、2014年8月の時点ではPC・スマホともにChromeブラウザ

改訂版について　(5/7/2019公開) この記事は、私がこちらに公開したもの中では最も読まれているようです。そこで、執筆後に気づいたこと、古くなった情報、新しい技術動向などを考慮に入れて改訂をしました。主な変更点は以下の通りです： 新しいセクションの追加 最近の本の紹介 細かな表現の修正 この記事は複数のセクションに分かれていますので、前編から始め、順番にアップデートして行きたいと思います。何かお気付きの点などありましたら、コメント欄、もしくはkonoアットマークucsd.eduにお願いいたします。 はじめに この記事は、可視化の専門家ではない人がコンピュータを使ってデータ可視化を実際に行う場合に必要な、一般的なノウハウをお伝えするシリーズの第一回です。 前編: 効果的なデータ可視化とはどのようなものか？　（本稿） 中編: 分かりにくい可視化を避けるための手法の選択 後編: Part 1

Randen Pederson 大規模なシステムであれば使っているであろうリバースプロキシ。 セキュリティや稼働率の観点からみて利用することは非常にメリットは高いです。 ただ、社内や周りであまり知見がなく、 「動くからいいや」という理由でApacheをそのままWebサービスの一次受けとして利用されている方も多いと思います。 動くという目的からすれば確かにその通りですが、ただ一枚リバースプロキシを入れるだけで ぐっと運用効率、稼働率も拡張性も上がります。 1. ルーティング処理の簡略化 例えばRESTfulな一般的なAPI構成を作りたいと思った時に以下のようなURL構成になると思います。 http://api.something.com/search/v1/item/list.json?cid=xxxx&gid=xxxxx もしアプリケーション側のルーティングしか知らなければframewor

良いって何ですか？ デザインの話をするのは、たとえ本業をしている方にとっても難しいことがあります。それが他分野の方ということになると、なおさらです。目的に沿って議論することで、デザインがより洗練されるわけですが、別の部署、他の役職の方との会話になると、なかなかうまくいかないことがあります。 その理由は、彼等がデザインのことを理解していないからというより、お互いが考える「正しい」を理解していないからということがあります。 Webサイトやアプリを設計・開発されている方全員「良いものを作りたい」と考えています。ただし、その「良い」のニュアンスは立場によって少し異なることがあります。「良い＝売れる」と解釈する人もいれば「良い＝使いやすい」と捉える方もいます。それぞれがもつ「良い」という価値観が、その人の意見や考え方に大きな影響を及ぼしています。 言葉だけでは理解ができない デザイン案を見せると、以

こんにちは、工藤です。 今回はテーブルデザインについて参考にしたいものを集めました。 簡単なようで結構悩んでしまうんですよね・・。 Oranges In The Sky http://icant.co.uk/csstablegallery/tables/39.php 名前の通りグレーを基調にリンクにオレンジと青を使ったテーブルです。 こちらのサイトでは右上にあるデザイン名からCSSを参照することができます。 Nimbupani http://icant.co.uk/csstablegallery/tables/42.php 黒を基調に、リンクに青色を使っているテーブルです。 英語だからいいのかもしれないのですがスタイリッシュなテーブルです。 Casablanca http://icant.co.uk/csstablegallery/tables/71.php グレーと赤を使ったテーブル。色

今回はOS X Lionから搭載されていて、起動しているアプリ全体が見渡せて便利な「Mission Control（ミッションコントロール）」を使いこなす方法について紹介したいと思います。 全体を確認できる「Mission Control」「Mission Control」の何が便利かというと、仮想デスクトップや今立ち上げているアプリなどが一気に確認できることですね。「MacBook Air」など解像度が低いマシンを使っている時は本当に重宝します。 まずは「Mission Control」の使い方ですが、「F3キー」を押すことで立ち上げることができます。他にもトラックパッドを3本指で上にスワイプすることでも同じ事ができます。 ちなみに、システム環境設定から「トラックパッド」を選び、「その他のジェスチャ」部分からMission Controlを4本指で上にスワイプに変更することもできます。僕

Software-Defined Data Centerは、あらゆるアプリケーションのためのプラットフォームになる。 VMware環境上でのDockerの対応、Kubernetesへの参加 VMwareとDockerは協力して以下のことなどに取り組むとしています。 VMware Fusion、vSphere、VMwareのクラウドサービスvCloud Airなどが、Docker Engingにとって優れた稼働環境になるようにする Docker関連のオープンソースプロジェクト、libswarm、libcontainer、libchanの開発 Docker Hubと、VMwareのクラウドサービスvCloud Air、vCenter Server、vCloud Automation Centerなどとの相互運用性向上 またVMwareはGoogleとの協業も発表。VMwareはすでにvSphe

こんにちは、LIGブログ編集部です。こちらは「Google Analytics（グーグルアナリティクス）をはじめて使う人が、一通りのアクセス解析を自分でできるようになる」ところまでを目標とした全5回の初心者向けGoogle Analytics講座の第1回目となります。 Google Analyticsとは、自身のブログをお持ちの方やメディアを運用している方にとって、必須ともいえるアクセス解析ツールです。このツールを利用することによって自身のWebサイトにどんなユーザーが訪れているのか、ブログやメディアの強みや改善すべき点などを分析することができるようになります。 「Google Analyticsという言葉は知っているけど、詳しいことはわからない……」という初心者の方は、導入から基本の使い方、そして役に立つ小技までをこのシリーズでマスターしていきましょう。初心者ではない方も、おさらいのつも

Dismiss Join GitHub today GitHub is home to over 50 million developers working together to host and review code, manage projects, and build software together. Sign up

1. Jubatus Casual Talk #3 「Meteor: Jubatusをベースにした オーディエンスの分析エンジンの紹介」 2014年6月29日 株式会社Intimate Merger 渡部創史 2. Intimate Merger 会社概要 2 商号 出資元の情報 株式会社Intimate  Merger インティメート・マージャー 設⽴立立 2013年年6⽉月 オフィス 六六本⽊木cross  point 代表 簗島 　亮亮次 ⾼高度度な広告配信技術を持つフリークアウトと検 索索・データマイニング技術に強みを持つPFIとの ジョイントベンチャー グリーでデータマイニング、ポータル、編成、 API、SDKなど複数部⾨門のマネジメントしてい た⼈人間を中⼼心としたデータマネジメント企業 “ビックデータをお⾦金金に換える“をテーマにビッ クデータの活⽤用や利利⽤用環境の構築を⽬

You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

最近、ClojureScriptに手を出してる。coffeeは手に馴染みすぎて飽きたし、TypeScriptはただのJS+ただの静的型付けで驚きがなくて刺激が足りない。 clojure-scriptが凄いのは、clojureプロジェクトとして開発されているということだ。clojureのコードが基本的にはそのまま動く。厳密にはまったく同じではないのだが、clojureサブセットだと思えば問題ない。 JVMが実装してあるわけではないので、clojure-scriptコンパイラはclojure-script -> javascriptの変換をしているわけだ。 僕は仕事で一番最初に使ったサーバー言語は実はclojureで、それなりに思い入れがあるのだが、とはいえちょっとの期間だったし、Lispに造詣が深いとも言えない。なので、勉強しながら使っている。 で、やってみたら色々問題があって、core.a