{{ Three.js Basics- [3 ways] }}

⚙️ Tech Stack

• Node.js
• Vite
• React.js
• Three.js
• React Three Fiber
• React Three Drei

🚨 About Repo :-

This repository contains the code for how to use and implement three.js models into our code. I have created three different folders with Each folder containig code for - importing Three.js models through CDN links, using three.js in [ npm + vite ] project and using three.js in [ npm + vite + React ] project. Follow to Following Quick Start guide to run this code on your local machine to see how it works.

🤸 Quick Start :-

Follow these steps to set up the project locally on your machine.

Prerequisites

Make sure you have the following installed on your machine:

• Git
• Node.js
• npm (Node Package Manager)

Cloning the Repository

Open command prompt -> type 'cd desktop' ->

git clone https://github.com/Rukh-Khan/3js-models-starter.git

close command prompt -> open the created folder in vs code

1) Folder-1 (basic)

Go to basic folder -> Simply, Run the index.html file ( Right click -> Open with live server )

AND file is running into your browser, have a look !

2) Folder-2 ( vite )

Open terminal -> Go to vite directory by running : -

cd vite

AND run just 2 commands :-

installation

install the project dependencies using npm

npm install

Running

Running the project

npm run dev

AND, have a look into your browser !

3) Folder-3 ( vite-react )

open terminal -> Go to vite+react directory by running :- ( Assuming you are in 'vite' directory )

cd ..

cd vite-react

AND run just 2 commands :-

installation

install the project dependencies using npm

npm install

Running

Running the project

npm run dev

Voila ! have a look into your browser !