Skip to content

Instantly share code, notes, and snippets.

@bensu

bensu/core.cljs

Created March 1, 2015 13:06
Show Gist options
  • Save bensu/6fa2bd7059d8db372d67 to your computer and use it in GitHub Desktop.
Save bensu/6fa2bd7059d8db372d67 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
core.cljs
(ns react-components.core
(:require [reagent.core :as reagent :refer [atom]]))
(enable-console-print!)
(defonce app-state
(atom {:text "Hello world!"
:plain {:comment "and I can take props from the atom"}}))
(defn comment-box []
js/CommentBox)
(defn hello-world []
[:div
[:h1 (:text @app-state)]
[comment-box #js {:comment "I'm a plain React component"}]
[comment-box (clj->js (:plain @app-state))]])
(reagent/render-component [hello-world]
(. js/document (getElementById "app")))
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<link href="css/style.css" rel="stylesheet" type="text/css">
<script src="http://fb.me/react-0.12.2.js"></script>
<script src="js/react_component.js" type="text/javascript"></script>
</head>
<body>
<div id="app">
<h2>Figwheel template</h2>
<p>Checkout your developer console.</p>
</div>
<script src="js/compiled/react_components.js" type="text/javascript"></script>
</body>
</html>
Raw
react_component.js
var CommentBox = React.createClass({displayName: 'CommentBox',
render: function() {
return (
React.createElement('div', {className: "commentBox"},
this.props.comment
)
);
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment