Skip to content

Instantly share code, notes, and snippets.

class DateTimePicker < React::Component::Base
param :record # typically an active_record model, but can be any object really
param :field # attr (read and write) of the object to be updated.
after_mount do
initialize_timepicker
initialize_datepicker
end
def initialize_timepicker
module HyperStore
def self.included(base)
base.extend ClassMethods
end
module ClassMethods
def state_reader(state_name)
define_method(state_name) { React::State.get_state(self, state_name) }
end
end
# render {}
Few days ago i’ve started to learning and understanding Reactrb from scratch. Well, at now days React is a popular JavaScript library for building user interfaces. With a big pleasure let me introduce you Reactrb  —  an Opal Ruby wrapper of React.js library.
I recommended this wrapper for all Ruby On Rails funs, because when you get some experience (just little bit) to work with it — you just gorgeous this. First step in my way was understanding how to work param/params in Components and inside it’s.
Here is the my first lesson:
When you pass some params to Reactrb component from Controller or View, don’t forget about using it inside Component as method calls.
You must read the attributes by method calls.
Here is fast example. Though View we pass to Reactrb Component parameter user:
class MyClass < React::Component::Base
param :user, type: User
def render
div
@catmando
catmando / Reactrb-test-setup.md
Last active May 24, 2016 13:14
Adding Specs to Opal / React.rb Gems

Add development dependencies to .gemspec

  # your-gem.gemspec
  
  s.add_development_dependency 'reactive-ruby' # only if not already a dependency
  s.add_development_dependency 'rake'
  s.add_development_dependency 'rspec-rails', '3.3.3'
  s.add_development_dependency 'timecop'
  s.add_development_dependency 'opal-rspec', '0.4.3'
  s.add_development_dependency 'sinatra'
@catmando
catmando / fail.log
Created March 10, 2016 14:31
Intermittent Puffing Billing Failure
Started GET "/drafts/new/pro/1/job_type" for 127.0.0.1 at 2016-03-08 21:58:11 -0500
Processing by DraftsController#new as HTML
Parameters: {"other"=>"new/pro/1/job_type"}
ProductionCenter Load (2.2ms) SELECT `production_centers`.* FROM `production_centers` WHERE (domain_aliases LIKE '%127.0.0.1\n%') ORDER BY `production_centers`.`id` ASC LIMIT 1
ProductionCenter Load (0.6ms) SELECT `production_centers`.* FROM `production_centers` WHERE `production_centers`.`domain` = '127.0.0.1' LIMIT 1
[[[ Production Center: Test Production Center: /Users/mitch/railsdev/v4-catprint/app/views/home ]]]
* Locale set to 'en'
* using US Time Format
(0.5ms) SELECT COUNT(*) FROM `papers`
Paper Load (1.5ms) SELECT `papers`.* FROM `papers` WHERE `papers`.`production_center_id` = 1 AND `papers`.`is_active` = 1 ORDER BY `papers`.`display_order` ASC
^CJanBearsAire:v4-catprint mitch$ DRIVER=wk bundle exec rspec spec/integration/home_spec.rb
Finished "EnableLogging()" with response "Success()"
Wrote response true ""
Received "SetTimeout(-1)"
Started "SetTimeout(-1)"
Finished "SetTimeout(-1)" with response "Success()"
Wrote response true ""
Received "Visit(http://127.0.0.1:55368/session/new?return_to=/)"
Started "Visit(http://127.0.0.1:55368/session/new?return_to=/)"
Load started
^CJanBearsAire:v4-catprint mitch$ DRIVER=wk bundle exec rspec spec/integration/home_spec.rb
Finished "EnableLogging()" with response "Success()"
Wrote response true ""
Received "SetTimeout(-1)"
Started "SetTimeout(-1)"
Finished "SetTimeout(-1)" with response "Success()"
Wrote response true ""
Received "Visit(http://127.0.0.1:55292/session/new?return_to=/)"
Started "Visit(http://127.0.0.1:55292/session/new?return_to=/)"
Load started
@catmando
catmando / test-react-rb-spa.html
Last active December 21, 2015 18:10
Test React.rb editable single page app file
<!DOCTYPE html>
<!--[if IE]><![endif]-->
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Inline Reactive Ruby Demo</title>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="inline-reactive-ruby.js" />
@catmando
catmando / remote_puts.rb
Last active December 20, 2015 23:30
simple opal remote_require test
puts 'yes I seem to have been required!'
@catmando
catmando / thinking-in-react-1.rb
Last active December 20, 2015 22:03
Thinking In React - Code Slice 1 in Ruby
class ProductCategoryRow < React::Component::Base
param :category, type: String
def render
tr { th(colSpan: 2) { params.category } }
end
end
class ProductRow < React::Component::Base