{"action":"created","issue":{"url":"https://api.github.com/repos/ustun/react-without-jsx/issues/1","labels_url":"https://api.github.com/repos/ustun/react-without-jsx/issues/1/labels{/name}","comments_url":"https://api.github.com/repos/ustun/react-without-jsx/issues/1/comments","events_url":"https://api.github.com/repos/ustun/react-without-jsx/issues/1/events","html_url":"https://github.com/ustun/react-without-jsx/issues/1","id":126526707,"number":1,"title":"An alternative convention","user":{"login":"jacksonrayhamilton","id":5356588,"avatar_url":"https://avatars.githubusercontent.com/u/5356588?v=3","gravatar_id":"","url":"https://api.github.com/users/jacksonrayhamilton","html_url":"https://github.com/jacksonrayhamilton","followers_url":"https://api.github.com/users/jacksonrayhamilton/followers","following_url":"https://api.github.com/users/jacksonrayhamilton/following{/other_user}","gists_url":"https://api.github.com/users/jacksonrayhamilton/gists{/gist_id}","starred_url":"https://api.github.com/users/jacksonrayhamilton/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jacksonrayhamilton/subscriptions","organizations_url":"https://api.github.com/users/jacksonrayhamilton/orgs","repos_url":"https://api.github.com/users/jacksonrayhamilton/repos","events_url":"https://api.github.com/users/jacksonrayhamilton/events{/privacy}","received_events_url":"https://api.github.com/users/jacksonrayhamilton/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"milestone":null,"comments":4,"created_at":"2016-01-13T22:04:09Z","updated_at":"2016-01-13T22:23:11Z","closed_at":"2016-01-13T22:20:32Z","body":"Here is another syntax that you might consider trying out or even promoting here:\r\n\r\n```js\r\nvar OtherComponent = React.createClass({\r\n  render: function () {\r\n    var $ = React.createElement;\r\n    return (\r\n      $('div', {className: 'example'}, 'Greetings.')\r\n    );\r\n  }\r\n});\r\n\r\nvar ExampleComponent = React.createClass({\r\n  render: function () {\r\n    var $ = React.createElement;\r\n    return (\r\n      $('div', {className: 'example'},\r\n        $('h1', null, 'Example Component'),\r\n        $('ul', null,\r\n          $('li', null, 'One item'),\r\n          $('li', null, 'Another item')\r\n         ),\r\n        $(OtherComponent)\r\n       )\r\n    );\r\n  }\r\n});\r\n\r\n(function () {\r\n  var $ = React.createElement;\r\n  ReactDOM.render(\r\n    $(ExampleComponent),\r\n    document.getElementById('container')\r\n  );\r\n}());\r\n```\r\n\r\n`React.createElement` allows you to create DOM elements and components using the same interface.\r\n\r\nAlso, a nice little hack: If you use 2-space indentation, Emacs indents nested elements as you intend.\r\n\r\nThere is also a \"lisp\" style available; I'm not sure which I like better:\r\n\r\n```js\r\nreturn (\r\n  $('div', {className: 'example'},\r\n    $('h1', null, 'Example Component'),\r\n    $('ul', null,\r\n      $('li', null, 'One item'),\r\n      $('li', null, 'Another item')),\r\n    $(OtherComponent)));\r\n```"},"comment":{"url":"https://api.github.com/repos/ustun/react-without-jsx/issues/comments/171456116","html_url":"https://github.com/ustun/react-without-jsx/issues/1#issuecomment-171456116","issue_url":"https://api.github.com/repos/ustun/react-without-jsx/issues/1","id":171456116,"user":{"login":"jacksonrayhamilton","id":5356588,"avatar_url":"https://avatars.githubusercontent.com/u/5356588?v=3","gravatar_id":"","url":"https://api.github.com/users/jacksonrayhamilton","html_url":"https://github.com/jacksonrayhamilton","followers_url":"https://api.github.com/users/jacksonrayhamilton/followers","following_url":"https://api.github.com/users/jacksonrayhamilton/following{/other_user}","gists_url":"https://api.github.com/users/jacksonrayhamilton/gists{/gist_id}","starred_url":"https://api.github.com/users/jacksonrayhamilton/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jacksonrayhamilton/subscriptions","organizations_url":"https://api.github.com/users/jacksonrayhamilton/orgs","repos_url":"https://api.github.com/users/jacksonrayhamilton/repos","events_url":"https://api.github.com/users/jacksonrayhamilton/events{/privacy}","received_events_url":"https://api.github.com/users/jacksonrayhamilton/received_events","type":"User","site_admin":false},"created_at":"2016-01-13T22:23:11Z","updated_at":"2016-01-13T22:23:11Z","body":"Nice, thanks!\r\n\r\nI just realized that with the \"closing parenthesis on newline\" style, the closing parenthesis gets aligned with the opening parenthesis. That might be kind of funny for people whose indent command inserts a fixed number of spaces. So I think I do like the \"lisp\" style better."}}