Here's some handy stuff you can use in React!
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="mt-8 flow-root" data-controller="table-component"> | |
<div class="-mx-4 -my-2 overflow-x-auto sm:-mx-6 lg:-mx-8"> | |
<div class="inline-block min-w-full py-2 align-middle sm:px-6 lg:px-8"> | |
<div class="relative"> | |
<table class="min-w-full table-fixed border-collapse"> | |
<thead class="border-solid border-0 border-b border-gray-200"> | |
<tr> | |
<th scope="col" class="min-w-[12rem] py-3.5 pr-3 text-left text-sm font-semibold text-gray-900"> | |
<%= columns.first.heading %> | |
</th> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
class AddPost extends React.Component { | |
render() { | |
return <PostForm initialPost={ this.state.post } onSave={ (formData) => this.save(formData) } /> | |
} | |
save(formData) { | |
// make a POST request to /api/posts | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title></title> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/JSXTransformer.js"></script> | |
</head> | |
<body> | |
<div id='todo'></div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title></title> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/JSXTransformer.js"></script> | |
</head> | |
<body> | |
<div id='hello'></div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import React from 'react'; | |
import ReactOnRails from 'react-on-rails'; | |
// Simple example of a React "dumb" component | |
export default class SimpleHelloWorld extends React.Component { | |
render() { | |
return ( | |
<div className="container"> | |
Hello, { this.props.name }! | |
</div> |
- Make sure you have Git installed on your computer. If you don't, here's a guide to getting it setup - http://git-scm.com/downloads.
- If you haven't already, create an account on GitHub.
- Install the Heroku toolbelt, and set up an account on Heroku.
- Opening a 'command-line' interpreter
- RVM (osx only), Ruby & Ruby-gems installed
- A Text Editor (Sublime Text strong recommended)
- Have the command line cheatsheet handy
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
require 'lotus-model' | |
require 'lotus/model/adapters/memory_adapter' | |
module Admin | |
module Models | |
class Feature | |
include Lotus::Entity | |
self.attributes = :name | |
end |
NewerOlder