Created
October 14, 2017 11:32
-
-
Save kazukomurata/8b00fc82d996de54f98dfe0bd9ef7617 to your computer and use it in GitHub Desktop.
素のreactを使ったサンプル
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="ja"> | |
<head> | |
<meta charset="UTF-8"> | |
<script src="https://cdn.jsdelivr.net/react/15.0.0/react.js"></script> | |
<script src="https://cdn.jsdelivr.net/react/15.0.0/react-dom.js"></script> | |
<title>素のReact</title> | |
</head> | |
<body> | |
<div id="l-content"></div> | |
<script> | |
var events = React.createElement('div', {}, | |
React.createElement('h1', {}, "寄席・定席"), | |
React.createElement('ul', {}, | |
React.createElement('li', {}, | |
React.createElement('h2', {}, "鈴本演芸場"), | |
React.createElement('div', {}, | |
React.createElement('a', {href: 'http://www.rakugo.or.jp'}, '公式サイト'), | |
React.createElement('p', {}, '落語協会のみ。昼夜入替あり。企画ものが多く、前売りチケットがでることも。縦長で後ろだと見づらい。会場に入らなくても前座さんの呼び出し太鼓がみれる。') | |
) | |
), | |
React.createElement('li', {}, | |
React.createElement('h2', {}, "新宿末廣亭"), | |
React.createElement('div', {}, | |
React.createElement('a', {href: 'http://www.suehirotei.com'}, '公式サイト'), | |
React.createElement('p', {}, '落語協会・落語芸術協会の交互。昼夜入替なし。建物が古く、絵になる。毎週土曜の深夜寄席が500円。桟敷、2階に席が取れると良い雰囲気。傾斜がないので、中央よりの席は前に座る人の頭しか見えない。') | |
) | |
), | |
React.createElement('li', {}, | |
React.createElement('h2', {}, "池袋演芸場"), | |
React.createElement('div', {}, | |
React.createElement('a', {href: 'http://www.ike-en.com'}, '公式サイト'), | |
React.createElement('p', {}, '落語協会・落語芸術協会の交互。昼夜入替なし。どの席でも見やすい。演者が近い。席が超狭い。気楽な雰囲気。') | |
) | |
), | |
React.createElement('li', {}, | |
React.createElement('h2', {}, "浅草演芸ホール"), | |
React.createElement('div', {}, | |
React.createElement('a', {href: 'http://www.asakusaengei.com'}, '公式サイト'), | |
React.createElement('p', {}, '落語協会・落語芸術協会の交互。昼夜入替なし。どの席でも見やすい。マナーがイマイチ。気楽な雰囲気。') | |
) | |
) | |
) | |
) | |
; | |
ReactDOM.render(events, document.getElementById('l-content')) | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment