Comment Créer un Site E-commerce à partir de Zéro en HTML & CSS !

[@frenchcoder-developpementw2429]

Voici les différents chapitres du tutoriel si ça peut vous aider : 0:00 Intro 0:53 Barre de navigation 11:27 Header 16:16 Les cartes de shopping 29:08 Vidéo de présentation 36:43 Pied de page 47:01 Format mobile 51:48 Présentation finale

[@bestfeeling2863]

Comment avoir ces codes sources ?

[@ghadaadjerime2285]

C Pouvez-vous me donner le code source de ce site si possible Merci

[@saintoseevaleroattia9706]

un très bon tuto j'en suis émerveiller, les détails sont expliqués la progression est de ouf. vraiment avec un tel tuto on sais comment travailler

[@rachidmountagui840]

merci cher ami pour cette formation , grâce a toi je vais pouvoir commencer mon premier projet.

[@TheCardsmania]

ayant de gros problèmes avec mon site e commerce qui n'a qu'un stockage de produits limités, ce tuto va peut-être me faciliter la vie.

[@_Sport44]

Grace à ton aide je viens d'avoir 27 sur 30 pour mon projet web! Merci!

[@frenchcoder-developpementw2429]

Bien joué !

[@deud3976]

Merci, merci et encore merci pour tes vidéos, tout est clair et organisé. Tu m'aides énormément à mieux assimiler ce que j'ingurgite pendant les journées de cours !

[@frenchcoder-developpementw2429]

Avec plaisir ! Content que ça puisse t'aider :)

[@Ummishaaq94]

Bonjour, est ce que vous pouvez nous faire un tuto backend de ce site ecommerce svp. Ce serait génial. Super tuto au passage

[@landryngounou1719]

vous avez finalement eu le backend parce que là moi meme j'en ai besoin?

[@mr.__rwicha]

c'est tuto m'a beaucoup aider a progresser en html vraiment merci

[@rodriPone]

vraiment ce tuto c'est un truc de ouf. avez vous d'autre tuto sur la creation des page web???

[@milanvicentijevic4092]

Extrêmement bien présenté et aussi clair que de l'eau de roche, bravo!

[@anisso2.063]

Merciiiiiii BEAUCOUP !!!! j ai tout compris et en plus j'ai appris pleins de nouveaux trucs .Franchement rien à dire .

[@bergerielepetitblanc287]

super efficace en application après de la théorie de bonnes bases solides en perspective merci mec !

[@philou527]

t'es juste le best mec, tu aides bcp de personnes avec ce tuto

[@frenchcoder-developpementw2429]

Merci pour ce commentaire encourageant !

[@pillier_de_la_flemme]

Merci bro💓💓💓💓. Je t'encourage à continuer ta chaîne nous aide beaucoup

[@frenchcoder-developpementw2429]

Merci !

[@jobkyungu2742]

J’aime tes détails French@Coder 🙏

[@YawilMusic]

pourquoi avoir utilisé des pour les différente rubrique de ton header au lieu de ul/li ?

[@adstta]

Bonjour, Merci beaucoup j'ai vraiment appris beaucoup de choses dans ta vidéo. 😍

[@pierresylvainabotia3038]

Merci pour ce tuto!!! Bonne continuation

[@frenchcoder-developpementw2429]

Je t'en prie !

[@yassinesalhi1797]

Merci, merci et encore merci pour tes vidéos et que je veux beaucoup plus de vidéos comme çà :) de ce type et parce que vous expliquez bien les choses bon courages

[@Taphad4]

Mercii pour tes explications c très claire ✨🙏🏿 la prochaine fois diminue un peu la vitesse 😅

[@simintoumohamed2441]

Merci pour ta vidéo elle est super bien expliqué !! Grosse force à toi 💪🏾

[@chamgold1429]

t'es le meilleur mec tu m'a bcp aider continue comme sa

[@frenchcoder-developpementw2429]

Je t'en prie !

[@gerardn3569]

Très intéressant et très bien expliqué !

[@erikamatra9518]

Bonjour à toi et merci pour ce tuto ;)

[@davidngabawaye6312]

franchement tu es juste bon no comment quand c'est bon c'est bon

[@frenchcoder-developpementw2429]

Merci!

[@metaEpsilone]

Tu expliques tros bien , tudo nes tout ce dont j ai besoin pour mieux comprendre 👍👌👉😉merci ,

[@frenchcoder-developpementw2429]

Merci pour ce commentaire encourageant :)

[@pictori1522]

vraiment mercis, ça m'a beaucoup aidé

[@frenchcoder-developpementw2429]

Je t'en prie ! :) Je suis content que mon travail puisse beaucoup aider !

[@samuelbouhanik1004]

Tu es vraiment le bosse merci de l’aide

[@myostvgaming771]

Super tuto merci beaucoup super claire

[@codec_haitiensmart5448]

Trop cool t'est devlopper genial

[@alimahamatchoukou3743]

CEST TRES BIEN POUR LES RAPPELLES DES BASES ,MERCI

[@frenchcoder-developpementw2429]

Je t'en prie :)

[@hannielkabongo2782]

Bonjour j’espère que vous allez bien ! J’ai une question je suis entrain de faire un projet mais mes paniers de ne affiche pas j’ai bien mis la bibliothèque mais je ne sais pas comment

[@mbusiness2.274]

Merci ça va beaucoup m'aider ! Nouveau abonné

[@frenchcoder-developpementw2429]

Je t'en prie ! Merci pour l'abonnement :)

[@shutaz.t4886]

Salut FrenchCoder, Pourrais-tu mettre dans toutes tes vidéos un dossier pour télécharger toutes les ressources nécessaire afin que l'on puisse refaire le site à l'identique en directe avec toi sans devoir aller dans ton code source... Merci pour tout ce que tu fais. ;-)

[@MobPab]

merci pour ce tuto.👍

[@pejoelilyeofficiel6744]

Oh c'est vraiment cool Monsieur,j'ai une question ou plutôt une suggestion quand on passe a la mode mobile pourquoi vous ne utilisez pas par exemple l'onglet menu qui devrait lister bien évidemment les autres comme nouveauté...etc

[@zaraing0510]

merci infiniment, avec la pratique j'avance bien

[@elhor]

trop magnifique

[@imanedakir9227]

merci beaucoup ça m'a bien aidé !

[@amineoukli2724]

bravo pour l'effort que vous faites merci j'apprends bonne continuation

[@frenchcoder-developpementw2429]

Merci à toi :)

[@fabiengaming1126]

Ouais Sisi je suis débutant dans le coding et ce genre de vidéo m'aide pas mal pour certaine chose que je comprenez pas au début 😁

[@frenchcoder-developpementw2429]

@@fabiengaming1126 Je suis content que ça puisse aider ;)

[@emmanuelzadjehie3555]

merci beaucoup la vidéo ma beaucoup aidé

[@Azmogexe]

Bonjour j'ai un problème je n'arrive pas a aligner mes 3 images pourtant j'ai bien mis .cards{ display: flex; flex-wrap:wrap; } Et j'ai bien essayer de réduire les image comme tu le dis mais cela ne fonctionne pas Merci d'avance pour ton aide

[@frenchcoder-developpementw2429]

Salut, essaie de vérifier si ton sélecteur fonctionne bien en mettant background-color:red; par exemple pour voir si la couleur d'arrière plan s'affiche bien

[@Azmogexe]

@@frenchcoder-developpementw2429 oui elle s'affiche bien

[@Azmogexe]

@@frenchcoder-developpementw2429 est ce que tu aurais discord ou quelque chose comme sa pour m'aider ? Merci d'avance pour ton aide

[@gauthierwagemans724]

@@Azmogexe vérifie que la class que tu as définie est la même que celle annoncée dans ton css, à une lettre prêt ça peut ne pas marcher

[@affiliationpuissante7047]

Bravo 20/20 vous avez un don d'enseignant

[@frenchcoder-developpementw2429]

Merci aha :)

[@roxanaprado4678]

Bonjour j"ai pas compris pourquoi sur le css a la ligne 80 et 135 il y a deux; .cards .card img{ width: 300px; } cards .card img{ width: 350px; } quelle est la diffréence ? Merci

[@aboyacyril]

Vraiment merci 🙏🏾

[@nathanlegai3009]

Bonjour, je voulais savoir avant de commencer le tuto si le site est fonctionnel pour vendre les produits et donc effectuer des transactions entre acheteur et vendeur. Merci de votre réponse

[@PruneCharlet]

Bonjour, est-ce que cette façon de coder est sécurisée ? Si le client passe commande et rentre ses données de paiement, il ne risque rien ? Avez-vous plus de tuto sur la sécurité web en html/css ? merci !

[@lpmlepetitmargoulin]

Salut a toi, ta vidéo est très bien éxpliquer et elle est génial mais je comprend pas pourquoi quand je fait le codage pour déplacer les onglets a droite de l'écran cela ne marche pas alors que je fais comme toi

[@axelguillerand2284]

Moi, quand je vais dans le CSS et que j'écrit: nav .onglets{ display: flex; flex-wrap:wrap; } et bah cela ne me mes pas tous mes onglets à l' horizontal... Pourquoi ? ='(

[@gauthierwagemans724]

c'est surement parce que ta page était trop petite à ce moment là, il faudrait réessayer en la mettant en plein écran

[@gauthierwagemans724]

sinon vérifie que la class que tu as associé à ta div est exactement la même que celle indiquée dans ton css, à une lettre prêt ça peut ne pas marcher

[@axelguillerand2284]

@@gauthierwagemans724 Merci !

[@axelguillerand2284]

@@gauthierwagemans724 C'est que en fait je n'avais pas mis de S a div class onglet alors cela ne marchais pas

[@donaldkouame4595]

concernant le menu navigation comment faire pour que ça soit un lien de sorte qu'on puisse clic afin d'ouvrir autres page par exemple si je clic sur homme il faut que j ai accès a la page au homme

[@faxther]

Comment coder, quand qqn fait un achat, de savoir dans un fichier txt l'adresse de livraison, num de tel, e-mail ? Fait en une vidéo pour expliquer ça stp

[@ange-dev854]

Bonsoir merci ☺️ Mais lorsque notre largueur ne s’applique pas pour toute les photos qu’est ce qu’on fait ??

[@okhugo.3666]

MERCI beaucoup pour ces tes vidéos, tu as une bonne pédagogie , seulement , peux-tu aller doucement dans tes explications prochainement ? Merci encore .

[@frenchcoder-developpementw2429]

C'est noté, merci pour ta remarque :)

[@MrNgues]

Super tuto.

[@frenchcoder-developpementw2429]

Merci !

[@RedLed.]

Bonjour , merci pour la video tu aide beaucoup , mais juste une petite remarque pour le format mobile pourquoi pas mettre (le truc avec 3 lignes empilées ) pour quand on click dessus il s'ouvre pour afficher différentes catégories celles que tu as supprimé sur le format mobile (hommes , femmes , enfants, nouveautés, cadeaux, le cœur + le kart de shopping) c'est plus utile.

[@dnikeofficiel4983]

tu es un ange 😇 😇

[@dimitridiop515]

parfait !

[@felixwarano]

je t'écris depuis le Cameroun et dans mon pays la programmation n'est pas du tout valoriser. j'aimerais que tu sois mon mentor 🤲🤲

[@mous_wengli]

Comment fait on pour créer une redirection vers un nouvel onglet lorsque l'on clique sur les onglets " homme" , " nouveautés" par exemple.

[@alimsaalifaissoil8054]

Petite précision! Jamais de width en pixel. Toujours width en pourcentage. il aurait fallu appliquer un width à 100% à ton cards et un flex à 30 ou 33% à tes card.

[@frenchcoder-developpementw2429]

Effectivement, merci pour la précision ! Je suis peut être allé trop vite

[@alimsaalifaissoil8054]

@@frenchcoder-developpementw2429 Quand on fixe une largeur en pixel, ça peut être embêtant sur la partie responsive. Il suffit que l'écran ait une résolution plus petite que la largeur fixée.

[@racemandroid7296]

thank you 💓

[@SupraDZ14]

salut comment faire pour recevoir les commandes des clients ?

waw t'est cool mec

[@miguelsparo6129]

hey salut mec super ta vidéos sinon j'ai un soucis au niveau de fontawesome ils ne sorte pas dans ma page web alors que j'ai intégré le lien dans le même dossier que mon html et css aide moi stp merci d'avance

[@frenchcoder-developpementw2429]

Tu as bien utilisé le cdn de fontawesome ?

[@rayanbechrouri3835]

Salut bonne vidéo déjà, je voulais savoir à partir du codage de la vidéo, comment crée un bouton à partir des mots de la barre de navigation dirigeant vers des pages vierges (créent dans le futur) je sais ps si c’est clair😅

[@gyorickholstone5376]

Très explicite

[@blackstar226bf]

bonjour très bonne videos au passage j'ais une question très pertinante à poser et je vais prendre un exemple pour illustré mon problème par exemple je suis vendeur et je souhaite creer mon propre site de vente en ligne et de pouvoir publier mes produits sans avoir a retoucher mes ligne de code . Si cela est possible est-que vous acccepterez de faire un cours sur ça.Merçi(avec html css et php ou js)

[@jeremienzuzidiansongi4854]

Bonjour j'espère que vous allez bien j'aime beaucoup votre tutoriel vous allez faire un tuto côté serveur PHP mysql

[@frenchcoder-developpementw2429]

Hello, pour l’instant je préparer une formation que je vais bientôt publier sur la chaîne pour apprendre à créer un Forum de A à Z en PHP & MySQL, le site ecommerce viendra sûrement plus tard

[@StalineSOGLO]

Merci pour l aide je suis en train

[@soryfofana1608]

Bonjour Mr enfaite j'arrivé pas à aligner les images pouvez-vous m'aidée s'il vous plait.

[@donaldkouame4595]

salut Monsieur svp je suis passionné du développement web et j aimerai apprendre d'avantage raison pour laquelle je me suis abondone a votre chaine svp ma question concerne font Awesome après avoir télécharge j aimerai savoir comment faire pour mettre dans l"editeur de texte pour pouvoir utilise

[@frankfuns_steel4889]

Il y'a des explications sur internet et en particulier sur la page du site regarde bien les documentations et si vraiment tu trouves pas va sur des discords de développement pour trouver des gens pour t'aider un petit peu

[@donaldkouame4595]

@@frankfuns_steel4889 merci pour tout ce que vous faites grâce à vous j'arrive à faire quelque choses et je sais que je vais y arrivé être aussi excellent comme vous

[@tomf6964]

Bonjour j'aimerais connaître une information qui m'aiderait fortement c'est de savoir enfaîte à partir de combien de pixel on n'est plus obligé de faire le responsive ? Par exemple existe il des téléphones en dessous de 320px? Pck à partir de 200px mon site ne suis plus. Merci à vous....

[@gauthierwagemans724]

je ne sais pas si il y a une limite, mais c'est pour cette raison qu'il faut mettre le width en % et non en px

[@coolmustach1579]

bonjour, super travail est ce que Leboncoin est un site e-commerce ?

[@frenchcoder-developpementw2429]

Bonjour, oui c'en est un

[@jamilaabela6013]

bonsoir, moi je ne parviens pas telecharger le link sur font awsome, il propose que de telecgarger tt un dossier

[@karimachoui9198]

sinon inscrit toi tu donnes ton email et ils te donnent un script et c'est réglé

[@jamilaabela6013]

@@karimachoui9198 ok merci 😊😊😊

[@frenchcoder-developpementw2429]

Le voici :

[@raphaelLM92]

salut ! Je suis un peu en galère, je voulais savoir comment mettre le titre ex: (short nike) en dessous et au centre de l'image associée au titre ? Merci d'avance :)

[@frenchcoder-developpementw2429]

Salut ! Et bien tu peux regrouper ton image et ton titre dans une même div et centrer ton text en faisant un text-align:center; en CSS

[@raphaelLM92]

@@frenchcoder-developpementw2429 je peux l'appeler n'importe comment la div ?

[@frenchcoder-developpementw2429]

@@raphaelLM92 Oui bien sûr

[@raphaelLM92]

@@frenchcoder-developpementw2429 Merci à toi, j'ai réussi :)

[@frenchcoder-developpementw2429]

@@raphaelLM92 Je t'en prie :)

[@Creativprod973]

Bonjour merci pour la vidéo mais j'ai un soucie je n'arrive pas aligner les images et j'ai regarder le code sur le lien ila été bien copier (j'ai mi mes images perso pouvez vous m'aider svp

[@pasteque_man4492]

peut le texte est trop long

[@hamoudbouu5957]

salut je fait tout comme vous mais pour quoi je trouve pas heart et chopping meme si je fait copie coller merci

[@Azmogexe]

est ce que tu pourrais faire une vidéo sur comment faire une boutique complete avec la possibilité d'acheter des éléments et de contacter par mail etc

[@simpleman1496]

pourquoi vous avez utilisé les balises p au lieu de li dans la nav et footer?

[@issadiol181]

Svp ce je comprend pas est si on clic par sur nouveautés où homme on tombe sur quoi?

[@nahmanmubashar6773]

Bonjour merci pour ce tuto il est au top j'ai juste un petit souci au niveau des images les images j'arrive pas à les mettre cote a cote j'ai bien mit un display flex et un flex wrap wrap j'ai tous fait comme tu as montré dans la vidéo et à ce niveau la je séche si tu peux m'aider ça serait cool ;)

[@frenchcoder-developpementw2429]

Si tu enlèves le flex-wrap:wrap ça fonctionne je suppose ?

[@Lebardesdevsoff]

@@frenchcoder-developpementw2429 nop ^^

[@lafaucheuse29bzh75]

bonjour la position position:sticky; ne fonctionne pas peu ton la replacer par autre chose. merci vidéo génial

[@DarwoN16]

Salut la video est super mais j'ai un probleme les cartes sont en colone et pas en ligne comment faire

[@EmilioPULS]

moi aussi je comprend pas

[@tourecherif7310]

Super

[@hinatashoyo765]

merci ! :)

[@louiscorvest3811]

quel est le logiciel de codage merci d avance

[@frenchcoder-developpementw2429]

Hello, j'utilise Visual Studio Code :)

[@manschebani8586]

Merci beaucoup monsieur, vous m'avez vraiment aidé ❤️ Mais comment créer une autre page (homme par exemple) liée à cette page qui présente on dirait un accueil Sachant que je suis débutant. Répondre moi svp 🙏🙏

[@frenchcoder-developpementw2429]

Hello, merci pour ton commentaire qui fait plaisir ! Pour créer une autre page, il te suffit de créer un autre fichier à côté de celui qui est déjà présent que tu nommes par exemple "home.html" et tu écris ton code pour cette page à l'intérieur. Ensuite, dans ton fichier principal où tu souhaites lier la page que tu viens de créer, il te suffit de mettre un lien par exemple dans la barre de navigation, qui redirige vers le fichier que tu as créé. Par exemple : Page d'accueil En espérant avoir répondu à ta question :)

[@manschebani8586]

@@frenchcoder-developpementw2429 oui exactement merci.

[@frenchcoder-developpementw2429]

@@manschebani8586 Je t'en prie

[@Faus0]

Bonjours, comment voyez vous l'apercu du site en meme temps que vous coder svp ?

[@B-bot_Obsolete]

Bonjour à tous, je voudrais savoir s'il vous plaît comment créer la balise font awesome, merci

[@laminebaba8286]

salut la bibliothèque Font Awesome ne marche pas . Pouvez-vous m'aider

[@sachad5175]

Bonjour; quel site utilise tu pour développer

[@djedidisabrina2191]

Merci pour votre vidéo elle m'a aidé et maintenant je veux un nom de domaine gratuit comment pourrais-je le faire ? Est ce qu'il y a une formation ?

[@frenchcoder-developpementw2429]

Hello ! Je n'ai pas encore fait de formation à ce sujet mais tu peux utiliser des hébergeurs gratuits comme 000webhost of Infinityfree

[@djedidisabrina2191]

Bonjour Merci beaucoup, c'est très gentil de votre part

[@MANGATECHNOLOGY]

Vous écrivez ce code avec quoi comme logiciel, comment le faire sur PC ??

[@abdoumoumene2864]

bon travail Parce que ce site recevra-t-il des clients et achètera-t-il et vendra-t-il ?

[@Yankee013]

merci beaucoup

[@roxanap6969]

Bonjour pouvez nous dire comment integrer un slide pour les cartes ?

[@rastaboy6626]

merci bcp vrm

[@guesselvdt1288]

Bonjour j'ai besoin d'aide je cherche un codage pour cree mon site html qui peut m'aider

[@championneroyale9860]

Mais moi je n'ai pas le logo coeur et shop qui s'affiche que faire ?

[@frenchcoder-developpementw2429]

Vous êtes sûre d'avoir bien importé la bibliothèque Fontawesome correctement ?

[@rimelinteligente4786]

Quel app vous utiliser pour ecrire les codes