Handy tricks

Things and tricks I revisit the most.

ngrock

ngrock establish a ssh tunnel from a localhost port to a remote url

$ngrok http --host-header=rewrite PORT

Happy testing in mobile and any other remote device you want!

Use browser js module for easiest (p)react demo

A great cdn: https://unpkg.com/

No bundling and shit !!

htm https://github.com/developit/htm

<!DOCTYPE html>
<html lang="en">
  <title>htm Demo</title>
  <script type="module">
    import { html, Component, render } from 'https://unpkg.com/htm/preact/standalone.module.js';
​
    class App extends Component {
      addTodo() {
        const { todos = [] } = this.state;
        this.setState({ todos: todos.concat(`Item ${todos.length}`) });
      }
      render({ page }, { todos = [] }) {
        return html`
          <div class="app">
            <${Header} name="ToDo's (${page})" />
            <ul>
              ${todos.map(todo => html`
                <li>${todo}</li>
              `)}
            </ul>
            <button onClick=${() => this.addTodo()}>Add Todo</button>
            <${Footer}>footer content here<//>
          </div>
        `;
      }
    }
​
    const Header = ({ name }) => html`<h1>${name} List</h1>`
​
    const Footer = props => html`<footer ...${props} />`
​
    render(html`<${App} page="All" />`, document.body);
  </script>
</html>
PreviousReact Hooks 3 - Test HooksNextAbout Micro FrontEnd

Last updated