lucky_react v0.1.0

Helper methods for rendering React components in Lucky pages

lucky_react

LuckyReact provides helper methods for rendering React components in Lucky apps that use the lucky-react package.

GitHub release Build Status

Installation

Add this to your application's shard.yml:

dependencies:
  lucky_react:
    github: mikeeus/lucky_react

Usage

Make sure you've installed lucky-react and added it to your app.

Then in a Lucky page you can include the LuckyReact module and use the react method.

require "lucky_react"

class Home::IndexPage < GuestLayout
  include LuckyReact

  def content
    react "Wrapper" do # with a block
      h1 "Nested Header"
    end

    messages = [
      { id: 1, sender: "me", text: "Hi" },
      { id: 2, sender: "Chatbot", text: "Hello! How can I help?" }
    ]

    react "Chat", { messages: messages } # with props
  end
end

The react method will render divs with [data-react-class=Component] and [react-data-class={"props": "props"}] attributes that are picked up by lucky-react .

Contributing

  1. Fork it (https://github.com/your-github-user/lucky_react/fork)
  2. Create your feature branch (git checkout -b my-new-feature)
  3. Commit your changes (git commit -am 'Add some feature')
  4. Push to the branch (git push origin my-new-feature)
  5. Create a new Pull Request

Contributors

  • mikeeus Mikias Abera - creator, maintainer
Repository

lucky_react

Owner
Statistic
  • 4
  • 0
  • 0
  • 0
  • 0
  • over 6 years ago
  • July 27, 2018
License

MIT License

Links
Synced at

Fri, 22 Nov 2024 13:32:19 GMT

Languages