https://github.com/trytriplex/triplex-sydjs
Build your first 3D component with React Three Fiber and Triplex.
https://github.com/trytriplex/triplex-sydjs
Last synced: 11 months ago
JSON representation
Build your first 3D component with React Three Fiber and Triplex.
- Host: GitHub
- URL: https://github.com/trytriplex/triplex-sydjs
- Owner: trytriplex
- Created: 2024-08-18T01:22:41.000Z (over 1 year ago)
- Default Branch: main
- Last Pushed: 2024-08-21T04:41:55.000Z (over 1 year ago)
- Last Synced: 2025-03-25T18:45:50.624Z (12 months ago)
- Language: TypeScript
- Homepage:
- Size: 1.85 MB
- Stars: 4
- Watchers: 0
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Triplex for [SydJS](https://sydjs.com)
Today we're going to build a user interface in 3D! Knowledge of React Three Fiber not needed. Enjoyed the workshop? [Let me know on X/Twitter](https://x.com/_douges).
Here's some references to what we're going to be using.
- [React Three Fiber](https://github.com/pmndrs/react-three-fiber)
- [uikit](https://github.com/pmndrs/uikit)
- [VS Code](https://code.visualstudio.com/)
- [Triplex](https://triplex.dev)
- [Talsho Login Screens](https://dribbble.com/shots/16120339-Talsho-Login-Screens) design by Kailash Saravanan
## Get Started
This workshop assumes you're using VS Code and have Node.js installed.
1. Clone this repository
```sh
git clone https://github.com/try-triplex/triplex-sydjs.git
cd triplex-sydjs
git checkout empty-scene
```
2. Install dependencies (preference: pnpm)
```sh
pnpm i
```
3. Install [Triplex for VS Code](https://marketplace.visualstudio.com/items?itemName=trytriplex.triplex-vsce), search: "triplex"
4. You're ready. Follow along!
## Press Enter To Continue...
When you want to continue learning, here's some handy links.
- [Learn more Triplex](https://github.com/try-triplex/triplex)
- [Join Discord](https://discord.gg/nBzRBUEs4b) — Join the Triplex community
- [Learn the User Interface](https://triplex.dev/docs/get-started/user-interface) —
A quick orientation around the editor
- [Project Settings](https://triplex.dev/docs/get-started/settings) — Learn how
to configure the editor to your needs
- [Declaring Props](https://triplex.dev/docs/get-started/declaring-props) —
Learn how declaring props on your components will appear in the editor
- [Join the React Three Fiber (pmndrs) Discord](https://discord.com/invite/poimandres)
- [Learn from Wawa Sensei](https://lessons.wawasensei.dev/courses/react-three-fiber)
- [Learn from Three.js Journey](https://threejs-journey.com)
