# Building a Basic Application

Table of Contents

- Project Layout
- Hello Web Viewer
- Custom Operator Basics
- Advanced Operator Concepts
- Interacting with the Model Tree
- Color and Transparency
- Geometry and Texture Creation
- Model Loading and Aggregation
- Connection to the HOOPS Server

This tutorial will walk you through the fundamentals of writing a web application with HOOPS Visualize Web. After completion of this tutorial, you should have enough understanding of the technology to start integrating HOOPS Visualize Web into your application.

The prerequisite for this tutorial is a basic understanding of JavaScript (JS) development. No advanced CAD expertise or web development experience is required. All JS code examples are client-side and require no server backend except for the last section, which covers the HOOPS Server and streaming.

### Web Viewer Preview

Double click the Web Viewer canvas to reset the camera position!

#### Model Structure...

Not Ready

#### CameraCallback

    {
            "position": {
                    "x": 0,
                    "y": 0,
                    "z": 0
            },
            "target": {
                    "x": 0,
                    "y": 0,
                    "z": 0
            },
            "up": {
                    "x": 0,
                    "y": 0,
                    "z": 0
            },
            "width": 0,
            "height": 0,
            "projection": 0,
            "nearLimit": 0.0,
            "className": ""
    }

Conversation saved
HOOPSY BETA

### Hello! I'm HOOPSY

Your Docs generative AI assistant. Ask me anything about HOOPS Visualize Web or choose a sample question below to start a conversation:

What is HOOPS Visualize Web?
What are the latest release notes for HOOPS Visualize Web?
How do I start evaluating HOOPS Visualize Web?
How do I write my first sample application?
How can I get assistance?

HOOPSY may store conversations according to OpenAI's policy. Responses may not always be accurate.

HOOPSY is thinking...