Viewer React Express Headless screenshot

Viewer React Express Headless

Author Avatar Theme by Autodesk forge
Updated: 6 May 2024
104 Stars

Headless viewer: Creates a custom Viewer GUI using react-express

Categories

Overview:

The Viewer - React - Express - Headless project offers a demonstration of integrating the Forge Viewer in a headless manner with custom extensions. It utilizes React on the front end, Redux for state management, and Node.js (Express) for authentication and access to Forge services. The project showcases various extensions available in full-screen mode, such as Properties, Explode Slider, Explode Animation, and Rotate Animation.

Features:

  • Headless Integration: Utilizes Forge Viewer in a headless manner with custom extensions.
  • Front-End Technologies: Built with React, Redux, and Node.js (Express).
  • Custom Extensions: Offers extensions like Properties, Explode Slider, and Rotate Animation.
  • Model Manipulation: Allows manipulation of the model, including rotation and explosion.

Installation:

  1. Clone the repository: git clone [repository_url]
  2. Navigate to the project directory: cd [project_directory]
  3. Create a file named credentials.js in the server directory with your credentials.
  4. Install dependencies: npm install
  5. Run the application in development mode: npm run watch
  6. Access the application locally at: http://localhost:3000

Summary:

The Viewer - React - Express - Headless project demonstrates the integration of Forge Viewer in a headless manner with custom extensions, utilizing React, Redux, and Node.js (Express) for authentication and access to Forge services. It offers various extensions like Properties, Explode Slider, and Rotate Animation for manipulating models. The application can be easily set up locally for development and production deployment on platforms like Heroku, following simple instructions provided in the documentation.