Loading video...

Video Failed to Load

There was a problem loading this video. This could be due to a temporary network issue or the video might be unavailable.

So I've completed my portfolio with React and Three.js!💻🥳 📎 - Code - - Added Gmail service using emailJS - Secured keys in env.local file - Increased the size of the plane🚁 - Created utility hooks for showing/hiding alerts 🧵

Ritika kaurr

3,133 subscribers

11,713 views • 2 years ago •via X (Twitter)

Anya Rossi• Live Now

Private livecam show

11 Comments

Ritika kaur2 years ago

🦊The fox model exhibits dynamic animations such as: No action - standing When typing - walking, Click send- running, each corresponding to different actions or states within the application.

Ritika kaur2 years ago

👩‍💻 Lil Tweaks in the portfolio: - Updated the skills section dynamically - Added cards for services - Created a custom hook for alerting on authentication errors - Made the responsive layouts - Added socials 📲 Check it out live and let me know your thoughts! 🌟

Safari Web Extensions1 year ago

Discover the top Safari web extensions to boost productivity, enhance workflow, and customize your browsing experience on Mac, iOS, and iPadOS.

Madza 👨‍💻⚡2 years ago

Looking really awesome, great job on this Ritika!

Ritika kaur2 years ago

Thanks Madza 😊

Thoufiq UchihaZO 🥷👨‍💻⚡⚔️2 years ago

Wow 🤩 Ritika that's a piece of fabulous work 🔥🔥

Ritika kaur2 years ago

Thankyou for your kind words 😊

Gaurav Bhojwani2 years ago

Great work, glad to see the final outcome😀💫

Ritika kaur2 years ago

Thank you for your feedback Gaurav 😊

Pratik Thorat2 years ago

I want to know how did you make your 3D model mobile responsive! I am creating a 3D portfolio as well

Ritika kaur2 years ago

I used tailwind for that by applying breakpoints, classes, and components strategically so that it can embrace different screen sizes.

Related Videos

Visit my web portfolio I created using Three.js , React and theatre js. Plus all the free models I got from Sketchfab

Visit my web portfolio I created using Three.js , React and theatre js. Plus all the free models I got from Sketchfab

Nnaemeka.dev

17,430 views • 2 years ago

Day 4 of building my cozy fishing game with Three.js. Let’s support each other! If you follow and repost, I will feature you in development videos and credit you in the final game with your X URL. Today I added Three.js for their support and Bruno Simon for the inspiration to start using three.js. Also improved the boat model, navigation, added a cargo ship and supporter buoys.

Day 4 of building my cozy fishing game with Three.js. Let’s support each other! If you follow and repost, I will feature you in development videos and credit you in the final game with your X URL. Today I added Three.js for their support and Bruno Simon for the inspiration to start using three.js. Also improved the boat model, navigation, added a cargo ship and supporter buoys.

Leon

17,795 views • 11 months ago

This past weekend, I built a portfolio website entirely using natural language through coding required. The site itself is powered by Three.js and React. ⚡️

This past weekend, I built a portfolio website entirely using natural language through coding required. The site itself is powered by Three.js and React. ⚡️

Ian Curtis

20,248 views • 1 year ago

my gift for the @levelsio game jam a three.js starter file with cannon.js, react three fiber, and drei.. ready to go no paywall, just a download link 👇

my gift for the @levelsio game jam a three.js starter file with cannon.js, react three fiber, and drei.. ready to go no paywall, just a download link 👇

Aurelien

94,775 views • 1 year ago

I've been showing the output of my flight reconstruction tool for a while and I wanted to share something like it which wasn't a mess of hand tuned stuff that required X-Plane. So I created a completely new version in javascript that runs in an HTML page so that anyone can use it. The output is a KML file which is a tour that works in Google Earth pro with all the attitude information included. This is a long way from perfect, I messed around with multiple smoothing algorithms and none of them compares well with the python code, but they're readable and understandable for anyone.

I've been showing the output of my flight reconstruction tool for a while and I wanted to share something like it which wasn't a mess of hand tuned stuff that required X-Plane. So I created a completely new version in javascript that runs in an HTML page so that anyone can use it. The output is a KML file which is a tour that works in Google Earth pro with all the attitude information included. This is a long way from perfect, I messed around with multiple smoothing algorithms and none of them compares well with the python code, but they're readable and understandable for anyone.

Scott Manley

19,808 views • 4 months ago

Introducing pmndrs/viverse and react-three/viverse 🎉 A Toolkit for building Three.js and React Three Fiber Apps for VIVERSE and beyond with only a few lines of code ⟁

Introducing pmndrs/viverse and react-three/viverse 🎉 A Toolkit for building Three.js and React Three Fiber Apps for VIVERSE and beyond with only a few lines of code ⟁

Bela Bohlender

22,510 views • 10 months ago

Back on my portfolio! I've added x-ray on the foliage so that we can see the car.

Back on my portfolio! I've added x-ray on the foliage so that we can see the car.

Bruno Simon

27,740 views • 1 year ago

I finally got some free time to update my portfolio😍. I've published my most recent works, components, and courses. It can record which projects you have visited so you don't miss any. ⚡️Live: Created with Three.js and Poimandres #threejsJourney #r3f #creativecoding

I finally got some free time to update my portfolio😍. I've published my most recent works, components, and courses. It can record which projects you have visited so you don't miss any. ⚡️Live: Created with Three.js and Poimandres #threejsJourney #r3f #creativecoding

Anderson Mancini

11,092 views • 1 year ago

Automated NBA match commentary using OpenAI vision and TTS (with code!) Everyone is bragging about projects that generate automatic video commentary, but no one is showing the code. I did it while waiting for the plane. code:

Automated NBA match commentary using OpenAI vision and TTS (with code!) Everyone is bragging about projects that generate automatic video commentary, but no one is showing the code. I did it while waiting for the plane. code:

SkalskiP

188,580 views • 2 years ago

A demo reel of a few of the animation projects I've completed in the past year! #Portfolio (Music by TGH_sr)

A demo reel of a few of the animation projects I've completed in the past year! #Portfolio (Music by TGH_sr)

Spyrook

27,639 views • 1 year ago

I've been experimenting with using the new analyzer plugin API for code generation, and it's actually really cool! ⚡️ Instant code generation 🔬 Surgical updates in the same file 🔎 Report outdated/wrong code as lint warnings 🪄 Auto-regenerate outdated/wrong code via 'dart fix'

I've been experimenting with using the new analyzer plugin API for code generation, and it's actually really cool! ⚡️ Instant code generation 🔬 Surgical updates in the same file 🔎 Report outdated/wrong code as lint warnings 🪄 Auto-regenerate outdated/wrong code via 'dart fix'

Kilian Schulte 💙

37,947 views • 7 months ago

I've been using the crap out of Claude Code recently And lots of you have been asking me my tips So, here goes - 10 minutes of me using Claude Code to implement a feature.

I've been using the crap out of Claude Code recently And lots of you have been asking me my tips So, here goes - 10 minutes of me using Claude Code to implement a feature.

Matt Pocock

145,128 views • 7 months ago

Hytopia is quietly abandoning its own SDK. They just published a full FPS template using zero SDK code - built with Colyseus, Three.js, React, and Rapier instead. Most platforms lock you in. Hytopia is doing the opposite. 🔓

Hytopia is quietly abandoning its own SDK. They just published a full FPS template using zero SDK code - built with Colyseus, Three.js, React, and Rapier instead. Most platforms lock you in. Hytopia is doing the opposite. 🔓

Daniel Spitzwieser

11,488 views • 3 months ago

Let’s kick off the year with my latest project with @bonhommeparis 👉 Discover the 10 key values that fuel Bonhomme since 2013 A collaboration with LRT, remy and Kévin Chapron Using Three.js React and #R3F

Let’s kick off the year with my latest project with @bonhommeparis 👉 Discover the 10 key values that fuel Bonhomme since 2013 A collaboration with LRT, remy and Kévin Chapron Using Three.js React and #R3F

Bruno Simon

28,004 views • 2 years ago

5 FREE Tools for Web Developers - Claude code alternative - Full-stack hosting and free static site - React hooks with examples – Create images of code snippets - CSS animation snippets

5 FREE Tools for Web Developers - Claude code alternative - Full-stack hosting and free static site - React hooks with examples – Create images of code snippets - CSS animation snippets

Csaba Kissi

12,519 views • 10 months ago

Hey everyone! New beginner three.js and Blender tutorial out! Create a cozy cafe portfolio, a little bit of TSL too. Tutorial: Site: Code, Credits, Blender file, etc: #threejs #threejsJourney #tsl #b3d

Hey everyone! New beginner three.js and Blender tutorial out! Create a cozy cafe portfolio, a little bit of TSL too. Tutorial: Site: Code, Credits, Blender file, etc: #threejs #threejsJourney #tsl #b3d

Andrew Woan

18,837 views • 2 months ago

Using the incredible creative and expressive power of Poimandres r3f + drei for this newsletter landing about AI + Design. With a parametric spring mesh on Three.js, later ported to React. Stay tuned!

Using the incredible creative and expressive power of Poimandres r3f + drei for this newsletter landing about AI + Design. With a parametric spring mesh on Three.js, later ported to React. Stay tuned!

Davo

32,059 views • 3 years ago

MCP broke my brain a little because it rethinks the entire workflow. Debug, diagnose and file the issue with Playwright and GitHub MCP. All from agent mode in Visual Studio Code. What are you using MCP for beyond code?

MCP broke my brain a little because it rethinks the entire workflow. Debug, diagnose and file the issue with Playwright and GitHub MCP. All from agent mode in Visual Studio Code. What are you using MCP for beyond code?

Burke Holland

34,733 views • 1 year ago

hand-controlled arpeggiator, drum machine, and audio reactive visualizer 🪬 do you want the code for this? created with Three.js, Rosebud AI, mediapipe computer vision, tone.js

hand-controlled arpeggiator, drum machine, and audio reactive visualizer 🪬 do you want the code for this? created with Three.js, Rosebud AI, mediapipe computer vision, tone.js

AA

164,176 views • 1 year ago

I pasted the Three.js code from the previous 3D scene in Grok 4 from xAI and prompted it to create a variation with new shapes. The scene leverages custom GLSL shaders for particle behavior and click morphs between shapes. Open source code and workflow in the thread below. 🧵👇

I pasted the Three.js code from the previous 3D scene in Grok 4 from xAI and prompted it to create a variation with new shapes. The scene leverages custom GLSL shaders for particle behavior and click morphs between shapes. Open source code and workflow in the thread below. 🧵👇

Techartist

3,103,497 views • 11 months ago