Skip to content
This repository was archived by the owner on Oct 19, 2018. It is now read-only.

Commit a606055

Browse files
author
Barrie Hadfield
committed
added NPM ruby-hyperloop
1 parent fc57ca8 commit a606055

File tree

4 files changed

+277
-12
lines changed

4 files changed

+277
-12
lines changed

.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
node_modules

README.md

+41-9
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
# Hyperloop JS
1+
# Ruby Hyperloop
22

33
### Hyperloop.js
44

@@ -57,17 +57,39 @@ See all the installation options on http://ruby-hyperloop.io/
5757

5858
## How to use
5959

60+
### Hyperloop Components, Operations, Stores, and Router
61+
6062
The simplest way to install is with NPM.
6163

6264
```
63-
npm install hyperloop-js --save
65+
npm install ruby-hyperloop --save
6466
```
6567

66-
TODO: requires and how they work....
68+
Then include the libraries in your Webpack script:
69+
70+
```javascript
71+
// following needed before hyperloop-js
72+
ReactDOM = require('react-dom');
73+
React = require('react');
74+
createReactClass = require('create-react-class');
75+
76+
// following needed before hyper-router (if you are using ReactRouter)
77+
ReactRouter = require('react-router');
78+
ReactRouterDOM = require('react-router-dom');
79+
History = require('history');
6780

68-
### Hyperloop-JS
81+
// Jquery and Opal
82+
$ = require("jquery");
83+
require('ruby-hyperloop/opal');
84+
85+
// Hyperloop Components, Stores and Operations
86+
require('ruby-hyperloop/hyperloop');
87+
88+
// Hyper-router if you are using ReactRouter
89+
require('ruby-hyperloop/hyper-router');
90+
```
6991

70-
Add the following to your HTML page:
92+
If you are not using NPM/Webpack then you will need to bring in Hyperloop-JS in your HTML page:
7193

7294
```html
7395
<head>
@@ -87,13 +109,21 @@ Add the following to your HTML page:
87109
</head>
88110
```
89111

90-
That is all you need for Hyperloop Components, Stores, Operations and Router client-side. If you have a back-end building Hyperloop code you are good to go.
112+
**That is all you need for Hyperloop Components, Stores, Operations and Router client-side. If you have a back-end building Hyperloop code you are good to go!**
91113

92-
If you want to do in browser compiling then follow the next step.
114+
### Hyperloop Compiler
93115

94-
### Hyperloop-compiler
116+
If you do not have a back-end and you want to compile your Hyperloop code in your browser then follow this step.
95117

96-
Complete the Hyperloop-JS step above then add the following to your HTML page:
118+
#### Setup
119+
120+
After completing the steps above, add the following to your Webpack script:
121+
122+
```javascript
123+
require('ruby-hyperloop/hyperloop-compiler');
124+
```
125+
126+
Or add the following to your HTML page:
97127

98128
```html
99129
<head>
@@ -102,6 +132,8 @@ Complete the Hyperloop-JS step above then add the following to your HTML page:
102132
</head>
103133
```
104134

135+
#### Usage
136+
105137
Specify your ruby code inside script tags or link to your ruby code using the src attribute `<script type="text/ruby" src=.../>`
106138

107139
```html

package-lock.json

+228
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

+7-3
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
2-
"name": "hyperloop-js",
3-
"version": "1.0.0",
2+
"name": "ruby-hyperloop",
3+
"version": "0.0.3",
44
"description": "Ruby Hyperloop client-side components",
55
"main": "./dist/hyperloop.js",
66
"scripts": {
@@ -20,5 +20,9 @@
2020
"bugs": {
2121
"url": "https://github.com/ruby-hyperloop/hyperloop-js/issues"
2222
},
23-
"homepage": "http://ruby-hyperloop.io/"
23+
"homepage": "http://ruby-hyperloop.io/",
24+
"dependencies": {
25+
"react": "^15.6.1",
26+
"react-router-dom": "^4.2.2"
27+
}
2428
}

0 commit comments

Comments
 (0)