render_react 1.0.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 1f1199329df44373786d8f5377fe6f4895ff2973
+  data.tar.gz: 79f01a0f8ca990c0e352aab45c1a4a5d922575ce
+SHA512:
+  metadata.gz: 769e5d7d47459c76ca3cfaa92b5af1af0f1d69bb5b57903e2d1a960aea67cd485bae9e90c977df7170607241696bfa4e9f2f3d0a2f6b46e51c3283cd555a86a3
+  data.tar.gz: 9619a216f48a4cc90402d87db1e83e17beac59c74c94332f6eef2213c9f500eff08b186f3361db74dabf8083fc15f550044787ce367b66e1ea59f2495059f5e2

data/.gitignore

@@ -0,0 +1,2 @@
+Gemfile.lock
+/pkg

data/.travis.yml

@@ -0,0 +1,22 @@
+sudo: false
+language: ruby
+
+rvm:
+- 2.4.1
+- 2.3.4
+- 2.2
+- 2.1
+- 2.0
+- jruby-9.1.12.0
+- ruby-head
+- jruby-head
+
+cache:
+- bundler
+
+matrix:
+  allow_failures:
+    - rvm: jruby-head
+    - rvm: ruby-head
+    - rvm: 2.0
+#   fast_finish: true

data/CHANGELOG.md

@@ -0,0 +1,6 @@
+## CHANGELOG
+
+### 1.0.0
+
+* Initial release
+

data/CODE_OF_CONDUCT.md

@@ -0,0 +1,74 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+In the interest of fostering an open and welcoming environment, we as
+contributors and maintainers pledge to making participation in our project and
+our community a harassment-free experience for everyone, regardless of age, body
+size, disability, ethnicity, gender identity and expression, level of experience,
+nationality, personal appearance, race, religion, or sexual identity and
+orientation.
+
+## Our Standards
+
+Examples of behavior that contributes to creating a positive environment
+include:
+
+* Using welcoming and inclusive language
+* Being respectful of differing viewpoints and experiences
+* Gracefully accepting constructive criticism
+* Focusing on what is best for the community
+* Showing empathy towards other community members
+
+Examples of unacceptable behavior by participants include:
+
+* The use of sexualized language or imagery and unwelcome sexual attention or
+advances
+* Trolling, insulting/derogatory comments, and personal or political attacks
+* Public or private harassment
+* Publishing others' private information, such as a physical or electronic
+  address, without explicit permission
+* Other conduct which could reasonably be considered inappropriate in a
+  professional setting
+
+## Our Responsibilities
+
+Project maintainers are responsible for clarifying the standards of acceptable
+behavior and are expected to take appropriate and fair corrective action in
+response to any instances of unacceptable behavior.
+
+Project maintainers have the right and responsibility to remove, edit, or
+reject comments, commits, code, wiki edits, issues, and other contributions
+that are not aligned to this Code of Conduct, or to ban temporarily or
+permanently any contributor for other behaviors that they deem inappropriate,
+threatening, offensive, or harmful.
+
+## Scope
+
+This Code of Conduct applies both within project spaces and in public spaces
+when an individual is representing the project or its community. Examples of
+representing a project or community include using an official project e-mail
+address, posting via an official social media account, or acting as an appointed
+representative at an online or offline event. Representation of a project may be
+further defined and clarified by project maintainers.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported by contacting the project team at opensource@janlelis.com. All
+complaints will be reviewed and investigated and will result in a response that
+is deemed necessary and appropriate to the circumstances. The project team is
+obligated to maintain confidentiality with regard to the reporter of an incident.
+Further details of specific enforcement policies may be posted separately.
+
+Project maintainers who do not follow or enforce the Code of Conduct in good
+faith may face temporary or permanent repercussions as determined by other
+members of the project's leadership.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
+available at [http://contributor-covenant.org/version/1/4][version]
+
+[homepage]: http://contributor-covenant.org
+[version]: http://contributor-covenant.org/version/1/4/

data/Gemfile

@@ -0,0 +1,7 @@
+source 'https://rubygems.org'
+
+gemspec
+
+gem 'minitest'
+gem 'minitest-reporters'
+gem 'rake'

data/MIT-LICENSE.txt

@@ -0,0 +1,20 @@
+Copyright (c) 2017 Jan Lelis, mail@janlelis.de
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,127 @@
+# RenderReact [![[version]](https://badge.fury.io/rb/render_react.svg)](http://badge.fury.io/rb/render_react)  [![[travis]](https://travis-ci.org/janlelis/render_react.svg)](https://travis-ci.org/janlelis/render_react)
+
+A lo-fi way to render client- and server-side React components from Ruby:
+
+```js
+class ExampleComponent extends React.Component {
+  render() {
+    return <marquee>Hello Ruby { this.props.example }</marquee>
+  }
+}
+```
+
+```html
+RenderReact.on_client_and_server("ExampleComponent", { example: "prop" })
+# =>
+<div id="RenderReact-caac405e-1714-495e-aeb4-77b42be42291">
+  <marquee data-reactroot="" data-reactid="1" data-react-checksum="441921122">
+    <!-- react-text: 2 -->Hello Ruby <!-- /react-text --><!-- react-text: 3 -->!<!-- /react-text -->
+  </marquee>
+</div>
+<script>
+  RenderReact.ReactDOM.render(RenderReact.React.createElement(RenderReact.components.ExampleComponent, {"example":"!"}),
+  document.getElementById('RenderReact-caac405e-1714-495e-aeb4-77b42be42291'))
+</script>
+```
+
+It is *bring your own tooling*: React is not included, nor any ES6 transpilers or module bundlers. It expects you to prepare the JavaScript bundle file in a specific format, which must contain React and all of your components.
+
+If you are looking for higher-level alternatives, checkout [react_on_rails](https://github.com/shakacode/react_on_rails) or [react-rails](https://github.com/reactjs/react-rails).
+
+## Setup
+
+Add to your `Gemfile`:
+
+```ruby
+gem 'render_react'
+```
+
+### JavaScript Source Preparation
+
+**RenderReact** expects the JavaScript bundle to include a global variable called `RenderReact` with the following contents:
+
+```javascript
+{
+  React: [variable which contains React, see first paragraph of https://facebook.github.io/react/docs/react-api.html],
+  ReactDOM: [variable which contains ReactDOM, see first paragraph of https://facebook.github.io/react/docs/react-dom.html]
+  ReactDOMServer: [variable which contains ReactDOMServer, see first paragraph of https://facebook.github.io/react/docs/react-dom-server.html],
+  components: {
+    ComponentIdentifier1: [variable which contains the component 1],
+    ComponentIdentifier2: [variable which contains the component 2],
+    ...
+  }
+}
+```
+
+You can have two different javascript bundle files - one for server rendering, and one for client-rendering.
+
+- The client bundle has to be included into your application by a method of your choice. You may skip passing in `ReactDOMServer` for the client bundle
+- The server bundle has to be passed to `RenderReact` (see Usage section). You may skip passing in `ReactDOM` for the server bundle
+
+#### Example (With ES6 Modules)
+
+```javascript
+import React from 'react'
+import ReactDOM from 'react-dom'
+import ReactDOMServer from 'react-dom/server'
+
+import ExampleComponent from './components/example_component'
+
+export default {
+  React: React,
+  ReactDOM: ReactDOM,
+  ReactDOMServer: ReactDOMServer,
+  components: {
+    ExampleComponent: ExampleComponent
+  }
+}
+```
+
+(gets later imported as `RenderReact`)
+
+#### Example (With  Browser Globals)
+
+```javascript
+window.RenderReact {
+  React: React,
+  ReactDOM: ReactDOM,
+  ReactDOMServer: ReactDOMServer,
+  components: {
+    ExampleComponent: ExampleComponent
+  }
+}
+```
+
+## Usage
+
+Create a **RenderReact** context by passing your server-side JavaScript bundle:
+
+```ruby
+RenderReact.create_context! File.read('path/to/your/server-bundle.js'), mode: :client_and_server
+```
+
+The optional `mode:` keyword argument can have one of the following values
+
+- `:client_and_server` (default) - component will be rendered server-side and mounted in the client
+- `:client` - component will be mounted in the client
+- `:server` - component will be render statically
+
+You can then render a component with
+
+```ruby
+RenderReact.("ExampleComponent", { example: "prop" })
+```
+
+It is possible to overwrite the context-rendering-mode by using specfic render methods:
+
+```ruby
+RenderReact.on_client_and_server("ExampleComponent") # server- and client-side
+RenderReact.on_client("ExampleComponent") # only client-side
+RenderReact.on_server("ExampleComponent") # only static
+```
+
+## MIT License
+
+Copyright (C) 2017 Jan Lelis <http://janlelis.com>. Released under the MIT license.
+
+React is BSD licensed.

data/Rakefile

@@ -0,0 +1,38 @@
+# # #
+# Get gemspec info
+
+gemspec_file = Dir['*.gemspec'].first
+gemspec = eval File.read(gemspec_file), binding, gemspec_file
+info = "#{gemspec.name} | #{gemspec.version} | " \
+       "#{gemspec.runtime_dependencies.size} dependencies | " \
+       "#{gemspec.files.size} files"
+
+# # #
+# Gem build and install task
+
+desc info
+task :gem do
+  puts info + "\n\n"
+  print "  "; sh "gem build #{gemspec_file}"
+  FileUtils.mkdir_p 'pkg'
+  FileUtils.mv "#{gemspec.name}-#{gemspec.version}.gem", 'pkg'
+  puts; sh %{gem install --no-document pkg/#{gemspec.name}-#{gemspec.version}.gem}
+end
+
+# # #
+# Start an IRB session with the gem loaded
+
+desc "#{gemspec.name} | IRB"
+task :irb do
+  sh "irb -I ./lib -r #{gemspec.name.gsub '-','/'}"
+end
+
+# # #
+# Run specs
+
+desc "#{gemspec.name} | Spec"
+task :spec do
+  sh "for file in spec/*_spec.rb; do ruby $file; done"
+end
+task default: :spec
+

data/lib/render_react.rb

@@ -0,0 +1,35 @@
+require_relative "render_react/version"
+require_relative "render_react/context"
+
+module RenderReact
+  class << self
+    def context
+      @context or raise ArgumentError, "Create a RenderReact::Context via RenderReact.create_context! first!"
+    end
+
+    def create_context!(*args)
+      @context = Context.new(*args)
+    end
+
+    def render_react(*args)
+      context.render_react(*args)
+    end
+    alias call render_react
+
+    def on_server(*args)
+      context.on_server(*args)
+    end
+
+    def on_client(*args)
+      context.on_client(*args)
+    end
+
+    def on_client_and_server(*args)
+      context.on_client_and_server(*args)
+    end
+
+    def on_server_and_client(*args)
+      context.on_server_and_client(*args)
+    end
+  end
+end

data/lib/render_react/context.rb

@@ -0,0 +1,58 @@
+require "execjs"
+require "securerandom"
+require "json"
+
+module RenderReact
+  class Context
+    attr_reader :app, :mode
+
+    def initialize(javascript_source = "", mode: :client_and_server)
+      @app = ExecJS.compile(javascript_source)
+      @mode = mode
+    end
+
+    def render_react(*args)
+      case mode
+      when :client
+        on_client(*args)
+      when :server
+        on_server(*args)
+      when :client_and_server, :server_and_client
+        on_client_and_server(*args)
+      else
+        raise ArgumentError, "unknown render mode"
+      end
+    end
+    alias call render_react
+
+    def on_client(component_name, props_hash = {})
+      component_uuid = SecureRandom.uuid
+      props_json = JSON.dump(props_hash)
+      "<div id=\"RenderReact-#{component_uuid}\"></div><script>#{client_script(component_name, props_json, component_uuid)}</script>"
+    end
+
+    def on_server(component_name, props_hash = {})
+      props_json = JSON.dump(props_hash)
+      app.eval(server_script(component_name, props_json, true))
+    end
+
+    def on_client_and_server(component_name, props_hash = {})
+      component_uuid = SecureRandom.uuid
+      props_json = JSON.dump(props_hash)
+      server_rendered = app.eval(server_script(component_name, props_json))
+      "<div id=\"RenderReact-#{component_uuid}\">#{server_rendered}</div><script>#{client_script(component_name, props_json, component_uuid)}</script>"
+    end
+    alias on_server_and_client on_client_and_server
+
+    private
+
+    def client_script(component_name, props_json, uuid)
+      "RenderReact.ReactDOM.render(RenderReact.React.createElement(RenderReact.components.#{component_name}, #{props_json}), document.getElementById('RenderReact-#{uuid}'))"
+    end
+
+    def server_script(component_name, props_json, static = false)
+      render_method = static ? 'renderToStaticMarkup' : 'renderToString'
+      "RenderReact.ReactDOMServer.#{render_method}(RenderReact.React.createElement(RenderReact.components.#{component_name}, #{props_json}))"
+    end
+  end
+end

data/lib/render_react/version.rb

@@ -0,0 +1,4 @@
+module RenderReact
+  VERSION = "1.0.0".freeze
+end
+

data/render_react.gemspec

@@ -0,0 +1,22 @@
+# -*- encoding: utf-8 -*-
+
+require File.dirname(__FILE__) + "/lib/render_react/version"
+
+Gem::Specification.new do |gem|
+  gem.name          = "render_react"
+  gem.version       = RenderReact::VERSION
+  gem.summary       = "Lo-fi way of rendering React components"
+  gem.description   = "Lo-fi way of rendering React components."
+  gem.authors       = ["Jan Lelis"]
+  gem.email         = ["mail@janlelis.de"]
+  gem.homepage      = "https://github.com/janlelis/render_react"
+  gem.license       = "MIT"
+
+  gem.files         = Dir["{**/}{.*,*}"].select{ |path| File.file?(path) && path !~ /^(pkg|spec)/ }
+  gem.executables   = gem.files.grep(%r{^bin/}).map{ |f| File.basename(f) }
+  gem.test_files    = gem.files.grep(%r{^(test|spec|features)/})
+  gem.require_paths = ["lib"]
+
+  gem.required_ruby_version = "~> 2.0"
+  gem.add_dependency "execjs", "~> 2.7"
+end

metadata

@@ -0,0 +1,71 @@
+--- !ruby/object:Gem::Specification
+name: render_react
+version: !ruby/object:Gem::Version
+  version: 1.0.0
+platform: ruby
+authors:
+- Jan Lelis
+autorequire: 
+bindir: bin
+cert_chain: []
+date: 2017-07-18 00:00:00.000000000 Z
+dependencies:
+- !ruby/object:Gem::Dependency
+  name: execjs
+  requirement: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '2.7'
+  type: :runtime
+  prerelease: false
+  version_requirements: !ruby/object:Gem::Requirement
+    requirements:
+    - - "~>"
+      - !ruby/object:Gem::Version
+        version: '2.7'
+description: Lo-fi way of rendering React components.
+email:
+- mail@janlelis.de
+executables: []
+extensions: []
+extra_rdoc_files: []
+files:
+- ".gitignore"
+- ".travis.yml"
+- CHANGELOG.md
+- CODE_OF_CONDUCT.md
+- Gemfile
+- Gemfile.lock
+- MIT-LICENSE.txt
+- README.md
+- Rakefile
+- lib/render_react.rb
+- lib/render_react/context.rb
+- lib/render_react/version.rb
+- render_react.gemspec
+homepage: https://github.com/janlelis/render_react
+licenses:
+- MIT
+metadata: {}
+post_install_message: 
+rdoc_options: []
+require_paths:
+- lib
+required_ruby_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - "~>"
+    - !ruby/object:Gem::Version
+      version: '2.0'
+required_rubygems_version: !ruby/object:Gem::Requirement
+  requirements:
+  - - ">="
+    - !ruby/object:Gem::Version
+      version: '0'
+requirements: []
+rubyforge_project: 
+rubygems_version: 2.6.11
+signing_key: 
+specification_version: 4
+summary: Lo-fi way of rendering React components
+test_files: []