├── .gitignore
├── LICENSE.md
├── README.md
├── index.html
├── package-lock.json
├── package.json
├── postcss.config.cjs
├── public
├── astro
│ ├── license.txt
│ ├── scene.bin
│ ├── scene.gltf
│ └── textures
│ │ └── Suit_Base_baseColor.png
├── desktop_pc
│ ├── license.txt
│ ├── scene.bin
│ ├── scene.gltf
│ └── textures
│ │ ├── Material.002_baseColor.png
│ │ ├── Material.023_baseColor.jpeg
│ │ ├── Material.024_baseColor.jpeg
│ │ ├── Material.074_0_baseColor.png
│ │ ├── Material.074_10_baseColor.jpeg
│ │ ├── Material.074_11_baseColor.png
│ │ ├── Material.074_12_baseColor.jpeg
│ │ ├── Material.074_13_baseColor.png
│ │ ├── Material.074_14_baseColor.png
│ │ ├── Material.074_15_baseColor.png
│ │ ├── Material.074_16_baseColor.png
│ │ ├── Material.074_17_baseColor.png
│ │ ├── Material.074_18_baseColor.png
│ │ ├── Material.074_18_emissive.png
│ │ ├── Material.074_19_baseColor.png
│ │ ├── Material.074_1_baseColor.jpeg
│ │ ├── Material.074_20_baseColor.png
│ │ ├── Material.074_21_baseColor.png
│ │ ├── Material.074_22_baseColor.png
│ │ ├── Material.074_23_baseColor.png
│ │ ├── Material.074_24_baseColor.png
│ │ ├── Material.074_24_emissive.png
│ │ ├── Material.074_25_baseColor.jpeg
│ │ ├── Material.074_26_baseColor.png
│ │ ├── Material.074_27_baseColor.png
│ │ ├── Material.074_27_emissive.png
│ │ ├── Material.074_28_baseColor.png
│ │ ├── Material.074_29_baseColor.png
│ │ ├── Material.074_2_baseColor.jpeg
│ │ ├── Material.074_30_baseColor.png
│ │ ├── Material.074_31_baseColor.png
│ │ ├── Material.074_32_baseColor.jpeg
│ │ ├── Material.074_33_baseColor.png
│ │ ├── Material.074_34_baseColor.jpeg
│ │ ├── Material.074_35_baseColor.png
│ │ ├── Material.074_36_baseColor.jpeg
│ │ ├── Material.074_39_baseColor.jpeg
│ │ ├── Material.074_3_baseColor.png
│ │ ├── Material.074_40_baseColor.png
│ │ ├── Material.074_4_baseColor.png
│ │ ├── Material.074_4_emissive.png
│ │ ├── Material.074_5_baseColor.png
│ │ ├── Material.074_6_baseColor.png
│ │ ├── Material.074_7_baseColor.png
│ │ ├── Material.074_8_baseColor.png
│ │ ├── Material.074_9_baseColor.png
│ │ ├── Material.074_9_emissive.png
│ │ ├── Material.074_baseColor.png
│ │ ├── Material_baseColor.jpeg
│ │ ├── Material_metallicRoughness.png
│ │ └── Tasten_2_baseColor.jpeg
├── logo.svg
└── planet
│ ├── license.txt
│ ├── scene.bin
│ ├── scene.gltf
│ └── textures
│ ├── Clouds_baseColor.png
│ └── Planet_baseColor.png
├── src
├── App.jsx
├── assets
│ ├── LOGO2.webp
│ ├── backend.png
│ ├── beeclone.png
│ ├── carrent.png
│ ├── close.svg
│ ├── code1.png
│ ├── company
│ │ ├── meta.png
│ │ ├── shopify.png
│ │ ├── starbucks.png
│ │ └── tesla.png
│ ├── creator.png
│ ├── github.png
│ ├── herobg.png
│ ├── ig.png
│ ├── index.js
│ ├── jeff.jpg
│ ├── jeff_jiang.pdf
│ ├── jobit.png
│ ├── linktree.png
│ ├── liveLink.png
│ ├── logo.svg
│ ├── logo3.png
│ ├── matrixai.png
│ ├── menu.svg
│ ├── mobile.png
│ ├── movie.png
│ ├── notable.png
│ ├── portfolio15.png
│ ├── portfolio16.png
│ ├── portfolio17.png
│ ├── shop.png
│ ├── smartrep.png
│ ├── tech
│ │ ├── css.png
│ │ ├── django.png
│ │ ├── docker.png
│ │ ├── figma.png
│ │ ├── git.png
│ │ ├── html.png
│ │ ├── javascript.png
│ │ ├── mongodb.png
│ │ ├── next.png
│ │ ├── nodejs.png
│ │ ├── postgres.png
│ │ ├── python.png
│ │ ├── reactjs.png
│ │ ├── redux.png
│ │ ├── sql.svg
│ │ ├── tailwind.png
│ │ ├── threejs.png
│ │ ├── typescript.png
│ │ └── vue.svg
│ ├── tiktok.png
│ ├── tripguide.png
│ ├── web.png
│ ├── youtube.png
│ └── zapflow.png
├── components
│ ├── About.jsx
│ ├── CV.jsx
│ ├── Contact.jsx
│ ├── Experience.jsx
│ ├── Feedbacks.jsx
│ ├── Footer.jsx
│ ├── Hero.jsx
│ ├── Loader.jsx
│ ├── Navbar.jsx
│ ├── Tech.jsx
│ ├── Works.jsx
│ ├── canvas
│ │ ├── Ball.jsx
│ │ ├── Computers.jsx
│ │ ├── Earth.jsx
│ │ ├── Stars.jsx
│ │ ├── Tico.jsx
│ │ └── index.js
│ └── index.js
├── constants
│ └── index.js
├── hoc
│ ├── SectionWrapper.jsx
│ └── index.js
├── index.css
├── jeff_jiang.pdf
├── main.jsx
├── styles.js
└── utils
│ └── motion.js
├── tailwind.config.cjs
└── vite.config.js
/.gitignore:
--------------------------------------------------------------------------------
1 | # Logs
2 | logs
3 | *.log
4 | npm-debug.log*
5 | yarn-debug.log*
6 | yarn-error.log*
7 | pnpm-debug.log*
8 | lerna-debug.log*
9 |
10 | node_modules
11 | dist
12 | dist-ssr
13 | *.local
14 |
15 | # Editor directories and files
16 | .vscode/*
17 | !.vscode/extensions.json
18 | .idea
19 | .DS_Store
20 | *.suo
21 | *.ntvs*
22 | *.njsproj
23 | *.sln
24 | *.sw?
25 |
26 | .env
27 |
28 | # vscode
29 | .vscode
--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2023 Jeff Jiang
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 |
2 |
3 |
8 |
9 | 3D Portfolio Website
10 |
11 |
12 | Explore the interactive 3D space that showcases my projects and skills. Built with the power of Three.js and React.js.
13 |
14 |
15 |
16 | 🚀 View Demo
17 |
18 |
19 | ## About The Project
20 |
21 | This 3D Portfolio Website is a creative approach to showcasing a portfolio in an interactive 3D environment. It uses Three.js and React Three Fiber to render a dynamic and immersive experience, allowing visitors to explore projects and skills in a way that's engaging and memorable.
22 |
23 | ### Features
24 |
25 | - **Interactive 3D Experience**: Navigate through the portfolio in a 3D space, making the exploration of projects both fun and immersive.
26 | - **Responsive Design**: Crafted with TailwindCSS for a responsive layout that ensures a great viewing experience on all device sizes.
27 | - **Smooth Animations**: Utilizing Framer Motion for smooth and appealing transitions and animations throughout the website.
28 |
29 | ## Tech Stack
30 |
31 | - **Three.js**: A powerful 3D library that brings content to life in the browser.
32 | - **React Three Fiber**: A React renderer for Three.js, enabling the use of React's declarative style to build 3D scenes.
33 | - **TailwindCSS**: A utility-first CSS framework for rapidly building custom designs.
34 | - **Framer Motion**: A library for React that makes creating realistic animations and transitions easy and powerful.
35 |
36 | ## Getting Started
37 |
38 | To get a local copy up and running, follow these simple steps:
39 |
40 | ### Prerequisites
41 |
42 | - npm
43 | ```sh
44 | npm install npm@latest -g
45 | ```
46 |
47 | ### Installation
48 |
49 | 1. Clone the repo
50 | ```sh
51 | git clone https://github.com/jeffjiang13/3d-portfolio.git
52 | ```
53 | 2. Install NPM packages
54 | ```sh
55 | npm install
56 | ```
57 | 3. Start the project
58 | ```sh
59 | npm start
60 | ```
61 |
62 | ## Contributing
63 |
64 | Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.
65 |
66 | 1. Fork the Project
67 | 2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
68 | 3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
69 | 4. Push to the Branch (`git push origin feature/AmazingFeature`)
70 | 5. Open a Pull Request
71 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | Jeff Jiang | Portfolio
8 |
9 |
10 |
11 |
12 |
13 |
14 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "web-3d-resume",
3 | "private": true,
4 | "version": "1.0.0",
5 | "type": "module",
6 | "scripts": {
7 | "dev": "vite",
8 | "build": "vite build",
9 | "preview": "vite preview"
10 | },
11 | "dependencies": {
12 | "@emailjs/browser": "^3.10.0",
13 | "@react-three/drei": "^9.57.1",
14 | "@react-three/fiber": "^8.12.0",
15 | "framer-motion": "^10.0.1",
16 | "gsap": "^3.11.4",
17 | "maath": "^0.5.2",
18 | "react": "^18.2.0",
19 | "react-dom": "^18.2.0",
20 | "react-icons": "^4.11.0",
21 | "react-router-dom": "^6.8.2",
22 | "react-simple-typewriter": "^5.0.1",
23 | "react-slick": "^0.30.2",
24 | "react-tilt": "^1.0.2",
25 | "react-ts-typewriter": "^0.1.8-b",
26 | "react-vertical-timeline-component": "^3.6.0",
27 | "slick-carousel": "^1.8.1",
28 | "three": "^0.150.1"
29 | },
30 | "devDependencies": {
31 | "@types/react": "^18.0.27",
32 | "@types/react-dom": "^18.0.10",
33 | "@vitejs/plugin-react": "^3.1.0",
34 | "autoprefixer": "^10.4.13",
35 | "postcss": "^8.4.21",
36 | "tailwindcss": "^3.2.7",
37 | "vite": "^4.1.0"
38 | }
39 | }
40 |
--------------------------------------------------------------------------------
/postcss.config.cjs:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | plugins: {
3 | tailwindcss: {},
4 | autoprefixer: {},
5 | }
6 | }
--------------------------------------------------------------------------------
/public/astro/license.txt:
--------------------------------------------------------------------------------
1 | Model Information:
2 | * title: 3December 2021 Day 18: Astronaut
3 | * source: https://sketchfab.com/3d-models/3december-2021-day-18-astronaut-40f22d473c2e41868794254068fb94a5
4 | * author: Liberi Arcano (https://sketchfab.com/LiberiArcano)
5 |
6 | Model License:
7 | * license type: CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)
8 | * requirements: Author must be credited. Commercial use is allowed.
9 |
10 | If you use this 3D model in your project be sure to copy paste this credit wherever you share it:
11 | This work is based on "3December 2021 Day 18: Astronaut" (https://sketchfab.com/3d-models/3december-2021-day-18-astronaut-40f22d473c2e41868794254068fb94a5) by Liberi Arcano (https://sketchfab.com/LiberiArcano) licensed under CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)
--------------------------------------------------------------------------------
/public/astro/scene.bin:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/astro/scene.bin
--------------------------------------------------------------------------------
/public/astro/scene.gltf:
--------------------------------------------------------------------------------
1 | {
2 | "accessors": [
3 | {
4 | "bufferView": 3,
5 | "componentType": 5126,
6 | "count": 4270,
7 | "max": [
8 | 1.551995873451233,
9 | 3.095130681991577,
10 | 0.553249180316925
11 | ],
12 | "min": [
13 | -1.551995873451233,
14 | -0.00020015239715576172,
15 | -0.7421041131019592
16 | ],
17 | "type": "VEC3"
18 | },
19 | {
20 | "bufferView": 3,
21 | "byteOffset": 51240,
22 | "componentType": 5126,
23 | "count": 4270,
24 | "max": [
25 | 1.0,
26 | 1.0,
27 | 1.0
28 | ],
29 | "min": [
30 | -1.0,
31 | -1.0,
32 | -1.0
33 | ],
34 | "type": "VEC3"
35 | },
36 | {
37 | "bufferView": 2,
38 | "componentType": 5126,
39 | "count": 4270,
40 | "max": [
41 | 0.4299863278865814,
42 | 0.7633627653121948
43 | ],
44 | "min": [
45 | 0.07166768610477448,
46 | 0.24486768245697021
47 | ],
48 | "type": "VEC2"
49 | },
50 | {
51 | "bufferView": 1,
52 | "componentType": 5125,
53 | "count": 6624,
54 | "type": "SCALAR"
55 | },
56 | {
57 | "bufferView": 3,
58 | "byteOffset": 102480,
59 | "componentType": 5126,
60 | "count": 1176,
61 | "max": [
62 | 1.1842095851898193,
63 | 2.322197437286377,
64 | 0.5741509199142456
65 | ],
66 | "min": [
67 | -1.1842095851898193,
68 | 0.19335079193115234,
69 | -0.7844569683074951
70 | ],
71 | "type": "VEC3"
72 | },
73 | {
74 | "bufferView": 3,
75 | "byteOffset": 116592,
76 | "componentType": 5126,
77 | "count": 1176,
78 | "max": [
79 | 1.0,
80 | 1.0,
81 | 1.0
82 | ],
83 | "min": [
84 | -1.0,
85 | -1.0,
86 | -1.0
87 | ],
88 | "type": "VEC3"
89 | },
90 | {
91 | "bufferView": 2,
92 | "byteOffset": 34160,
93 | "componentType": 5126,
94 | "count": 1176,
95 | "max": [
96 | 1.0,
97 | 1.0
98 | ],
99 | "min": [
100 | 0.0,
101 | 0.0
102 | ],
103 | "type": "VEC2"
104 | },
105 | {
106 | "bufferView": 1,
107 | "byteOffset": 26496,
108 | "componentType": 5125,
109 | "count": 1776,
110 | "type": "SCALAR"
111 | },
112 | {
113 | "bufferView": 3,
114 | "byteOffset": 130704,
115 | "componentType": 5126,
116 | "count": 38,
117 | "max": [
118 | 0.4723106622695923,
119 | 2.759875774383545,
120 | 0.4915982782840729
121 | ],
122 | "min": [
123 | -0.4723106622695923,
124 | 1.9141709804534912,
125 | 0.13955865800380707
126 | ],
127 | "type": "VEC3"
128 | },
129 | {
130 | "bufferView": 3,
131 | "byteOffset": 131160,
132 | "componentType": 5126,
133 | "count": 38,
134 | "max": [
135 | 0.8253355026245117,
136 | 0.825336217880249,
137 | 1.0
138 | ],
139 | "min": [
140 | -0.8253354430198669,
141 | -0.656608521938324,
142 | 0.3135174512863159
143 | ],
144 | "type": "VEC3"
145 | },
146 | {
147 | "bufferView": 2,
148 | "byteOffset": 43568,
149 | "componentType": 5126,
150 | "count": 38,
151 | "max": [
152 | 0.4589775800704956,
153 | 0.3081425726413727
154 | ],
155 | "min": [
156 | 0.36022287607192993,
157 | 0.13131555914878845
158 | ],
159 | "type": "VEC2"
160 | },
161 | {
162 | "bufferView": 1,
163 | "byteOffset": 33600,
164 | "componentType": 5125,
165 | "count": 156,
166 | "type": "SCALAR"
167 | },
168 | {
169 | "bufferView": 5,
170 | "componentType": 5126,
171 | "count": 48,
172 | "max": [
173 | 100.0,
174 | 2.408794641494751,
175 | 2.123263120651245,
176 | 0.0,
177 | 2.1544318199157715,
178 | 100.0,
179 | 1.4296036958694458,
180 | 0.0,
181 | 2.0290353298187256,
182 | 2.500000238418579,
183 | 100.0,
184 | 0.0,
185 | 4.396424770355225,
186 | 1.8617634773254395,
187 | 0.9628139138221741,
188 | 1.0
189 | ],
190 | "min": [
191 | -1.6624454259872437,
192 | -2.408795118331909,
193 | -2.123263120651245,
194 | 0.0,
195 | -2.1544313430786133,
196 | -2.465498447418213,
197 | -2.500000238418579,
198 | 0.0,
199 | -2.0290353298187256,
200 | -0.9475418329238892,
201 | -1.4076430797576904,
202 | 0.0,
203 | -4.396426677703857,
204 | -4.510514736175537,
205 | -2.3592920303344727,
206 | 1.0
207 | ],
208 | "type": "MAT4"
209 | },
210 | {
211 | "bufferView": 0,
212 | "componentType": 5123,
213 | "count": 4270,
214 | "type": "VEC4"
215 | },
216 | {
217 | "bufferView": 4,
218 | "componentType": 5126,
219 | "count": 4270,
220 | "max": [
221 | 1.0,
222 | 0.49340885877609253,
223 | 0.3002254366874695,
224 | 0.15343782305717468
225 | ],
226 | "min": [
227 | 0.3415411412715912,
228 | 0.0,
229 | 0.0,
230 | 0.0
231 | ],
232 | "type": "VEC4"
233 | },
234 | {
235 | "bufferView": 0,
236 | "byteOffset": 34160,
237 | "componentType": 5123,
238 | "count": 1176,
239 | "type": "VEC4"
240 | },
241 | {
242 | "bufferView": 4,
243 | "byteOffset": 68320,
244 | "componentType": 5126,
245 | "count": 1176,
246 | "max": [
247 | 1.0,
248 | 0.476285845041275,
249 | 0.2632391154766083,
250 | 0.16873608529567719
251 | ],
252 | "min": [
253 | 0.29893380403518677,
254 | 0.0,
255 | 0.0,
256 | 0.0
257 | ],
258 | "type": "VEC4"
259 | },
260 | {
261 | "bufferView": 0,
262 | "byteOffset": 43568,
263 | "componentType": 5123,
264 | "count": 38,
265 | "type": "VEC4"
266 | },
267 | {
268 | "bufferView": 4,
269 | "byteOffset": 87136,
270 | "componentType": 5126,
271 | "count": 38,
272 | "max": [
273 | 1.0,
274 | 0.30321112275123596,
275 | 0.0,
276 | 0.0
277 | ],
278 | "min": [
279 | 0.6967889070510864,
280 | 0.0,
281 | 0.0,
282 | 0.0
283 | ],
284 | "type": "VEC4"
285 | }
286 | ],
287 | "asset": {
288 | "extras": {
289 | "author": "Liberi Arcano (https://sketchfab.com/LiberiArcano)",
290 | "license": "CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)",
291 | "source": "https://sketchfab.com/3d-models/3december-2021-day-18-astronaut-40f22d473c2e41868794254068fb94a5",
292 | "title": "3December 2021 Day 18: Astronaut"
293 | },
294 | "generator": "Sketchfab-13.4.0",
295 | "version": "2.0"
296 | },
297 | "bufferViews": [
298 | {
299 | "buffer": 0,
300 | "byteLength": 43872,
301 | "byteStride": 8,
302 | "name": "shortBufferViews",
303 | "target": 34962
304 | },
305 | {
306 | "buffer": 0,
307 | "byteLength": 34224,
308 | "byteOffset": 43872,
309 | "name": "floatBufferViews",
310 | "target": 34963
311 | },
312 | {
313 | "buffer": 0,
314 | "byteLength": 43872,
315 | "byteOffset": 78096,
316 | "byteStride": 8,
317 | "name": "floatBufferViews",
318 | "target": 34962
319 | },
320 | {
321 | "buffer": 0,
322 | "byteLength": 131616,
323 | "byteOffset": 121968,
324 | "byteStride": 12,
325 | "name": "floatBufferViews",
326 | "target": 34962
327 | },
328 | {
329 | "buffer": 0,
330 | "byteLength": 87744,
331 | "byteOffset": 253584,
332 | "byteStride": 16,
333 | "name": "floatBufferViews",
334 | "target": 34962
335 | },
336 | {
337 | "buffer": 0,
338 | "byteLength": 3072,
339 | "byteOffset": 341328,
340 | "name": "floatBufferViews"
341 | }
342 | ],
343 | "buffers": [
344 | {
345 | "byteLength": 344400,
346 | "uri": "scene.bin"
347 | }
348 | ],
349 | "images": [
350 | {
351 | "uri": "textures/Suit_Base_baseColor.png"
352 | }
353 | ],
354 | "materials": [
355 | {
356 | "doubleSided": true,
357 | "name": "Suit_Base",
358 | "pbrMetallicRoughness": {
359 | "baseColorTexture": {
360 | "index": 0
361 | },
362 | "metallicFactor": 0.0
363 | }
364 | },
365 | {
366 | "doubleSided": true,
367 | "name": "Suit_Details",
368 | "pbrMetallicRoughness": {
369 | "baseColorFactor": [
370 | 0.8,
371 | 0.1432,
372 | 0.0,
373 | 1.0
374 | ],
375 | "metallicFactor": 0.0
376 | }
377 | },
378 | {
379 | "doubleSided": true,
380 | "name": "Suit_Visor",
381 | "pbrMetallicRoughness": {
382 | "baseColorTexture": {
383 | "index": 1
384 | },
385 | "metallicFactor": 0.0
386 | }
387 | }
388 | ],
389 | "meshes": [
390 | {
391 | "name": "Cylinder_Suit_Base_0",
392 | "primitives": [
393 | {
394 | "attributes": {
395 | "JOINTS_0": 13,
396 | "NORMAL": 1,
397 | "POSITION": 0,
398 | "TEXCOORD_0": 2,
399 | "WEIGHTS_0": 14
400 | },
401 | "indices": 3,
402 | "material": 0,
403 | "mode": 4
404 | }
405 | ]
406 | },
407 | {
408 | "name": "Cylinder_Suit_Details_0",
409 | "primitives": [
410 | {
411 | "attributes": {
412 | "JOINTS_0": 15,
413 | "NORMAL": 5,
414 | "POSITION": 4,
415 | "TEXCOORD_0": 6,
416 | "WEIGHTS_0": 16
417 | },
418 | "indices": 7,
419 | "material": 1,
420 | "mode": 4
421 | }
422 | ]
423 | },
424 | {
425 | "name": "Cylinder_Suit_Visor_0",
426 | "primitives": [
427 | {
428 | "attributes": {
429 | "JOINTS_0": 17,
430 | "NORMAL": 9,
431 | "POSITION": 8,
432 | "TEXCOORD_0": 10,
433 | "WEIGHTS_0": 18
434 | },
435 | "indices": 11,
436 | "material": 2,
437 | "mode": 4
438 | }
439 | ]
440 | }
441 | ],
442 | "nodes": [
443 | {
444 | "children": [
445 | 1
446 | ],
447 | "matrix": [
448 | 1.0,
449 | 0.0,
450 | 0.0,
451 | 0.0,
452 | 0.0,
453 | 2.220446049250313e-16,
454 | -1.0,
455 | 0.0,
456 | 0.0,
457 | 1.0,
458 | 2.220446049250313e-16,
459 | 0.0,
460 | 0.0,
461 | 0.0,
462 | 0.0,
463 | 1.0
464 | ],
465 | "name": "Sketchfab_model"
466 | },
467 | {
468 | "children": [
469 | 2
470 | ],
471 | "matrix": [
472 | 0.009999999776482582,
473 | 0.0,
474 | 0.0,
475 | 0.0,
476 | 0.0,
477 | 0.0,
478 | 0.009999999776482582,
479 | 0.0,
480 | 0.0,
481 | -0.009999999776482582,
482 | 0.0,
483 | 0.0,
484 | 0.0,
485 | 0.0,
486 | 0.0,
487 | 1.0
488 | ],
489 | "name": "ac2651938cc549bc94dcf399c5ffea84.fbx"
490 | },
491 | {
492 | "children": [
493 | 3
494 | ],
495 | "name": "RootNode"
496 | },
497 | {
498 | "children": [
499 | 4
500 | ],
501 | "matrix": [
502 | 39.999996185302734,
503 | -8.881783349968308e-15,
504 | -8.88178282057277e-15,
505 | 0.0,
506 | 8.88178267941232e-15,
507 | 39.99999618530262,
508 | -3.0199157625600945e-06,
509 | 0.0,
510 | 8.881783491128746e-15,
511 | 3.0199157625600945e-06,
512 | 39.99999618530262,
513 | 0.0,
514 | 0.0,
515 | 0.0,
516 | -41.250736236572266,
517 | 1.0
518 | ],
519 | "name": "Armature"
520 | },
521 | {
522 | "children": [
523 | 5,
524 | 7,
525 | 8,
526 | 9,
527 | 6
528 | ],
529 | "name": "Object_4"
530 | },
531 | {
532 | "children": [
533 | 10
534 | ],
535 | "name": "_rootJoint"
536 | },
537 | {
538 | "matrix": [
539 | 99.99999999999909,
540 | -4.411918393753823e-22,
541 | 4.4119215807518805e-22,
542 | 0.0,
543 | 4.411921580751843e-22,
544 | -1.4371666980169618e-12,
545 | -99.99999999999966,
546 | 0.0,
547 | 4.411918393753912e-22,
548 | 99.99999999999966,
549 | -1.4371666980169618e-12,
550 | 0.0,
551 | 3.67267790916695e-22,
552 | -1.0661136144902994e-13,
553 | -1.0729538573173159e-06,
554 | 1.0
555 | ],
556 | "name": "Object_6"
557 | },
558 | {
559 | "mesh": 0,
560 | "name": "Object_7",
561 | "skin": 0
562 | },
563 | {
564 | "mesh": 1,
565 | "name": "Object_8",
566 | "skin": 0
567 | },
568 | {
569 | "mesh": 2,
570 | "name": "Object_9",
571 | "skin": 0
572 | },
573 | {
574 | "children": [
575 | 11,
576 | 49,
577 | 53
578 | ],
579 | "name": "root_01",
580 | "rotation": [
581 | 0.9454687237739563,
582 | 6.880668991461866e-17,
583 | -6.880668991461866e-17,
584 | 0.32571321725845337
585 | ],
586 | "translation": [
587 | -4.478098550104363e-16,
588 | 2.016756296157837,
589 | 1.5226085281483392e-07
590 | ]
591 | },
592 | {
593 | "children": [
594 | 12
595 | ],
596 | "name": "pelvis_02",
597 | "rotation": [
598 | -0.7071067094802856,
599 | 7.850460835574956e-17,
600 | 7.850459512085976e-17,
601 | 0.7071068286895752
602 | ],
603 | "scale": [
604 | 1.0,
605 | 1.0,
606 | 0.9999998807907104
607 | ],
608 | "translation": [
609 | -5.706211620328373e-16,
610 | 1.2812550067901611,
611 | -2.1948423385620117
612 | ]
613 | },
614 | {
615 | "children": [
616 | 13,
617 | 16,
618 | 33
619 | ],
620 | "name": "chest_03",
621 | "rotation": [
622 | -0.25838619470596313,
623 | -1.1516116416032673e-07,
624 | 3.080203825334138e-08,
625 | 0.9660418033599854
626 | ],
627 | "scale": [
628 | 1.0,
629 | 1.0000001192092896,
630 | 1.0
631 | ],
632 | "translation": [
633 | 7.372662465759367e-23,
634 | 1.065049171447754,
635 | 1.1920928955078125e-07
636 | ]
637 | },
638 | {
639 | "children": [
640 | 14
641 | ],
642 | "name": "neck_04",
643 | "rotation": [
644 | 0.2272789180278778,
645 | -1.4497787126084398e-14,
646 | -5.41875202486608e-08,
647 | 0.9738298058509827
648 | ],
649 | "scale": [
650 | 1.0,
651 | 0.9999999403953552,
652 | 1.0000001192092896
653 | ],
654 | "translation": [
655 | 2.0888227196644467e-14,
656 | 0.9543017148971558,
657 | 2.384185791015625e-07
658 | ]
659 | },
660 | {
661 | "children": [
662 | 15
663 | ],
664 | "name": "head_05",
665 | "rotation": [
666 | -0.2890593707561493,
667 | -4.149157688433658e-14,
668 | 6.891714576795493e-08,
669 | 0.9573112726211548
670 | ],
671 | "scale": [
672 | 1.0,
673 | 0.9999999403953552,
674 | 0.9999999403953552
675 | ],
676 | "translation": [
677 | 4.663669556331622e-14,
678 | 0.37622547149658203,
679 | 4.76837158203125e-07
680 | ]
681 | },
682 | {
683 | "name": "head_end_034",
684 | "rotation": [
685 | 1.3877787807814457e-17,
686 | 1.3234889800848443e-23,
687 | -3.308722450212111e-24,
688 | 1.0
689 | ],
690 | "translation": [
691 | 5.293955920339377e-23,
692 | 2.9734418392181396,
693 | 2.220446049250313e-16
694 | ]
695 | },
696 | {
697 | "children": [
698 | 17
699 | ],
700 | "name": "arm.r_06",
701 | "rotation": [
702 | 0.24485903978347778,
703 | 0.20525550842285156,
704 | 0.6886839866638184,
705 | 0.6508675813674927
706 | ],
707 | "translation": [
708 | -1.0379647016525269,
709 | 0.7787226438522339,
710 | -0.07191251963376999
711 | ]
712 | },
713 | {
714 | "children": [
715 | 18,
716 | 21,
717 | 24,
718 | 27,
719 | 30
720 | ],
721 | "name": "forearm.r_07",
722 | "rotation": [
723 | 0.5490573644638062,
724 | 0.342181533575058,
725 | -0.1637803167104721,
726 | 0.7447307109832764
727 | ],
728 | "scale": [
729 | 0.9999998807907104,
730 | 0.9999998807907104,
731 | 0.9999998807907104
732 | ],
733 | "translation": [
734 | -1.601874828338623e-07,
735 | 1.0167521238327026,
736 | 1.7881393432617188e-07
737 | ]
738 | },
739 | {
740 | "children": [
741 | 19
742 | ],
743 | "name": "hand.r_08",
744 | "rotation": [
745 | 0.4236648976802826,
746 | -0.09755676984786987,
747 | 0.308370977640152,
748 | 0.8461076021194458
749 | ],
750 | "translation": [
751 | 1.1920928955078125e-07,
752 | 1.0135563611984253,
753 | -5.960464477539063e-08
754 | ]
755 | },
756 | {
757 | "children": [
758 | 20
759 | ],
760 | "name": "thumb.r_09",
761 | "rotation": [
762 | -0.083188496530056,
763 | 0.04909014701843262,
764 | -0.060638342052698135,
765 | 0.9934751391410828
766 | ],
767 | "scale": [
768 | 0.9999999403953552,
769 | 1.0,
770 | 1.0
771 | ],
772 | "translation": [
773 | -1.7695128917694092e-07,
774 | 0.5183656811714172,
775 | -2.980232238769531e-07
776 | ]
777 | },
778 | {
779 | "name": "thumb.r_end_035",
780 | "rotation": [
781 | 2.7755575615628914e-17,
782 | -1.3877787807814457e-17,
783 | 3.851859888774472e-34,
784 | 1.0
785 | ],
786 | "translation": [
787 | -8.881784197001252e-16,
788 | 0.18877367675304413,
789 | 0.0
790 | ]
791 | },
792 | {
793 | "children": [
794 | 22
795 | ],
796 | "name": "index.r_010",
797 | "rotation": [
798 | 0.06170859932899475,
799 | -0.003656060667708516,
800 | -0.02882716991007328,
801 | 0.9976711273193359
802 | ],
803 | "scale": [
804 | 0.9999998807907104,
805 | 1.0,
806 | 1.0
807 | ],
808 | "translation": [
809 | -0.05657011270523071,
810 | 1.4787355661392212,
811 | 0.32744747400283813
812 | ]
813 | },
814 | {
815 | "children": [
816 | 23
817 | ],
818 | "name": "index1.r_011",
819 | "rotation": [
820 | 0.03683380037546158,
821 | -0.02648746222257614,
822 | 0.020175835117697716,
823 | 0.9987665414810181
824 | ],
825 | "scale": [
826 | 0.9999997615814209,
827 | 0.9999998807907104,
828 | 0.9999999403953552
829 | ],
830 | "translation": [
831 | -3.5762786865234375e-07,
832 | 0.3210671544075012,
833 | 1.1920928955078125e-07
834 | ]
835 | },
836 | {
837 | "name": "index1.r_end_036",
838 | "rotation": [
839 | 2.7755575615628914e-17,
840 | 2.7755575615628914e-17,
841 | 1.3877787807814457e-17,
842 | 1.0
843 | ],
844 | "translation": [
845 | -4.440892098500626e-16,
846 | 0.25421473383903503,
847 | 0.0
848 | ]
849 | },
850 | {
851 | "children": [
852 | 25
853 | ],
854 | "name": "middle.r_012",
855 | "rotation": [
856 | 0.07132982462644577,
857 | -0.049500610679388046,
858 | -0.025781074538826942,
859 | 0.995890200138092
860 | ],
861 | "scale": [
862 | 1.0,
863 | 0.9999999403953552,
864 | 0.9999999403953552
865 | ],
866 | "translation": [
867 | 0.07060748338699341,
868 | 1.491424560546875,
869 | 0.11351436376571655
870 | ]
871 | },
872 | {
873 | "children": [
874 | 26
875 | ],
876 | "name": "middle1.r_00",
877 | "rotation": [
878 | 0.020841555669903755,
879 | -0.014414837583899498,
880 | 0.00937262549996376,
881 | 0.9996350407600403
882 | ],
883 | "scale": [
884 | 1.0,
885 | 0.9999999403953552,
886 | 0.9999999403953552
887 | ],
888 | "translation": [
889 | 2.384185791015625e-07,
890 | 0.2933874726295471,
891 | 0.0
892 | ]
893 | },
894 | {
895 | "name": "middle1.r_end_037",
896 | "rotation": [
897 | 2.7755575615628914e-17,
898 | 6.245004513516506e-17,
899 | 5.551115123125783e-17,
900 | 1.0
901 | ],
902 | "translation": [
903 | -4.440892098500626e-16,
904 | 0.28515341877937317,
905 | -2.220446049250313e-16
906 | ]
907 | },
908 | {
909 | "children": [
910 | 28
911 | ],
912 | "name": "ring.r_013",
913 | "rotation": [
914 | 0.055891744792461395,
915 | -0.07666171342134476,
916 | -0.035019125789403915,
917 | 0.9948732256889343
918 | ],
919 | "scale": [
920 | 1.0,
921 | 1.0000001192092896,
922 | 1.0
923 | ],
924 | "translation": [
925 | 0.18682754039764404,
926 | 1.4848365783691406,
927 | -0.08603602647781372
928 | ]
929 | },
930 | {
931 | "children": [
932 | 29
933 | ],
934 | "name": "ring1.r_014",
935 | "rotation": [
936 | 0.02180379070341587,
937 | -0.014768972992897034,
938 | 0.008354267105460167,
939 | 0.9996182918548584
940 | ],
941 | "scale": [
942 | 1.0,
943 | 0.9999999403953552,
944 | 1.0
945 | ],
946 | "translation": [
947 | -2.384185791015625e-07,
948 | 0.30228081345558167,
949 | -2.384185791015625e-07
950 | ]
951 | },
952 | {
953 | "name": "ring1.r_end_038",
954 | "rotation": [
955 | 0.0,
956 | 3.469446951953614e-17,
957 | 0.0,
958 | 1.0
959 | ],
960 | "translation": [
961 | 8.881784197001252e-16,
962 | 0.281179279088974,
963 | 2.220446049250313e-16
964 | ]
965 | },
966 | {
967 | "children": [
968 | 31
969 | ],
970 | "name": "pinky.r_015",
971 | "rotation": [
972 | -0.056875694543123245,
973 | -0.01203614380210638,
974 | -0.0960986539721489,
975 | 0.9936726689338684
976 | ],
977 | "scale": [
978 | 1.0,
979 | 1.0000001192092896,
980 | 1.0
981 | ],
982 | "translation": [
983 | 0.26439720392227173,
984 | 1.4476542472839355,
985 | -0.22652429342269897
986 | ]
987 | },
988 | {
989 | "children": [
990 | 32
991 | ],
992 | "name": "pinky1.r_016",
993 | "rotation": [
994 | 0.05055097118020058,
995 | -0.03503500297665596,
996 | 0.025067122653126717,
997 | 0.9977919459342957
998 | ],
999 | "scale": [
1000 | 1.0,
1001 | 0.9999998807907104,
1002 | 1.0000001192092896
1003 | ],
1004 | "translation": [
1005 | -1.1920928955078125e-07,
1006 | 0.31051313877105713,
1007 | -1.4901161193847656e-07
1008 | ]
1009 | },
1010 | {
1011 | "name": "pinky1.r_end_039",
1012 | "rotation": [
1013 | 1.3877787807814457e-17,
1014 | -2.42861286636753e-17,
1015 | 3.3703774026776627e-34,
1016 | 1.0
1017 | ],
1018 | "translation": [
1019 | -4.440892098500626e-16,
1020 | 0.2603984773159027,
1021 | 2.220446049250313e-16
1022 | ]
1023 | },
1024 | {
1025 | "children": [
1026 | 34
1027 | ],
1028 | "name": "arm.l_017",
1029 | "rotation": [
1030 | -0.06161034479737282,
1031 | 0.025054465979337692,
1032 | -0.861615777015686,
1033 | 0.5031847953796387
1034 | ],
1035 | "scale": [
1036 | 1.000000238418579,
1037 | 1.0000001192092896,
1038 | 1.0
1039 | ],
1040 | "translation": [
1041 | 1.037964940071106,
1042 | 0.7787226438522339,
1043 | -0.07191301137208939
1044 | ]
1045 | },
1046 | {
1047 | "children": [
1048 | 35,
1049 | 38,
1050 | 40,
1051 | 43,
1052 | 46
1053 | ],
1054 | "name": "forearm.l_018",
1055 | "rotation": [
1056 | 0.10943089425563812,
1057 | 0.0685834139585495,
1058 | -0.2099781483411789,
1059 | 0.9691389799118042
1060 | ],
1061 | "scale": [
1062 | 0.9999999403953552,
1063 | 1.0,
1064 | 0.9999999403953552
1065 | ],
1066 | "translation": [
1067 | -1.1920928955078125e-07,
1068 | 1.016752004623413,
1069 | 1.4901161193847656e-07
1070 | ]
1071 | },
1072 | {
1073 | "children": [
1074 | 36
1075 | ],
1076 | "name": "hand.l_019",
1077 | "rotation": [
1078 | 0.423664927482605,
1079 | 0.09755680710077286,
1080 | -0.30837100744247437,
1081 | 0.8461076021194458
1082 | ],
1083 | "scale": [
1084 | 1.0,
1085 | 1.0000001192092896,
1086 | 1.0
1087 | ],
1088 | "translation": [
1089 | 5.960464477539063e-08,
1090 | 1.013556718826294,
1091 | 5.960464477539063e-08
1092 | ]
1093 | },
1094 | {
1095 | "children": [
1096 | 37
1097 | ],
1098 | "name": "thumb.l_020",
1099 | "rotation": [
1100 | -0.08318851888179779,
1101 | -0.04909024387598038,
1102 | 0.06063833087682724,
1103 | 0.9934751391410828
1104 | ],
1105 | "translation": [
1106 | 7.450580596923828e-08,
1107 | 0.5183653831481934,
1108 | -5.960464477539063e-08
1109 | ]
1110 | },
1111 | {
1112 | "name": "thumb.l_end_040",
1113 | "rotation": [
1114 | 5.551115123125783e-17,
1115 | 2.7755575615628914e-17,
1116 | -1.5407439555097887e-33,
1117 | 1.0
1118 | ],
1119 | "translation": [
1120 | 4.440892098500626e-16,
1121 | 0.18877367675304413,
1122 | 0.0
1123 | ]
1124 | },
1125 | {
1126 | "children": [
1127 | 39
1128 | ],
1129 | "name": "index.l_021",
1130 | "rotation": [
1131 | -0.06430221349000931,
1132 | -0.034792691469192505,
1133 | -0.15913113951683044,
1134 | 0.9845466017723083
1135 | ],
1136 | "scale": [
1137 | 1.0,
1138 | 0.9999999403953552,
1139 | 0.9999998807907104
1140 | ],
1141 | "translation": [
1142 | 0.21590262651443481,
1143 | 1.5199835300445557,
1144 | 0.21591147780418396
1145 | ]
1146 | },
1147 | {
1148 | "name": "index.l_end_041",
1149 | "rotation": [
1150 | 2.7755575615628914e-17,
1151 | -6.938893903907228e-18,
1152 | 1.3877787807814457e-17,
1153 | 1.0
1154 | ],
1155 | "translation": [
1156 | 0.0,
1157 | 0.3210669457912445,
1158 | 0.0
1159 | ]
1160 | },
1161 | {
1162 | "children": [
1163 | 41
1164 | ],
1165 | "name": "middle.l_022",
1166 | "rotation": [
1167 | -0.04595402255654335,
1168 | 0.00769611494615674,
1169 | -0.16717500984668732,
1170 | 0.9848257303237915
1171 | ],
1172 | "scale": [
1173 | 1.0,
1174 | 1.0,
1175 | 0.9999999403953552
1176 | ],
1177 | "translation": [
1178 | 0.10538792610168457,
1179 | 1.5229170322418213,
1180 | -0.007428020238876343
1181 | ]
1182 | },
1183 | {
1184 | "children": [
1185 | 42
1186 | ],
1187 | "name": "middle1.l_023",
1188 | "rotation": [
1189 | 0.020841574296355247,
1190 | 0.014414851553738117,
1191 | -0.009372693486511707,
1192 | 0.9996350407600403
1193 | ],
1194 | "scale": [
1195 | 0.9999998807907104,
1196 | 1.0,
1197 | 0.9999999403953552
1198 | ],
1199 | "translation": [
1200 | 0.0,
1201 | 0.29338783025741577,
1202 | 1.7881393432617188e-07
1203 | ]
1204 | },
1205 | {
1206 | "name": "middle1.l_end_042",
1207 | "rotation": [
1208 | 2.7755575615628914e-17,
1209 | -1.3877787807814457e-17,
1210 | 1.3877787807814457e-17,
1211 | 1.0
1212 | ],
1213 | "translation": [
1214 | 0.0,
1215 | 0.28515341877937317,
1216 | 0.0
1217 | ]
1218 | },
1219 | {
1220 | "children": [
1221 | 44
1222 | ],
1223 | "name": "ring.l_024",
1224 | "rotation": [
1225 | -0.056002844125032425,
1226 | 0.03823890537023544,
1227 | -0.16183851659297943,
1228 | 0.9844846129417419
1229 | ],
1230 | "scale": [
1231 | 1.0000001192092896,
1232 | 1.0,
1233 | 1.0
1234 | ],
1235 | "translation": [
1236 | -0.00238722562789917,
1237 | 1.508249282836914,
1238 | -0.2112419307231903
1239 | ]
1240 | },
1241 | {
1242 | "children": [
1243 | 45
1244 | ],
1245 | "name": "ring1.l_025",
1246 | "rotation": [
1247 | 0.021803775802254677,
1248 | 0.014768983237445354,
1249 | -0.008354284800589085,
1250 | 0.9996182918548584
1251 | ],
1252 | "translation": [
1253 | -2.9802322387695313e-08,
1254 | 0.30228036642074585,
1255 | -3.8743019104003906e-07
1256 | ]
1257 | },
1258 | {
1259 | "name": "ring1.l_end_043",
1260 | "rotation": [
1261 | 2.7755575615628914e-17,
1262 | -5.7777898331617076e-34,
1263 | -2.0816681711721685e-17,
1264 | 1.0
1265 | ],
1266 | "translation": [
1267 | 4.440892098500626e-16,
1268 | 0.281179279088974,
1269 | 0.0
1270 | ]
1271 | },
1272 | {
1273 | "children": [
1274 | 47
1275 | ],
1276 | "name": "pinky.l_026",
1277 | "rotation": [
1278 | -0.17971180379390717,
1279 | 0.004280483815819025,
1280 | -0.09752324223518372,
1281 | 0.9788640141487122
1282 | ],
1283 | "scale": [
1284 | 1.0000001192092896,
1285 | 1.0000001192092896,
1286 | 1.0
1287 | ],
1288 | "translation": [
1289 | -0.08654916286468506,
1290 | 1.4671800136566162,
1291 | -0.34676554799079895
1292 | ]
1293 | },
1294 | {
1295 | "children": [
1296 | 48
1297 | ],
1298 | "name": "pinky1.l_027",
1299 | "rotation": [
1300 | 0.05055098980665207,
1301 | 0.035034969449043274,
1302 | -0.02506713755428791,
1303 | 0.9977919459342957
1304 | ],
1305 | "scale": [
1306 | 1.0,
1307 | 1.0,
1308 | 1.0000001192092896
1309 | ],
1310 | "translation": [
1311 | 2.384185791015625e-07,
1312 | 0.3105137348175049,
1313 | -5.960464477539063e-08
1314 | ]
1315 | },
1316 | {
1317 | "name": "pinky1.l_end_044",
1318 | "rotation": [
1319 | 2.7755575615628914e-17,
1320 | 1.3877787807814457e-17,
1321 | -3.851859888774472e-34,
1322 | 1.0
1323 | ],
1324 | "translation": [
1325 | 0.0,
1326 | 0.2603984773159027,
1327 | -2.220446049250313e-16
1328 | ]
1329 | },
1330 | {
1331 | "children": [
1332 | 50
1333 | ],
1334 | "name": "tigh.r_028",
1335 | "rotation": [
1336 | 0.7271880507469177,
1337 | 0.30427059531211853,
1338 | 0.3430641293525696,
1339 | 0.5108071565628052
1340 | ],
1341 | "scale": [
1342 | 0.9999999403953552,
1343 | 0.9999999403953552,
1344 | 0.9999998807907104
1345 | ],
1346 | "translation": [
1347 | -0.632968544960022,
1348 | 1.1774132251739502,
1349 | -1.8106130361557007
1350 | ]
1351 | },
1352 | {
1353 | "children": [
1354 | 51
1355 | ],
1356 | "name": "leg.r_029",
1357 | "rotation": [
1358 | 0.19719117879867554,
1359 | 0.029596319422125816,
1360 | 0.3070812523365021,
1361 | 0.9305593967437744
1362 | ],
1363 | "scale": [
1364 | 1.0,
1365 | 0.9999999403953552,
1366 | 1.0
1367 | ],
1368 | "translation": [
1369 | -1.7881393432617188e-07,
1370 | 0.7718814611434937,
1371 | 4.470348358154297e-08
1372 | ]
1373 | },
1374 | {
1375 | "children": [
1376 | 52
1377 | ],
1378 | "name": "foot.r_030",
1379 | "rotation": [
1380 | -0.3119527995586395,
1381 | 0.010508210398256779,
1382 | -0.4280250370502472,
1383 | 0.8481565713882446
1384 | ],
1385 | "scale": [
1386 | 1.0,
1387 | 1.0,
1388 | 0.9999998807907104
1389 | ],
1390 | "translation": [
1391 | 4.470348358154297e-08,
1392 | 0.8215205669403076,
1393 | 4.470348358154297e-08
1394 | ]
1395 | },
1396 | {
1397 | "name": "foot.r_end_045",
1398 | "rotation": [
1399 | 7.703719777548943e-34,
1400 | 2.7755575615628914e-17,
1401 | -2.7755575615628914e-17,
1402 | 1.0
1403 | ],
1404 | "translation": [
1405 | 2.220446049250313e-16,
1406 | 1.0566707849502563,
1407 | 0.0
1408 | ]
1409 | },
1410 | {
1411 | "children": [
1412 | 54
1413 | ],
1414 | "name": "tigh.l_031",
1415 | "rotation": [
1416 | 0.5788095593452454,
1417 | -0.37945666909217834,
1418 | -0.2574610710144043,
1419 | 0.6743188500404358
1420 | ],
1421 | "scale": [
1422 | 0.9999998807907104,
1423 | 0.9999998807907104,
1424 | 0.9999998807907104
1425 | ],
1426 | "translation": [
1427 | 0.632968544960022,
1428 | 1.1774132251739502,
1429 | -1.8106130361557007
1430 | ]
1431 | },
1432 | {
1433 | "children": [
1434 | 55
1435 | ],
1436 | "name": "leg.l_032",
1437 | "rotation": [
1438 | 0.2552643418312073,
1439 | -0.036766909062862396,
1440 | -0.38728728890419006,
1441 | 0.8851537108421326
1442 | ],
1443 | "scale": [
1444 | 1.0000001192092896,
1445 | 1.0,
1446 | 1.0
1447 | ],
1448 | "translation": [
1449 | -2.123415470123291e-07,
1450 | 0.7718814611434937,
1451 | 5.960464477539063e-08
1452 | ]
1453 | },
1454 | {
1455 | "children": [
1456 | 56
1457 | ],
1458 | "name": "foot.l_033",
1459 | "rotation": [
1460 | -0.3394746780395508,
1461 | -0.00808812864124775,
1462 | 0.4712177813053131,
1463 | 0.8140302896499634
1464 | ],
1465 | "scale": [
1466 | 1.0,
1467 | 0.9999998807907104,
1468 | 1.0000001192092896
1469 | ],
1470 | "translation": [
1471 | 2.2351741790771484e-08,
1472 | 0.8215208053588867,
1473 | 4.470348358154297e-08
1474 | ]
1475 | },
1476 | {
1477 | "name": "foot.l_end_046",
1478 | "rotation": [
1479 | 1.3877787807814457e-17,
1480 | -2.7755575615628914e-17,
1481 | 3.851859888774472e-34,
1482 | 1.0
1483 | ],
1484 | "translation": [
1485 | 0.0,
1486 | 1.0566707849502563,
1487 | 2.7755575615628914e-17
1488 | ]
1489 | }
1490 | ],
1491 | "samplers": [
1492 | {
1493 | "magFilter": 9729,
1494 | "minFilter": 9987,
1495 | "wrapS": 10497,
1496 | "wrapT": 10497
1497 | },
1498 | {
1499 | "magFilter": 9728,
1500 | "minFilter": 9986,
1501 | "wrapS": 10497,
1502 | "wrapT": 10497
1503 | }
1504 | ],
1505 | "scene": 0,
1506 | "scenes": [
1507 | {
1508 | "name": "Sketchfab_Scene",
1509 | "nodes": [
1510 | 0
1511 | ]
1512 | }
1513 | ],
1514 | "skins": [
1515 | {
1516 | "inverseBindMatrices": 12,
1517 | "joints": [
1518 | 5,
1519 | 10,
1520 | 11,
1521 | 12,
1522 | 13,
1523 | 14,
1524 | 15,
1525 | 16,
1526 | 17,
1527 | 18,
1528 | 19,
1529 | 20,
1530 | 21,
1531 | 22,
1532 | 23,
1533 | 24,
1534 | 25,
1535 | 26,
1536 | 27,
1537 | 28,
1538 | 29,
1539 | 30,
1540 | 31,
1541 | 32,
1542 | 33,
1543 | 34,
1544 | 35,
1545 | 36,
1546 | 37,
1547 | 38,
1548 | 39,
1549 | 40,
1550 | 41,
1551 | 42,
1552 | 43,
1553 | 44,
1554 | 45,
1555 | 46,
1556 | 47,
1557 | 48,
1558 | 49,
1559 | 50,
1560 | 51,
1561 | 52,
1562 | 53,
1563 | 54,
1564 | 55,
1565 | 56
1566 | ],
1567 | "skeleton": 5
1568 | }
1569 | ],
1570 | "textures": [
1571 | {
1572 | "sampler": 0,
1573 | "source": 0
1574 | },
1575 | {
1576 | "sampler": 1,
1577 | "source": 0
1578 | }
1579 | ]
1580 | }
1581 |
--------------------------------------------------------------------------------
/public/astro/textures/Suit_Base_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/astro/textures/Suit_Base_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/license.txt:
--------------------------------------------------------------------------------
1 | Model Information:
2 | * title: Gaming Desktop PC
3 | * source: https://sketchfab.com/3d-models/gaming-desktop-pc-d1d8282c9916438091f11aeb28787b66
4 | * author: Yolala1232 (https://sketchfab.com/Yolala1232)
5 |
6 | Model License:
7 | * license type: CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)
8 | * requirements: Author must be credited. Commercial use is allowed.
9 |
10 | If you use this 3D model in your project be sure to copy paste this credit wherever you share it:
11 | This work is based on "Gaming Desktop PC" (https://sketchfab.com/3d-models/gaming-desktop-pc-d1d8282c9916438091f11aeb28787b66) by Yolala1232 (https://sketchfab.com/Yolala1232) licensed under CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)
--------------------------------------------------------------------------------
/public/desktop_pc/scene.bin:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/scene.bin
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.002_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.002_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.023_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.023_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.024_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.024_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_0_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_0_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_10_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_10_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_11_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_11_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_12_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_12_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_13_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_13_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_14_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_14_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_15_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_15_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_16_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_16_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_17_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_17_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_18_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_18_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_18_emissive.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_18_emissive.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_19_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_19_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_1_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_1_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_20_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_20_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_21_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_21_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_22_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_22_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_23_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_23_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_24_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_24_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_24_emissive.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_24_emissive.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_25_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_25_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_26_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_26_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_27_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_27_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_27_emissive.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_27_emissive.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_28_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_28_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_29_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_29_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_2_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_2_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_30_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_30_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_31_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_31_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_32_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_32_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_33_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_33_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_34_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_34_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_35_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_35_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_36_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_36_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_39_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_39_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_3_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_3_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_40_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_40_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_4_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_4_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_4_emissive.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_4_emissive.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_5_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_5_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_6_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_6_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_7_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_7_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_8_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_8_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_9_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_9_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_9_emissive.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_9_emissive.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material.074_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material.074_baseColor.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material_baseColor.jpeg
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Material_metallicRoughness.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Material_metallicRoughness.png
--------------------------------------------------------------------------------
/public/desktop_pc/textures/Tasten_2_baseColor.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/desktop_pc/textures/Tasten_2_baseColor.jpeg
--------------------------------------------------------------------------------
/public/logo.svg:
--------------------------------------------------------------------------------
1 |
2 |
14 |
23 |
25 |
30 |
32 |
35 |
38 |
41 |
44 |
47 |
52 |
55 |
56 |
57 |
62 |
65 |
66 |
67 |
--------------------------------------------------------------------------------
/public/planet/license.txt:
--------------------------------------------------------------------------------
1 | Model Information:
2 | * title: Stylized planet
3 | * source: https://sketchfab.com/3d-models/stylized-planet-789725db86f547fc9163b00f302c3e70
4 | * author: cmzw (https://sketchfab.com/cmzw)
5 |
6 | Model License:
7 | * license type: CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)
8 | * requirements: Author must be credited. Commercial use is allowed.
9 |
10 | If you use this 3D model in your project be sure to copy paste this credit wherever you share it:
11 | This work is based on "Stylized planet" (https://sketchfab.com/3d-models/stylized-planet-789725db86f547fc9163b00f302c3e70) by cmzw (https://sketchfab.com/cmzw) licensed under CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)
--------------------------------------------------------------------------------
/public/planet/scene.bin:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/planet/scene.bin
--------------------------------------------------------------------------------
/public/planet/scene.gltf:
--------------------------------------------------------------------------------
1 | {
2 | "accessors": [
3 | {
4 | "bufferView": 2,
5 | "componentType": 5126,
6 | "count": 26495,
7 | "max": [
8 | 0.8758764863014221,
9 | 0.8545469045639038,
10 | 0.8728971481323242
11 | ],
12 | "min": [
13 | -0.8763356804847717,
14 | -0.8634992837905884,
15 | -0.8758782148361206
16 | ],
17 | "type": "VEC3"
18 | },
19 | {
20 | "bufferView": 2,
21 | "byteOffset": 317940,
22 | "componentType": 5126,
23 | "count": 26495,
24 | "max": [
25 | 1.0,
26 | 0.9999911785125732,
27 | 0.9991646409034729
28 | ],
29 | "min": [
30 | -1.0,
31 | -0.9999968409538269,
32 | -0.9999611377716064
33 | ],
34 | "type": "VEC3"
35 | },
36 | {
37 | "bufferView": 1,
38 | "componentType": 5126,
39 | "count": 26495,
40 | "max": [
41 | 1.0,
42 | 1.0
43 | ],
44 | "min": [
45 | 0.0,
46 | 0.0
47 | ],
48 | "type": "VEC2"
49 | },
50 | {
51 | "bufferView": 0,
52 | "componentType": 5125,
53 | "count": 103014,
54 | "type": "SCALAR"
55 | },
56 | {
57 | "bufferView": 2,
58 | "byteOffset": 635880,
59 | "componentType": 5126,
60 | "count": 6596,
61 | "max": [
62 | 0.6551179885864258,
63 | 0.6613333821296692,
64 | 0.6618664860725403
65 | ],
66 | "min": [
67 | -0.6606217622756958,
68 | -0.6490849852561951,
69 | -0.6526646018028259
70 | ],
71 | "type": "VEC3"
72 | },
73 | {
74 | "bufferView": 2,
75 | "byteOffset": 715032,
76 | "componentType": 5126,
77 | "count": 6596,
78 | "max": [
79 | 0.999987006187439,
80 | 0.9998384118080139,
81 | 0.9999796748161316
82 | ],
83 | "min": [
84 | -0.9995425939559937,
85 | -0.999676525592804,
86 | -0.9994800686836243
87 | ],
88 | "type": "VEC3"
89 | },
90 | {
91 | "bufferView": 1,
92 | "byteOffset": 211960,
93 | "componentType": 5126,
94 | "count": 6596,
95 | "max": [
96 | 1.0,
97 | 1.0
98 | ],
99 | "min": [
100 | 0.0,
101 | 0.0
102 | ],
103 | "type": "VEC2"
104 | },
105 | {
106 | "bufferView": 0,
107 | "byteOffset": 412056,
108 | "componentType": 5125,
109 | "count": 39042,
110 | "type": "SCALAR"
111 | },
112 | {
113 | "bufferView": 3,
114 | "componentType": 5126,
115 | "count": 451,
116 | "max": [
117 | 15.0
118 | ],
119 | "min": [
120 | 0.0
121 | ],
122 | "type": "SCALAR"
123 | },
124 | {
125 | "bufferView": 5,
126 | "componentType": 5126,
127 | "count": 451,
128 | "max": [
129 | 0.20017318427562714,
130 | 0.979751706123352,
131 | 0.2001722753047943,
132 | 0.9797602891921997
133 | ],
134 | "min": [
135 | -0.018710684031248093,
136 | -0.9797568917274475,
137 | -0.1991616040468216,
138 | 0.0026621678844094276
139 | ],
140 | "type": "VEC4"
141 | },
142 | {
143 | "bufferView": 3,
144 | "byteOffset": 1804,
145 | "componentType": 5126,
146 | "count": 125,
147 | "max": [
148 | 15.0
149 | ],
150 | "min": [
151 | 0.0
152 | ],
153 | "type": "SCALAR"
154 | },
155 | {
156 | "bufferView": 4,
157 | "componentType": 5126,
158 | "count": 125,
159 | "max": [
160 | 1.0000001192092896,
161 | 1.0,
162 | 1.0000001192092896
163 | ],
164 | "min": [
165 | 0.9999998807907104,
166 | 1.0,
167 | 0.9999998807907104
168 | ],
169 | "type": "VEC3"
170 | },
171 | {
172 | "bufferView": 3,
173 | "byteOffset": 2304,
174 | "componentType": 5126,
175 | "count": 451,
176 | "max": [
177 | 15.0
178 | ],
179 | "min": [
180 | 0.0
181 | ],
182 | "type": "SCALAR"
183 | },
184 | {
185 | "bufferView": 5,
186 | "byteOffset": 7216,
187 | "componentType": 5126,
188 | "count": 451,
189 | "max": [
190 | 0.20017318427562714,
191 | 0.979751706123352,
192 | 0.2001722753047943,
193 | 0.9797602891921997
194 | ],
195 | "min": [
196 | -0.018710684031248093,
197 | -0.9797568917274475,
198 | -0.1991616040468216,
199 | 0.0026621678844094276
200 | ],
201 | "type": "VEC4"
202 | },
203 | {
204 | "bufferView": 3,
205 | "byteOffset": 4108,
206 | "componentType": 5126,
207 | "count": 125,
208 | "max": [
209 | 15.0
210 | ],
211 | "min": [
212 | 0.0
213 | ],
214 | "type": "SCALAR"
215 | },
216 | {
217 | "bufferView": 4,
218 | "byteOffset": 1500,
219 | "componentType": 5126,
220 | "count": 125,
221 | "max": [
222 | 1.0000001192092896,
223 | 1.0,
224 | 1.0000001192092896
225 | ],
226 | "min": [
227 | 0.9999998807907104,
228 | 1.0,
229 | 0.9999998807907104
230 | ],
231 | "type": "VEC3"
232 | }
233 | ],
234 | "animations": [
235 | {
236 | "channels": [
237 | {
238 | "sampler": 0,
239 | "target": {
240 | "node": 3,
241 | "path": "rotation"
242 | }
243 | },
244 | {
245 | "sampler": 1,
246 | "target": {
247 | "node": 3,
248 | "path": "scale"
249 | }
250 | },
251 | {
252 | "sampler": 2,
253 | "target": {
254 | "node": 5,
255 | "path": "rotation"
256 | }
257 | },
258 | {
259 | "sampler": 3,
260 | "target": {
261 | "node": 5,
262 | "path": "scale"
263 | }
264 | }
265 | ],
266 | "name": "Animation",
267 | "samplers": [
268 | {
269 | "input": 8,
270 | "interpolation": "LINEAR",
271 | "output": 9
272 | },
273 | {
274 | "input": 10,
275 | "interpolation": "LINEAR",
276 | "output": 11
277 | },
278 | {
279 | "input": 12,
280 | "interpolation": "LINEAR",
281 | "output": 13
282 | },
283 | {
284 | "input": 14,
285 | "interpolation": "LINEAR",
286 | "output": 15
287 | }
288 | ]
289 | }
290 | ],
291 | "asset": {
292 | "extras": {
293 | "author": "cmzw (https://sketchfab.com/cmzw)",
294 | "license": "CC-BY-4.0 (http://creativecommons.org/licenses/by/4.0/)",
295 | "source": "https://sketchfab.com/3d-models/stylized-planet-789725db86f547fc9163b00f302c3e70",
296 | "title": "Stylized planet"
297 | },
298 | "generator": "Sketchfab-14.10.0",
299 | "version": "2.0"
300 | },
301 | "bufferViews": [
302 | {
303 | "buffer": 0,
304 | "byteLength": 568224,
305 | "name": "floatBufferViews",
306 | "target": 34963
307 | },
308 | {
309 | "buffer": 0,
310 | "byteLength": 264728,
311 | "byteOffset": 568224,
312 | "byteStride": 8,
313 | "name": "floatBufferViews",
314 | "target": 34962
315 | },
316 | {
317 | "buffer": 0,
318 | "byteLength": 794184,
319 | "byteOffset": 832952,
320 | "byteStride": 12,
321 | "name": "floatBufferViews",
322 | "target": 34962
323 | },
324 | {
325 | "buffer": 0,
326 | "byteLength": 4608,
327 | "byteOffset": 1627136,
328 | "name": "floatBufferViews"
329 | },
330 | {
331 | "buffer": 0,
332 | "byteLength": 3000,
333 | "byteOffset": 1631744,
334 | "byteStride": 12,
335 | "name": "floatBufferViews"
336 | },
337 | {
338 | "buffer": 0,
339 | "byteLength": 14432,
340 | "byteOffset": 1634744,
341 | "byteStride": 16,
342 | "name": "floatBufferViews"
343 | }
344 | ],
345 | "buffers": [
346 | {
347 | "byteLength": 1649176,
348 | "uri": "scene.bin"
349 | }
350 | ],
351 | "extensionsUsed": [
352 | "KHR_materials_unlit"
353 | ],
354 | "images": [
355 | {
356 | "uri": "textures/Clouds_baseColor.png"
357 | },
358 | {
359 | "uri": "textures/Planet_baseColor.png"
360 | }
361 | ],
362 | "materials": [
363 | {
364 | "doubleSided": true,
365 | "emissiveTexture": {
366 | "index": 0
367 | },
368 | "extensions": {
369 | "KHR_materials_unlit": {}
370 | },
371 | "name": "Clouds",
372 | "pbrMetallicRoughness": {
373 | "baseColorTexture": {
374 | "index": 0
375 | },
376 | "metallicFactor": 0.0
377 | }
378 | },
379 | {
380 | "emissiveFactor": [
381 | 0.23391156271636818,
382 | 0.23391156271636818,
383 | 0.23391156271636818
384 | ],
385 | "emissiveTexture": {
386 | "index": 1
387 | },
388 | "extensions": {
389 | "KHR_materials_unlit": {}
390 | },
391 | "name": "Planet",
392 | "pbrMetallicRoughness": {
393 | "baseColorTexture": {
394 | "index": 1
395 | },
396 | "metallicFactor": 0.0
397 | }
398 | }
399 | ],
400 | "meshes": [
401 | {
402 | "name": "Object_0",
403 | "primitives": [
404 | {
405 | "attributes": {
406 | "NORMAL": 1,
407 | "POSITION": 0,
408 | "TEXCOORD_0": 2
409 | },
410 | "indices": 3,
411 | "material": 0,
412 | "mode": 4
413 | }
414 | ]
415 | },
416 | {
417 | "name": "Object_1",
418 | "primitives": [
419 | {
420 | "attributes": {
421 | "NORMAL": 5,
422 | "POSITION": 4,
423 | "TEXCOORD_0": 6
424 | },
425 | "indices": 7,
426 | "material": 1,
427 | "mode": 4
428 | }
429 | ]
430 | }
431 | ],
432 | "nodes": [
433 | {
434 | "children": [
435 | 1
436 | ],
437 | "matrix": [
438 | 0.9979661703109741,
439 | 0.06371438503265381,
440 | 0.001990502001717701,
441 | 0.0,
442 | 0.0,
443 | 0.031225780025124772,
444 | -0.9995123744010925,
445 | 0.0,
446 | -0.06374546885490417,
447 | 0.9974795579910278,
448 | 0.031162271276116593,
449 | 0.0,
450 | 0.0,
451 | 0.0,
452 | 0.0,
453 | 1.0
454 | ],
455 | "name": "Sketchfab_model"
456 | },
457 | {
458 | "children": [
459 | 2
460 | ],
461 | "name": "root"
462 | },
463 | {
464 | "children": [
465 | 3,
466 | 5
467 | ],
468 | "matrix": [
469 | 1.0,
470 | 0.0,
471 | 0.0,
472 | 0.0,
473 | 0.0,
474 | 2.220446049250313e-16,
475 | 1.0,
476 | 0.0,
477 | 0.0,
478 | -1.0,
479 | 2.220446049250313e-16,
480 | 0.0,
481 | 0.0,
482 | 0.0,
483 | 0.0,
484 | 1.0
485 | ],
486 | "name": "GLTF_SceneRootNode"
487 | },
488 | {
489 | "children": [
490 | 4
491 | ],
492 | "name": "Clouds_1"
493 | },
494 | {
495 | "mesh": 0,
496 | "name": "Object_4"
497 | },
498 | {
499 | "children": [
500 | 6
501 | ],
502 | "name": "Planet_2"
503 | },
504 | {
505 | "mesh": 1,
506 | "name": "Object_6"
507 | }
508 | ],
509 | "samplers": [
510 | {
511 | "magFilter": 9729,
512 | "minFilter": 9987,
513 | "wrapS": 10497,
514 | "wrapT": 10497
515 | }
516 | ],
517 | "scene": 0,
518 | "scenes": [
519 | {
520 | "name": "Sketchfab_Scene",
521 | "nodes": [
522 | 0
523 | ]
524 | }
525 | ],
526 | "textures": [
527 | {
528 | "sampler": 0,
529 | "source": 0
530 | },
531 | {
532 | "sampler": 0,
533 | "source": 1
534 | }
535 | ]
536 | }
537 |
--------------------------------------------------------------------------------
/public/planet/textures/Clouds_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/planet/textures/Clouds_baseColor.png
--------------------------------------------------------------------------------
/public/planet/textures/Planet_baseColor.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/public/planet/textures/Planet_baseColor.png
--------------------------------------------------------------------------------
/src/App.jsx:
--------------------------------------------------------------------------------
1 | import { BrowserRouter } from "react-router-dom";
2 |
3 | import {
4 | About,
5 | Contact,
6 | Experience,
7 | Feedbacks,
8 | Hero,
9 | Navbar,
10 | Tech,
11 | Works,
12 | StarsCanvas,
13 | Footer,
14 | } from "./components";
15 |
16 | const App = () => {
17 | return (
18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 | );
50 | };
51 |
52 | export default App;
53 |
--------------------------------------------------------------------------------
/src/assets/LOGO2.webp:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/LOGO2.webp
--------------------------------------------------------------------------------
/src/assets/backend.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/backend.png
--------------------------------------------------------------------------------
/src/assets/beeclone.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/beeclone.png
--------------------------------------------------------------------------------
/src/assets/carrent.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/carrent.png
--------------------------------------------------------------------------------
/src/assets/close.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
--------------------------------------------------------------------------------
/src/assets/code1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/code1.png
--------------------------------------------------------------------------------
/src/assets/company/meta.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/company/meta.png
--------------------------------------------------------------------------------
/src/assets/company/shopify.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/company/shopify.png
--------------------------------------------------------------------------------
/src/assets/company/starbucks.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/company/starbucks.png
--------------------------------------------------------------------------------
/src/assets/company/tesla.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/company/tesla.png
--------------------------------------------------------------------------------
/src/assets/creator.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/creator.png
--------------------------------------------------------------------------------
/src/assets/github.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/github.png
--------------------------------------------------------------------------------
/src/assets/herobg.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/herobg.png
--------------------------------------------------------------------------------
/src/assets/ig.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/ig.png
--------------------------------------------------------------------------------
/src/assets/index.js:
--------------------------------------------------------------------------------
1 | import logo from "./logo3.png";
2 | import backend from "./backend.png";
3 | import creator from "./creator.png";
4 | import mobile from "./mobile.png";
5 | import web from "./web.png";
6 | import github from "./github.png";
7 | import menu from "./menu.svg";
8 | import close from "./close.svg";
9 | import code1 from "./code1.png";
10 |
11 | import css from "./tech/css.png";
12 | import docker from "./tech/docker.png";
13 | import figma from "./tech/figma.png";
14 | import git from "./tech/git.png";
15 | import html from "./tech/html.png";
16 | import javascript from "./tech/javascript.png";
17 | import mongodb from "./tech/mongodb.png";
18 | import nodejs from "./tech/nodejs.png";
19 | import reactjs from "./tech/reactjs.png";
20 | import redux from "./tech/redux.png";
21 | import tailwind from "./tech/tailwind.png";
22 | import typescript from "./tech/typescript.png";
23 | import threejs from "./tech/threejs.png";
24 | import python from "./tech/python.png";
25 | import meta from "./company/meta.png";
26 | import shopify from "./company/shopify.png";
27 | import starbucks from "./company/starbucks.png";
28 | import tesla from "./company/tesla.png";
29 | import django from "./tech/django.png";
30 | import postgres from "./tech/postgres.png";
31 | import sql from "./tech/sql.svg";
32 | import next from "./tech/next.png";
33 | import vue from "./tech/vue.svg"
34 | import carrent from "./carrent.png";
35 | import jobit from "./jobit.png";
36 | import tripguide from "./tripguide.png";
37 | import movie from "./movie.png"
38 | import shop from "./shop.png"
39 | import youtube from "./youtube.png"
40 | import jeff from "./jeff.jpg"
41 | import liveLink from "./liveLink.png"
42 | import portfolio15 from "./portfolio15.png"
43 | import portfolio16 from "./portfolio16.png"
44 | import portfolio17 from "./portfolio17.png"
45 | import LOGO2 from "./LOGO2.webp";
46 | import tiktok from "./tiktok.png";
47 | import ig from "./ig.png";
48 | import linktree from "./linktree.png";
49 | import smartrep from "./smartrep.png";
50 | import matrixai from "./matrixai.png";
51 | import beeclone from "./beeclone.png";
52 | import notable from "./notable.png";
53 | import zapflow from "./zapflow.png";
54 |
55 |
56 | export {
57 | logo,
58 | backend,
59 | creator,
60 | mobile,
61 | web,
62 | github,
63 | menu,
64 | close,
65 | css,
66 | docker,
67 | figma,
68 | git,
69 | html,
70 | javascript,
71 | mongodb,
72 | nodejs,
73 | reactjs,
74 | redux,
75 | tailwind,
76 | typescript,
77 | threejs,
78 | meta,
79 | shopify,
80 | starbucks,
81 | tesla,
82 | carrent,
83 | jobit,
84 | tripguide,
85 | code1,
86 | movie,
87 | shop,
88 | youtube,
89 | jeff,
90 | python,
91 | django,
92 | postgres,
93 | sql,
94 | next,
95 | vue,
96 | liveLink,
97 | portfolio15,
98 | portfolio16,
99 | portfolio17,
100 | LOGO2,
101 | tiktok,
102 | ig,
103 | linktree,
104 | smartrep,
105 | matrixai,
106 | beeclone,
107 | notable,
108 | zapflow,
109 | };
110 |
--------------------------------------------------------------------------------
/src/assets/jeff.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/jeff.jpg
--------------------------------------------------------------------------------
/src/assets/jeff_jiang.pdf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/jeff_jiang.pdf
--------------------------------------------------------------------------------
/src/assets/jobit.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/jobit.png
--------------------------------------------------------------------------------
/src/assets/linktree.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/linktree.png
--------------------------------------------------------------------------------
/src/assets/liveLink.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/liveLink.png
--------------------------------------------------------------------------------
/src/assets/logo.svg:
--------------------------------------------------------------------------------
1 |
2 |
14 |
23 |
25 |
30 |
32 |
35 |
38 |
41 |
44 |
47 |
52 |
55 |
56 |
57 |
62 |
65 |
66 |
67 |
--------------------------------------------------------------------------------
/src/assets/logo3.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/logo3.png
--------------------------------------------------------------------------------
/src/assets/matrixai.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/matrixai.png
--------------------------------------------------------------------------------
/src/assets/menu.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
--------------------------------------------------------------------------------
/src/assets/mobile.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/mobile.png
--------------------------------------------------------------------------------
/src/assets/movie.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/movie.png
--------------------------------------------------------------------------------
/src/assets/notable.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/notable.png
--------------------------------------------------------------------------------
/src/assets/portfolio15.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/portfolio15.png
--------------------------------------------------------------------------------
/src/assets/portfolio16.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/portfolio16.png
--------------------------------------------------------------------------------
/src/assets/portfolio17.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/portfolio17.png
--------------------------------------------------------------------------------
/src/assets/shop.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/shop.png
--------------------------------------------------------------------------------
/src/assets/smartrep.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/smartrep.png
--------------------------------------------------------------------------------
/src/assets/tech/css.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/css.png
--------------------------------------------------------------------------------
/src/assets/tech/django.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/django.png
--------------------------------------------------------------------------------
/src/assets/tech/docker.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/docker.png
--------------------------------------------------------------------------------
/src/assets/tech/figma.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/figma.png
--------------------------------------------------------------------------------
/src/assets/tech/git.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/git.png
--------------------------------------------------------------------------------
/src/assets/tech/html.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/html.png
--------------------------------------------------------------------------------
/src/assets/tech/javascript.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/javascript.png
--------------------------------------------------------------------------------
/src/assets/tech/mongodb.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/mongodb.png
--------------------------------------------------------------------------------
/src/assets/tech/next.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/next.png
--------------------------------------------------------------------------------
/src/assets/tech/nodejs.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/nodejs.png
--------------------------------------------------------------------------------
/src/assets/tech/postgres.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/postgres.png
--------------------------------------------------------------------------------
/src/assets/tech/python.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/python.png
--------------------------------------------------------------------------------
/src/assets/tech/reactjs.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/reactjs.png
--------------------------------------------------------------------------------
/src/assets/tech/redux.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/redux.png
--------------------------------------------------------------------------------
/src/assets/tech/sql.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/tech/tailwind.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/tailwind.png
--------------------------------------------------------------------------------
/src/assets/tech/threejs.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/threejs.png
--------------------------------------------------------------------------------
/src/assets/tech/typescript.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tech/typescript.png
--------------------------------------------------------------------------------
/src/assets/tech/vue.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/src/assets/tiktok.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tiktok.png
--------------------------------------------------------------------------------
/src/assets/tripguide.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/tripguide.png
--------------------------------------------------------------------------------
/src/assets/web.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/web.png
--------------------------------------------------------------------------------
/src/assets/youtube.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/youtube.png
--------------------------------------------------------------------------------
/src/assets/zapflow.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/assets/zapflow.png
--------------------------------------------------------------------------------
/src/components/About.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Tilt } from "react-tilt";
3 | import { motion } from "framer-motion";
4 |
5 | import { styles } from "../styles";
6 | import { services } from "../constants";
7 | import { SectionWrapper } from "../hoc";
8 | import { fadeIn, textVariant } from "../utils/motion";
9 | import { jeff } from "../assets";
10 | const ServiceCard = ({ index, title, icon }) => (
11 |
12 |
16 |
24 |
29 |
30 |
31 | {title}
32 |
33 |
34 |
35 |
36 | );
37 |
38 | const About = () => {
39 | return (
40 | <>
41 |
42 |
Introduction
43 |
Overview.
44 |
45 |
46 |
50 | Hello! I'm Jeff Jiang, a New York-based Full-Stack Developer
51 | proficient in an array of modern technologies including Python 3,
52 | JavaScript ES6+, SQL, Django 4, MongoDB, Node.js, React, and more. I'm
53 | passionate about creating dynamic, efficient, and user-friendly web
54 | applications. I have hands-on experience in developing e-commerce
55 | platforms, utilizing technologies such as Next.js, Strapi, Tailwind,
56 | Firebase, and Redux. I am also experienced in managing the full
57 | project lifecycle from setup to deployment. My journey in tech is
58 | supported by my prior experiences, including my time as a Police
59 | Officer at NYPD and a Restaurant Manager, which honed my skills in
60 | teamwork, problem-solving, and operations management. Feel free to
61 | explore my projects and get in touch at{" "}
62 |
66 | jeff.jiang13@gmail.com.
67 | {" "}
68 | I'm always open to new opportunities and collaborations!{" "}
69 |
70 |
71 |
75 |
79 |
84 |
85 |
86 |
87 |
88 |
89 | {services.map((service, index) => (
90 |
91 | ))}
92 |
93 | >
94 | );
95 | };
96 |
97 | export default SectionWrapper(About, "about");
98 |
--------------------------------------------------------------------------------
/src/components/CV.jsx:
--------------------------------------------------------------------------------
1 | import React from "react"
2 | import { motion } from "framer-motion"
3 |
4 | import { styles } from "../styles"
5 | import { SectionWrapper } from "../hoc"
6 | import { fadeIn, textVariant } from "../utils/motion"
7 | import { CVDuncan } from "../constants"
8 | import CVDoc from "../assets/jeff_jiang.pdf"
9 |
10 | const Card = ({ index, text, name, designation, company, image }) => (
11 |
12 |
13 |
14 |
15 |
16 |
17 |
22 |
23 |
24 |
25 | )
26 |
27 | const CV = () => {
28 | return (
29 |
42 |
43 | )
44 | }
45 |
46 | export default SectionWrapper(CV, "cv")
47 |
--------------------------------------------------------------------------------
/src/components/Contact.jsx:
--------------------------------------------------------------------------------
1 | import React, { useRef, useState } from "react";
2 | import { motion } from "framer-motion";
3 | import emailjs from "@emailjs/browser";
4 |
5 | import { styles } from "../styles";
6 | import { EarthCanvas } from "./canvas";
7 | import { SectionWrapper } from "../hoc";
8 | import { slideIn } from "../utils/motion";
9 |
10 | const Contact = () => {
11 | const formRef = useRef();
12 | const [form, setForm] = useState({
13 | name: "",
14 | email: "",
15 | message: "",
16 | });
17 |
18 | const [loading, setLoading] = useState(false);
19 |
20 | const handleChange = (e) => {
21 | const { target } = e;
22 | const { name, value } = target;
23 |
24 | setForm({
25 | ...form,
26 | [name]: value,
27 | });
28 | };
29 |
30 | const handleSubmit = (e) => {
31 | e.preventDefault();
32 | setLoading(true);
33 |
34 | emailjs
35 | .send(
36 | import.meta.env.VITE_APP_EMAILJS_SERVICE_ID,
37 | import.meta.env.VITE_APP_EMAILJS_TEMPLATE_ID,
38 | {
39 | name: form.name,
40 | to_name: "Jeff Jiang",
41 | email: form.email,
42 | to_email: "jeff.jiang13@gmail.com",
43 | message: form.message,
44 | },
45 | import.meta.env.VITE_APP_EMAILJS_PUBLIC_KEY
46 | )
47 | .then(
48 | () => {
49 | setLoading(false);
50 | alert("Thank you. I will get back to you as soon as possible.");
51 |
52 | setForm({
53 | name: "",
54 | email: "",
55 | message: "",
56 | });
57 | },
58 | (error) => {
59 | setLoading(false);
60 | console.error(error);
61 |
62 | alert("Ahh, something went wrong. Please try again.");
63 | }
64 | );
65 | };
66 |
67 | return (
68 |
69 |
72 |
76 | Get in touch
77 | Contact.
78 |
79 |
125 |
126 |
127 |
131 |
132 |
133 |
134 | );
135 | };
136 |
137 | export default SectionWrapper(Contact, "contact");
138 |
--------------------------------------------------------------------------------
/src/components/Experience.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import {
3 | VerticalTimeline,
4 | VerticalTimelineElement,
5 | } from "react-vertical-timeline-component";
6 | import { motion } from "framer-motion";
7 |
8 | import "react-vertical-timeline-component/style.min.css";
9 |
10 | import { styles } from "../styles";
11 | import { experiences } from "../constants";
12 | import { SectionWrapper } from "../hoc";
13 | import { textVariant } from "../utils/motion";
14 |
15 | const ExperienceCard = ({ experience }) => {
16 | return (
17 |
27 |
32 |
33 | }
34 | >
35 |
36 |
{experience.title}
37 |
41 | {experience.company_name}
42 |
43 |
44 |
45 |
46 | {experience.points.map((point, index) => (
47 |
51 | {point}
52 |
53 | ))}
54 |
55 |
56 | );
57 | };
58 |
59 | const Experience = () => {
60 | return (
61 | <>
62 |
63 |
64 | What I have done so far
65 |
66 |
69 | Experience.
70 |
71 |
72 |
73 |
74 |
75 | {experiences.map((experience, index) => (
76 |
80 | ))}
81 |
82 |
83 | >
84 | );
85 | };
86 |
87 | export default SectionWrapper(Experience, "work");
88 |
--------------------------------------------------------------------------------
/src/components/Feedbacks.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { motion } from "framer-motion";
3 |
4 | import { styles } from "../styles";
5 | import { SectionWrapper } from "../hoc";
6 | import { fadeIn, textVariant } from "../utils/motion";
7 | import { testimonials } from "../constants";
8 | // import { ComputersCanvas } from "./canvas";
9 | import Slider from "react-slick";
10 | import "slick-carousel/slick/slick.css";
11 | import "slick-carousel/slick/slick-theme.css";
12 | import { imageProjects } from "../constants";
13 | const FeedbackCard = ({
14 | index,
15 | testimonial,
16 | name,
17 | designation,
18 | company,
19 | image,
20 | }) => (
21 |
25 | "
26 |
27 |
28 |
{testimonial}
29 |
30 |
31 |
32 |
33 | @ {name}
34 |
35 |
36 | {designation} of {company}
37 |
38 |
39 |
40 |
45 |
46 |
47 |
48 | );
49 | const ImageCarousel = () => {
50 | // Settings for the slider
51 | const settings = {
52 | dots: true,
53 | infinite: true,
54 | speed: 500,
55 | slidesToShow: 1,
56 | slidesToScroll: 1,
57 | autoplay: true,
58 | autoplaySpeed: 2000,
59 | };
60 |
61 | return (
62 |
63 |
Check it out
64 |
67 | Preview.
68 |
69 |
70 | {imageProjects.map((project) => (
71 |
72 |
73 |
74 |
75 |
76 | {project.title}
77 |
78 |
{project.description}
79 |
80 | ))}
81 |
82 |
83 | );
84 | };
85 |
86 | const Feedbacks = () => {
87 | return (
88 | <>
89 | {/*
93 |
94 |
*/}
95 |
96 |
99 | {/*
100 | What others say
101 |
104 | Testimonials.
105 |
106 |
107 |
108 |
109 | {testimonials.map((testimonial, index) => (
110 |
115 | ))} */}
116 |
117 |
118 |
119 | >
120 | );
121 | };
122 |
123 | export default SectionWrapper(Feedbacks, "");
124 |
--------------------------------------------------------------------------------
/src/components/Footer.jsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from "react";
2 |
3 | import { LOGO2 } from "../assets";
4 | import Typewriter from "react-ts-typewriter";
5 | import { Link } from "react-router-dom";
6 |
7 | const Footer = () => {
8 | const [active, setActive] = useState("");
9 |
10 | return (
11 |
12 |
13 |
{
16 | setActive("");
17 | window.scrollTo(0, 0);
18 | }}
19 | >
20 |
21 |
22 |
23 | {new Date().getFullYear()} © Created by Jeff Jiang. All rights
24 | reserved.
25 |
26 |
27 |
28 | ",
33 | ]}
34 | loop
35 | speed={80}
36 | cursor={false}
37 | />
38 |
39 |
40 | );
41 | };
42 |
43 | export default Footer;
44 |
--------------------------------------------------------------------------------
/src/components/Hero.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { motion } from "framer-motion";
3 | import { Link } from "react-router-dom";
4 |
5 | import { styles } from "../styles";
6 | import { TicofabCanvas } from "./canvas";
7 | import { Cursor, useTypewriter } from "react-simple-typewriter";
8 |
9 | import {
10 | BsTwitter,
11 | BsGithub,
12 | BsDiscord,
13 | BsInstagram,
14 | BsLinkedin,
15 | BsFacebook,
16 | } from "react-icons/bs";
17 |
18 | const Hero = () => {
19 | const [text, count] = useTypewriter({
20 | words: [
21 | " ",
22 | "TechInnovator & ProblemSolver",
23 | "FitnessEnthusiast",
24 | "GamingConnoisseur",
25 | "EternalLearner & TechExplorer",
26 | "CraftingElegantSolutions",
27 | "InCodeWeTrust",
28 | "PushingPixelsAndDeadlifts",
29 | "FromJavaScriptToJavaSips",
30 | "BuildingTheWebOneLineAtATime",
31 | "UnitingTechAndWellness",
32 | ],
33 | loop: true,
34 | delaySpeed: 1000,
35 | });
36 |
37 | return (
38 |
39 |
42 |
46 |
47 |
48 |
49 | Hi, I'm{" "}
50 |
51 | Jeff Jiang
52 |
53 |
54 |
55 |
56 | {text}
57 |
58 |
59 |
60 |
61 |
62 |
63 |
64 |
79 |
80 |
81 |
82 |
86 |
87 |
88 |
89 |
93 |
94 |
95 |
96 |
100 |
101 |
102 |
103 |
107 |
108 |
109 |
110 |
114 |
115 |
116 |
120 |
121 |
122 |
123 | );
124 | };
125 |
126 | export default Hero;
127 |
--------------------------------------------------------------------------------
/src/components/Loader.jsx:
--------------------------------------------------------------------------------
1 | import { Html, useProgress } from "@react-three/drei"
2 |
3 | const CanvasLoader = () => {
4 | const { progress } = useProgress()
5 | return (
6 |
16 |
17 |
25 | {progress.toFixed(2)}%
26 |
27 |
28 | )
29 | }
30 |
31 | export default CanvasLoader
32 |
--------------------------------------------------------------------------------
/src/components/Navbar.jsx:
--------------------------------------------------------------------------------
1 | import React, { useEffect, useState } from "react";
2 | import { Link } from "react-router-dom";
3 |
4 | import { styles } from "../styles";
5 | import { navLinks } from "../constants";
6 | import { logo, menu, close } from "../assets";
7 | import resume from "/src/jeff_jiang.pdf";
8 | import { LOGO2 } from "../assets";
9 | const Navbar = () => {
10 | const [active, setActive] = useState("");
11 | const [toggle, setToggle] = useState(false);
12 | const [scrolled, setScrolled] = useState(false);
13 |
14 | useEffect(() => {
15 | const handleScroll = () => {
16 | const scrollTop = window.scrollY;
17 | if (scrollTop > 100) {
18 | setScrolled(true);
19 | } else {
20 | setScrolled(false);
21 | }
22 | };
23 |
24 | window.addEventListener("scroll", handleScroll);
25 |
26 | return () => window.removeEventListener("scroll", handleScroll);
27 | }, []);
28 |
29 | return (
30 |
37 |
38 |
{
42 | setActive("");
43 | window.scrollTo(0, 0);
44 | }}
45 | >
46 |
47 |
48 | FullStack Developer
49 | {/* | Portfolio */}
50 |
51 |
52 |
53 |
87 |
88 |
89 |
setToggle(!toggle)}
94 | />
95 |
96 |
139 |
140 |
141 |
142 | );
143 | };
144 |
145 | export default Navbar;
146 |
--------------------------------------------------------------------------------
/src/components/Tech.jsx:
--------------------------------------------------------------------------------
1 | // import React from "react";
2 |
3 | // import { BallCanvas } from "./canvas";
4 | // import { SectionWrapper } from "../hoc";
5 | // import { technologies } from "../constants";
6 |
7 | // const Tech = () => {
8 | // return (
9 | //
10 | // {technologies.map((technology) => (
11 | //
12 | //
13 | //
14 | // ))}
15 | //
16 | // );
17 | // };
18 |
19 | // export default SectionWrapper(Tech, "");
20 |
21 |
22 |
23 | import React from "react"
24 | // import Tilt from "react-tilt"
25 | import { Tilt } from "react-tilt";
26 |
27 |
28 | // import Tilt from "react-tilt/dist/tilt"
29 |
30 | import { motion } from "framer-motion"
31 |
32 | import { fadeIn, textVariant } from "../utils/motion"
33 | import { SectionWrapper } from "../hoc"
34 | import { technologies } from "../constants"
35 | import { styles } from "../styles"
36 |
37 | const TechCard = ({ index, icon }) => {
38 | return (
39 |
40 |
43 |
46 |
47 |
48 |
49 |
50 | )
51 | }
52 |
53 | const Tech = () => {
54 | return (
55 | <>
56 |
57 |
My tools
58 |
Technologies.
59 |
60 |
61 |
62 |
63 | {technologies.map((technology) => (
64 |
65 | ))}
66 |
67 | >
68 | )
69 | }
70 |
71 | export default SectionWrapper(Tech, "tech")
72 |
--------------------------------------------------------------------------------
/src/components/Works.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import { Tilt } from "react-tilt";
3 | import { motion } from "framer-motion";
4 |
5 | import { styles } from "../styles";
6 | import { github } from "../assets";
7 | import { SectionWrapper } from "../hoc";
8 | import { projects } from "../constants";
9 | import { fadeIn, textVariant } from "../utils/motion";
10 | import livelink from "../assets/liveLink.png";
11 |
12 | const ProjectCard = ({
13 | index,
14 | name,
15 | description,
16 | tags,
17 | image,
18 | source_code_link,
19 | liveUrl,
20 | }) => {
21 | return (
22 | //
23 |
31 |
32 |
37 |
38 |
39 |
window.open(source_code_link, "_blank")}
41 | className="black-gradient w-8 h-8 rounded-full flex justify-center items-center cursor-pointer"
42 | >
43 |
48 |
49 |
{
51 | window.open(liveUrl, "_blank");
52 | }}
53 | className="black-gradient w-8 h-8 rounded-full flex justify-center items-center cursor-pointer"
54 | >
55 |
60 |
61 |
62 |
63 |
64 |
65 |
{name}
66 |
67 | {description}
68 |
69 |
70 |
71 |
72 | {tags.map((tag) => (
73 |
77 | #{tag.name}
78 |
79 | ))}
80 |
81 |
82 | //
83 | );
84 | };
85 |
86 | const Works = () => {
87 | return (
88 | <>
89 | {/* */}
90 | My work
91 |
94 | Projects.
95 |
96 | {/* */}
97 |
98 |
99 |
103 | Following projects showcases my skills and experience through
104 | real-world examples of my work. Each project is briefly described with
105 | links to code repositories and live demos in it. It reflects my
106 | ability to solve complex problems, work with different technologies,
107 | and manage projects effectively.
108 |
109 |
110 |
111 |
112 | {projects.map((project, index) => (
113 |
114 | ))}
115 |
116 | >
117 | );
118 | };
119 |
120 | export default SectionWrapper(Works, "");
121 |
--------------------------------------------------------------------------------
/src/components/canvas/Ball.jsx:
--------------------------------------------------------------------------------
1 | // import React, { Suspense } from "react";
2 | // import { Canvas } from "@react-three/fiber";
3 | // import {
4 | // Decal,
5 | // Float,
6 | // OrbitControls,
7 | // Preload,
8 | // useTexture,
9 | // } from "@react-three/drei";
10 |
11 | // import CanvasLoader from "../Loader";
12 |
13 | // const Ball = (props) => {
14 | // const [decal] = useTexture([props.imgUrl]);
15 |
16 | // return (
17 | //
18 | //
19 | //
20 | //
21 | //
22 | //
28 | //
35 | //
36 | //
37 | // );
38 | // };
39 |
40 | // const BallCanvas = ({ icon }) => {
41 | // return (
42 | //
47 | // }>
48 | //
49 | //
50 | //
51 |
52 | //
53 | //
54 | // );
55 | // };
56 |
57 | // export default BallCanvas;
58 |
59 |
60 |
61 | import React, { Suspense } from "react";
62 | import { Canvas } from "@react-three/fiber";
63 | import {
64 | Decal,
65 | Float,
66 | OrbitControls,
67 | Preload,
68 | useTexture,
69 | } from "@react-three/drei";
70 |
71 | import CanvasLoader from "../Loader";
72 |
73 | const Ball = (props) => {
74 | const [decal] = useTexture([props.imgUrl]);
75 |
76 | return (
77 |
78 | <>
79 |
80 |
81 |
82 |
83 |
89 |
96 |
97 | >
98 |
99 | );
100 | };
101 |
102 | const BallCanvas = ({ icon }) => {
103 | return (
104 |
109 | }>
110 |
111 |
112 |
113 |
114 |
115 |
116 | );
117 | };
118 |
119 | export default BallCanvas;
120 |
--------------------------------------------------------------------------------
/src/components/canvas/Computers.jsx:
--------------------------------------------------------------------------------
1 | import React, { Suspense, useEffect, useState } from "react"
2 | import { Canvas } from "@react-three/fiber"
3 | import { OrbitControls, Preload, useGLTF } from "@react-three/drei"
4 |
5 | import CanvasLoader from "../Loader"
6 |
7 | const Computers = ({ isMobile }) => {
8 | const computer = useGLTF("./desktop_pc/scene.gltf")
9 |
10 | return (
11 |
12 |
13 |
21 |
22 |
28 |
29 | )
30 | }
31 |
32 | const ComputersCanvas = () => {
33 | const [isMobile, setIsMobile] = useState(false)
34 |
35 | useEffect(() => {
36 | // Add a listener for changes to the screen size
37 | const mediaQuery = window.matchMedia("(max-width: 500px)")
38 |
39 | // Set the initial value of the `isMobile` state variable
40 | setIsMobile(mediaQuery.matches)
41 |
42 | // Define a callback function to handle changes to the media query
43 | const handleMediaQueryChange = (event) => {
44 | setIsMobile(event.matches)
45 | }
46 |
47 | // Add the callback function as a listener for changes to the media query
48 | mediaQuery.addEventListener("change", handleMediaQueryChange)
49 |
50 | // Remove the listener when the component is unmounted
51 | return () => {
52 | mediaQuery.removeEventListener("change", handleMediaQueryChange)
53 | }
54 | }, [])
55 |
56 | return (
57 |
64 | }>
65 |
72 |
73 |
74 |
75 |
76 |
77 | )
78 | }
79 |
80 | export default ComputersCanvas
81 |
--------------------------------------------------------------------------------
/src/components/canvas/Earth.jsx:
--------------------------------------------------------------------------------
1 | import React, { Suspense } from "react";
2 | import { Canvas } from "@react-three/fiber";
3 | import { OrbitControls, Preload, useGLTF } from "@react-three/drei";
4 |
5 | import CanvasLoader from "../Loader";
6 |
7 | const Earth = () => {
8 | const earth = useGLTF("./planet/scene.gltf");
9 |
10 | return (
11 |
12 | );
13 | };
14 |
15 | const EarthCanvas = () => {
16 | return (
17 |
29 | }>
30 |
36 |
37 |
38 |
39 |
40 |
41 | );
42 | };
43 |
44 | export default EarthCanvas;
45 |
--------------------------------------------------------------------------------
/src/components/canvas/Stars.jsx:
--------------------------------------------------------------------------------
1 | import { useState, useRef, Suspense } from "react";
2 | import { Canvas, useFrame } from "@react-three/fiber";
3 | import { Points, PointMaterial, Preload } from "@react-three/drei";
4 | import * as random from "maath/random/dist/maath-random.esm";
5 |
6 | const Stars = (props) => {
7 | const ref = useRef();
8 | const [sphere] = useState(() => random.inSphere(new Float32Array(5000), { radius: 1.2 }));
9 |
10 | useFrame((state, delta) => {
11 | ref.current.rotation.x -= delta / 10;
12 | ref.current.rotation.y -= delta / 15;
13 | });
14 |
15 | return (
16 |
17 |
18 |
25 |
26 |
27 | );
28 | };
29 |
30 | const StarsCanvas = () => {
31 | return (
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 | );
42 | };
43 |
44 | export default StarsCanvas;
45 |
--------------------------------------------------------------------------------
/src/components/canvas/Tico.jsx:
--------------------------------------------------------------------------------
1 | import React, { Suspense, useEffect, useState } from "react";
2 | import { Canvas } from "@react-three/fiber";
3 | import { OrbitControls, Preload, useGLTF } from "@react-three/drei";
4 |
5 | import CanvasLoader from "../Loader";
6 |
7 | const Ticofab = ({ isMobile }) => {
8 | const tico = useGLTF("./astro/scene.gltf");
9 |
10 | return (
11 |
12 |
13 |
21 |
22 |
28 |
29 | );
30 | };
31 |
32 | const TicofabCanvas = () => {
33 | const [isMobile, setIsMobile] = useState(false);
34 |
35 | useEffect(() => {
36 | // Add a listener for changes to the screen size
37 | const mediaQuery = window.matchMedia("(max-width: 500px)");
38 |
39 | // Set the initial value of the `isMobile` state variable
40 | setIsMobile(mediaQuery.matches);
41 |
42 | // Define a callback function to handle changes to the media query
43 | const handleMediaQueryChange = (event) => {
44 | setIsMobile(event.matches);
45 | };
46 |
47 | // Add the callback function as a listener for changes to the media query
48 | mediaQuery.addEventListener("change", handleMediaQueryChange);
49 |
50 | // Remove the listener when the component is unmounted
51 | return () => {
52 | mediaQuery.removeEventListener("change", handleMediaQueryChange);
53 | };
54 | }, []);
55 |
56 | return (
57 |
64 | }>
65 |
72 |
73 |
74 |
75 |
76 |
77 | );
78 | };
79 |
80 | export default TicofabCanvas;
81 |
--------------------------------------------------------------------------------
/src/components/canvas/index.js:
--------------------------------------------------------------------------------
1 | import EarthCanvas from "./Earth";
2 | import BallCanvas from "./Ball";
3 | import ComputersCanvas from "./Computers";
4 | import StarsCanvas from "./Stars";
5 | import TicofabCanvas from "./Tico";
6 | export { EarthCanvas, BallCanvas, ComputersCanvas, StarsCanvas, TicofabCanvas };
7 |
--------------------------------------------------------------------------------
/src/components/index.js:
--------------------------------------------------------------------------------
1 | import { EarthCanvas, BallCanvas, ComputersCanvas, StarsCanvas, TicofabCanvas } from './canvas';
2 | import Hero from "./Hero";
3 | import Navbar from "./Navbar";
4 | import About from "./About";
5 | import Tech from "./Tech";
6 | import Experience from "./Experience";
7 | import Works from "./Works";
8 | import Feedbacks from "./Feedbacks";
9 | import Contact from "./Contact";
10 | import CanvasLoader from "./Loader";
11 | import Footer from "./Footer";
12 |
13 | export {
14 | Hero,
15 | Navbar,
16 | About,
17 | Tech,
18 | Experience,
19 | Works,
20 | Feedbacks,
21 | Contact,
22 | CanvasLoader,
23 | EarthCanvas,
24 | BallCanvas,
25 | ComputersCanvas,
26 | StarsCanvas,
27 | Footer,
28 | TicofabCanvas,
29 | };
30 |
--------------------------------------------------------------------------------
/src/constants/index.js:
--------------------------------------------------------------------------------
1 | import {
2 | mobile,
3 | backend,
4 | creator,
5 | web,
6 | javascript,
7 | typescript,
8 | html,
9 | css,
10 | reactjs,
11 | redux,
12 | tailwind,
13 | nodejs,
14 | mongodb,
15 | git,
16 | figma,
17 | docker,
18 | meta,
19 | starbucks,
20 | tesla,
21 | shopify,
22 | carrent,
23 | jobit,
24 | tripguide,
25 | threejs,
26 | code1,
27 | movie,
28 | shop,
29 | youtube,
30 | python,
31 | django,
32 | postgres,
33 | sql,
34 | next,
35 | vue,
36 | liveLink,
37 | portfolio15,
38 | portfolio16,
39 | portfolio17,
40 | linktree,
41 | tiktok,
42 | ig,
43 | beeclone,
44 | smartrep,
45 | matrixai,
46 | zapflow,
47 | notable,
48 |
49 |
50 | } from "../assets";
51 | export const navLinks = [
52 | {
53 | id: "about",
54 | title: "About",
55 | },
56 | {
57 | id: "work",
58 | title: "Work",
59 | },
60 | {
61 | id: "contact",
62 | title: "Contact",
63 | },
64 | ];
65 |
66 | const services = [
67 | {
68 | title: "Web Developer",
69 | icon: web,
70 | },
71 | {
72 | title: "Frontend Developer",
73 | icon: mobile,
74 | },
75 | {
76 | title: "Backend Developer",
77 | icon: backend,
78 | },
79 | {
80 | title: "Fullstack Developer",
81 | icon: creator,
82 | },
83 | ];
84 |
85 | const technologies = [
86 | {
87 | name: "HTML 5",
88 | icon: html,
89 | },
90 | {
91 | name: "CSS 3",
92 | icon: css,
93 | },
94 | {
95 | name: "JavaScript",
96 | icon: javascript,
97 | },
98 | {
99 | name: "TypeScript",
100 | icon: typescript,
101 | },
102 | {
103 | name: "React JS",
104 | icon: reactjs,
105 | },
106 | {
107 | name: "Redux Toolkit",
108 | icon: redux,
109 | },
110 | {
111 | name: "Tailwind CSS",
112 | icon: tailwind,
113 | },
114 | {
115 | name: "Node JS",
116 | icon: nodejs,
117 | },
118 | {
119 | name: "MongoDB",
120 | icon: mongodb,
121 | },
122 | {
123 | name: "python",
124 | icon: python,
125 | },
126 | {
127 | name: "git",
128 | icon: git,
129 | },
130 | {
131 | name: "figma",
132 | icon: figma,
133 | },
134 | {
135 | name: "docker",
136 | icon: docker,
137 | },
138 | {
139 | name: "django",
140 | icon: django,
141 | },
142 | {
143 | name: "postgres",
144 | icon: postgres,
145 | },
146 | {
147 | name: "sql",
148 | icon: sql,
149 | },
150 | {
151 | name: "threejs",
152 | icon: threejs,
153 | },
154 | {
155 | name: "next",
156 | icon: next,
157 | },
158 | {
159 | name: "vue",
160 | icon: vue,
161 | },
162 | ];
163 |
164 | const experiences = [
165 | {
166 | title: "Full-Stack Developer",
167 | company_name: "Hack Reactor",
168 | icon: code1,
169 | iconBg: "#E6DEDD",
170 | date: "2021",
171 | points: [
172 | "Successfully led a team of engineers in the development and deployment of a high-performance API web application within a tight six-week timeframe.",
173 | "Designed and implemented a scalable backend service utilizing MongoDB and FastAPI, following a test-driven development approach, ensuring a stable and well-tested codebase.",
174 | "Implemented secure user authentication by integrating Simple JWT, ensuring secure access to sensitive user information and a seamless user experience.",
175 | ],
176 | },
177 | {
178 | title: "Full-Stack Developer",
179 | company_name: "ChiqueChickShop",
180 | icon: code1,
181 | iconBg: "#383E56",
182 | date: "2022",
183 | points: [
184 | "Developed ChiqueChickShop, a responsive e-commerce platform.",
185 | "Enhanced user experience with intuitive navigation features.",
186 | "Implemented secure payment processing for online transactions.",
187 | ],
188 | },
189 | {
190 | title: "Full-Stack Developer",
191 | company_name: "Madamcoon",
192 | icon: code1,
193 | iconBg: "#E6DEDD",
194 | date: "2023",
195 | points: [
196 | "Spearheaded the revamp of Madamcoon, focusing on responsive design and user experience improvements.",
197 | "Integrated CMS and implemented SEO strategies for enhanced online visibility.",
198 | "Optimized the website for increased engagement and performance metrics.",
199 | ],
200 | },
201 | // {
202 | // title: "Fulstack Developer",
203 | // company_name: "YOUTUBE CLONE",
204 | // icon: code1,
205 | // iconBg: "#383E56",
206 | // date: "2023",
207 | // points: [
208 | // "Developed a responsive React JS application consisting of stunning video sections, custom categories, channel pages, and, most importantly, you can play videos straight from this app.",
209 | // "Used RAPID API to access various endpoints to retrieve data such as suggested videos, search video details, channel details, and channel videos.",
210 | // "Ensured cross-browser and cross-platform compatibility.",
211 | // ],
212 | // },
213 | // {
214 | // title: "Fullstack Developer",
215 | // company_name: "MOVIE APP",
216 | // icon: code1,
217 | // iconBg: "#E6DEDD",
218 | // date: "2023",
219 | // points: [
220 | // "Developed and maintained an application using React.js, Material UI, Alan AI and other related technologies.",
221 | // "Enhanced user experience by implementing secure user authentication, providing a sleek dark mode option, and allowing users to sort movies by categories or genres. Users can now access movie and actor details and easily add movies to their favorites or watchlist, in addition to other convenient functionalities.",
222 | // "Integrated voice assistant to application.",
223 | // ],
224 | // },
225 | ];
226 |
227 | const testimonials = [
228 | {
229 | testimonial:
230 | "I can't say enough good things about Jeff. He's a true team player who always puts the needs of the project first. If you're looking for a software engineer who can deliver results, Jeff is your guy.",
231 | name: "Halley Bennett",
232 | designation: "",
233 | company: "Hack Reactor",
234 | image: "https://randomuser.me/api/portraits/women/4.jpg",
235 | },
236 | {
237 | testimonial:
238 | "Jeff is an incredible problem solver. Whenever we ran into a roadblock on our project, he was always able to come up with creative solutions that kept us moving forward.",
239 | name: "Yishak Wesego",
240 | designation: "",
241 | company: "Hack Reactor",
242 | image: "https://randomuser.me/api/portraits/men/5.jpg",
243 | },
244 | {
245 | testimonial:
246 | "I've worked with a lot of engineers over the years, and Jeff is one of the best. His technical skills are top-notch, but what really sets him apart is his ability to communicate complex ideas in a way that everyone on the team can understand.",
247 | name: "Megan Stewart",
248 | designation: "",
249 | company: "Hack Reactor",
250 | image: "https://randomuser.me/api/portraits/women/6.jpg",
251 | },
252 | ];
253 | const imageProjects = [
254 | {
255 | id: 1,
256 | image: portfolio15,
257 | url: "https://madamcoon.com/",
258 | title: "Madamcoon Maine Coon Cattery NYC",
259 | description: "",
260 | },
261 | {
262 | id: 2,
263 | image: portfolio16,
264 | url: "https://chiquechickshop.com/",
265 | title: "ChiqueChickShop",
266 | description: "",
267 | },
268 | {
269 | id: 3,
270 | image: portfolio17,
271 | url: "https://jj-tailortech.vercel.app/",
272 | title: "TailorTech",
273 | description: "",
274 | },
275 | {
276 | id: 4,
277 | image: shop,
278 | url: "https://jj-ecomstore.vercel.app/",
279 | title: "E-commerce platform",
280 | description: "",
281 | },
282 | {
283 | id: 5,
284 | image: movie,
285 | url: "https://jj-movie-app.netlify.app/",
286 | title: "Movie app",
287 | description: "",
288 | },
289 | {
290 | id: 6,
291 | image: youtube,
292 | url: "https://jj-youtube-clone.netlify.app/",
293 | title: "Youtube clone",
294 | description: "",
295 | },
296 | {
297 | id: 7,
298 | image: ig,
299 | url: "https://quicktele.netlify.app/",
300 | title: "Instagram clone",
301 | description: "",
302 | },
303 | {
304 | id: 8,
305 | image: tiktok,
306 | url: "https://jj-tiktok.vercel.app/",
307 | title: "TikTok clone",
308 | description: "",
309 | },
310 | {
311 | id: 9,
312 | image: linktree,
313 | url: "https://jj-linktri.vercel.app/",
314 | title: "LinkTree clone",
315 | description: "",
316 | },
317 | {
318 | id: 10,
319 | image: smartrep,
320 | url: "https://jj-smartrep.vercel.app/",
321 | title: "SmartRep AI",
322 | description: "",
323 | },
324 | {
325 | id: 11,
326 | image: zapflow,
327 | url: "https://jj-zapflow.vercel.app/",
328 | title: "ZapFlow",
329 | description: "",
330 | },
331 | {
332 | id: 12,
333 | image: matrixai,
334 | url: "https://jj-nextgen-ai.vercel.app/",
335 | title: "Matrix AI",
336 | description: "",
337 | },
338 | {
339 | id: 13,
340 | image: notable,
341 | url: "https://jj-notable.up.railway.app/",
342 | title: "Notable",
343 | description: "",
344 | },
345 | {
346 | id: 14,
347 | image: beeclone,
348 | url: "https://jj-newsletter.vercel.app/",
349 | title: "Beeclone",
350 | description: "",
351 | },
352 | ];
353 |
354 | const projects = [
355 | {
356 | name: "SmartRep AI",
357 | description:
358 | "SmartRep AI is an advanced AI chatbot designed to streamline customer interactions, book appointments, process payments, and manage leads. It seamlessly integrates with any website, offering a customizable interface and a suite of powerful features to enhance user experience and business operations.",
359 | tags: [
360 | {
361 | name: "Next.js",
362 | color: "blue-text-gradient",
363 | },
364 | {
365 | name: "Neon",
366 | color: "green-text-gradient",
367 | },
368 | {
369 | name: "Typescript",
370 | color: "pink-text-gradient",
371 | },
372 | ],
373 | image: smartrep,
374 | source_code_link: "https://github.com/jeffjiang13/smartrep-ai",
375 | liveUrl: "https://jj-smartrep.vercel.app/",
376 | },
377 | {
378 | name: "Notable",
379 | description:
380 | "Experience unparalleled team collaboration with Notable, a cutting-edge SaaS platform designed to enhance productivity dynamically. Built with Next.js 13 and adorned with the latest technologies like Stripe for secure payments, Drizzle ORM for efficient data management, Tailwind CSS for intuitive styling, Supabase for a scalable backend, and WebSockets for real-time interactions, Notable offers a modern workspace for teams and individuals to thrive in real time. Perfect for startups and large enterprises alike, Notable seamlessly integrates advanced collaboration tools into your daily operations, setting a new standard for what a collaborative platform can achieve.",
381 | tags: [
382 | {
383 | name: "Next.js",
384 | color: "blue-text-gradient",
385 | },
386 | {
387 | name: "Supabase",
388 | color: "green-text-gradient",
389 | },
390 | {
391 | name: "Typescript",
392 | color: "pink-text-gradient",
393 | },
394 | ],
395 | image: notable,
396 | source_code_link: "https://github.com/jeffjiang13/notable",
397 | liveUrl: "https://jj-notable.up.railway.app/",
398 | },
399 | {
400 | name: "ZapFlow",
401 | description:
402 | "ZapFlow is a SaaS Automation Builder, a powerful and versatile platform designed to automate and streamline your business processes. Built from the ground up without relying on integration libraries, this builder offers a seamless and customizable experience for creating automation flows. Whether you are a small business or a large enterprise, our builder has the features you need to connect various services and automate your workflows efficiently.",
403 | tags: [
404 | {
405 | name: "Next.js",
406 | color: "blue-text-gradient",
407 | },
408 | {
409 | name: "Neon",
410 | color: "green-text-gradient",
411 | },
412 | {
413 | name: "Tailwind",
414 | color: "pink-text-gradient",
415 | },
416 | ],
417 | image: zapflow,
418 | source_code_link: "https://github.com/jeffjiang13/saas-automation",
419 | liveUrl: "https://jj-zapflow.vercel.app/",
420 | },
421 | {
422 | name: "Beeclone",
423 | description:
424 | "This project is a fullstack clone of Linktree built with Next.js, Tailwind CSS, and MongoDB. It allows users to create a personalized page with links to their content across the internet, customize their profile, and view analytics on their links.",
425 | tags: [
426 | {
427 | name: "Next.js",
428 | color: "blue-text-gradient",
429 | },
430 | {
431 | name: "MongoDB",
432 | color: "green-text-gradient",
433 | },
434 | {
435 | name: "Tailwind",
436 | color: "pink-text-gradient",
437 | },
438 | ],
439 | image: beeclone,
440 | source_code_link: "https://github.com/jeffjiang13/saas-newsletter",
441 | liveUrl: "https://jj-newsletter.vercel.app/",
442 | },
443 | {
444 | name: "Matrix AI",
445 | description:
446 | "MatrixAI is a comprehensive SaaS AI Platform with a modern tech stack including Next.js 13, React, Tailwind CSS, Prisma, and Stripe. This platform is designed to offer a wide range of AI-powered tools, from image and video generation to music creation and conversational AI. Featuring a sleek Tailwind design, full responsiveness, and a variety of authentication methods, this platform is equipped to handle the needs of diverse users.",
447 | tags: [
448 | {
449 | name: "Next.js",
450 | color: "blue-text-gradient",
451 | },
452 | {
453 | name: "Prisma",
454 | color: "green-text-gradient",
455 | },
456 | {
457 | name: "Tailwind",
458 | color: "pink-text-gradient",
459 | },
460 | ],
461 | image: matrixai,
462 | source_code_link: "https://github.com/jeffjiang13/MatrixAI",
463 | liveUrl: "https://jj-nextgen-ai.vercel.app/",
464 | },
465 | {
466 | name: "LinkTri",
467 | description:
468 | "This project is a fullstack clone of Linktree built with Next.js, Tailwind CSS, and MongoDB. It allows users to create a personalized page with links to their content across the internet, customize their profile, and view analytics on their links.",
469 | tags: [
470 | {
471 | name: "Next.js",
472 | color: "blue-text-gradient",
473 | },
474 | {
475 | name: "MongoDB",
476 | color: "green-text-gradient",
477 | },
478 | {
479 | name: "Tailwind",
480 | color: "pink-text-gradient",
481 | },
482 | ],
483 | image: linktree,
484 | source_code_link: "https://github.com/jeffjiang13/LinkTree",
485 | liveUrl: "https://jj-linktri.vercel.app/",
486 | },
487 | {
488 | name: "Instagram Clone,",
489 | description:
490 | "The IG App 2024 is a comprehensive clone of the Instagram platform, designed to replicate the core functionalities and visual appeal of the original app with added enhancements. Developed using modern web technologies such as Vite, React.js, and Tailwind CSS, this project emphasizes a responsive and eye-catching user interface, ensuring optimal performance and user experience across various devices, specifically optimized for screens with a minimum width of 375px.",
491 | tags: [
492 | {
493 | name: "Vite.js",
494 | color: "blue-text-gradient",
495 | },
496 | {
497 | name: "React.js",
498 | color: "green-text-gradient",
499 | },
500 | {
501 | name: "Tailwind",
502 | color: "pink-text-gradient",
503 | },
504 | ],
505 | image: ig,
506 | source_code_link: "https://github.com/jeffjiang13/IG-2.0",
507 | liveUrl: "https://quicktele.netlify.app/",
508 | },
509 | {
510 | name: "TikTok Clone",
511 | description:
512 | "Explore the modern web with our TikTok Clone Application! This project encompasses a full suite of features including Google Authentication, video uploads, publishing, sharing, commenting, liking, category filtering, advanced search functionalities, profile pages, suggested accounts, and a custom responsive design.",
513 | tags: [
514 | {
515 | name: "TypeScript",
516 | color: "blue-text-gradient",
517 | },
518 | {
519 | name: "React.js",
520 | color: "green-text-gradient",
521 | },
522 | {
523 | name: "Sanity",
524 | color: "pink-text-gradient",
525 | },
526 | ],
527 | image: tiktok,
528 | source_code_link: "https://github.com/jeffjiang13/tiktok",
529 | liveUrl: "https://jj-tiktok.vercel.app/",
530 | },
531 | {
532 | name: "TailorTech",
533 | description:
534 | "This comprehensive SaaS platform leverages the latest technologies including Next.js 14, Bun, Stripe Connect, Prisma, MySQL, and Tailwind to offer a robust solution for building websites, managing projects, and handling financial transactions seamlessly. Designed for agencies, freelancers, and businesses, our platform simplifies the digital landscape through an intuitive interface and powerful features.",
535 | tags: [
536 | {
537 | name: "Next.js",
538 | color: "blue-text-gradient",
539 | },
540 | {
541 | name: "Bun",
542 | color: "green-text-gradient",
543 | },
544 | {
545 | name: "Prisma",
546 | color: "pink-text-gradient",
547 | },
548 | ],
549 | image: portfolio17,
550 | source_code_link: "https://github.com/jeffjiang13/tailortech",
551 | liveUrl: "https://jj-tailortech.vercel.app/",
552 | },
553 | {
554 | name: "ChiqueChickShop",
555 | description:
556 | "Engineered the ChiqueChickShop, a fully responsive e-commerce platform, from the ground up. This project entailed designing an inviting online shopping experience complete with intuitive navigation and streamlined user flows. Focused on integrating secure payment processing systems to ensure transactional safety. Implemented best practices in web development to enhance site responsiveness across all devices. Due to client confidentiality, project specifics and GitHub source are kept private.",
557 | tags: [
558 | {
559 | name: "React.js",
560 | color: "blue-text-gradient",
561 | },
562 | {
563 | name: "JavaScript",
564 | color: "green-text-gradient",
565 | },
566 | {
567 | name: "CSS",
568 | color: "pink-text-gradient",
569 | },
570 | ],
571 | image: portfolio16,
572 | source_code_link: "https://github.com/jeffjiang13",
573 | liveUrl: "https://chiquechickshop.com/",
574 | },
575 | {
576 | name: "Madamcoon Maine Coon Cattery NYC",
577 | description:
578 | "Led the comprehensive development of the Madamcoon website, from concept to launch, focusing on crafting a responsive design that adapts seamlessly across devices. Enhanced user interaction and experience by implementing a user-friendly interface and streamlined navigation. Integrated robust content management systems for easy content updates and management. Employed advanced SEO strategies to maximize online visibility and search rankings. Project details are confidential with GitHub source kept private for client security.",
579 | tags: [
580 | {
581 | name: "React.js",
582 | color: "blue-text-gradient",
583 | },
584 | {
585 | name: "JavaScript",
586 | color: "green-text-gradient",
587 | },
588 | {
589 | name: "CSS",
590 | color: "pink-text-gradient",
591 | },
592 | ],
593 | image: portfolio15,
594 | source_code_link: "https://github.com/jeffjiang13",
595 | liveUrl: "https://madamcoon.com/",
596 | },
597 | {
598 | name: "Movie App",
599 | description:
600 | "This app is an online database of information related to movies. Users can search for movies and learn about movies, as well as the cast of the movie. Navigating through the application is made simple with help of a AI voice chatbot. Also provides ratings of movies. Tech stack: JavaScript tools including React.js, Redux, Material UI, Alan AI, and more.",
601 | tags: [
602 | {
603 | name: "React.js",
604 | color: "blue-text-gradient",
605 | },
606 | {
607 | name: "JavaScript",
608 | color: "green-text-gradient",
609 | },
610 | {
611 | name: "Material UI",
612 | color: "pink-text-gradient",
613 | },
614 | ],
615 | image: movie,
616 | source_code_link: "https://github.com/jeffjiang13/movie-app",
617 | liveUrl: "https://jj-movie-app.netlify.app/",
618 | },
619 | {
620 | name: "Ecommerce App",
621 | description:
622 | "Fully responsive, full-stack e-commerce application with payments. It includes advanced React and Next.js best practices, and integrates Stripe for payment processing. The content of the app can be managed using Sanity, which allows for dynamic modifications of the store's home page and product details. The app is mobile-responsive and includes features such as adding and editing products, advanced card functionalities, and a complete checkout process.",
623 | tags: [
624 | {
625 | name: "Next.js",
626 | color: "blue-text-gradient",
627 | },
628 | {
629 | name: "Stripe",
630 | color: "green-text-gradient",
631 | },
632 | {
633 | name: "Sanity",
634 | color: "pink-text-gradient",
635 | },
636 | ],
637 | image: shop,
638 | source_code_link: "https://github.com/jeffjiang13/ecommerce_sanity",
639 | liveUrl: "https://jj-ecomstore.vercel.app/",
640 | },
641 | {
642 | name: "YouTube Clone",
643 | description:
644 | "A responsive React JS application consisting of stunning video sections, custom categories, channel pages, and, most importantly, you can play videos straight from this app!",
645 | tags: [
646 | {
647 | name: "React.js",
648 | color: "blue-text-gradient",
649 | },
650 | {
651 | name: "JavaScript",
652 | color: "green-text-gradient",
653 | },
654 | {
655 | name: "RAPIDAPI",
656 | color: "pink-text-gradient",
657 | },
658 | ],
659 | image: youtube,
660 | source_code_link: "https://github.com/jeffjiang13/youtube-clone",
661 | liveUrl: "https://jj-youtube-clone.netlify.app/",
662 | },
663 | ];
664 |
665 | export {
666 | services,
667 | technologies,
668 | experiences,
669 | testimonials,
670 | projects,
671 | imageProjects,
672 | };
673 |
--------------------------------------------------------------------------------
/src/hoc/SectionWrapper.jsx:
--------------------------------------------------------------------------------
1 | import React from "react"
2 | import { motion } from "framer-motion";
3 |
4 | import { styles } from "../styles";
5 | import { staggerContainer } from "../utils/motion";
6 |
7 | const StarWrapper = (Component, idName) =>
8 | function HOC() {
9 | return (
10 |
17 |
18 |
19 |
20 |
21 |
22 |
23 | );
24 | };
25 |
26 | export default StarWrapper;
27 |
--------------------------------------------------------------------------------
/src/hoc/index.js:
--------------------------------------------------------------------------------
1 | import SectionWrapper from "./SectionWrapper";
2 |
3 | export { SectionWrapper };
4 |
--------------------------------------------------------------------------------
/src/index.css:
--------------------------------------------------------------------------------
1 | @import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap");
2 |
3 | @tailwind base;
4 | @tailwind components;
5 | @tailwind utilities;
6 |
7 | * {
8 | margin: 0;
9 | padding: 0;
10 | box-sizing: border-box;
11 | font-family: "Poppins", sans-serif;
12 | scroll-behavior: smooth;
13 | color-scheme: dark;
14 | }
15 |
16 | ::-webkit-scrollbar {
17 | width: 2px;
18 | }
19 |
20 | /* Track */
21 | ::-webkit-scrollbar-track {
22 | background: #2a2e2f;
23 | background: transparent;
24 | border-radius: 10px;
25 | }
26 |
27 | /* Handle */
28 | ::-webkit-scrollbar-thumb {
29 | background: lightblue;
30 | border-radius: 5px;
31 | }
32 |
33 | ::selection {
34 | background-color: #915dfc;
35 | color: #fff;
36 | }
37 |
38 | .hash-span {
39 | margin-top: -100px;
40 | padding-bottom: 100px;
41 | display: block;
42 | }
43 |
44 | .black-gradient {
45 | background: #000000; /* fallback for old browsers */
46 | background: -webkit-linear-gradient(
47 | to right,
48 | #434343,
49 | #000000
50 | ); /* Chrome 10-25, Safari 5.1-6 */
51 | background: linear-gradient(
52 | to right,
53 | #434343,
54 | #000000
55 | ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
56 | }
57 |
58 | .violet-gradient {
59 | background: #804dee;
60 | background: linear-gradient(-90deg, #804dee 0%, rgba(60, 51, 80, 0) 100%);
61 | background: -webkit-linear-gradient(
62 | -90deg,
63 | #804dee 0%,
64 | rgba(60, 51, 80, 0) 100%
65 | );
66 | }
67 |
68 | .green-pink-gradient {
69 | background: "#00cea8";
70 | background: linear-gradient(90.13deg, #00cea8 1.9%, #bf61ff 97.5%);
71 | background: -webkit-linear-gradient(-90.13deg, #00cea8 1.9%, #bf61ff 97.5%);
72 | }
73 |
74 | .orange-text-gradient {
75 | background: #f12711; /* fallback for old browsers */
76 | background: -webkit-linear-gradient(
77 | to top,
78 | #f12711,
79 | #f5af19
80 | ); /* Chrome 10-25, Safari 5.1-6 */
81 | background: linear-gradient(
82 | to top,
83 | #f12711,
84 | #f5af19
85 | ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
86 | -webkit-background-clip: text;
87 | -webkit-text-fill-color: transparent;
88 | }
89 |
90 | .green-text-gradient {
91 | background: #11998e; /* fallback for old browsers */
92 | background: -webkit-linear-gradient(
93 | to top,
94 | #11998e,
95 | #38ef7d
96 | ); /* Chrome 10-25, Safari 5.1-6 */
97 | background: linear-gradient(
98 | to top,
99 | #11998e,
100 | #38ef7d
101 | ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
102 | -webkit-background-clip: text;
103 | -webkit-text-fill-color: transparent;
104 | }
105 |
106 | .blue-text-gradient {
107 | /* background: -webkit-linear-gradient(#eee, #333); */
108 | background: #56ccf2; /* fallback for old browsers */
109 | background: -webkit-linear-gradient(
110 | to top,
111 | #2f80ed,
112 | #56ccf2
113 | ); /* Chrome 10-25, Safari 5.1-6 */
114 | background: linear-gradient(
115 | to top,
116 | #2f80ed,
117 | #56ccf2
118 | ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
119 | -webkit-background-clip: text;
120 | -webkit-text-fill-color: transparent;
121 | }
122 |
123 | .pink-text-gradient {
124 | background: #ec008c; /* fallback for old browsers */
125 | background: -webkit-linear-gradient(
126 | to top,
127 | #ec008c,
128 | #fc6767
129 | ); /* Chrome 10-25, Safari 5.1-6 */
130 | background: linear-gradient(
131 | to top,
132 | #ec008c,
133 | #fc6767
134 | ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
135 | -webkit-background-clip: text;
136 | -webkit-text-fill-color: transparent;
137 | }
138 |
139 | /* canvas- styles */
140 | .canvas-loader {
141 | font-size: 10px;
142 | width: 1em;
143 | height: 1em;
144 | border-radius: 50%;
145 | position: relative;
146 | text-indent: -9999em;
147 | animation: mulShdSpin 1.1s infinite ease;
148 | transform: translateZ(0);
149 | }
150 |
151 | @keyframes mulShdSpin {
152 | 0%,
153 | 100% {
154 | box-shadow: 0em -2.6em 0em 0em #ffffff,
155 | 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2),
156 | 2.5em 0em 0 0em rgba(255, 255, 255, 0.2),
157 | 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2),
158 | 0em 2.5em 0 0em rgba(255, 255, 255, 0.2),
159 | -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2),
160 | -2.6em 0em 0 0em rgba(255, 255, 255, 0.5),
161 | -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7);
162 | }
163 | 12.5% {
164 | box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.7),
165 | 1.8em -1.8em 0 0em #ffffff, 2.5em 0em 0 0em rgba(255, 255, 255, 0.2),
166 | 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2),
167 | 0em 2.5em 0 0em rgba(255, 255, 255, 0.2),
168 | -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2),
169 | -2.6em 0em 0 0em rgba(255, 255, 255, 0.2),
170 | -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5);
171 | }
172 | 25% {
173 | box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.5),
174 | 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.7), 2.5em 0em 0 0em #ffffff,
175 | 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2),
176 | 0em 2.5em 0 0em rgba(255, 255, 255, 0.2),
177 | -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2),
178 | -2.6em 0em 0 0em rgba(255, 255, 255, 0.2),
179 | -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
180 | }
181 | 37.5% {
182 | box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2),
183 | 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.5),
184 | 2.5em 0em 0 0em rgba(255, 255, 255, 0.7), 1.75em 1.75em 0 0em #ffffff,
185 | 0em 2.5em 0 0em rgba(255, 255, 255, 0.2),
186 | -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2),
187 | -2.6em 0em 0 0em rgba(255, 255, 255, 0.2),
188 | -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
189 | }
190 | 50% {
191 | box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2),
192 | 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2),
193 | 2.5em 0em 0 0em rgba(255, 255, 255, 0.5),
194 | 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.7), 0em 2.5em 0 0em #ffffff,
195 | -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.2),
196 | -2.6em 0em 0 0em rgba(255, 255, 255, 0.2),
197 | -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
198 | }
199 | 62.5% {
200 | box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2),
201 | 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2),
202 | 2.5em 0em 0 0em rgba(255, 255, 255, 0.2),
203 | 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.5),
204 | 0em 2.5em 0 0em rgba(255, 255, 255, 0.7), -1.8em 1.8em 0 0em #ffffff,
205 | -2.6em 0em 0 0em rgba(255, 255, 255, 0.2),
206 | -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
207 | }
208 | 75% {
209 | box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2),
210 | 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2),
211 | 2.5em 0em 0 0em rgba(255, 255, 255, 0.2),
212 | 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2),
213 | 0em 2.5em 0 0em rgba(255, 255, 255, 0.5),
214 | -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.7), -2.6em 0em 0 0em #ffffff,
215 | -1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2);
216 | }
217 | 87.5% {
218 | box-shadow: 0em -2.6em 0em 0em rgba(255, 255, 255, 0.2),
219 | 1.8em -1.8em 0 0em rgba(255, 255, 255, 0.2),
220 | 2.5em 0em 0 0em rgba(255, 255, 255, 0.2),
221 | 1.75em 1.75em 0 0em rgba(255, 255, 255, 0.2),
222 | 0em 2.5em 0 0em rgba(255, 255, 255, 0.2),
223 | -1.8em 1.8em 0 0em rgba(255, 255, 255, 0.5),
224 | -2.6em 0em 0 0em rgba(255, 255, 255, 0.7), -1.8em -1.8em 0 0em #ffffff;
225 | }
226 | }
227 | .abhishek {
228 | color: rgba(255, 255, 255, 0.8);
229 | /* background: #3085d6; */
230 | padding: 10px;
231 | margin: auto;
232 | border-radius: 5px;
233 | transition: 0.5s;
234 | }
235 |
236 | .abhishek:hover {
237 | color: white;
238 | box-shadow: 0 5px 15px #afe0f5;
239 | }
240 |
241 | .abhishek-btn {
242 | position: relative;
243 | color: var(--glow-color);
244 | cursor: pointer;
245 | padding: 0.35em 1em;
246 | border: 0.15em solid var(--glow-color);
247 | border-radius: 0.45em;
248 | background: none;
249 | /* perspective: 2em; */
250 | font-family: "Raleway", sans-serif;
251 | font-size: 1em;
252 | font-weight: 900;
253 | letter-spacing: 0.1em;
254 |
255 | -webkit-box-shadow: inset 0px 0px 0.5em 0px var(--glow-color),
256 | 0px 0px 0.5em 0px var(--glow-color);
257 | -moz-box-shadow: inset 0px 0px 0.5em 0px var(--glow-color),
258 | 0px 0px 0.5em 0px var(--glow-color);
259 | box-shadow: inset 0px 0px 0.5em 0px var(--glow-color),
260 | 0px 0px 0.5em 0px var(--glow-color);
261 | animation: border-flicker 2s linear infinite;
262 | }
263 |
264 | .glowing-txt {
265 | float: left;
266 | margin-right: 0.5em;
267 | -webkit-text-shadow: 0 0 0.125em hsl(0 0% 100% / 0.3),
268 | 0 0 0.45em var(--glow-color);
269 | -moz-text-shadow: 0 0 0.125em hsl(0 0% 100% / 0.3),
270 | 0 0 0.45em var(--glow-color);
271 | text-shadow: 0 0 0.125em hsl(0 0% 100% / 0.3), 0 0 0.45em var(--glow-color);
272 | animation: text-flicker 3s linear infinite;
273 | }
274 |
275 | .faulty-letter {
276 | opacity: 0.5;
277 | animation: faulty-flicker 2s linear infinite;
278 | }
279 |
280 | .abhishek-btn::before {
281 | content: "";
282 | position: absolute;
283 | top: 0;
284 | bottom: 0;
285 | left: 0;
286 | right: 0;
287 | opacity: 0.7;
288 | filter: blur(1em);
289 | transform: translateY(120%) rotateX(95deg) scale(1, 0.35);
290 | background: var(--glow-color);
291 | pointer-events: none;
292 | }
293 |
294 | .abhishek-btn::after {
295 | content: "";
296 | /* position: absolute; */
297 | top: 0;
298 | left: 0;
299 | right: 0;
300 | bottom: 0;
301 | opacity: 0;
302 | z-index: -1;
303 | background-color: var(--glow-color);
304 | box-shadow: 0 0 2em 0.2em var(--glow-color);
305 | transition: opacity 100ms linear;
306 | }
307 |
308 | .abhishek-btn:hover {
309 | color: rgba(255, 255, 255, 0.8);
310 | text-shadow: none;
311 | animation: none;
312 | }
313 |
314 | .abhishek-btn:hover .glowing-txt {
315 | animation: none;
316 | }
317 |
318 | .abhishek-btn:hover .faulty-letter {
319 | animation: none;
320 | text-shadow: none;
321 | opacity: 1;
322 | }
323 |
324 | .abhishek-btn:hover:before {
325 | filter: blur(1.5em);
326 | opacity: 1;
327 | }
328 |
329 | .abhishek-btn:hover:after {
330 | opacity: 1;
331 | }
332 |
333 | @keyframes faulty-flicker {
334 | 0% {
335 | opacity: 0.1;
336 | }
337 | 2% {
338 | opacity: 0.1;
339 | }
340 | 4% {
341 | opacity: 0.5;
342 | }
343 | 19% {
344 | opacity: 0.5;
345 | }
346 | 21% {
347 | opacity: 0.1;
348 | }
349 | 23% {
350 | opacity: 1;
351 | }
352 | 80% {
353 | opacity: 0.5;
354 | }
355 | 83% {
356 | opacity: 0.4;
357 | }
358 |
359 | 87% {
360 | opacity: 1;
361 | }
362 | }
363 |
364 | @keyframes text-flicker {
365 | 0% {
366 | opacity: 0.1;
367 | }
368 |
369 | 2% {
370 | opacity: 1;
371 | }
372 |
373 | 8% {
374 | opacity: 0.1;
375 | }
376 |
377 | 9% {
378 | opacity: 1;
379 | }
380 |
381 | 12% {
382 | opacity: 0.1;
383 | }
384 | 20% {
385 | opacity: 1;
386 | }
387 | 25% {
388 | opacity: 0.3;
389 | }
390 | 30% {
391 | opacity: 1;
392 | }
393 |
394 | 70% {
395 | opacity: 0.7;
396 | }
397 | 72% {
398 | opacity: 0.2;
399 | }
400 |
401 | 77% {
402 | opacity: 0.9;
403 | }
404 | 100% {
405 | opacity: 0.9;
406 | }
407 | }
408 |
409 | @keyframes border-flicker {
410 | 0% {
411 | opacity: 0.1;
412 | }
413 | 2% {
414 | opacity: 1;
415 | }
416 | 4% {
417 | opacity: 0.1;
418 | }
419 |
420 | 8% {
421 | opacity: 1;
422 | }
423 | 70% {
424 | opacity: 0.7;
425 | }
426 | 100% {
427 | opacity: 1;
428 | }
429 | }
430 |
431 | @media only screen and (max-width: 600px) {
432 | .abhishek-btn {
433 | font-size: 1rem;
434 | }
435 | }
436 |
437 | /* @font-face {
438 | font-family: neon;
439 | src: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/707108/neon.ttf);
440 | } */
441 |
442 | .neon {
443 | /* font-family: neon; */
444 | color: #fb4264;
445 | font-size: 9vw;
446 | line-height: 9vw;
447 | text-shadow: 0 0 3vw #f40a35;
448 | }
449 |
450 | .flux {
451 | /* font-family: neon; */
452 | color: #426dfb;
453 | font-size: 9vw;
454 | line-height: 9vw;
455 | text-shadow: 0 0 3vw #2356ff;
456 | }
457 |
458 | .neon {
459 | animation: neon 1s ease infinite;
460 | -moz-animation: neon 1s ease infinite;
461 | -webkit-animation: neon 1s ease infinite;
462 | }
463 |
464 | @keyframes neon {
465 | 0%,
466 | 100% {
467 | text-shadow: 0 0 1vw #fa1c16, 0 0 3vw #fa1c16, 0 0 10vw #fa1c16,
468 | 0 0 10vw #fa1c16, 0 0 0.4vw #fed128, 0.5vw 0.5vw 0.1vw #806914;
469 | color: #fed128;
470 | }
471 | 50% {
472 | text-shadow: 0 0 0.5vw #800e0b, 0 0 1.5vw #800e0b, 0 0 5vw #800e0b,
473 | 0 0 5vw #800e0b, 0 0 0.2vw #800e0b, 0.5vw 0.5vw 0.1vw #40340a;
474 | color: #806914;
475 | }
476 | }
477 |
478 | .flux {
479 | animation: flux 2s linear infinite;
480 | -moz-animation: flux 2s linear infinite;
481 | -webkit-animation: flux 2s linear infinite;
482 | -o-animation: flux 2s linear infinite;
483 | }
484 |
485 | @keyframes flux {
486 | 0%,
487 | 100% {
488 | text-shadow: 0 0 1vw #1041ff, 0 0 3vw #1041ff, 0 0 10vw #1041ff,
489 | 0 0 10vw #1041ff, 0 0 0.4vw #8bfdfe, 0.5vw 0.5vw 0.1vw #147280;
490 | color: #28d7fe;
491 | }
492 | 50% {
493 | text-shadow: 0 0 0.5vw #082180, 0 0 1.5vw #082180, 0 0 5vw #082180,
494 | 0 0 5vw #082180, 0 0 0.2vw #082180, 0.5vw 0.5vw 0.1vw #0a3940;
495 | color: #146c80;
496 | }
497 | }
498 |
499 | .neonText {
500 | color: #fff;
501 | text-shadow: 0 0 0px #fff, 0 0 5px #03ed03, 0 0 10px #fff, 0 0 30px #bc13fe,
502 | 0 0 70px #230345, 0 0 80px #bc13fe, 0 0 100px #bc13fe, 0 0 120px #af12ed;
503 | }
504 |
505 | .Abhishekbg:hover {
506 | -webkit-transition: opacity 0.5s ease-in-out;
507 | -moz-transition: opacity 0.5s ease-in-out;
508 | -ms-transition: opacity 0.5s ease-in-out;
509 | -o-transition: opacity 0.5s ease-in-out;
510 | transition: opacity 0.5s ease-in-out;
511 |
512 | -webkit-box-shadow: 0px 0px 100px 0px rgba(254, 255, 253, 0.862);
513 | -moz-box-shadow: 0px 0px 100px 0px rgb(255, 255, 255);
514 | box-shadow: 0px 0px 100px 0px rgb(51, 65, 211);
515 | }
516 | .carousel-slide img {
517 | width: 100%; /* Make images fully responsive */
518 | min-height: 280px; /* Adjust based on your preference */
519 | max-height: 480px; /* Adjust based on your preference */
520 | object-fit: cover; /* This will ensure the aspect ratio is maintained without stretching the image */
521 | border-radius: 8px; /* Optional: Adds rounded corners to your images */
522 | }
523 |
--------------------------------------------------------------------------------
/src/jeff_jiang.pdf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/jeffjiang13/3d-portfolio/1d81854b269e2ae6a15b4705aa7c7677c049a55f/src/jeff_jiang.pdf
--------------------------------------------------------------------------------
/src/main.jsx:
--------------------------------------------------------------------------------
1 | import React from "react";
2 | import ReactDOM from "react-dom/client";
3 |
4 | import App from "./App";
5 | import "./index.css";
6 |
7 | ReactDOM.createRoot(document.getElementById("root")).render(
8 |
9 |
10 |
11 | );
12 |
--------------------------------------------------------------------------------
/src/styles.js:
--------------------------------------------------------------------------------
1 | const styles = {
2 | paddingX: "sm:px-16 px-6",
3 | paddingY: "sm:py-16 py-6",
4 | padding: "sm:px-16 px-6 sm:py-16 py-10",
5 |
6 | heroHeadText:
7 | "font-black text-white lg:text-[80px] sm:text-[60px] xs:text-[50px] text-[40px] lg:leading-[98px] mt-2",
8 | heroSubText:
9 | "text-[#dfd9ff] font-medium lg:text-[30px] sm:text-[26px] xs:text-[20px] text-[16px] lg:leading-[40px]",
10 |
11 | sectionHeadText:
12 | " font-black md:text-[60px] sm:text-[50px] xs:text-[40px] text-[30px]",
13 | sectionSubText:
14 | "sm:text-[18px] text-[14px] text-secondary uppercase tracking-wider",
15 | };
16 |
17 | export { styles };
18 |
--------------------------------------------------------------------------------
/src/utils/motion.js:
--------------------------------------------------------------------------------
1 | export const textVariant = (delay) => {
2 | return {
3 | hidden: {
4 | y: -50,
5 | opacity: 0,
6 | },
7 | show: {
8 | y: 0,
9 | opacity: 1,
10 | transition: {
11 | type: "spring",
12 | duration: 1.25,
13 | delay: delay,
14 | },
15 | },
16 | };
17 | };
18 |
19 | export const fadeIn = (direction, type, delay, duration) => {
20 | return {
21 | hidden: {
22 | x: direction === "left" ? 100 : direction === "right" ? -100 : 0,
23 | y: direction === "up" ? 100 : direction === "down" ? -100 : 0,
24 | opacity: 0,
25 | },
26 | show: {
27 | x: 0,
28 | y: 0,
29 | opacity: 1,
30 | transition: {
31 | type: type,
32 | delay: delay,
33 | duration: duration,
34 | ease: "easeOut",
35 | },
36 | },
37 | };
38 | };
39 |
40 | export const zoomIn = (delay, duration) => {
41 | return {
42 | hidden: {
43 | scale: 0,
44 | opacity: 0,
45 | },
46 | show: {
47 | scale: 1,
48 | opacity: 1,
49 | transition: {
50 | type: "tween",
51 | delay: delay,
52 | duration: duration,
53 | ease: "easeOut",
54 | },
55 | },
56 | };
57 | };
58 |
59 | export const slideIn = (direction, type, delay, duration) => {
60 | return {
61 | hidden: {
62 | x: direction === "left" ? "-100%" : direction === "right" ? "100%" : 0,
63 | y: direction === "up" ? "100%" : direction === "down" ? "100%" : 0,
64 | },
65 | show: {
66 | x: 0,
67 | y: 0,
68 | transition: {
69 | type: type,
70 | delay: delay,
71 | duration: duration,
72 | ease: "easeOut",
73 | },
74 | },
75 | };
76 | };
77 |
78 | export const staggerContainer = (staggerChildren, delayChildren) => {
79 | return {
80 | hidden: {},
81 | show: {
82 | transition: {
83 | staggerChildren: staggerChildren,
84 | delayChildren: delayChildren || 0,
85 | },
86 | },
87 | };
88 | };
89 |
--------------------------------------------------------------------------------
/tailwind.config.cjs:
--------------------------------------------------------------------------------
1 | /** @type {import('tailwindcss').Config} */
2 | module.exports = {
3 | content: ["./src/**/*.{js,jsx}"],
4 | mode: "jit",
5 | theme: {
6 | extend: {
7 | animation: {
8 | text: "text 5s ease infinite",
9 | },
10 | keyframes: {
11 | text: {
12 | "0%, 100%": {
13 | "background-size": "200% 200%",
14 | "background-position": "left center",
15 | },
16 | "50%": {
17 | "background-size": "200% 200%",
18 | "background-position": "right center",
19 | },
20 | },
21 | },
22 | colors: {
23 | primary: "#050816",
24 | secondary: "#aaa6c3",
25 | tertiary: "#151030",
26 | "black-100": "#100d25",
27 | "black-200": "#090325",
28 | "white-100": "#f3f3f3",
29 | },
30 | boxShadow: {
31 | card: "0px 35px 120px -15px #211e35",
32 | },
33 | screens: {
34 | xs: "450px",
35 | },
36 | backgroundImage: {
37 | "hero-pattern": "url('/src/assets/herobg.png')",
38 | },
39 | },
40 | },
41 | plugins: [],
42 | }
43 |
--------------------------------------------------------------------------------
/vite.config.js:
--------------------------------------------------------------------------------
1 | import { defineConfig } from 'vite'
2 | import react from '@vitejs/plugin-react'
3 |
4 | // https://vitejs.dev/config/
5 | export default defineConfig({
6 | plugins: [react()],
7 | })
8 |
--------------------------------------------------------------------------------