Skip to main content

Creating a New Web Project

tip

You can also start from existing Web projects

Modern Web Project Essentials​

To build a brand-new WebSpatial project from scratch, first create a modern Web project (currently React-only) that meets the following requirements:

  • Use HTML APIs (for example, JSX) through a UI framework such as React
  • Use CSS APIs through the same UI framework (supports PostCSS, TailwindCSS, CSS-in-JS, and other approaches)
  • Manage project dependencies with npm or any npm-compatible package manager (like pnpm)
  • Compile and build HTML and static web assets (JS, CSS, images, etc.) that run directly in desktop / mobile browsers
  • Run a Web server that exposes URLs accessible from desktop / mobile browsers

Project Templates for Getting Started​

Below are several options for creating a modern Web project that satisfies the requirements above. Any of these can serve as the starting point before you add the WebSpatial SDK.

note

Ensure Node.js is installed first. See the official Node.js site for installation instructions.

  1. React + Vite

    npx create-vite --template react

  2. React + Vite + TypeScript

    npx create-vite --template react-ts

  3. React + Next.js

    npx create-next-app --js

  4. React + Next.js + TypeScript

    npx create-next-app --ts

  5. React + Rsbuild

    npx create-rsbuild --template react

  6. React + Rsbuild + TypeScript

    npx create-rsbuild --template react-ts

  7. React + Rspack

    npx create-rspack --template react

  8. React + Rspack + TypeScript

    npx create-rspack --template react-ts

Adding Other Common Features (Optional)​