Programming – category –
-
Next.js + React Three Fiber + React Three XR + Variant Launch to develop a WebXR compatible AR app on iOS!
I was thinking of creating an AR app with WebXR, but the current situation is that iOS does not officially support WebXR. So, I used Variant Launch, which was also featured in the official React Three XR, to support WebXR AR on iOS as well. Does it work on iOS?WebXR fo... -
[For beginners] Introduction to React Three Fiber x Drei x TypeScript! Create pixel art and dynamic animations from images
Recently, web application development has seen an increasing number of efforts to improve the user experience using graphics. With React Three Fiber (R3F), you can easily utilize Three.js features as a React component, making it easy for anyone to create attractive expressions... -
[Complete explanation] Learn with React Three Fiber × TypeScript! Practical guide to Transform (Position, Rotation, Scale) for 3D Objects
One thing that cannot be avoided in 3D app development is the operations of objects such as "Position", "Rotation", and "Scale". React Three Fiber (R3F) allows you to intuitively build 3D scenes while taking advantage of React's component-based mechanisms... -
[Super Easy] Introduction to React Three Fiber x Drei x TypeScript! Poke Poke style 3D background made with standard objects!
Recently, there have been an increasing number of cases where 3D graphics are used in web app development. In particular, React Three Fiber (R3F) allows you to easily handle Three.js as a React component. This time, we will also use the Three.js wrapper library Drei... -
[Super Introduction] React Three Fiber × Drei × TypeScript! Basics of 3D expressions made with standard objects
3D design is now attracting a lot of attention not only in game development, but also in the world of websites and next-generation interfaces. Have you ever thought, "I want to create that charming world myself!"? However, many people probably find that 3D is difficult. Traditional Thre... -
[Super Introduction] Easy even for beginners! Build a 3D environment for TypeScript x React Three Fiber with Vite!
Recently, on the web, we have seen more and more interactive and beautiful 3D representations. For example, 3D animation backgrounds, game-style designs, and even next-generation interfaces. At first glance, these may seem like "advanced skills required", but React T... -
Control 3D models in glb format generated using Meshy AI using React and Three.js! How to manage multiple animations
Are you interested in controlling animations for 3D models? Recently, there are an increasing number of 3D model generation tools that utilize AI, and among them, Meshy AI is attracting attention as a tool that allows you to easily create high-quality 3D models. However, the generated 3D model is... -
I tried making bears walk with React x Three.js! Easy 3D modeling with Meshy AI!
As AI technology evolves, 3D modeling has become easier and more enjoyable. With the introduction of "Meshy AI," which can be easily used by beginners of programming, 3D modeling, which we have previously found difficult, has suddenly lowered the hurdle. 📺 Check Mesh: This Lin... -
Bolt.new thorough explanation! I actually tried to create a React app using AI super fast! Will this be a new era tool that doesn't require code?
Have you ever thought, "I want to try app development, but I'm not confident in programming..." or "I wish I could make an app easier"? "Bolt.new" is perfect for such people. With this tool, you can enjoy app development intuitively without writing any code... -
Generate AI with Meshy! How to instantly display 3D models that even beginners can do with React x Three.js!
Recently, generating 3D models using AI has become surprisingly easy. Among them, the AI tool called "Meshy" allows you to quickly generate high-quality 3D models with intuitive operations. In this blog, we will explain how to display 3D models generated using Mesh in a browser using React and Three.js...
12