🕺 Run React code snippets/components from your command-line without config

Overview

react-run

CI

Run React code snippets/components from your command-line without config.

Usage

The entry point is a component called App, example:

Hello World

{count}

); }">
// example.js
export default function App() {
  const [count, setCount] = React.useState(0);

  return (
    <div style={{ background: "purple", color: "white", padding: "10px" }}>
      <h1>Hello World</h1>
      <p>{count}</p>
      <button onClick={() => setCount(count + Math.random())}>+ random</button>
    </div>
  );
}

You could run this with:

react-run example.js

This will open your default browser with your component loaded.

Check the examples/ to see what is supported.

Installation

With cargo:

cargo install react-run

Or use a binary from releases.

License

Licensed under the MIT licence.

Comments
  • could not compile `swc_ecma_ast`

    could not compile `swc_ecma_ast`

    the method eq_ignore_span exists for reference &num_bigint::BigInt, but its trait bounds were not satisfied --> C:\Users\aresyang.cargo\registry\src\mirrors.ustc.edu.cn-61ef6e0cd06fb9b8\swc_ecma_ast-0.65.4\src\lit.rs:66:20 | 66 | #[derive(Eq, Hash, EqIgnoreSpan)] | ^^^^^^^^^^^^ method cannot be called on &num_bigint::BigInt due to unsatisfied trait bounds | ::: C:\Users\aresyang.cargo\registry\src\mirrors.ustc.edu.cn-61ef6e0cd06fb9b8\num-bigint-0.2.6\src\bigint.rs:115:1 | 115 | pub struct BigInt { | ----------------- doesn't satisfy num_bigint::BigInt: EqIgnoreSpan | = note: the following trait bounds were not satisfied: num_bigint::BigInt: EqIgnoreSpan which is required by &num_bigint::BigInt: EqIgnoreSpan = note: this error originates in the derive macro EqIgnoreSpan (in Nightly builds, run with -Z macro-backtrace for more info)

    bug 
    opened by aresbit 5
  • feature: support typescript

    feature: support typescript

    Options

    1. Still using the browser to manage al js related, using something like https://github.com/harrysolovay/ts-browser

    2. Integrate swc/similar to parse jsx+ts

    enhancement help wanted good first issue 
    opened by UltiRequiem 2
  • :construction: live-reload

    :construction: live-reload

    Not working yet, the code is very experimental.

          const protocol =
            window.location.protocol === "http:" ? "ws://" : "wss://";
          const address = `${window.location.host}${window.location.pathname}ws`;
          const socket = new WebSocket(`${protocol}/${address}`);
          socket.onmessage = (msg) => {
            if (msg.data == "reload") window.location.reload();
          };
          console.log("Live reload enabled.");
    

    Modified from https://github.com/tapio/live-server/blob/master/injected.html

    This will close #1

    opened by UltiRequiem 1
  • ⬆️ Bump regex from 1.5.4 to 1.5.6

    ⬆️ Bump regex from 1.5.4 to 1.5.6

    Bumps regex from 1.5.4 to 1.5.6.

    Changelog

    Sourced from regex's changelog.

    1.5.6 (2022-05-20)

    This release includes a few bug fixes, including a bug that produced incorrect matches when a non-greedy ? operator was used.

    1.5.5 (2022-03-08)

    This releases fixes a security bug in the regex compiler. This bug permits a vector for a denial-of-service attack in cases where the regex being compiled is untrusted. There are no known problems where the regex is itself trusted, including in cases of untrusted haystacks.

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • ⬆️ Bump crossbeam-utils from 0.8.6 to 0.8.8

    ⬆️ Bump crossbeam-utils from 0.8.6 to 0.8.8

    Bumps crossbeam-utils from 0.8.6 to 0.8.8.

    Release notes

    Sourced from crossbeam-utils's releases.

    crossbeam-utils 0.8.8

    • Fix a bug when unstable loom support is enabled. (#787)

    crossbeam-utils 0.8.7

    • Add AtomicCell<{i*,u*}>::{fetch_max,fetch_min}. (#785)
    • Add AtomicCell<{i*,u*,bool}>::fetch_nand. (#785)
    • Fix unsoundness of AtomicCell<{i,u}64> arithmetics on 32-bit targets that support Atomic{I,U}64 (#781)
    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • feature: reload on file change

    feature: reload on file change

    To trigger file change:

    https://github.com/notify-rs/notify

    some very wip gists:

    • https://gist.github.com/UltiRequiem/322caeba160f4b4b41242e06657f5c28
    • https://gist.github.com/UltiRequiem/bf8caacb7b787e80796c2ec2688cb8a4
    enhancement help wanted good first issue 
    opened by UltiRequiem 0
Owner
Eliaz Bobadilla
A 15 year old, system/backend developer, bookworm, cheese lover, and musician. I like to work with Go and JavaScript.
Eliaz Bobadilla
The-way - A code snippets manager for your terminal.

The Way A code snippets manager for your terminal. Record and retrieve snippets you use every day, or once in a blue moon, without having to spin up a

OutOfCheeseError 254 Jan 7, 2023
FastSSH is a TUI that allows you to quickly connect to your services by navigating through your SSH config.

Connect quickly to your services ?? FastSSH is a TUI that allows you to quickly connect to your services by navigating through your SSH config. Instal

Julien 85 Dec 14, 2022
A list of crates with snippets used by me to learn more about Rust.

my-rust-examples This is a list of crates used by me to learn Rust. How to execute You can use a dependency called cargo-play: cargo install cargo-pla

Ronald 0 Jan 3, 2022
WIP. Goals: Treesitter highlighting, snippets, and a smooth intergration with neovim.

typst.nvim WIP. Goals: Tree-sitter highlighting, snippets, and a smooth integration with neovim. For the past week, I've been thinking what I want for

SeniorMars 66 Apr 9, 2023
Small command-line tool to switch monitor inputs from command line

swmon Small command-line tool to switch monitor inputs from command line Installation git clone https://github.com/cr1901/swmon cargo install --path .

William D. Jones 5 Aug 20, 2022
Supercharge your markdown including RSCx components.

rscx-mdx Render Markdown into HTML, while having custom RSCx components inside. Usage use rscx::{component, html, props}; use rscx_mdx::mdx::{Mdx, Mdx

Antonio Pitasi 4 Oct 21, 2023
The dead easy way to use config files in your rust project

Configr The dead easy way to use config files in your project This will load a config.toml file if it exists, otherwise it will create the needed fold

Carsten Kragelund Jørgensen 4 Jul 1, 2022
ripsecrets is a command-line tool to prevent committing secret keys into your source code.

ripsecrets is a command-line tool to prevent committing secret keys into your source code. ripsecrets has a few features that distinguish it from other secret scanning tools:

Brian Smith 588 Dec 30, 2022
Run adb in Termux without root permissions!

termux-adb Run adb in Termux without root permissions! Description This is a launcher for adb which enables debugging of one Android device from anoth

null 36 Dec 26, 2022
Save image from your clipboard 📋 as an image file directly from your command line! 🔥

Clpy ?? Save copied image from clipboard as an image file directly from your command line! Note It works only on windows as of now. I'll be adding sup

Piyush Suthar 13 Nov 28, 2022
Catch Tailwindcss Errors at Compile-Time Before They Catch You, without making any change to your code! Supports overriding, extending, custom classes, custom modifiers, Plugins and many more 🚀🔥🦀

twust Twust is a powerful static checker in rust for TailwindCSS class names at compile-time. Table of Contents Overview Installation Usage Statement

null 15 Nov 8, 2023
Pathfinding on grids using jumping point search and connected components.

grid_pathfinding A grid-based pathfinding system. Implements Jump Point Search with improved pruning rules for speedy pathfinding. Pre-computes connec

Thom van der Woude 16 Dec 12, 2022
Components of Fornjot that are no longer actively maintained. Pull requests still welcome!

Fornjot - Extra Components About These are extra components from the Fornjot repository, that are no longer actively maintained. Fornjot's goal was to

Hanno Braun 4 Jun 6, 2023
Transform jsx/tsx files to reactive views in js/ts to use in Web Components, insert into DOM or integrate with other libraries/frameworks

viewmill Features | Installation | Getting Started | Notes | Examples viewmill is aimed to create complex UIs from a simple form of JSX. It statically

apleshkov 6 Sep 4, 2023
Rust Server Components. JSX-like syntax and async out of the box.

RSCx - Rust Server Components RSCx is a server-side HTML rendering engine library with a neat developer experience and great performance. Features: al

Antonio Pitasi 21 Sep 19, 2023
Most intuitive global cli maker. *(lazy_static + config-rs + clap)

argone Most intuitive global cli maker. *(lazy_static + config-rs + clap) | Examples | Docs | Latest Note | [dependencies] argone = "0.5" Phases Parsi

Doha Lee 6 Dec 9, 2022
Irx-config - The library provides convenient way to represent/parse configuration from different sources

The irx-config library provides convenient way to represent/parse configuration from different sources. The main goals is to be very easy to use and t

Andriy Bakay 2 Sep 14, 2022
⚙️ A curated list of static analysis (SAST) tools for all programming languages, config files, build tools, and more.

This repository lists static analysis tools for all programming languages, build tools, config files and more. The official website, analysis-tools.de

Analysis Tools 10.7k Jan 2, 2023
🐙 Loads config and hosts for gh CLI in Rust.

gh-config-rs Loads config and hosts for gh CLI in Rust. Getting started [dependencies] gh-config = "0.2" Usage use std::error::Error; use gh_config::*

Naoki Ikeguchi 2 Jul 23, 2022