Skip to content

Instantly share code, notes, and snippets.

@kazukomurata
Created October 14, 2017 11:32
Show Gist options
  • Save kazukomurata/8b00fc82d996de54f98dfe0bd9ef7617 to your computer and use it in GitHub Desktop.
Save kazukomurata/8b00fc82d996de54f98dfe0bd9ef7617 to your computer and use it in GitHub Desktop.
素のreactを使ったサンプル
<!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