Web Tech Viewer

Web Tech Viewer is a VS Code extension that automatically opens a webview panel on startup and displays a curated, formatted document of HTML, CSS, JavaScript, and XML code experiments.

Features

• Automatically opens on VS Code startup (activation event: onStartupFinished)
• Displays a clean and scrollable webview titled Web Technology Experiments
• Uses light document styling with dark code blocks
• Renders formatted sections with escaped code in pre blocks

How It Works

When the extension activates, it creates a webview panel using the VS Code API and injects static HTML via panel.webview.html.

Run It Locally (Make It Live in VS Code)

1. Install dependencies:

npm install

2. Compile once:

npm run compile

3. Press F5 in VS Code. This opens an Extension Development Host window where the extension runs live.

Package for Distribution

Create a .vsix file:

npm run package

Then install it locally with:

code --install-extension nothing-dev-web-tech-viewer-0.0.2.vsix

Publish to VS Code Marketplace

1. Create a publisher in the Marketplace (if not already created).
2. Create a Personal Access Token (PAT) from Azure DevOps.
3. Login once:

npx @vscode/vsce login nothing-dev

4. Publish using semantic version bump:

npm run publish:patch

Use publish:minor or publish:major when needed.

Requirements

No additional runtime requirements.

Known Issues

• No known issues currently.

Release Notes

See the changelog section in this project for version history.