Next.jsReact启动器

vertex-nextjs-starter — Next.js 启动器模板

作者 Vertexvis

基于 Next.js 的 Vertex 平台应用启动模板,可查看场景、应用相机状态并读取场景项元数据。

看看你的网站会是什么样

浏览真实页面截图,比较内容排版与手机效果。点击下方缩略图切换,放大查看整页细节。

1 个预览视图
桌面端首页
桌面端截图首屏预览

由服务器浏览器实际访问页面后截取。

目前有 1 张原始预览,可打开完整图片查看设计细节。

截图用于了解视觉与布局,交互效果请以实际项目为准。

采集于 2026-10-07查看来源

值得关注的模板亮点

从已有项目资料中,快速了解它的特点。

01

演示查看场景、应用相机状态、读取场景项元数据三类基础能力

02

按 Vertex 平台集成最佳实践组织的 Next.js 应用结构

03

提供 Docker 与本地 yarn dev 两种启动方式

04

支持链接本地 vertex-web-sdk 进行调试

05

README 给出 Vercel、Netlify、OpenNext 部署到 AWS 的选项

06

采用 MIT 许可,可免费使用、修改、商用和分发

模板详细介绍

这是一个面向 Vertex 3D 平台的 Next.js 启动模板,用于搭建集成 Vertex 平台的原型应用。模板演示了三个基础能力:查看场景、应用相机状态,以及查看场景项的元数据。README 说明其按 Vertex 平台集成的最佳实践编写,并指向官方指南帮助开发者先搭好基础,再自行扩展功能。

项目结构清晰:public/ 存放静态资源,src/ 下分为 components(页面组件)、lib(共享库与工具)、pages(Next.js 页面)以及 pages/api(Next.js API 端点)。

运行方式有两种。Docker 方式:复制 .env.local.template 为 .env.local 并按需修改,执行 docker-compose --file ./docker-compose.yml up 启动,访问 http://localhost:3000;拉取代码变更后需重新 build 再 up。本地开发方式:同样先准备 .env.local,执行 yarn install 安装依赖,再运行 yarn dev 启动开发服务器。若需配合本地 vertex-web-sdk 调试,需在 vertex-web-sdk 中 yarn build 并 yarn link,修改 package.json 的 dev 脚本与 resolutions 指向本地包,再 yarn install。

部署方面 README 列出 Vercel、Netlify 以及通过 OpenNext 部署到 AWS 三种选项。仓库采用 MIT 许可,可免费使用、修改、商用和分发该版本代码,但演示图片、字体、图标等第三方素材需单独核对许可,域名、托管等外部服务可能另行收费。

Next.jsReact启动器

适合你的项目吗?

适用场景

  • 作为集成 Vertex 3D 平台的原型应用起点
  • 在本地或 Docker 中运行并浏览 Vertex 场景示例
  • 基于 pages/api 目录扩展自定义 API 端点
  • 链接本地 vertex-web-sdk 进行组件调试

适合人群

  • 需要快速搭建 Vertex 平台原型应用的开发者
  • 使用 Next.js 与 React 的前端团队
  • 希望参考 Vertex 平台集成实践的项目

上手与定制指南

结合仓库当前版本的说明,按下面的资料检查内容、配置与运行要求。

  1. 1

    复制 .env.local.template 为 .env.local,并按需修改其中的值

  2. 2

    Docker 运行:docker-compose --file ./docker-compose.yml up,访问 http://localhost:3000

  3. 3

    本地开发:yarn install 后运行 yarn dev

  4. 4

    拉取代码变更后需重新执行 docker-compose build 再 up

  5. 5

    链接本地 vertex-web-sdk 时需修改 package.json 的 dev 脚本与 resolutions 并重新 yarn install

查看仓库使用说明

授权与来源资料

使用条件与限制

免费使用 · 保留许可声明

本次收录的是公开仓库中采用 MIT 许可的免费版本;免费范围为该版本代码,不代表外部服务或第三方素材免费。

使用时需要遵守

  • 允许免费使用、修改、商用和分发该版本代码。
  • 分发代码副本或实质性部分时,保留原作者版权声明和完整 MIT 许可声明。
  • 代码按现状提供;担保与责任限制以原许可证及适用法律为准。

额外费用与待核对事项

  • 演示图片、字体、图标及其他第三方素材需按各自许可核对,不能仅凭代码的 MIT 许可判断。
  • 域名、托管、数据库、支付或 AI 等外部服务可能另外收费。
  • 该模板是 Vertex 平台的启动模板,需配合 Vertex 平台使用;查看场景、相机状态与元数据等功能依赖 Vertex 平台账号与 SDK。
  • README 将其定位为原型应用起点,需按官方指南自行扩展功能,并非可直接上线的完整产品。
  • 运行前需复制并配置 .env.local 环境变量文件,可能涉及 Vertex 平台凭据等外部服务配置。
  • 如需配合本地 vertex-web-sdk 调试,需先构建并 link 该外部 SDK 仓库,属于额外的外部依赖步骤。
查看原文依据

Permission is hereby granted, free of charge

许可证原文

Use our starter application template using the NextJS framework.

README 原文

[Follow our guide](http://developer.vertex3d.com/docs/guides/build-your-first-app) to build a foundation, then add functionality to create your own prototype application using Vertex.

README 原文

1. Copy `.env.local.template` to `.env.local` and optionally edit values

README 原文

1. `yarn build` in `vertex-web-sdk` 1. `yarn link` from local `vertex-web-sdk`

README 原文
https://github.com/Vertexvis/vertex-nextjs-starter/blob/main/LICENSEhttps://github.com/Vertexvis/vertex-nextjs-starter/blob/main/README.md

DeepSeek 根据仓库许可证和 README 整理 ·2026-10-07。结果仅覆盖已读取资料,依赖、图片、字体及后续条款变更以各自原文为准。

项目核对记录与介绍依据

模板资料

来源平台
GitHub
资料与维护参考分
资料较完整 · 88 / 100
技术栈
Next.js · React
网站类型
启动器
这个分数如何计算

本站按许可资料(最高30分)、演示链接(12分)、预览图(10分)、Star数(15分)、记录的维护时间(15分)、描述完整度(8分)、功能记录(5分)和分类资料(5分)计算。它不是代码、安全或性能测试,也不是 Google 评分;有链接不代表已实测可用。

这个项目需要核对什么

记录的仓库更新时间
2026-10-07
截图检查日期
2026-10-07

已收录演示链接。请用你的内容与屏幕尺寸检查;有演示不代表表单、认证或支付已经可用。

目录记录的主要技术栈是 Next.js。请通过依赖清单和锁文件核对实际版本与托管要求。这些说明基于收录资料,不代表代码审计或部署实测。

查看具体选型方法 →

介绍的制作与核对状态

介绍由 AI 辅助整理目录与仓库资料。仓库作者不等于这篇介绍的审核者。

审核声明: [email protected] · 2026-10-08

查看当时使用的来源资料

SHA-256: 25335bf1010b77044a6fa11c4fde9987db395c9573389e2786929a1b26f9e7e9

2026-10-07T18:29:23.931Z

来源文件 / 仓库
# Vertex NextJS Starter

Use our starter application template using the NextJS framework.

View a scene, apply camera states, and see a scene item's metadata. We built this application following best practices for integrating the Vertex platform. [Follow our guide](http://developer.vertex3d.com/docs/guides/build-your-first-app) to build a foundation, then add functionality to create your own prototype application using Vertex.

## Run locally in Docker

1. Copy `.env.local.template` to `.env.local` and optionally edit values
1. Run `docker-compose --file ./docker-compose.yml up` to start the app locally
1. Browse to http://localhost:3000

If you pull down changes, you'll need to run `docker-compose --file ./docker-compose.yml build` to build them and then `docker-compose --file ./docker-compose.yml up` again.

## Local development

1. Copy `.env.local.template` to `.env.local` and optionally edit values
1. Install dependencies, `yarn install`
1. Run `yarn dev` to start the local development server
1. Browse to http://localhost:3000

### With Vertex-web-sdk

1. `yarn build` in `vertex-web-sdk`
1. `yarn link` from local `vertex-web-sdk`
1. make these changes in package.json

```json
  "scripts": {
    "dev": "NODE_OPTIONS=--preserve-symlinks next dev --webpack",
    ...
  },
  "resolutions": {
    "@vertexvis/viewer": "portal:../vertex-web-sdk/packages/viewer",
    "@vertexvis/viewer-react": "portal:../vertex-web-sdk/packages/viewer-react",
    ...
  }
```

1. `yarn install` to pull local packages

### Project organization

```text
public/       // Static assets
src/
components/ // Components used in pages
lib/        // Shared libraries and utilities
pages/      // Pages served by NextJS
  api/      // API endpoints served by NextJS
```

### Deployment

A few options for deployment,

- [Vercel](https://nextjs.org/docs/deployment)
- [Netlify](https://www.netlify.com/blog/2020/11/30/how-to-deploy-next.js-sites-to-netlify/)
- [AWS via OpenNext](https://opennext.js.org)
反馈内容错误

看看同类模板

对比同技术栈与用途的模板,找到更适合的视觉与内容结构。