In the beginning… there was HTML

First we need to learn a little HTML. This is so that we can understand what's going on with A-Frame, because it uses HTML. And we need to talk about files vs servers (https and CORS ...sigh!)

This is a very simple web page, with a simple stylesheet called "styles.css"

• Note: There is a javascript in this page that just says "Hello", and one that says "Bonjour!"
• We have a link to the A-Frame docs, open them in another tab, we're gonna need them. These examples are good (and version 1.3.0).
• See my digital creativity site for links to 3D modeling tools, like TinkerCad or Monster Mash and for places to find free 3D .gltf models (or .obj files).
• There is a comment, hidden in this paragraph that you can only see when editing. Why is this text red? Because it has a class added (see the stylesheet).
• Remix this project and get your own version, then CLOSE the preview pane and Preview » Preview in a new window. Trust me, Glitch makes a total arse of working on multi-page sites.
• Open A-Frame Docs in a new tab.

Let's begin.

Contents

• Our First VR World
• Adding Media (images, sounds)
• Adding GLB (or GLTF or OBJ) models
• Adding Lights
• Adding an Environment(s)
• Adding Animation
• Adding Code
• Adding Interactivity