Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/autodesk-forge/forge-react-boiler.nodejs
React and Node.js boilerplate examples collection: Provides a boilerplate project for using the Forge APIs in a modern React + Node.js web application
https://github.com/autodesk-forge/forge-react-boiler.nodejs
Last synced: 3 months ago
JSON representation
React and Node.js boilerplate examples collection: Provides a boilerplate project for using the Forge APIs in a modern React + Node.js web application
- Host: GitHub
- URL: https://github.com/autodesk-forge/forge-react-boiler.nodejs
- Owner: Autodesk-Forge
- License: mit
- Created: 2017-03-01T13:27:10.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2019-02-27T14:08:50.000Z (almost 6 years ago)
- Last Synced: 2024-04-09T21:50:09.264Z (11 months ago)
- Language: CSS
- Homepage:
- Size: 9.68 MB
- Stars: 53
- Watchers: 16
- Forks: 24
- Open Issues: 4
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[](http://developer.autodesk.com/)
[](http://developer.autodesk.com/)
[](http://developer.autodesk.com/)
[](http://developer.autodesk.com/)# About Forge React Boiler
A boilerplate project to quickly get started using [Autodesk Forge Platform](https://forge.autodesk.com/)
Web Services in a modern React + Node.js Web Application.
The base project is initially derived from the [React Redux Starter Kit](https://github.com/davezuko/react-redux-starter-kit).### Thumbnail
* Main components of the Frontend:
[React](https://facebook.github.io/react/) + [Redux](https://github.com/reactjs/redux)
* On the Backend:
[Node.js](https://nodejs.org) + [Express](http://expressjs.com)
* Build System:
[NPM](https://www.npmjs.com/) scripts + [Webpack 2](https://webpack.js.org) + [Babel](https://babeljs.io)
## React Support
React >= 0.13.x
## Browser Support
Forge React Boiler is responsive, mobile friendly and has been tested on the following browsers:
* Chrome
* Firefox
* Safari
* Opera
* Edge## Running the sample
Configuration is controlled by **NODE_ENV**
[environment variable](https://www.google.com/webhp?q=set+environment+variable&gws_rd=cr&ei=tum2WMaSF4SdsgHruLrIDg),
make sure to set it properly to **development** or **production**,
based on the configuration type you want to run.In **development**, the client is dynamically built by the
[webpack-dev-middleware](https://github.com/webpack/webpack-dev-middleware), so just run:* `npm install` *(downloads project dependencies locally)*
* `set NODE_ENV=development`
* `set HOT_RELOADING=true`
* `npm start` *(builds client on the fly and runs server)*
* open [http://localhost:3000](http://localhost:3000) in your favorite browser
In **production**, the client requires a build step, so run:
* `npm install` *(not required if you already run at previous step)*
* `set NODE_ENV=production`
* `npm run build-server` *(builds server in /bin/server)*
* `npm run build-prod` *(builds client in /dist)*
* `npm start` *(runs server)*
* open [http://localhost:3000](http://localhost:3000) in your favorite browser
## Loading custom models in the Forge Viewer
The project contains a default model located in **/resources/models/seat** that can be loaded with no further
setup and will also work offline.If you want to load a model from **Autodesk Cloud**, you first need to generate a viewable **URN** as documented in the
[Prepare a File for the Viewer](https://developer.autodesk.com/en/docs/model-derivative/v2/tutorials/prepare-file-for-viewer/) tutorial.Using the same Forge ClientId & ClientSecret used to upload the model,
populate environment variables used by the config files (in **/config**):* development:
`FORGE_DEV_CLIENT_ID`
`FORGE_DEV_CLIENT_SECRET`
* production:
`FORGE_CLIENT_ID`
`FORGE_CLIENT_SECRET`
Restart the server, you can then directly load your model by specifying design **URN** as query parameter in the url of the viewer page:
[http://localhost:3000/viewer?urn=YOUR_URN_HERE](http://localhost:3000/viewer?urn=YOUR_DESIGN_URN_HERE)
## Deploy to Heroku
Use your **Forge ClientId & ClientSecret** obtained while
[Creating a new Forge App](https://developer.autodesk.com/myapps/create)And Press Deploy button below:
[](https://heroku.com/deploy)
Wait for a while once the Heroku App has been deployed as the client needs to be built **after the first run**
## More about Autodesk Forge Platform and Web Applications of the future?
Check it out at [developer.autodesk.com](https://developer.autodesk.com).
Look at our [Quickstarts Guide](https://developer.autodesk.com/en/docs/quickstarts/v1/overview/)
to find the Forge SDK's for the programming language of your choice.## About the Author
[https://twitter.com/F3lipek](https://twitter.com/F3lipek)
## Web Applications using Forge React Boiler
* [Autodesk Forge RCDB](https://forge-rcdb.autodesk.io)

(Feel free to add your own by submitting a pull request...)