My Website Step by Step (Three.js, HTML/CSS, Javascript)

[@LouistitiFr]

Je partage complètement ton excitation. Quand tu ressens ces papillons pendant le développement d'un projet, cette flamme qui devrait animer tous les développeurs, c'est juste l'extase ! Bravo pour le travail ! 👏

[@gunkat]

Très beau site, bsahtek benjamin ! Et les projets étapes par étapes sont une super bonne idée

[@manuel-hadriensalard1637]

Merci pour cette vidéo. Je suis en train de songer à devenir developpeur web alors que je n'ai aucune compétence en la matière. Tes vidéos sont très motivantes et donnent envie de faire ton métier. Je suis en train de postuler à l'école le wagon en espèrant être sélectionné.

[@chokdeesam2365]

Au top ! Voilà pourquoi j’aime le front end : les possibilités de design et d’interactions infinis, qui procurent au final une expérience incroyable, et surtout mémorable:) Je suis débutant, mais vraiment le back end, ça me fait pas rêver du tout... Merci pour cette vidéo géniale!

[@yannyver5746]

Tu gères, j'adore et curieux de voir comment on réalise ce truc. C'est effectivement trop bon, cette excitation quand tu es sur un projet qui te prend et t'emmène si loin que tu as même oublié de manger. Pour cette raison que j'adore ce job. Félicitations pour ton site et tes vidéos. 👏

J'ai adoré le parallèle très vrai entre la découpe du site brique par brique et l'algorithmique ! Fabuleuse vidéo et fabuleux site, bravo Benjamin ! 👏

[@tanguybruwaert901]

Je kiff comment tu communique cette passion😆, je suis actuellement au début de html, ces, tellement d'univers découvrir. Bravo pour ta communication, ton travail, ton enthousiasme 🙏👏

[@cedricchaffard829]

Absolument merci de nous faire partager tout ça Benjamin. C’est intéressant au plus haut point et tellement motivant de voir toutes ces incroyables possibilités de création web 👍🏻👍🏻🤘🏻

[@Maertaugh]

Just bluffant... je suis émerveillé par ta ténacité et ta motivation... bravo. Le resultat a l air super top comme ca sur youtube

[@zennadizaki4393]

Il faut dire que le contenu que tu nous présentes et juste excellentissime

[@napoleonkhan7943]

Whaou. Le résultat est juste dingue. Franchement bravo. Ce serait super cool que tu nous parles plus de webgl et des shaders, même des bases. Car il n'y aucune vidéo sérieuse la dessus en français. Et sur un sujet complexe comme ça, c'est toujours agréable d'avoir des ressources en langue maternelle pour se lancer. En tout cas, bravo encore. Super vidéo !

[@BenjaminCode]

Je suis d'accord que y'a pas bcp de resources en français. Même en anglais en fait... C'est le désert total et y'a peu de choses bien pédagogique à ce niveau. Moi je ne ferai pas de tutos ou j'en parlerai pas avant de mieux maîtriser le sujet et j'en suis loin hélas... En tout cas je suis confronté à exactement les mêmes problèmes que vous dans mon apprentissage !

[@paulbrumder7394]

@@BenjaminCode En effet, pour avoir effectué énormément de recherches dessus, c'est un désert et c'est compréhensible que tu ne veuilles pas t'avancer dans un tuto sans maîtriser le sujet. En revanche si tu as le temps, il peut déjà être intéressant de présenter comment tu as réalisé l'effet présent dans cette vidéo ou du moins quelles sont les sources et ressources utilisées pour aboutir à ce résultat. +1 abonné au passage pour l'excellente qualité de la vidéo 👌

[@47jiro47]

A chaque fois que j'ai une baisse de motiv' tu sors une vidéo. En tt cas beau boulot!

[@benoitchrl8480]

Super intéressante ta vidéo ! J'adore découvrir en détail ton travail et ton processus créatif. Ça démystifie pas mal de tout découper en petits morceaux de taf comme tu le fais. Continues comme ça et bravo !

[@swarm9354]

C’est vraiment un domaine qui me plait, j’étais en formation à l’AFPA en tant que développeur web et web mobile, c’était très intéressant de jour en jour, je progressais, du CSS Brut aux flexbox - grid /Bootstrap puis semantic et d’autres. Malheureusement, je n’ai pas trouvé de stage malgré le fait d’avoir envoyé énormément de CV. Ça m’a démotivé alors que j’aurais pu être un bon développeur si j’avais pu du coup suivre la seconde partie de la formation sur le back-end. J’aurais pu passé de sans BAC à titre de niveau de 3. Mais bon, je pratique encore et je me suis mis à vuejs, sans diplôme j’ai encore espoir de trouver quelque chose ^^

[@Mihawkkun]

Woaw c'est ouf ! Un taff incroyable. J'aime beaucoup les étapes d'explication tout le long de la vidéo, j'aurais aimé en savoir plus sur cette technique de 3D que tu as utilisé pour faire ton corps avec cette société, peut-être une prochaine vidéo sur ça pourrait être cool !

[@BenjaminCode]

La vidéo est déjà sur ma chaîne ! Je suis allé chez eux et jai filmé le processus en plus d'une interview. La vidéo s'appelle : je me fais scanner en 3d par digitage

[@Mihawkkun]

@@BenjaminCode oups désolé j'ai pas fais attention j'irai la voir alors merci pour ton contenu en tout cas 🙂

[@babali840]

Super vidéo, j'adore ta motivation c'est trop cool ! Longue vie aux shaders

[@zaaaaz31]

4:00 > "Et là, patatrac. Je me rends compte que ce que j'ai fait la veille c'est de la merde." C'est la base ça. C'est même la quintessence du dev.^^

[@gxclseize2945]

Comment avec un commentaire pareil , il n'a pas été censuré , j'ai tenté de faire un commentaire positif, il a été censuré

[@BenjaminCode]

Bienvenu chez youtube...

[@gxcl1683]

@@BenjaminCode youtube ???

[@BenjaminCode]

Regarde ma réponse à ton autre commentaire tu verras ce qu'il se passe, c'est pas de ma faute, c'est youtube qui fait n'importe quoi et ça me rend fou. C'est un bug qui supprime des tonnes de commentaire en pensant faire de la modération.

[@sebastiendubourg4797]

Salut ! Super vidéo, super fluide, t'es hyper naturel et tu donnes juste le bon niveau d'info / au bon timing qui fait que c'est un plaisir de te suivre. Je suis venu pour three.js, mais je reste curieux de voir le reste. Ah, j'ai failli oublier : tu as l'air vraiment passionné. ça aussi, ça y fait beaucoup. On la sent la flamme dont tu parles. A + dude

[@BenjaminCode]

Merci beaucoup ! Trop bien d'avoir ce genre de retour sur le la conception de la vidéo avec le rythme et tout !

[@roadnkite]

C'est trop bien ça de voir comment tu réfléchis, voir le cheminement du début à la fin

[@kaporos]

Lundi, mardi, credi 😁 Très chouette vidéo !

[@TomahAwkDJ7]

Vraiment classe ! C'est ce qui me motive dans mon apprentissage du web dev et design ce genre de site innovant ! J'ai bien ri à 5:20 :D

[@laurentmottet7615]

Hello, super inspirante ta vidéo (et la plupart de celles sur ta chaîne !) pour voir jusqu'où peut nous mener le développement front pour moi qui débute en HTML/CSS. La route est longue mais tout cela est passionnant ! Merci pour le partage.

[@ryan_0337]

Salut Benoît félicitations pour ton intégrité. Tu as réussi à faire ce que très peu de monde peu à réussi à faire. Tu apportes beaucoup à la communauté 😊 Si tu fais des formations je serai ton premier client😉

[@juleserbin4070]

Très beau site !! Vive le créative development, bravo à toi

[@taile5345]

Yes Yes Yes, je valide totalement ! J'adore ton approche dans tes vidéos, 👏

[@darkodeur9603]

Enorme la vidéo et le site. La tête lunaire à la fin ;)

[@Personneverrajamais]

gNeU gNeU dEv FrOnT c pA 1 MéTiEr, les devs back en PLS. Joli taf je suis admiratif ! EDIT : T'as une jolie lune.

[@ifecojahs8151]

Wait a minute. All the great THREE.js guys are from France. Wow! That's cool!

[@thierryguichon]

Je kiff l easter eag à la fin de ton site 😂

[@Leodagan84]

Incroyable ce projet ! Félicitations

[@voyagesetsurf8869]

C'est super stylé! Tu t'es bien chauffé sur ce projet, bravo.

[@eliamlotongaaliasmitou5497]

1:26 Allez un like juste pour la tête apres la blague sur les fesses ahhahaha :D t'es pas seul dans ta tête mex xd

[@quentinmengue4685]

Franchement tu es vraiment fort chapeau

[@Pouetpouets]

Assez incroyable cette vidéo, plus de projet perso comme ça !

[@aghileslounis]

30 premières secondes je vois le site en fond je like la video waw c'est fou!

[@harentzharentz3477]

🤩🤩🤩 COOL, Continuez !!!!!!

[@maxime3969]

9:36 Lundi Mardi Credi 😂😂

[@antoankurti]

Yo. Trop cool la vidéo. Très bien le fait de découper les étapes. Tu ne fais pas de vidéos tuto mais le côté : lire des vidéos à partir d’une playlist KZbin m’intéresse fort. Si l’envie te prend d’en faire quelque chose. Bise.

[@mougri0695]

Trop bien la lune easter egg

[@MrSeb7]

Super vidéo et super site, bravo à toi. J'adore totalement.

[@hajarivolarazanakotorasold9167]

J'adore, rien a ajouter de plus.

[@LoganSeduction]

Wow, respect pour ton niveau !!

[@yannig9365]

Salut Benjamin ! J'ai une question relatives aux performances à l'exécution des animations de ton site. Je n'y connais pas grand chose en développement web. Je crois néanmoins comprendre que ces animations sont codées en javascript et s'exécutent donc côté client, sur le pc (ou autre) de la personne qui visite ton site. Si la carte graphique du visiteur n'est pas top, est-ce que ça ne risque pas de plomber l'exécution des animations et donc de donner un rendu bof, pour le visiteur de ton site ? Sinon, j'ai découvert ta chaîne ce week-end et j'aime beaucoup ! Concernant le développement de ton site, quel plaisir de voir ton enthousiasme, par rapport à ce projet, c'est beau à voir ! :)

[@MaskOfficiel]

J'pose ça la pour flatter l'égo de l'algo. Véritablement trop rien à dire sur toi ta fait tes preuves depuis un moment. Continue comme ça ! Mais tu le sais déjà 👏

[@avelvetcreation3556]

Pour un surfer du web comme moi qui parfois peut avoir 400 onglets en moyenne d'ouvert (les navigateur à base de chrome sont très mal optimiser en multi onglets), ton site ne charge plus. Puis une deuxième remarque, il faut penser le chargement d'un site web, si tu as quelque à voir ou à faire pendant le chargement d'un site, tu y gagnes. Alors oui, c'est vraiment pas mal, mais c'est plaisant un temps, ce n'est pas particulièrement efficace niveau communication à moins de s'adresser à des grands fans, je serais assez curieux d'avoir les statistiques sur la fréquentation du site. Ce type de site fonctionne très bien pour des sorties de films, d'annonce d'un évènement qui ne s'étale pas dans le temps. En tant que vitrine de compétence, j'ai un doute (surtout pour ceux qui n'y connaisse rien, ils ne vont pas reconnaitre le travail qu'il y a derrière).

[@titouanschotte]

Super site et bravo 👌🏻💪🏻

[@lusab3960]

Bonsoir Benjamin je suis en formation de dév (bon ct pas obligé de le noter lol). Je voulais juste savoir où je pouvais retrouver ton site où je peux voir ce rendu ! car en allant sur ton site actuel je ne tombe pas dessus.

[@thewarmachine9713]

Franchement Chapeau L’artiste 👏

[@moustaphakachab6277]

Super site ça m’a super inspirer 🔥🔥 merci 🙏🏼🙏🏼✨✨

[@ld2037]

Genial j'adore ta chaîne

[@arnaudvillani797]

Merci pour cette vidéo! Est-ce que tu as posté le github du projet quelque part?

[@LilZoty]

C'est ouf, bravo, j'aimerais avoir ton niveau pour réaliser ça !

[@pioupiagaming]

Wow C'est incroyable !

[@JhnBravo84]

Lesson est :MAGNIFIQUE!!! Merci! Tu peux en faire encore sur dév Créatif??? Stp

[@sereine27]

Tu nous apprends des choses... Merci ;)

[@adminmauvais-oeil5058]

Magnifique

[@cholakabaso725]

Génial le site, il est bien optimiser que l'original, félicitation

[@Ta9i]

Incroyable

[@KorbakSC]

Intéressant sur le fond! Un peu mégalomaniac sur la forme.

[@Learnbynet]

un defi pour la v2, ajouter des normals avec un éclairage dynamic :) Bravos three.js est une super libs, perso je prefere pixijs et j'utilise de la projections pour mes rendu 3d. Ces plus lowlevel que threejs, mais un bien meilleur contrôle et performance pour webgl. pixijs.io/examples/#/plugin-projection/iso-basic.js

[@blackmesa2297]

Super vidéo, dommage qu'il n'y ai pas plus de travail sur les textures du rocher et les ombres de la statue sur celui-ci. Idem pour le fond du site. Après ça reste une question de goût !

[@Watcha93]

Super site. Félicitation

[@khalid540000000]

Salut, Grave cool, chapeau 👏👏👏

[@Sialbh]

Salut Benjamin, super vidéo, j'avais vu le site sur Awwwards et j'étais bluffé ! Je me pose une question, comment est-ce que tu gères l'importation de ton élément 3D dans ta page ? Est-ce que tu appelles un .obj avec Three.js ou tu utilises un add-on comme Blend4web sur Blender. Je t'avoue que comme beaucoup de personnes, je suis complètement perdu lorsqu'il s'agit de 3D et de web -_- En tout cas continu comme ça ! ;)

[@eddyhansandrianambinina5907]

T'es un boss 🤩🤩🤩

[@vinzFDC]

Énorme !!

[@MrSymbellou]

Bon ben l'effet m'a directement fait penser à Tomb Raider ! C'est pareil que le menu de sélection des objets dans les premiers tomb raider !

[@bebebeboop]

Es ce que tu pourrais expliquer plus précisément comme tu l'as fais ? Ou juste mettre les ressources ? Je pense que tu as utilisé tweenMax avec Magic mouse mais je ne suis pas sur

[@demaupeoucorentin]

J'adore les sites avec un design qui attire vraiment, est-ce que tu connais des tutos sur three.js ? J'en trouve pas mal perso mais juste pour les bases

[@anthonygorski]

J'aime j'aime x1000 ! Bravo !

[@Gontran_Courtjoie]

Salut, merci pour tes vidéos que j'apprécie car très peu de blabla et beaucoup de concret. J'ai une petite question : je suis le point d'acheter un mac et j'aurais voulu savoir quelle config tu as choisi pour ton macbook pro 16' et combien d'années tu penses l'utiliser avant d'en changer ? Merci d'avance.

[@Anonymous-cs6cl]

Bonjour Benjamin. Je sais pas si tu le répondra un jour, mais je suis curieux de savoir comment est tu devenu aussi fort dans ce domaine. Merci

[@elyseebleu3974]

Moi j’aimerais savoir si la réalisation de ce genre de projets nécessite une bonne connaissance en Mathématiques ?

[@balt0x801]

Yo ! Est-ce que t'a fais une vidéo sur ton parcours scolaire etc ?

[@baptoufou966]

Magnifique l'easter egg 😏

[@buuchs]

Ah tiens ! Je suis justement sur un truc en webgl ou j’essaye de rajouter une font custom t’as un tips ? Parce que je m’en mords les doigts justement

[@misterpoof3197]

Salut j'ai découvert ta chaîne hier et depuis j'enchaîne tes vidéo à quel point c'est trop bien 😍 j'aimerais poser une question, sa fait combien d'années que ta commencer l'informatique et quel âge avait tu, car jai commencer y a même pas un an merci et bonne continuation !

[@BenjaminCode]

Salut Prof ! Merci pour les compliments ! J'ai commencé à trifouiller du code quand j'étais au collège. Je me faisais des petits sites ou je racontais ma life. Après j'ai tout arrêté et j'ai repris après la prépa, à mon école d'ingé en gros ! à 20 ans en gros et aujourd'hui j'en ai 29 donc ça fait un paquet de temps que je code mais je faisais déjà des trucs super cool à 21 - 22 ! J'espère que ça répond à ta question :)

[@mklk7377]

Le EasterEgg c'est le move de ta figurine 3D qui fait comme Dr Strange ?

[@sergioguinaudeau7997]

Très instructif

[@MobjineYt]

je veux coder une appli mais je sais pas avec quelle langage e quelle logiciel, je voudrais savoir si tu a créer un discord pour poser mais question

[@AymericDominique]

5:11 du front quoi :D (de la part d'un front)

[@ImSpliiZz]

Salut, Tu as fait comment ton personnage 3D ? Sinon lourd comme d'hab

[@enzosopranos8854]

Top

[@StEvUgnIn]

Bravo, en français en plus. As-tu tenté de le soumettre aux CSS Design Awards ?

[@Menlho83]

Orteille proteille bouteille.... bosmek C'est quoi le titre de la musique de fin ? Bien joué joli projet !

[@BenjaminCode]

La musique complète est dispo ici ! C'est du fait maison :) kzbin.info/www/bejne/a5PaY2loitN0e7c

[@Menlho83]

@@BenjaminCode Un génie ! Merci beaucoup =)

[@fakherhabib7952]

j aimes ton contenu

[@BenjaminCode]

Bienvenue à toi !

[@JohnDoe-rz6jk]

c'est quel extension pour les personnages 3D ?

[@misou8303]

Salut, Si tu veux chrome a une extension qui s'appelle wappalizer et qui permet de connaître les langages qui ont été utilisé pour créer un site

[@yvanmackowiak1227]

Ca serait tellement intéressant d'avoir accès au code pour étudier tout ça

[@bilal27000]

Bonjour j'ai une question hors sujet est ce que programmé avec rad studio embarcadero fait de moi un movais programmeur je trouve vraiment raremznt de personne qui en parle et qui programme avec du coups je me pose des question merci pour votre réponse par avance bonne continuation a vous

[@c_r8256]

Best youtubeur

[@zenwhitezen]

Pour toutes ces formes c'est bien un canvas html5 ?

[@guillaumemmm7370]

Très chaud!

[@Loupechou]

Top, bravo !

[@dadoucha6946]

JUST WAAW !

[@FazioNico]

Bravo pour ta vidéo et surtout pour le defis! Maintenant il faudait à mon avis normaliser et donc intégrer tous cela dans un framework... Angular? Vue? React?? Tu choisirai lequel pour l'intégration?

[@BenjaminCode]

Salut et merci ! Pourquoi l'intégrer à un framework ? Ici j'ai tout fait en javascript natif avec des classes bien propres, le projet est super bien architecturé. Je ne vois pas du tout ce qu'apporterait un des 3 framework JS à part un peu de poids au fichier js final. Par contre, c'est tout à fait possible de le faire et sur un autre projet sur lequel je suis en train de bosser j'ai mixé vue.js et three.js sans soucis ! Tu trouveras ça ici : dmap-visualizer.herokuapp.com

[@guillaumemmm7370]

Hello, pour info un truc très prometteur aussi c'est React three fiber (github.com/react-spring/react-three-fiber ) pour intégrer facilement et assez naturellement three.js dans React :) Et du coup si tu cherches un moyen d'intégration à un framework, je pense que c'est ce qu'il y a de plus avancé (avec les custom shaders et glslify ça devient un peu plus complexe, mais le jeu en vaut la chandelle).

[@FazioNico]

@@BenjaminCode Oui je pense bien que tu l'as bien architecturé ton projet ^^ Le seul avantage que je verrai à passé tous cela sur un framework c'est démontrer la possibilité à intégrer ce code dans un environnement applicatif professionnel. En entreprise on code jamais sans framework.. et trop peu de dev savent passer du PoC vanillaJS au veritable Composent réutilisable et configurable... sans parler de la testabilité. Si tu cherche un nouveau job avec du chalenge, c'est un truc que les recruteurs regardent ;-)

[@CkyreGaming]

Oooh non pas la liaison hélicoïdale 😭😭

[@uploadvoice]

Liaison helicoidal :) T'as fais le bilan des forces ?

[@BenjaminCode]

Rien que lire ça ça m'a rappelé de trop mauvais souvenir bordel de merde ! 😂

[@uploadvoice]

@@BenjaminCode comment as tu (toi aussi) mal tourner et aller dans l'informatique ?

[@samsky9045]

J'ai commencé à apprendre le html/CSS cette vidéo m'a mis une bonne tarte moi qui pensait avoir bien avancé, alors que je suis comme un bébé qui a fait ses premiers pas ptdrrr

[@faridzo1017]

bravo, c'est super ;)