How to use hops - 10 common examples

To help you get started, we’ve selected a few hops examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github xing / hops / packages / spec / integration / jest-preset / __tests__ / preset.js View on Github external
it('allows to require hops runtime code', () => {
    const hops = require('hops');
    expect(hops.render).toBeDefined();
  });
github xing / hops / packages / spec / integration / typescript / index.tsx View on Github external
import { render, importComponent } from 'hops';
import * as React from 'react';

import Headline from './headline';

const Content = importComponent(() => import('./content'));

export default render(
  <>
    
    <content>
  
);
</content>
github xing / hops / packages / spec / integration / react / index.js View on Github external
Header,
  importComponent,
  Miss,
  render,
  withServerData,
  useServerData,
  Status,
  withConfig,
  useConfig,
} from 'hops';

import React from 'react';
import { Link, Redirect, Route, Switch } from 'react-router-dom';
import FlowText from './flow-text';

const Text = importComponent(() =&gt; import('./text'));

const ServerDataHoC = withServerData(({ serverData }) =&gt; (
  <output>{serverData.method}</output>
));

const ServerDataHook = () =&gt; {
  const serverData = useServerData();

  return <output>{serverData.method}</output>;
};

const ConfigHoC = withConfig(({ config: { hoc } }) =&gt; <h1>{hoc}</h1>);

const ConfigHook = () =&gt; {
  const config = useConfig();
github xing / hops / packages / spec / integration / hops / index.js View on Github external
import React from 'react';
import { importComponent, render } from 'hops';

const Text = importComponent('./text');

const loader = load =&gt;
  Promise.race([new Promise((_, reject) =&gt; setTimeout(reject, 10000)), load()]);

const renderText = ({ Component, loading, ...props }) =&gt; {
  return loading ? <p>Fetching content…</p> : ;
};

export function App() {
  return
github xing / hops / app / src / main.js View on Github external
import React, { createClass, PropTypes } from 'react';
import { Route } from 'react-router';
import { connect } from 'react-redux';

import { render, register } from 'hops';

import { headline } from './style.css';

const type = 'updateGreeting';
const select = register('home', (state = {}, action) => (
  (action.type !== type) ? state : { ...state, greeting: action.payload }
));
const update = (payload) => ({ type, payload });

const Home = connect(select, { update })(
  createClass({
    displayName: 'Home',
    propTypes: {
      greeting: PropTypes.string,
      update: PropTypes.func
    },
    componentDidMount() {
      this.props.update('Hello World!');
    },
    render() {
      return (
github xing / hops / packages / build / commands / develop.js View on Github external
'Clean up artifacts in build / cache directories before ' +
          'building',
        type: 'boolean',
      },
    },
    handler: function developHandler(argv) {
      if (argv.static) {
        process.env.HOPS_MODE = 'static';
      }
      require('..').runServer(argv);
    },
  });
};

if (require.main === module) {
  require('hops').run(module.exports, 'develop');
}
github xing / hops / packages / spec / integration / react / index.js View on Github external
const ConfigHook = () =&gt; {
  const config = useConfig();

  return <h1>{config.hook}</h1>;
};
github xing / hops / packages / spec / integration / react / index.js View on Github external
const ServerDataHook = () =&gt; {
  const serverData = useServerData();

  return <output>{serverData.method}</output>;
};
github xing / hops / packages / spec / integration / react / index.js View on Github external
import { Link, Redirect, Route, Switch } from 'react-router-dom';
import FlowText from './flow-text';

const Text = importComponent(() =&gt; import('./text'));

const ServerDataHoC = withServerData(({ serverData }) =&gt; (
  <output>{serverData.method}</output>
));

const ServerDataHook = () =&gt; {
  const serverData = useServerData();

  return <output>{serverData.method}</output>;
};

const ConfigHoC = withConfig(({ config: { hoc } }) =&gt; <h1>{hoc}</h1>);

const ConfigHook = () =&gt; {
  const config = useConfig();

  return <h1>{config.hook}</h1>;
};

export default render(
  <div>
    Link to two
    </div>
github xing / hops / packages / spec / integration / react / index.js View on Github external
Miss,
  render,
  withServerData,
  useServerData,
  Status,
  withConfig,
  useConfig,
} from 'hops';

import React from 'react';
import { Link, Redirect, Route, Switch } from 'react-router-dom';
import FlowText from './flow-text';

const Text = importComponent(() =&gt; import('./text'));

const ServerDataHoC = withServerData(({ serverData }) =&gt; (
  <output>{serverData.method}</output>
));

const ServerDataHook = () =&gt; {
  const serverData = useServerData();

  return <output>{serverData.method}</output>;
};

const ConfigHoC = withConfig(({ config: { hoc } }) =&gt; <h1>{hoc}</h1>);

const ConfigHook = () =&gt; {
  const config = useConfig();

  return <h1>{config.hook}</h1>;
};

hops

Hops main Package to build and run Hops applications

MIT
Latest version published 2 years ago

Package Health Score

51 / 100
Full package analysis