Demonstration of the application | Features | Technologies used | Application installation
A responsive t-shirt designing website with an interactive 3D Model using:
- ReactJS - a popular front-end library that has gradually become the go-to framework for modern web development
- ThreeJS - a powerful 3D graphics library for rendering and animating the 3D model
- React Three Fiber - a popular library for creating 3D graphics with ThreeJS in React
- Tailwind CSS - a popular utility-first CSS styling framework
- Framer Motion - the most popular library used to bring your React website to life with animations
- Dalle·E 2 - OpenAI's ai system to create realistic images and art from a description in natural language
- Color Picker.
- Image Upload for both logo and full canvas.
- Image Generation using OpenAI's DALL·E 2.
https://dalle-ai-threejs.netlify.app/
- git clone
https://github.com/ChammounC/TShirtDesign-ThreeJS.git
to clone the repository
cd server
and runnpm install
- Visit https://platform.openai.com/account/api-keys and generate an
API_KEY
- create a
.env
file in the root ofserver
folder and add variables:
OPENAI_API_KEY = <GENERATED_API_KEY_FROM_ABOVE_STEP>
ALLOWED_ORIGIN = <CLIENT_URL> // eg.http://localhost:3000/
- run
npm start
cd client
and runnpm install
- create a
.env
file in the root ofclient
folder and add variable:
VITE_URL = http://localhost:8080/api/v1/dalle
- run
npm run dev