今回は、ヒーローの情報を編集する簡単なエディタを作る。
あらゆる物語にはスタート地点がある。 今回の話は クイックスタート が終わったところから始めよう。
#チュートリアル: TOUR OF HEROES
このチュートリアルは TypeScript で Angular2 のアプリケーションを作成する手順を説明している。
この計画は、ヒーロー事務所に所属したヒーローたち、そして彼らの派遣を望むような仕事をマネジメントする助けになるアプリケーションを作成することである。 無論、このチュートリアルで得られる進捗はほんの少しだけだと思う。 しかし、最終的な完成形にはデータドリブンアプリケーション(data-driven application)に求められる機能の大部分は持つことになるだろう。 例えば、(事務所に所属する)ヒーローの一覧を取得して表示すること、あるヒーローの情報を編集すること、あるいはヒーローのデータを表示する別の画面に遷移することなどだ。
digraph G { | |
subgraph cluster_1 { | |
gea[label="歯車"]; | |
} | |
subgraph cluster_2 { | |
bel[label="輸送ベルト"]; | |
} | |
subgraph cluster_3 { |
digraph G { | |
subgraph cluster_Alpha { | |
irp[label="鉄板(8)",shape=Msquare]; | |
cop[label="銅板(1.5)",shape=Msquare]; | |
label="掘って焼く"; | |
} | |
subgraph cluster_A { | |
ger[label="歯車(2)"]; | |
color=red; |
window.onload = function () { | |
var script = document.createElement("script"); | |
var code = function () { | |
var uiController = [ | |
' <div style="text-align:center;">' | |
, ' <div class="ui icon buttons" style="text-align:left;margin:1rem;">' | |
, ' <button id="plus_select_alpha" class="ui large orange button" style="width: 150px;">Alpha</button>' | |
, ' <button id="plus_select_neutral" class="ui large button" style="width: 70px;"><i class="unmute icon"></i></button>' | |
, ' <button id="plus_select_bravo" class="ui large violet button" style="width: 150px;">Bravo</button>' | |
, ' </div>' |
# http://www.graphviz.org/content/cluster | |
digraph G { | |
Router [shape=Msquare,label="RTX1200\n(router)"] | |
Internet -> ONU [color=blue] | |
ONU -> Router [color=green] | |
Router -> PC[color=green] | |
Router -> NAS[color=green] | |
Router -> Air [color=orange] |
# Description: | |
# ハイカラニュース | |
# | |
# Notes: | |
# イカ、よろしくー | |
# | |
kaiwa = { | |
"Bバスパーク": [ | |
["スケボーは苦手・・・\n骨折とかしそう・・・", "骨、無いじゃん・・・"], | |
["ここは 接近戦が勝負の決め手!\n死角も多い!", "高台から チャージャー使うのも\n捨てがたいよね~"], |
digraph G { | |
src1[label="Switch+Dock"] | |
src3[label="マイク"] | |
dest1[label="ディスプレイ"] | |
dest2[label="ヘッドフォン"] | |
mix[label="ミキサ"] | |
spl[label="HDMIスプリッタ+RCA分離器"] | |
src1 -> spl [label="game",color=violet] | |
--[[ | |
# ルーターメトリック収集スクリプト | |
## 概要 | |
定期的にルーターのリソースを監視して、プロキシ経由で Mackerel に下記メトリック情報を送信します | |
* CPU 使用率(整数) | |
* メモリ使用率(整数) | |
* 筐体内温度(整数) |