Fork of Hello HTML

100%

Fork of Hello HTML

✓ Published0🌍 Public

Last edited May 6, 2021

Created on May 6, 2021

This example uses React and ReactDOM to render a static SVG scene of a yellow circle with a black outline and two smaller black circles positioned as eyes, creating a simple face. The SVG elements are defined directly within a React component and mounted into the DOM via ReactDOM's `render` method. The code also logs the React and ReactDOM objects to the console. The visualization relies on SVG's basic shape primitives (`circle` with `r`, `cx`, and `cy` attributes) and does not incorporate any external data or interaction.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Hello HTML

This example displays a simple yellow circle with a thick black outline and two smaller black circles positioned as eyes, rendered directly as SVG elements. The page also mounts a React application that logs the ReactDOM object and renders a heading reading "hello" into a root div. The code references React 18.2.0 from unpkg, though script tags contain typos for the source and bundle paths. The visualization is static, with no interactive behavior or data-driven components beyond the fixed geometric shapes.

Mmalveeka27

95% match

Loading thumbnail…

Fork of Fork of Hello HTML

This example shows a simple yellow circle with a black outline and two smaller black circles positioned as eyes, rendered as an SVG face. The visualization is built with a React component that uses React and ReactDOM to manage the page, while the SVG markup itself defines the shapes with explicit coordinates for the center, radius, and stroke properties. The code also sets up the HTML page with CSS styling that removes margins and hides overflow, and it loads the React libraries from a CDN before rendering the fixed 960 by 500 pixel SVG canvas.

AAynura Huseynova

95% match

Loading thumbnail…

Fork of Hello HTML

This example displays a static yellow face composed of three SVG circles, with a black outline and two small circles for eyes, rendered on a 960 by 500 canvas. The page loads the React library from a CDN, and the code logs the React object to the console. The visualization is built directly with inline SVG markup in the HTML body, while a separate JavaScript file simply executes the same console log command, demonstrating a minimal integration of React alongside an SVG drawing.

Ssean.smith@artifact.io

94% match

Loading thumbnail…

Fork of Hello HTML

This example displays a static yellow circle with two smaller black circles, evoking a simple face. Rendered as an SVG, the shapes are drawn directly within an HTML page. The code uses React to manage a separate heading element, while the visualizations are defined using raw SVG markup, including `<circle>` elements with explicit `r`, `cx`, `cy`, `fill`, and `stroke` attributes. The page loads React and ReactDOM from a CDN, and the SVG is output without additional data processing or interaction logic.

DDataVizardHB

94% match

Loading thumbnail…

Fork of Hello HTML

This example shows a static SVG scene of a yellow circle with two smaller black circles, rendered alongside a React-generated "Hello JSX" heading. The code combines a hand-written SVG directly in the HTML with a React component mounted via `ReactDOM.render`. It uses the React 17 UMD production builds from unpkg, with the SVG coordinates and styling defined inline, while the React app only produces a simple text element. No data or interaction is present; the visualization demonstrates how to embed SVG markup within a React-powered page.

Llohuza

94% match

Loading thumbnail…

Fork of Hello HTML

This example displays a simple yellow circle with two smaller black circles—a schematic face—rendered as static SVG elements on a 960x500 canvas. It pairs this hand-authored SVG with a React app that logs the React library to the console and attempts to render a "Hello JSX" heading via `ReactDOM.render`, though the component returns nothing. The code loads React 18.2.0 from a CDN and uses plain SVG circle elements, not D3 or other visualization libraries, highlighting a minimal integration of React with SVG markup.

HHannah Heejeong Lim

94% match

Loading thumbnail…

Fork of Hello HTML

This example shows a static SVG scene of a yellow circle with black outline and two smaller circles, alongside a React-rendered heading. The page loads React 18 and ReactDOM 17 via UMD scripts, then uses `ReactDOM.render` to insert JSX into a root div. The SVG circles are drawn directly in the HTML, with hardcoded coordinates and styles. The code demonstrates basic SVG markup combined with React’s declarative rendering, though the SVG elements are not generated through React components.

PPGC-2557

94% match

Loading thumbnail…

Fork of Hello HTML

A static SVG face rendered with React and raw SVG elements. The code uses React to manage the SVG structure, drawing a yellow circle for the face, black strokes for borders, and two smaller circles for eyes. The example demonstrates basic SVG shapes and React integration, with the SVG output displayed directly in the HTML page. It uses React 16.9.0 from a CDN and relies on native SVG attributes like `cx`, `cy`, `r`, and `fill`.

11G4S

94% match