- 31
- 142 583
CodeCrafter
Spain
Приєднався 9 сер 2022
Interactive Hover Effects: HTML, CSS & JS Tutotiral [2024]
Learn how to create interactive hover effects using HTML, CSS, and JavaScript, in this tutorial I’ll take you step by step through the process so you can apply these skills to your own web projects.- Basic HTML Structure - Styles and Animations with CSS - Interactivity with JavaScript
Source Code. - www.patreon.com/posts/96645063
#htmlcss #javascript
Source Code. - www.patreon.com/posts/96645063
#htmlcss #javascript
Переглядів: 127
Відео
Create an Interactive Portfolio with 3D Models | REACT & REACT THREE FIBER
Переглядів 2,2 тис.11 місяців тому
Create an Impressive 3D Web Portfolio. Step-by-Step Tutorial to Showcase Your Projects with Interactive Models using React and React Three Fiber. Source Code - www.patreon.com/posts/tutorial-website-89824766?Link& #reaction #portfoliowebsite
3D Portfolio Website Built with React and React Three Fiber
Переглядів 1,5 тис.Рік тому
Welcome to my immersive world of web design! In this video, I'm thrilled to unveil my latest creation a stunning portfolio website built using React JS and React Three Fiber. Source Code - www.patreon.com/posts/portfolio-react-83024057?Link& Buy me a coffee - www.buymeacoffee.com/wdhttpsp #reactjs #portfoliowebsite
Portfolio - React React Three Fiber
Переглядів 876Рік тому
Here you have a portfolio with 3D models created with React and React Three Fiber. Soon the tutorial, but if you want the code and the files, you can find them on my patreon. source code - www.patreon.com/posts/portfolio-react-83024057?Link& #react #portfolio
Portfolio Website - HTML CSS JAVASCRIPT
Переглядів 6 тис.Рік тому
In this videos i will create a responsive portfolio using 3D models with html css and javascript. Source Code - www.patreon.com/posts/portfolio-html-81860161?Link& assets - drive.google.com/drive/folders/1ooD6RJ0paqwIhCCPt7Ey2wR6mYda-emY?usp=share_link #javascript #website #portfoliowebsite
How to create React Three Fiber Website.
Переглядів 1,7 тис.Рік тому
Hello, in this video i will create a responsive website using React Three Fiber and JavaScript. I hope you enjoy. Code Source - www.patreon.com/posts/how-to-create-79265101?Link&
Responsive Portfolio Website Using HTML CSS
Переглядів 1,7 тис.Рік тому
Hello, in this video i will create a responsive one section portfolio using only HTML CSS. I hope you enjoy. Source Code - www.patreon.com/posts/responsive-using-78746923?Link& #responsivewebsite #portfoliowebsite #htmlcss
Html & Css Website with 3D Models
Переглядів 808Рік тому
How to create your own website with 3D Models using Html & Css. In this video i will create a header and a hero section with 3D Models using Html & Css, hope you enjoy. Source Code - www.patreon.com/posts/html-css-website-77292038?Link& #3dmodel #htmlcss
Create 3D Website with Spline Design and React
Переглядів 267Рік тому
In this video i will design a 3D website using Spline Design and React, create your own 3D website easily with this tool. Source Code - www.patreon.com/posts/create-3d-with-76968916?Link& #3ddesign #react #webdesign
Tutorial - Parallax Scrolling Website
Переглядів 333Рік тому
Learn how to create a parallax website using Html Css & JavaScript Source Code - www.patreon.com/posts/parallax-website-76586363?Link& #javascript #parallax
Tutorial 3D Nav Bar Html and Css
Переглядів 160Рік тому
In this video i will create a 3D Nav Bar with Html & Css. Source Code - www.patreon.com/posts/3d-nav-bar-html-76400206?Link& #css #navbar
Tutorial - Html & Css Button
Переглядів 126Рік тому
In this video i will create a button with Html & Css. Source Code - www.patreon.com/posts/html-css-button-76329441?Link& #html #button
Animated Section Three Js and React
Переглядів 979Рік тому
Learn how to create an animated section using Three Js and React. Code Source - www.patreon.com/posts/animated-section-76054581?Link& #threejs #react
CSS Animated Background
Переглядів 426Рік тому
In this video i will build a 3D cube and a plane with Css. Learn a simple way to CUSTOMIZE THE CURSOR WITH CSS. Code Source: www.patreon.com/posts/css-animated-75567532?Link& #css #animatedbackground
Top CSS Animated Background
Переглядів 304Рік тому
Animated Background with Pure CSS and Html. Use it for animate a website. source code: www.patreon.com/posts/animated-with-75326528?Link& #css #css3
TUTORIAL - Import Models React Three Fiber
Переглядів 4 тис.Рік тому
TUTORIAL - Import Models React Three Fiber
Tutorial - Animated Background Three Js
Переглядів 105 тис.Рік тому
Tutorial - Animated Background Three Js
Awesome 👍
if you are teaching some needed programme, then why did you put the background music, you could have spoken and could have understand good, and your screen size is too short to watch this video, pls zoom further you make other video & translate also.
Hi, it is given a problem when I write the import part of “style.css” and also impor the images. It says Cannot import dependency
¡Me encantó, nuevo suscriptor!☺
Thank you for the video. Is it a good practise to do the heavy calculation from inside JavaScript code? I think it loop through each vertices and even do it so many times per second which is so performance expensive when it run through CPU. But, instead if we can run it through GPU by writing GLSL code it would run on GPU and drastically improve the performance. Do you know any method to do it by GLSL instead?
thank you so much g, all this talking channels and they can't get you straight to the point btw i had to change some minor index.js into this instead in order to work: import "./style.css"; import ReactDOM from 'react-dom/client'; import { Canvas } from '@react-three/fiber'; import Experience from "./Experience"; const root = ReactDOM.createRoot(document.querySelector('#root')); root.render( <Canvas> <Experience /> </Canvas> );
Would you create a detail lecture or roadmap of creating 3d websites
I will create a tutorial soon, anyway you can take a look at my channel, there are some videos about it
Cool . Time code is missing.
i have problem on my send button its always disabled..it never enable to click
bundles are cancer if require something extrenal and cant load it with one line you do it wrong compailing anything is totally wrong
Can i copy this all web to make mine?
Of course
the image is not coming when i import it through js
Hello, that is because your code, make a review to your code
i wrote exactly as in the video but it still not shows@@wd-https
I checked the code and the code is ok, so there have to be something that you missing
is it responsive?
in Environment preset you don't need brackets just quotes is enough
thanks for the awesome video. That's why I shared your channel on FB programming community
Awesome, thank you!
Intro music pls
😇👏👏
the image is really pixelated once its rendered on the site. how to fix that?
Try to change the image
@@wd-https I used all of the images you put in the description. each is pixelated
Download an image whit good resolution and try it, if it still shows pixels, check the code
Instead of hard typing, Is it possible to add a comment feature to the scene?
Can you tell how I can load this 3d model faster without compromising it?
I’m not sure that I understand ur question, if u use model-viewer, it’s the way that u see on the video, if u use three js or something else just let me know
@@wd-https I only use whatever you shown in the video that much only!
Then follow the steps, it’s the only way to load 3D models with model-viewer, anyway I will upload a new video with 3D models in a few days, if u want to wait, maybe it will helps you
Hey buddy, Can you tell from where you downloaded glb models so i can download anothe r
Hello E-things, from sketchfab, name of first model: cyberpunk Desk, name second model: robot playground
@@wd-https bro it is paid models?
Free models
where did you find the img? please
Hello, I think pngtree com with the name purple lines
@@wd-https thanks but i don't think that i understand 😅😅 you don't have a drive with the asset something like that?
I will upload the files, give me a couple of hours pls
@@wd-https ok thanks you very i have to do a portfolio for school and i want do something like that with multiple object like the deskt
I will upload in a few day’s another one with 3D models created with react
Awesome video. Good way to learn !!! Keep up the good work
Thank you
Thanks for the video
Awesome
Huge thanks for the video, helped me a lot 👌
Thanks for the video! Can’t wait to see what comes next
Nice channel man, you have my like
Thank you 🙏
I want the image too. Can you provide the background images?
You have the link in description
Just cool
🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
😉
Awesome 👍
Thank you Tushal 🙂
I need a background animation with continuous codes written in the background, please take a video
I will try
Color combination is not good
looks amazing but the camera movment is kinda glitchy
True, that portfolio requires a performant pc
Muito bom!
I loved your videos personaly to be honest ! 👌👌
That kind of comments helps me a lot, thank you mate 👊
😪 pr໐๓໐Ş๓
not working animation, do you have any idea? Code the same like in video.
If your code is the same as the code in the video, it has to work, if it doesn't work it's because something is missing, check the code well until you find the error
@@wd-https thanks! Does the Three.js version make sense?
It shouldn't, in a few hours I'll upload the code, you'll find it on my patreon, I'll post the link
You copy the code and then you do npm install and after npm run dev, I will let u know when I’ll upload the code
@@wd-https Thank you so much! You are amazing!
open source please 😄
great job, you're doing good
Thank you
Bro you are a genius
Thank you mate!😌
@@wd-https please upload this on UA-cam i beg you
You have the code on my patreon, it’s free to download
@@wd-https thank you so much
@@mieleinstein7530 np bro
Bro, where is demo link?
He is charging money for it