Fork of Hello HTML

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

LLuisEFerreira1998@gmail.com

Fork of Hello HTML

This example shows a simple yellow face with two black eyes rendered as SVG circles on a white background. The face is drawn directly in the HTML markup using the `circle` element, with fixed positions and radii for the head and eyes. The page imports React 16.9.0 from a CDN and logs the React object to the console in `index.js`, though the visualization itself does not rely on React for rendering. The SVG canvas is set to 960 by 500 pixels, and the body margin is zeroed for a clean display.

Fork of Hello HTML

This example shows a simple yellow circle with two black dots, resembling a face, rendered as static SVG shapes on a 960×500 canvas. The visualization uses plain SVG elements directly in the `index.html` file, with circles positioned via `cx`, `cy`, and `r` attributes and styled with fill and stroke properties. It references the React library in a script tag and logs `React` to the console, but does not actually use React components or any D3 code. The page imports ReactDOM from unpkg but only relies on the built-in browser SVG rendering.

NNina Mainusch

Fork of Hello HTML

This example shows a simple yellow circle with two smaller black circles positioned on it, resembling a face, rendered inside an SVG canvas. The page loads React 18 from a CDN, and `index.js` imports React and ReactDOM while logging the React object to the console. The SVG markup is written directly in the HTML body, and the `bundle.js` script suggests the React code is compiled separately, though the visible rendering does not yet use React components.

Hhadisotudeh

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

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

Fork of Hello HTML

A minimal React-rendered SVG sketch depicts a yellow circle with two smaller black eyes, forming a simple face on a blank canvas. The page loads React 17 from a CDN and uses inline SVG elements—`circle` tags with explicit `cx`, `cy`, `r`, and `fill` attributes—to draw the shapes at fixed coordinates. No interactivity or data binding occurs; the visualization is purely static, demonstrating a basic React and SVG setup within a single HTML file.

FFumi

Fork of Hello HTML

This example shows a simple yellow circle with two smaller black circles arranged as a face, rendered directly in an SVG element. The visualization uses React 17, loaded from the unpkg CDN, though the code only logs the React object to the console without invoking any React components. The SVG circles are drawn with hardcoded coordinates and dimensions, using attributes like `cx`, `cy`, and `r`, while CSS sets the body to have no margin and hidden overflow. The outer circle includes a black stroke, defining the face’s outline against the default white background.

Tturk-i