Blog / How to Supercharge Your CamScripter App Development with Claude Code

How to Supercharge Your CamScripter App Development with Claude Code

13 Nov 2026 - 08:11

Building custom micro-applications that run directly on Axis cameras with the CamScripter App is a powerful way to add edge analytics, custom UI, and third-party integrations to your video setup. But what if you could turn an idea into a working app in just a few hours, instead of the days or even weeks it would normally take?

With Claude Code (an agentic coding tool by Anthropic that runs directly in your terminal), you get a dedicated AI co-pilot. Give Claude the right documentation and a clear plan, and it can handle the heavy lifting: API integrations, UI components, and application logic.

This guide shows how to prompt and collaborate with Claude Code to build your next CamScripter app, using a real-world example: a script that reads live scores from your scoring system and displays them as a custom scoreboard overlay in the camera image.

The scoreboard is just one example. The same approach works for virtually any device or data source whose data you want to bring into the camera image: weather stations, flow meters, microcontrollers communicating over USB, Wi-Fi, or Bluetooth, and much more. Simply replace the scoring system in the prompts below with your own device and its API.

Claude Code isn’t the only option: you can follow the same workflow with other AI coding tools. We chose Claude Code because it’s the tool we have hands-on experience with.

Claude Code is a fantastic tool for rapidly turning your ideas into real, working prototypes. Production deployment, however, is a different story: software in production has to keep working in a fast-changing world, where systems receive security patches, cameras get new firmware versions, and the APIs of connected systems keep evolving. If you need that kind of certainty, turn to your system integrator, or feel free to contact us directly. You will get an application with a guarantee and regular maintenance, so this crucial aspect of running an application in production is reliably covered.

Step 0: Get Claude Code

Before you start, you need Claude Code installed on your machine.

  1. Install: Claude Code is available as an npm package (Node.js 18 or newer is required; on Windows or macOS, download and run the installer from the official Node.js website). Open your terminal and run:

    npm install -g @anthropic-ai/claude-code

    Other installation methods are described in the official documentation.

  2. Authenticate: Run claude in your terminal and follow the instructions to log in with your Claude account or Anthropic Console account. (Full official documentation: Claude Code Docs.)

Step 1: Onboard Claude with the Right Context

Claude is very capable, but it needs specific context about the Axis and CamStreamer ecosystems. Create an empty project folder, start Claude Code in it, and feed it the foundational documentation.

Use this prompt to prime Claude:

“I want to write a custom application for the CamScripter App, which runs locally on Axis cameras. Before we start coding, please study the following documentation:

  1. How to write apps using the core library: https://github.com/CamStreamer/CamStreamerLib
  2. How to build the UI (study this example in particular): https://github.com/CamStreamer/CamScripterApp_examples/tree/master/videoCheckpoint
  3. The Axis VAPIX API documentation: https://developer.axis.com/vapix/
  4. The CamStreamer ACAP API documentation: https://camstreamer.survilla.support/camstreamer-api/#intro
  5. [Optional: link to the documentation of your own system — in our example, the API of your scoring system]

Let me know when you have analyzed these resources, and I will give you the specific goal.”

Tip: Claude reads source code more reliably than web pages. Ask Claude to clone the GitHub repositories into your project folder so it can browse the library and examples directly. You can also ask Claude to summarize what it learned into a CLAUDE.md file in the project. Claude Code loads this file automatically, so the context carries over to future sessions.

Step 2: Define the Goal and Request a Plan

Never ask the AI to just “write the code” all at once. For integrations with camera hardware and third-party systems, you need a step-by-step architecture first.

Define the exact requirements, including the UI parameters, logic, and data sources. Because Claude Code runs on your computer, it can reach devices on your local network, so you can give it access to your test camera and scoring system. Use a test environment and a dedicated camera user account, never production credentials.

Use this prompt to define the project:

“Here is our goal: I need an app that reads the live score from our scoring system and displays it as a scoreboard in the camera image using the CamScripter App and the CamOverlay App.

Requirements:

  • UI: The settings page must let the user enter the names of the home and guest teams and choose a color for each team.
  • Data source: The scoring system is available at [IP_B] ([API / protocol], credentials if needed). Update the scoreboard whenever the score changes.
  • Test environment: The camera is at [IP_A] (user: [user], password: [password]). You have permission to run curl commands to explore the APIs of both the camera and the scoring system.

Task: Do not write the full code yet. Please create a step-by-step development plan. Break it down into project structure, UI creation, fetching data from the scoring system, score processing logic, and rendering the scoreboard via the CamOverlay API.”

Tip: Show Claude what the scoreboard should look like: drag and drop a screenshot or mockup of the desired design into the Claude Code terminal. You can also switch Claude Code to Plan Mode (Shift+Tab) so it only analyzes and plans without editing files.

Step 3: Approve, Modify, and Execute

Review the plan Claude generates. CamScripter apps require a specific package structure (e.g. manifest.json, main.js, html/index.html; compare with the example repository), so make sure the plan includes it.

  • If the plan looks good, tell Claude: “The plan is approved. Please proceed with Step 1 and generate the files.”
  • Let Claude create the files directly in your workspace. It will write the code, ask for your permission before running terminal commands, and save the scripts.
  • Proceed step by step and check the result of each step before moving on to the next one.

Step 4: The Independent Code Review

AI can occasionally use deprecated API endpoints or introduce logical errors. Once Claude finishes writing the code, ask it to review the work with fresh eyes. For best results, have the review done by a separate subagent: it starts with a clean context and sees only the code, so it isn’t influenced by the reasoning that produced it.

Use this prompt for the review:

“Use a separate subagent that acts as an independent Senior QA Developer and have it conduct a thorough code review of the scripts in this project.

Look specifically for:

  • Incorrect usage of the CamStreamerLib, CamOverlay, or VAPIX APIs.
  • Unhandled errors when the camera or the scoring system is temporarily unavailable (reconnection logic).
  • Invalid or missing data coming from the scoring system.
  • Security issues with credential handling in the UI and configuration.

Then summarize the issues it found, suggest fixes, and apply them.”

Step 5: Test on the Camera

Once the review fixes are applied, it’s time for the final test.

  1. Package your project as a ZIP file (or ask Claude to generate a build/package script).
  2. Upload the package to the CamScripter App on your camera.
  3. Open the app settings, fill in the team names, colors, and connection details, and verify that the scoreboard is displayed correctly in the camera image and updates when the score changes.

If you encounter a bug, copy the error log from the CamScripter console (filter it to show only your script) and paste it directly into Claude Code:

“I ran the script on the camera and got this error in the console: [paste error]. Please investigate and fix the code.”

Going Further: CamStreamer Cloud

Your script doesn’t have to be on the same network as the camera. If you need to connect to a camera running at another location or on a different network, you can handle the integration through CamStreamer Cloud and its API.

Documentation for the CamStreamer Cloud API: https://camstreamer.survilla.support/api-management/#intro. Add this link to the prompt in Step 1 so that Claude studies it as well.

Coming soon: CamStreamer Cloud will introduce a new event engine that will let you display your own external events on the recording timeline and trigger further actions from there.

Summary

Whether you are integrating a scoreboard, a weather station, or a custom sensor, the workflow stays the same. By giving Claude Code the right API documentation, making it plan before it codes, and using it for independent code reviews, you can turn days of API troubleshooting into a few hours of productive AI collaboration. Happy coding!

Author
CamStreamer Team

Blog / How to Supercharge Your CamScripter App Development with Claude Code


Contact us

We appreciate your interest in our CamStreamer solutions. Please use our contact form on the right to send an email to either our sales or support department. Answers to frequently asked questions can be found here.

Have a question or suggestion about a specific product? Please contact us at sales@camstreamer.com.

Need assistance with any of our services? Check our FAQs or contact us at support@camstreamer.com.


You can also reach out to our nearest local partners, who are always ready to assist.

Choose a department *
Send us your non-binding enquiry
Your first name
Your last name
Company
Email address *
Your phone number
Your message *