# Part 1 - Beautiful Landing Page with React Fiber & Three.js (Free Course)

> This is Part 1 of a FREE course where I’ll teach you how to create a stunning landing page featuring a 3D DNA chain and a transparent pill animation. We'll…

Canonical page: https://andersonmancini.dev/videos/part-1-beautiful-landing-page-with-react-fiber-and-three-js

Published: 2024-09-28 · Duration: 34:46 · Category: Tutorials · Tags: three.js, react-three-fiber, tutorial, source-code, webgl, threejs-course, mesh-transition-material, r3f

Watch: [YouTube](https://www.youtube.com/watch?v=lCCcfXI5igA) · [Subscribe to the channel](https://www.youtube.com/@AndersonMancini?sub_confirmation=1)

This is Part 1 of a FREE course where I’ll teach you how to create a stunning landing page featuring a 3D DNA chain and a transparent pill animation. We'll build everything from scratch using React Three Fiber and Three.js, making it perfect for beginners and experienced developers alike.

Links:

•Live Project Demo:

•Download Source Code:

What You’ll Learn in Part 1:

• Setting up and configuring React Three Fiber and Three.js

• Building a beautiful DNA chain animation

• Creating a realistic, transparent pill effect

## Links from the video

- [fdt94j.csb.app](https://fdt94j.csb.app/)
- [CodeSandbox](https://codesandbox.io/p/sandbox/serene-pine-fdt94j)