https://github.com/sv443/react-three-electron-template

Template for a React, MUI, Three.js, Electron, TypeScript and Vite project
https://github.com/sv443/react-three-electron-template

electron mui react template-project threejs typescript vite

Last synced: 19 days ago
JSON representation

Template for a React, MUI, Three.js, Electron, TypeScript and Vite project

• Host: GitHub
• URL: https://github.com/sv443/react-three-electron-template
• Owner: Sv443
• Created: 2023-02-02T12:17:08.000Z (almost 2 years ago)
• Default Branch: master
• Last Pushed: 2024-05-05T00:30:48.000Z (7 months ago)
• Last Synced: 2024-05-05T12:24:57.921Z (6 months ago)
• Topics: electron, mui, react, template-project, threejs, typescript, vite
• Language: TypeScript
• Homepage:
• Size: 211 KB
• Stars: 2
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# React, MUI, Three.js, Electron, TypeScript & Vite Template




## Setup:

1. [Click here to create a repository based on this template](https://github.com/Sv443/React-Three-Electron-Template/generate)

2. Clone your repository with git

3. Run the command `npm i` to install dependencies




## Commands:

| Command | Description |

| --- | --- |

| `npm run dev` | Starts the vite dev server and the electron app |

| `npm run lint` | Lint the code with ESLint |

| `npm run build` | Compiles the TS code and builds the electron executable |

| `npm run build-win` | Build for Windows only |

| `npm run build-mac` | Build for MacOS only |

| `npm run build-linux` | Build for Linux only |




## Files & Folders:

| Path | Description |

| --- | --- |

| `src/App.tsx` | Main component of the app |

| `src/objects/` | Folder that contains all Three.js "object components" (meshes etc.) |

| `src/components/` | Folder for all other misc. React components |

| `src/theme.ts` | Theme configuration |

| `src/global.css` | CSS that is applied globally |

| `electron/` | Electron-specific code like creating windows and handling IPC |




## Additional info & guides & interesting packages

### Main stuff

- https://mui.com/material-ui/getting-started/overview/

- https://github.com/pmndrs/react-three-fiber

- https://threejs.org/docs/index.html#manual/en/introduction/Creating-a-scene

### Helpful stuff

- https://discoverthreejs.com/tips-and-tricks/

### Other cool stuff

- https://github.com/pmndrs/gltfjsx

- https://github.com/pmndrs/drei

- https://github.com/pmndrs/react-three-flex

- https://github.com/pmndrs/use-cannon

- https://github.com/pmndrs/react-spring

- https://github.com/pmndrs/leva