The document discusses Opal, a Ruby runtime for JavaScript that compiles Ruby code to JavaScript. It can be used to write Ruby code that runs in the browser. The author expresses excitement about being able to use Ruby on both the frontend and backend and shares an example of using Opal to write a simple Ruby class that interacts with JavaScript. Key projects related to Opal are also listed.

1. OPAL - RUBY STYLE
RUBY IN THE BROWSER
Forrest Chang, OCRuby

3. TRENDS

4. NODE.JS

5. NOV 2011
MOST POPULAR REPO ON
GITHUB

7. JAVASCRIPT REVOLUTION

8. JS EVERYWHERE

9. IDEA: TAKE THE FRONTEND
LANGUAGE PUT IT THE BACK
END

10. GOOD IDEA?

11. LANGUAGES THAT COMPILE
TO JAVASCRIPT

21. JUST A FEW..

22. I GET THE IDEA PEOPLE
MIGHT PREFER SOMETHING
OTHER THAN JAVASCRIPT

23. IDEA: TAKE THE BACKEND
LANGUAGE, PUT IT ON THE
FRONT END

24. APPARENTLY A POPULAR
IDEA

25. Coffeescript

26. WHY

27. Better syntax
Less verbose, clearer, more intention
Some nice features, list comprehensions, implicit
return, etc.
Happier programmers *

28. Y U NO COFFEESCRIPT?

29. NOTHING WRONG WITH IT

30. BUT I LIKE RUBY BETTER

31. AND ALREADY WORK RUBY
ON THE BACKEND

32. BUT IF YOU’RE GOING TO
CHANGE THE SYNTAX, WHY
NOT ALL THE WAY?

33. HASN’T IT BEEN TRIED
BEFORE?

35. active

36. active
active

37. active Less ruby like
active

38. WHAT IS OPAL

40. RUNTIME?

41. USED TO BOTHER ME, MIGHT
BOTHER ME AGAIN LATER

42. JAVASCRIPT IS NOW THE “C
OF THE WEB”

43. DO PEOPLE CARE THAT
RUBY/LISP/PYTHON DOESN’T
LOOK/ACT LIKE C

44. AS LONG AS IT’S DONE WELL

45. EMBRACE THE
ABSTRACTION!

46. HTTPS://GITHUB.COM/OPAL
opalscript
Javascript + Ruby = OpalScript (Sssh, It's a secret and not
ready yet). • opal-spec
Last updated 14 hours ago Spec Library for opal
Last updated 23 days ago
• opal
Ruby runtime and library on top of Javascript • opal-rails
Last updated 14 hours ago Rails bindings for Opal JS engine
Last updated a month ago
• opal-jquery
Give opal access to jquery
Last updated 15 hours ago
• opal-erb
• opal-todos ERB parser and runtime for opal
Last updated a month ago
todomvc based opal example
Last updated 3 days ago
• vienna
• opal-node Client-side MVC framework for Opal
Last updated a month ago
Coffescript was so cool…
Last updated 3 days ago
• opal.github.com
Opal Website
Last updated 7 days ago

47. I HAD A SIMILAR IDEA

48. CHAI-SCRIPT
Hot drink motif. What drink is reddish?
Ruby equivalent of Coffeescript
Syntactic sugar, but ruby flavor
eventd subset of ruby w/idea of eventd gems for front
and backend
Ease ‘em into ruby

49. OPALSCRIPT
Likely the same idea
1st public commits just released on 10/24/2012 (i.e.
yesterday)
I’ll be keeping a key eye on this, not certain which I’ll
prefer

50. MY DRIVER

51. MATZ PRINCIPLE

52. MAKE THE PROGRAMMER
HAPPY

53. I.E. ME

54. I’M ENJOYING IT THUS FAR

55. A NEAT IDEA - TRY OPAL

56. An example: bit.ly/WFHLyh

57. CODE

59. modules to share functionality

60. modules to share functionality
wrapping js via x string

61. modules to share functionality
wrapping js via x string
Easy classes

62. modules to share functionality
wrapping js via x string
Easy classes
include module

63. modules to share functionality
wrapping js via x string
Easy classes
include module
easy attributes

64. modules to share functionality
wrapping js via x string
Easy classes
include module
easy attributes
calling my js wrapper

65. modules to share functionality
wrapping js via x string
Easy classes
include module
easy attributes
calling my js wrapper
Inheritance, baby

66. modules to share functionality
wrapping js via x string
Easy classes
include module
easy attributes
calling my js wrapper
Inheritance, baby
super, baby

67. modules to share functionality
wrapping js via x string
Easy classes
include module
easy attributes
calling my js wrapper
Inheritance, baby
super, baby
reusing JsUtils again...

68. COMPILED JS PRETTY
STRAIGHT FORWARD

69. BUT VERBOSE

71. Opal runtime

72. Opal runtime
matching line of code

73. Opal runtime
matching line of code
JsUtils module

74. Opal runtime
matching line of code
JsUtils module
js alert wrapped

75. Opal runtime
matching line of code
JsUtils module
js alert wrapped
Dude class

77. Gal class

78. Gal class
super

79. Gal class
super
Bystander class

80. Gal class
super
Bystander class
Instance invocations

81. WHAT’S TO LIKE?
Ruby
Rake
Rspec
nicer APIs
Ruby on the backend, Ruby on the frontend

82. RUBY EVERYWHERE!

83. Desktop/Server: MRI, JRuby, Iron Ruby, Rubinius
Faster Rubylike subset for JVM (Android and other
possibilities) Mirah
Embedded: mruby
IOS: RubyMotion
Browser/Node: opal

84. YOU KNOW WHAT I MEAN?

85. CODE ALONG

86. opal
opal-rails
opal-jquery
opal filter in haml
follow the gist https://gist.github.com/3956417