From e959c8adc791349575cead4398c8311cf90fa869 Mon Sep 17 00:00:00 2001 From: Md Samsul Alam Date: Thu, 8 Jun 2023 12:46:26 +0600 Subject: [PATCH] created readme for issue #20 --- README.md | 86 ++++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 85 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index f1633c43..a025d29b 100644 --- a/README.md +++ b/README.md @@ -1 +1,85 @@ -Lama Dev Season 3 +# React 3D Portfolio Website with Three.js + +This is a portfolio project developed with React and demonstrates the usage of React Three.js and animations. It showcases interactive 3D elements and provides an engaging user experience. This README will guide you through the process of cloning the project from GitHub to your local repository and explain how to install the necessary dependencies and run the project. + +## Cloning the Project + +To clone the project from GitHub, follow these steps: + +1. Open your terminal or command prompt. +2. Navigate to the directory where you want to clone the project. +3. Run the following command to clone the repository: + + ``` + git clone -b 3d-portfolio https://github.com/username/repository.git + ``` + +4. Once the cloning process is complete, navigate into the project directory using the following command: + + ``` + cd react-app + ``` + +Now you have successfully cloned the project to your local repository. + +## Installing Dependencies + +This project uses [Vite](https://vitejs.dev/) as the build tool. To install the project dependencies, make sure you have [Node.js](https://nodejs.org/) installed on your machine, and then follow these steps: + +1. Open your terminal or command prompt. +2. Navigate to the project directory if you are not already in it. +3. Run the following command to install the dependencies: + + ``` + npm install + ``` + +This will install all the necessary dependencies listed in the `package.json` file. + +## Running the Project + +After successfully installing the dependencies, you can run the project using the following steps: + +1. Open your terminal or command prompt. +2. Navigate to the project directory if you are not already in it. +3. Run the following command to start the development server: + + ``` + npm run dev + ``` + + This will start the development server provided by Vite. + +4. Once the server is up and running, you will see a message in the terminal with the local URL where the project is being served (e.g., `http://localhost:3000`). + + Open your web browser and visit the URL shown in the terminal to view the project. + +## Additional Information + +### Dependencies + +The project relies on the following dependencies: + +- `@emailjs/browser`: A library for sending emails using JavaScript. +- `@react-three/drei`: A collection of useful helpers and abstractions for React Three.js. +- `@react-three/fiber`: The core package for using React with Three.js. +- `@react-three/postprocessing`: A package for adding post-processing effects to your Three.js scenes. +- `prop-types`: A library for defining and validating React component props. +- `react`: The React library. +- `react-dom`: The entry point to the React DOM package. +- `react-simple-maps`: A library for creating customizable SVG maps with React. +- `styled-components`: A popular library for styling React components using CSS-in-JS. +- `three`: The core Three.js library. + +### Development Dependencies + +The project has the following development dependencies: + +- `@types/react`: TypeScript type definitions for React. +- `@types/react-dom`: TypeScript type definitions for React DOM. +- `@vitejs/plugin-react`: Vite plugin for React support. +- `vite`: The build tool used to serve and bundle the project. + +## Conclusion + +You have now successfully cloned the project from GitHub, installed the necessary dependencies, and started the development server. You can now explore and interact with the React Three.js Animation Portfolio project. Enjoy! \ No newline at end of file