Fork of Hello HTML

100%

Fork of Hello HTML

✓ Published0🌍 Public

Last edited Apr 18, 2024

Created on Apr 16, 2024

A React-based reproduction of a classic "Hello HTML" page, this example renders a yellow smiley face using SVG circles inside a `react-dom` application. The code defines `width`, `height`, and `centerX`/`centerY` constants to position the main circle, while two smaller circles form the eyes. It uses the `ReactDOM.render` API from `react-dom@18.2.0` to mount the component into a `#root` div, replacing a commented-out static SVG version with a dynamic React implementation.

AI-generated description

A bare minimum HTML page.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Hello HTML

This example shows a yellow smiley face drawn with two black eyes on a white background. It renders static SVG circles directly in the HTML body using React and ReactDOM. The page imports React 16.7 and ReactDOM 18.2 from a CDN, and the root element is referenced by `document.getElementById('root')`. No interactive behavior or data updates are included; the face is drawn entirely with hardcoded circle coordinates and attributes.

PPittaro

93% match

Loading thumbnail…

Fork of Hello

This example renders a yellow smiley face as a static SVG graphic using React’s `ReactDOM.render` to mount a component that returns SVG circle elements. The component defines dimensions, eye offsets, and radii as constants, then draws a large outlined circle for the face and two smaller circles for the eyes. The code relies on React 17 and ReactDOM, with all shapes positioned manually via SVG attributes. It demonstrates basic declarative SVG creation within a React component, with no interactivity or data binding.

JJuan Manuel Castro

93% match

Loading thumbnail…

Fork of Hello HTML

This example renders a static yellow circle with a black border and two smaller black circles as eyes, forming a simple smiley-face-like shape. It uses React 17 to log the imported `React` object to the console via `index.js`, though no dynamic components are implemented. The SVG markup in `index.html` directly defines the shapes, with coordinates and radii hardcoded. The page loads React from a UMD distribution and defers the script execution, setting the body to hide overflow.

TTravis Luke

93% match

Loading thumbnail…

Fork of Hello HTML

This example draws a simple yellow smiley face as an SVG graphic using React and ReactDOM. It defines three circles: a large yellow circle for the head with a black stroke, and two smaller black circles positioned offset from the center to represent the eyes. The component sets explicit pixel dimensions for the SVG canvas and uses hard-coded constants for distances and radii. The rendering is accomplished by mounting the React component to a root div element, utilizing the production builds of React and ReactDOM loaded from a CDN.

GGrygorii Shevchenko

93% match

Loading thumbnail…

Fork of Hello HTML

This example shows a simple yellow smiley face drawn as an SVG circle with two eye circles, rendered statically without interaction. The code uses React 17 to define an `App` component that returns SVG elements, with ReactDOM rendering it into the root HTML container. Dimensions and positions are computed via JavaScript variables for the face radius, center coordinates, stroke width, and eye offsets. The visualization demonstrates basic SVG circle shapes and React’s declarative JSX syntax for composing graphics, with no external data or dynamic behavior.

SShankar Ghimire

93% match

Loading thumbnail…

Fork of Hello HTML

This example renders a simple yellow smiley face using React 17 and SVG. It shows how static SVG shapes can be composed directly within an HTML document, relying on the `svg` element’s default coordinate system. The drawing consists of three circles: a large yellow face with a black stroke, and two smaller black eyes centered at fixed positions. The code uses raw React JavaScript via `unpkg` and the `react.production.min.js` script, with no additional visualization libraries or data processing.

Xxwong22

92% match

Loading thumbnail…

Fork of Hello HTML

This fork of the Hello HTML example displays a static yellow smiley face drawn with SVG shapes. The visualization uses two black circles for eyes and a large yellow circle with a black stroke for the head, all positioned on an SVG canvas. The code loads React via a CDN and calls `console.log(React)`, though no React components are actually rendered. The page sets the body margin to zero and hides overflow, and the example is built with the React framework.

Rrachael.moseley@csedge.org

92% match

Loading thumbnail…

Fork of Hello HTML

This example displays a simple yellow smiley face with black-outlined circular eyes, rendered as static SVG shapes. The drawing is implemented with hardcoded `circle` elements inside an `<svg>` tag, using a 960-by-500 pixel canvas. Although the file references React via a production UMD script and logs `React` to the console in `index.js`, the visualization itself relies solely on plain HTML and SVG markup—no interactive behavior or data-driven updates are demonstrated.

Mmurguia.joe@gmail.com

92% match