CesiumJS Deep Dive Workshop

Stater code for the CesiumJS Deep Dive Workshop [slides], part of the 2025 Cesium Developer Conference.

This example repo is designed to get a new developer up and running with a starter CesiumJS app. It's built using Vite and is based on cesium-vite-example.

Requirements

• A Cesium ion account
• Visual Studio Code, or an IDE of choice
• NodeJS, version 20+, with npm
  • We recommend installing via nvm for first-time setup
• Optional: Git to clone from example repo

Setup

1. Download a copy of the code:

   • If using Git, fork this repository and sync it on your local machine at the desired location.
   • Otherwise, download the source code and unzip to your desired location.

2. In Visual Studio Code, open the workspace by using File > Open Folder... and selecting the cesiumjs-workshop directory from the previous step.

3. Open src/main.js.

4. Create a new Cesium ion token.

   

   • In Cesium ion, open the Access Tokens tab.
   • Press the Create token, button.
   • Give the token a name and leave the default permission settings. Press Create.
   • Copy the contents from Token.

   Learn more about managing access tokens in Cesium ion.

   [!TIP] It’s best practice to create a unique access token for each application you develop and to grant the minimal required access in order for your app to work. See Security best practices for tokens.

5. Back in src/main.js replace the content of your_ion_token_here by pasting the access token from the previous step.

6. Open the terminal by using Terminal > New Terminal.

7. Run the following commands to setup, build, and run the app:

   npm install # Install project dependencies

   npm run dev # Build and start the development server

8. In a browser, navigate to http://localhost:5173/

Developer scripts

This project includes a few tools to support development. Any of the following commands can be run in terminal.

• npm run eslint: Find and fix common JavaScript code issues using ESLint
• npm run prettier: Format all the code to a consistent style using Prettier
• npm run dev: Start a development server at http://localhost:5173/ using Vite
• npm run build: Run an optimized build for production and output to the dist/ directory

Resources

• CesiumJS Docs: The JavaScript API reference documentation
• Sandcastle: A live-coding environment with a large gallery of code examples
• Cesium Community Forum: Where the community and the development team ask and answer Cesium-related questions