hyperstack

How to use HTTP in hyperstack


I have made a basic install of a hyperstack rails app using hyperstack.org's installation instructions, trying to add a HTTP.get request in an after_mount callback.

Not really sure what else I could try, thought HTTP would be a standard option

class App < HyperComponent
  include Hyperstack::Router

  after_mount do
    HTTP.get('/example.json')
  end

  render do
    DIV() do
      'App'
      # NodeDisplay
      # define routes using the Route psuedo component.  Examples:
      # Route('/foo', mounts: Foo)                : match the path beginning with /foo and mount component Foo here
      # Route('/foo') { Foo(...) }                : display the contents of the block
      # Route('/', exact: true, mounts: Home)     : match the exact path / and mount the Home component
      # Route('/user/:id/name', mounts: UserName) : path segments beginning with a colon will be captured in the match param
      # see the hyper-router gem documentation for more details
    end
  end
end

the error received is:

Uncaught error: HTTP: uninitialized constant App::HTTP
in App (created by Hyperstack::Internal::Component::TopLevelRailsComponent)
in Hyperstack::Internal::Component::TopLevelRailsComponent

Solution

  • Simple answer: The HTTP library is not by default included in Opal or Hyperstack.

    You can include it as part of the Opal jQuery wrapper, or with a minimal Opal Browser::HTTP library.

    To add the jQuery wrapper to your Hyperstack application do the following:

    1. Import the Hypestack jquery wrapper by adding
      import 'hyperstack/component/jquery', client_only: true
      to your config/initializers/hyperstack.rb file.

    2. Then include the actual jquery javascript code in your assets:

      If using webpacker run yarn add jquery in your terminal, and then add this line to the javascripts/packs/client_only.js file: jQuery = require('jquery');

      If not using webpacker instead add import 'jquery', client_only: true to the hyperstack initializer file.

    If you just want to use the more minimal Browser::HTTP module, add

    import 'browser/http

    to your config/initializers/hyperstack.rb file.

    After changing your hyperstack.rb you will have to clear the rails tmp cache by running rm -rf tmp/cache

    Note: When using the browser version you will need to use Browser::HTTP instead of simply HTTP.