html-css

[icy whale]

Si tu veux je suis dispo pour voc

[distant thorn]

Dsl je ne peux pas mais a l'avenir 😁

D'ailleurs, tu t'y connais pour faire un système de login ?

[icy whale]

Oui bien sûr !

[distant thorn]

Waouh ! Trop cool est ce que tu pourras m'expliquer car je m'y connais vraiment pas ?

[distant thorn]

Ce serait un système assez simple pas un truc dur

[icy whale]

Oui il y a pas de soucis !

[distant thorn]

Tu peux m'add ?

[formal fox]

@distant thorn #php

[distant thorn]

Oui ?

[pseudo sundial]

Si tu veux faire un systeme de login tu peux commencer à faire du backend avec des langages comme php, java(pour le micro service mais ca c vrm plus tard tkt) , je te conseil d'apprendre d'abord javascript, cel va te permettre au niveau du front end de faire bcp plus de choses, par exemple si tu affiche une liste de service, tu poouras proposer a l'utilisateur de les filtrer etc avec du code qui s'execute sur le navigateur et plein d'autre chose, en suite apprend php si tu veux, en fait javascript te permettra ensuite de travailler avec des librairies, framework bcp plus professionel au niveau du frontend, puis php, java, node js pour le backend, si un jours tu veux voc je suis tjr dispo

[distant thorn]

Je vais utiliser firebase, c'est simple rapide et secu

[formal fox]

Si t’es entrain d’apprendre je te conseille d’apprendre comment ça marche vraiment et de le faire toi

[valid ibex]

Bonjour à tous,
J'apprends actuellement à coder mon premier site web et, depuis deux jours, j'ai un problème avec un bouton personnalisé utilisant la fonction hover. En parallèle, j'ai ajouté un effet scroll pour obtenir un effet particulier sur les images.

Le souci, c'est que je dois placer ce bouton sur une image, et il faut qu'il reste au même endroit lorsque je passe sur un smartphone. J'ai essayé d'utiliser des media queries, mais ça ne change pas grand-chose.

Si vous avez des idées pour m'aider à régler ce problème, ça m'aiderait beaucoup ! Merci d'avance !

[formal fox]

Il nous faut le code :)

[valid ibex]

effectivement c'est peut-être mieux avec le code X)

[clear escarp]

Il y en a qui conseillerai de supprimer système 32 (humour)

[valid ibex]

En HTML, j’ai créé un conteneur pour regrouper toutes mes images, et j’y ai ajouté un bouton. Cependant, j’ai l’impression que mon bouton est considéré comme une boîte (box) indépendante. Comment pourrais-je faire pour lier mon bouton directement à l’image, de manière à ce qu’il soit « fixé » sur celle-ci ? J’espère que c’est clair.

[olive wind]

Si tu veux que ton bouton soit fixé au dessus de l'image.
Tu peux le mettre en position absolute et mettre la div parente en "relative" pour que le bouton se place en fonction de celle-ci

[valid ibex]

ça marche je vais essayer ça merci !

[limpid wren]

Salut tout le monde !
Je suis étudiant et j'ai un projet de crée mon portfolio ( et j'ai comme objectif perso de le mettre en ligne par la suite )

Quelqu'un serait disponible pour vocal vers 13h ?
Pour vérifier mon "code" et me donner un coup de boost ?

[compact glen]

Bonjour, as-tu un GitHub avec ton code dessus ?

[limpid wren]

Absolument pas, mais je peux faire un live share ( l'extension de Microsoft ) si ca te convient ?

[compact glen]

Faut un dépôt sur GitHub pour que j’analyse

[limpid wren]

Tu peux me donner ton nom github s'il te plaît ?

[formal fox]

hello, tu veux regarder ca en vocal ?

[limpid wren]

Je veux bien ahah

[formal fox]

Je suis chez moi dans environ 30 minutes

[limpid wren]

Ca marche ! Merci à toi

[void anvil]

Bonjours les amis quelqu'un de chaud en html/css de dispo?

[shrewd marlin]

demande ici

[limpid wren]

Salut !
J'ai une petite question sur les grid css !
Je vous invite à regarder le screen, pouvait vous m'expliquer pourquoi:

grid-column: 4/6

et pourqoi cela ne fonctionne pas:

grid-column: 4/5

Merci d'avance pour votre aide :)

[pliant pasture]

Hey je suis un débutant dans le monde du développement et j'aimerai apprendre le langage web pour commencer html css et par la suite python et JavaScript je voulais savoir par où vous aviez commencé et si vous avez des conseils à me donner

[ionic aurora]

Est-ce qu'il y a quelqu'un ici qui peut m'aider ? Svp

[dapper grotto]

@ionic aurora Dans ta balise H2, ton texte "Photos de chats" tu l'as tapé volontairement de cette façon où c'est une traduction automatique qui s'est faite ?

[ionic aurora]

traduc

[restive fog]

Ah oui sont auto trad j'y avais pas penser a ça ptdr

désactive ton auto trad et retest avec le code en full anglais

[dapper grotto]

Ouais bah ça vient sûrement de ça 👀 Et manifestement ça affecte aussi le truc quoi

[dapper grotto]

💀

C'est pas mal FreeCodeCamp

[restive fog]

mdrr

[ionic aurora]

Ça se fout de ma gueule ouuuuuuuuuu

[restive fog]

test ça

<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Le titre</title>
</head>
<body> 
    <h1>CatPhotoApp</h1>
    <h2>Cat Photos</h2>
    </body>
</html>

[dapper grotto]

Et c'est quoi ça le H1 ? C'était par défaut ?

[restive fog]

peut-être la structuration html et je pense que le h1 c'est la step précédente

[dapper grotto]

Ok ouais

[ionic aurora]

yes

[ionic aurora]

c'est bon ?

[restive fog]

yes

[ionic aurora]

sa ne marche pas

[restive fog]

bas wtf

ah il manque un h

a la fin de la balise h2

[ionic aurora]

ouiii !!!!

sa marche

Mais du coup le problème maintenant c'est que je pense que free code camp aurait dû m'expliquer ça avant de me dire de faire ça non ?

[restive fog]

Je ne sais pas du tout comment fonctionne FreeCodeCamp mais logiquement oui il aurait dû te dire de respecter la structuration HTML après c'est une question de logique mais bon, je pense qu'il aurait pu l'indiquer surtout si c'est un "cours" pour les débutants qui n'ont jamais touché au langage

[ionic aurora]

Mais toi comment tu as appris html et java

???

[restive fog]

Youtube principalement pour le java (même si j'en fait plus et que j'ai fait que du Minecraft) après toute la parti web (udemy, video, documentation)

[ionic aurora]

ook

[clear escarp]

Yo je sais que ça peut en choquer plus d'un mais est-ce que le code que génère webflow est relativement potable ?

[limpid wren]

Salut !
J'ai une petite question sur les grid css !

[pliant pasture]

je commence aussi hehe

[restive fog]

pose t'as question bg

[pliant pasture]

@restive fog

[restive fog]

ça ne fonctionne pas parce que grid-column: 4/5; ne prend qu'une seule colonne alors que Grid Garden attend que l'élément en occupe deux, donc grid-column: 4/6; fonctionne car il couvre bien deux colonnes (de 4 à 6) enfin si j'ai bien compris t'as question 🤣

[ionic aurora]

hehe

[pliant pasture]

je viens de finir le cat app et il explique a la fin la structuration de html

je suis en qwerty j'ai pas les accents desole

[sterile vault]

Il n’y a pas les accent sur qwerty ?

Bon bas merci haha je comptait prendre un nv clavier mais il est dispo que en qwerty

[pliant pasture]

nop

je le mets en qwerty pour coder

sinon azerty je connais les touches par coeur

[sterile vault]

Ah okk je vois

Merci

[pliant pasture]

np

[restive fog]

mais c'est complétement con ça 🤣

[pliant pasture]

oui ptdrr

[restive fog]

en qu'elle année t'explique la structuration d'un langage a la fin ? genre t'as aucune notion, aucun concepte il te passe des exos a faire sans t'expliquer les bases de l'html genre fait moi 3 balise h de taille différente:

<h1>t</h1>
<h2>t</h2>
<h3>t</h3>

voilà exo fini a bas pk ça fonctionne pas

[pliant pasture]

apres la structure est prefaite dans casi tous les logiciels de codage

[pliant pasture]

pour qu'on fasse tous l exo

lol

tous les exos

[restive fog]

Oui sauf que sans t'expliquer la base en sachant que t'es sur leur interpreteur / "ide"

[pliant pasture]

hm

[restive fog]

c'est un peu con d'expliquer la structure de l'html à la fin en sachant que tu arrives sans le savoir de base, que tu as leur propre ide donc pas de structure initiale enfin, c'est que de la déduction pour le coup jamais utilisé FreeCodeCamp

[pliant pasture]

tu conseilles quoi?

code qu on a apres l exo du chat

[restive fog]

Bas là va falloir me donner du contexte mdr parce que tu veux des conseils à propos de ?

[pliant pasture]

Pour apprendre le dev web

Html css ect

[viscid kettle]

Si tu veux faire petit à petit c'est pas pour faire de la pub mais tu as grafikart qui est vraiment sympa

[restive fog]

En vrai t’as plein de ressource comme Grafikart, YouTube et Udemy après c’est juste de l’apprentissage continu (refaire des sites existants, tester des trucs) perso, c’est comme ça que j'ai apprit mais ça dépend de comment t’aimes apprendre après soyons honnêtes, HTML/CSS pur c’est bateau à apprendre donc YouTube suffit largement

[pliant pasture]

ouii il est connu nonM

?

[pliant pasture]

https://www.udemy.com/share/101LjG3@zDyLP1Ld_Fub0eVeZukQWLM4LLB4W0tpld25XeUMtlGaTbY_YTLncfmrZkc4kPAICA==/

ca suffit ?

[viscid kettle]

oui

[restive fog]

Suffit ça dépendra de toi mais ça l'air pas trop mal pour voir les bases

[pliant pasture]

pour pouvoir faire un site de

de la creation a la fin

désolé je viens de remettre mon clavier en azerty prcq ça m'horrifie de voir mon écriture sans accent ect

[limpid wren]

Yes merci !

[lime vector]

Si, il y en a

[lime vector]

Ça devrait suffire mais tout dépend du type de site que tu veux créer, en fonction des fonctionnalités principalement. Si par exemple c’est juste un site statique qui affiche des informations (comme un peu le tuto que t’as montré) y a pas forcément besoin de plus, mais si c’est dynamique, il y aura besoin de plus

[pliant pasture]

Et pour avoir ce plus tu sais où je pourrais le trouver après avoir fini cela ?

[restive fog]

Mais zebi

Discord vraiment de la merde

@pliant pasture
Udemy, youtube, openclassroom ect

Pour faire udemy je te conseillerais ce cours si qui te permet de toucher à toutes les bases de conception d'un site web (html/CSS en passant par le dynamisme JS puis en terminant par la logique backend php, pdo ect

https://www.udemy.com/course/formation-developpeur-web/?couponCode=LETSLEARNNOW

Et bas putain obliger d'envoyer 10 fois le message pour qu'il s'envoie j'adore ma vie

[wild stump]

pas sur :

• JQuery c'est mort
• Bootstrap est en train de mourir
• php est sur le déclin
• wordpress est sur la même pente que php

Ce cours aurait été pas mal il y a 5ans, mais le web ayant évolué je ne suis pas sur que le meilleur plan soit d'apprendre du php et du jquery. Il vaut mieux suivre les tendances pour pouvoir évoluer avec, plus qu'en retard. Selon moi le meilleur parcours pour apprendre c'est plus
HTML/CSS => JS => node/npm => react / vue => tailwindcss (ou autre lib de style) => server node js natif (juste pour comprendre) => express (api rest, server socket, SSE, push, les autres trucs RTD) => base de donnée relationnelle (si possible SQL based : pg, maria, ...) => framework back et front (next / remix / vue) => de l'authentification avec du JWT et de provider => bdd non relationnelle (pas mongo par pitié) => ORM (pas prisma vu que c'est pas un orm, plus des trucs style objection avec knex) => WebRTC => les bundler => pwa

[restive fog]

Ah oui PHP est mort, Bootstrap aussi et bientôt HTML sera remplacé par du JSON non sérieusement, je veux bien qu’on suive les tendances, mais faut éviter de confondre ‘moins hype’ et ‘plus utilisé’ mdr.

D’autant plus que PHP alimente encore 70% du web, Laravel est l’un des frameworks les plus utilisés (sans compter Symfony), et Bootstrap reste un standard dans l’industrie les tendances évoluent, certes mais enterrer trop vite certaines stacks c’est ignorer la réalité du marché 🤣

Et pour jQuery c’est sûr que pour un nouveau projet moderne, on évite de l’utiliser surtout avec l’arrivée de frameworks comme Vue, React et des API natives bien plus performantes mais de là à dire que c’est mort… jQuery est toujours massivement utilisé dans des millions de sites et applications legacy il reste maintenu et plein de projets en production l’embarquent encore ce n’est pas parce qu’une techno est moins hype qu’elle a disparu du paysage tech 🤣

[viscid kettle]

petite parenthèse, je rentre pas dans le débat, mais pour ceux qui veulent justement un peu les "tendances" (côté js) => https://risingstars.js.org/2024/en
après les tendances peuvent être éphémères donc à user avec précaution

[limpid wren]

Pourquoi wordpress est en train de mourir ?

[wild stump]

oui enfin il prennent -1 % par an, les grosses entreprises passes pour la plus part sous du js, PHP est encore très utilisé par tout les idépendants qui font des sites avec php vu que la plupart des cms sont fait en php, mais maintenant qu'il commence a y avoir des CMS js les CMS PHP commence a perdre en popularité. pour php un des meilleurs signes de ça est que depuis la 5.6 il y a de moins en moins de sites qui paraissent sur les nouvelles versions de php (le premier graph c'est 2024, le deuxième 2016). Statistiquement php est viellissant. il y a de moins en moins de sites qui sont fait avec php, donc pourquoi apprendre ça alors qu'il y a des chances non négligables pour que d'ici 5 ans (la durée d'un cycle d'étude supérieur liscence + master) ait encore réduit de moitié.
Pareils pour bootstrap, bootstap est encore beaucoup utilisé parce qu'il a été utilisé longtemps mais contrairement a ce que tu dis c'est loin d'être encore un standard, il y a de plus en plus de lib de composants, qui sont plus lights que bootstrap, qui sont de plus en plus utilisées, les seuls a encore vraiment utiliser bootstrap sont les gens qui font des sites a bases de templates, si pour toi des sites a 6k c'est l'industrie alors oui effectivement c'est toujours un standard.
Jquery toujours la meme choses, et les entreprises fuient jQuery prcq ils ne trouvent plus de dev. Donc pareils c'est en train d'être abandonné.

Je ne dis pas que c'est des technos dégueux, je dis juste que le marché est tendu, c'est de plus en plus difficile de trouver du taffes, donc autant apprendre des techno qui ont une popularité grandissantes que des technos qui sont en train de ralentir ou d'être abandonné

[limpid wren]

Ah ! Donc les cms ne sont pas en train de mourir ? ( C'était trop beau ahah )

[wild stump]

c'est moyennement vrai, mais globalement le gros du web c'est des pelos random qui font leurs sites sur des CMS, et avant le seul potable était wp mais maintenant vu que les gens installe des trucs modern, bah ils installes de plus en plus des CMS js

[wild stump]

non, ça marches du feu de dieux

[restive fog]

Je vois ce que tu veux dire mais tes arguments sont un peu biaisés PHP a certes perdu en hype par rapport à Node.js (c’est un fait), mais il alimente toujours 70% du web, et Laravel/Symfony sont loin d’être morts. WordPress, qui tourne sur PHP, est encore la solution CMS dominante (40% des sites).

Quant à Bootstrap il reste massivement utilisé en entreprise, même si Tailwind/MaterialUI prennent de la place dire que seuls "les gens qui font des bases de templates" l’utilisent c’est une simplification

jQuery, oui ce n’est plus recommandé pour les nouveaux projets modernes mais il reste utilisé dans des millions de sites **legacy **et en entreprise "Les entreprises fuient jQuery" ? pas vraiment elles l’utilisent encore dans des projets qui tournent depuis 10 ans mais comme tu l’as dit de moins en moins de nouveaux développeurs apprennent ces anciennes stacks, et c'est bien dommage.

Enfin le marché de l’emploi est tendu pour toutes les technos PHP reste un choix viable en entreprise notamment dans le e-commerce, les CMS et les apps métier penser que PHP, Bootstrap et WordPress vont disparaître sous prétexte que les alternatives existent, c’est une mauvaise lecture des tendances

[sterile vault]

Et html alimente 100% pourtant de moins en moins utilisé 🤷‍♂️

[pliant pasture]

Merci beaucoup 🙂

[clear escarp]

Est-ce que vous connaissez un site web qui contient des éléments pour un site web comme celui-là à peu près : https://ui.aceternity.com/components mais juste en html CSS et JS (je sais pas si ça existe genre sans utiliser react)

[restive fog]

https://uiverse.io/

[clear escarp]

Azz merci

[upper gust]

bonjour j'ai un problème en html css que j'arrive pas a résoudre quelqu'un peut m'aider ?

[clear escarp]

C'est quoi ton pb ?

[upper gust]

c'est avec un div qui ce met pas correctement

elle ne prend pas toute la largeur de la page

[clear escarp]

Si une <div> HTML ne prend pas toute la largeur de la page, voici plusieurs solutions que tu peux essayer :

1. S'assurer que la largeur est définie à 100% : Par défaut, une <div> est un élément de bloc, mais il peut y avoir des marges ou des styles affectant sa largeur. Tu peux définir sa largeur à 100 % avec CSS :

.ma-div {
width: 100%;
}

2. Supprimer les marges et le padding : Si la <div> a des marges ou des espacements internes qui l'empêchent de s'étendre complètement, tu peux les réinitialiser :

.ma-div {
margin: 0;
padding: 0;
width: 100%;
}

3. Vérifier la propriété box-sizing : Si la propriété box-sizing est définie sur content-box, la largeur de la <div> peut ne pas inclure les bordures et le padding. Pour inclure le padding et les bordures dans la largeur totale, tu peux utiliser box-sizing: border-box :

.ma-div {
box-sizing: border-box;
width: 100%;
}

4. Vérifier le conteneur parent : Si la <div> est dans un conteneur parent, vérifie que le conteneur a bien une largeur de 100 %. Si le parent a une largeur fixe ou limitée, la <div> peut en hériter.

5. Vérifier les éléments flottants ou position : Si la <div> ou ses éléments enfants utilisent des float ou ont des positions absolues/relatives, cela peut affecter son comportement. Dans ce cas, tu peux essayer de remettre à zéro le flottement avec clear: both ou ajuster les propriétés position.

Si après tout cela le problème persiste, n'hésite pas à partager ton code pour que je puisse t'aider à diagnostiquer plus précisément le problème !

Oui c'est pas bien je fais avec chat gpt

T'a trouvé ?

[upper gust]

yes

j'ai juste rajouté ,body après html

j'ai envie de pleurer 3h que je suis dessus

et j'ai supprimé display: flex;

[clear escarp]

Ok

J'apprends le web dev c'est compliqué qq mm

[upper gust]

j'apprends aussi, c'est compliqué effectivement

après a force de pratiquer j'y arrive de mieux en mieux

[clear escarp]

Le projet est trop gros pour mon niveau en web dev

[upper gust]

lequel le mien?

[clear escarp]

Je vais peut être faire ça aussi

[clear escarp]

Tu veux faire quoi ?

[upper gust]

après moi j'ai pris des cours et franchement ça fait une grande différence

[upper gust]

CRM

[clear escarp]

Moi aussi mais il y a un peu longtemps

[clear escarp]

Stylé

[upper gust]

un CRM lié à Vinted, donc pour un débutant comme moi j'ai encore des heures d'apprentissages

je suis pas sorti...

[clear escarp]

Ça à l'air cool

[upper gust]

yes je vais faire de mon mieux !

et toi tu es sur un projet ?

[clear escarp]

Oe une "big" école en ligne DCP faut je fasse des programmes pédagogique (ça va être long lol)

[upper gust]

je connais rien en développement a part quelques trucs sur le web du genre html css js

mais ça a l'air trop sympa

[clear escarp]

Pareil 😂

[upper gust]

mais oui beaucoup de temps a investir mdrrr

[upper gust]

franchement c'est une vraie torture à la moindre erreur

[clear escarp]

Met copilote de GitHub sur ton visual si nn

[upper gust]

comment on fait ?

[clear escarp]

C'est un plugin (il peut modifier des bout de code corriger des erreurs et corriger le code plein de trucs)

[upper gust]

ça a l'air sympa

[clear escarp]

Ça peut aider un peu en dev

[formal fox]

Fais gaffe y’a des règles sur les réponses avec l’ia

[clear escarp]

Est-ce que vous connaissez un plugin vs code pour avoir un aperçu de ce que l'on code en temps réel (ou à chaque sauvegarde) mais vraiment intégré sur vs code

[clear escarp]

Du genre ?

[nova iron]

Lance un Go Live et tu auras un mini serveur web avec une mise à jour instantanée

[restive fog]

Live Preview ou Live Server (de Ritwick)

enfin live server il me semble que sa use un client web externe

[clear escarp]

Oui je connais celui-là c'est pour ça je cherchais un truc sur l'App c'est plus pratique. Je vais voir ce que vous avez dit

[nova iron]

Live Preview alors

Si tu veux que ça reste vraiment dans VSCode

[clear escarp]

Ça télécharge!

Merci les BG

[nova iron]

Crazy

[clear escarp]

Wa ça marche grv bien

[formal fox]

Du genre c’est interdit

[clear escarp]

De la transmettre ?

[formal fox]

Oublies c’est pas écrit dans le règlement

J’avais vu des gens se faire prendre la tête à cause de ça

Mais visiblement y’a rien à l’écrit donc c’est good

[nova iron]

Ils ont du temps à perdre visiblement

[clear escarp]

Où ?

[nova iron]

Nul part

[clear escarp]

Ouais il y a que le truc du plagiat mais j'ai bien cité

[formal fox]

Comment ça où ?

Ou c’est pas écrit ?

[clear escarp]

Il y a bien une réponse qui me vient en tête mais ça va pas passer

[nova iron]

Tkt, l'IA plagiat aussi ; )

[formal fox]

C’est dur à montrer ça

[clear escarp]

Ouais largement plus que moi 😅

[restive fog]

Un avis ? (page de test d'un framework css skeuomorphic que je dev)

[formal fox]

Bah c’est surtout que demander où n’est pas quelque chose ça offre un peu trop de possibilités de réponses

[clear escarp]

Juste faut faire gaffe. On n'est pas dans le bon salon

[nova iron]

Matrix

[formal fox]

Pas fan des ombres et l’épaisseur de la police dans les boutons

Après c’est le skeumorphisme qui veut ça je présume

[restive fog]

Oui

[formal fox]

Pareil pour les bordures et angles

[nova iron]

Toute la page quoi ?

[formal fox]

Non les couleurs sont bien

J’aime bien le noir et le blanc

[nova iron]

Mdr

[restive fog]

les grid ou les flex ?

[formal fox]

Le gris du désactivé aussi

Je parle juste de la bordure des éléments

Très sharp

[restive fog]

bas après y'a pas vraiment de page c'est que des composants de test

[restive fog]

Yes

[formal fox]

Puis ton élément tout en haut à une bordure et pas les autres

[clear escarp]

@restive fog tu as quoi comme plugin (pour le web je veux dire) ?

[restive fog]

oui il a un skeuo-rounded-lg que les div flex & grid n'ont pas en

[restive fog]

cad ?

[formal fox]

JetBrains ?

[restive fog]

yes

[formal fox]

Jamais fais d’html avec c’est bien ?

[restive fog]

webstorm pour tous ce qui touche au frontend

[formal fox]

Yes

[restive fog]

après en sois pour de l'html t'as pas grand chose en plus que d'autre IDE

[formal fox]

J’ai juste utilisé CLion et IDEA pour le moment mais je présume que pour certains framework y’a pas mal de choses d’intégrées

[restive fog]

Yes les suites Jetbrains sont vraiment au-dessus de tous les IDE (payants) parce que bon, en similaire free t'as VSC x) mais pas fan de leur UI

[formal fox]

Après ça dépend du langage je présume

J’ai beaucoup aimé VS pour le C#

VSC pas fan non plus ceci dit

De toute façon j’ai pas le droit d’utiliser autre chose que vim donc la course au meilleur éditeur est finie depuis bien longtemps pour moi

[restive fog]

en C# je pense que VS atomise le marché

[clear escarp]

Sur ton éditeur je veux dire

[restive fog]

Hormis Discord Integration (pour le richpresence) rien

[formal fox]

Mais c’est quoi que t’appelles des plugins web ?

[restive fog]

tous le reste c'est du default de jetbrains

[formal fox]

Genre sur VS y’a pas l’auto complétion et la coloration syntaxique ? 🧐

J’ai du mal à capter quel genre de plugins tu peux avoir

[restive fog]

sur jetbrains t'as pas mal de truc intéréssant chez VS idk

[clear escarp]

Genre live preview (genre on s'en sert pas trop pour faire des bot discord après why not)

[clear escarp]

Ah ouais en mode minimaliste

[formal fox]

Live preview c’est pas juste un ctrl+r ?

Si c’est le plugin qui refresh tout seul ta page web quand y’a un changement dans ton workspace ça peut être relou

Genre si t’utilises une base sqlite ca refresh le projet a chaque modif de la base

[clear escarp]

Nn perso ça marchait pas il était pas installé

[formal fox]

Hein ?

Ctrl+R était pas installé ?

[restive fog]

Bas perso j'ai besoin de rien d'autre je fait jamais d'html enfin

en vanilla je parle

[formal fox]

Ou live preview est nécessaire pour ctrl+r ?

J’ai pas compris le sens de la phrase

[feral mist]

L'avantage de la suite Jetbrains, c'est d'avoir des logiciels sur-mesure pour ton projet et d'avoir des outils natifs que VSCode ne proposent qu'en plugins

Mais encore heureux vu le prix que ça coûte

Merci l'université 👍

[formal fox]

Après c’est vite amorti

Entre le confort et le gain de temps

[feral mist]

Si c'est ton gagne pain c'est sûr

[formal fox]

Ouais vraiment, merci l’ingé mdrr

[feral mist]

Premier investissement que je fais le jour où j'ai mon diplôme

[formal fox]

Après sur un malentendu tu payes jamais

[restive fog]

bas en vrai pas si cher que ça

[feral mist]

Seul chose qu'est dommage, c'est qu'ils n'ont pas de bons outils pour certains langages comme Lua par exemple. Il n'existe que EmmyLua qu'est téléchargeable sur Intellij

[restive fog]

surtout que t'as license t'as accès a la totalité de leur logiciel

[formal fox]

J’ai toujours mon GitHub student de ma précédente école alors que j’y suis plus

[feral mist]

Banger

[restive fog]

🤫

[formal fox]

Bah ça va

C’est genre 15€/mois

[restive fog]

sur un léger malentendu sa part sur ||filecr||

[formal fox]

« Léger »

[clear escarp]

Oe mais c'est d'un coup

[feral mist]

Hop ça part dans mon bloc-notes ça

[formal fox]

Mdrr

[restive fog]

🤣

[clear escarp]

😂

[restive fog]

@formal fox build avec mon framework (doc du framework)

[formal fox]

Je préfère ce screen là :)

[restive fog]

ah bas le premier screen c'était vraiment une page de test de fonctionnalité x)

[clear escarp]

Généralement c'est autour de combien un site un peu compliqué à faire?

Ouais c'est un peu vague

[restive fog]

ça dépend ce que tu appelles compliqué

[clear escarp]

Genre des trucs de base (login sing up page d'accueil etc) avec un "panel" utilisateur avec des cours mais accessible que après achat

[restive fog]

D'acc pour ce genre de projet le prix peut varier en fonction de ce que tu souhaites si tu veux un développement from scratch ou si tu préfères utiliser un CMS comme WordPress ça peut influencer le coût par exemple, avec WordPress il existe des plugins qui gèrent ce que tu veux faire (il me semble), ce qui peut réduire le travail de développement

[clear escarp]

Un CMS c'est un peu pour gérer la base de données. C'est ça?

[restive fog]

Pour du from scratch, je dirais que ça peut varier entre 500€ et 3000€, selon les fonctionnalités que tu veux réellement.
Pour une version WordPress, avec des plugins et un bon paramétrage, ça pourrait tourner autour de 200€ à 1000€ en fonction du niveau de personnalisation et des extensions utilisées. (ce ne sont que mes estimations, ça peut coûter plus ou moins cher selon les prestataires et la complexité exacte du projet)

Et pour répondre à ta question sur ce qu'est un CMS c'est (vulgairement) un site préconstruit que tu configures et personnalises pour obtenir le résultat souhaité

[clear escarp]

Ok en vrai en tarif ça va (je vais pas mis aventurer non plus)

[restive fog]

Yes en vrai je me suis basé sur ce que ça coûterait si c'était moi qui devais le réalisé après comme j'ai dit, ça reste super variable selon les prestataires et les besoins précis du projet x)

[clear escarp]

Ouais bien sûr, c'était pour me faire un ordre d'idée 🙃

[formal fox]

J'ai plus vu des WP tourner autout de 1.500 en vrai

[sly abyss]

hello, je fait un site avec vue et j'utilise la balise v-html pour pouvoir afficher du contenu. Mais ca ne fonctionne pas (cf image). Le text s'affiche quand la page charge mais disparait quasiment instentanément. Pouvez vous m'aider svp

Story.vue :

<template>
  <section id="story">
    <h1 class="text-4xl font-bold text-center my-10">NOTRE HISTOIRE</h1>
    <div class="flex flex-col md:flex-row justify-around items-center gap-10">
      <StorySub
        v-for="el in StoryParts"
        :key="el.title"
        :title="el.title"
        :icon="el.icon"
       :content="el.content"
        >{{ el.content }}</StorySub
      >
    </div>
  </section>
</template>

Exemple de partie :

  {
    title: "Notre Origine",
    icon: "/originIcon.svg",
    content: `
      <p>En effet, dans le lore de notre jeu, <strong>Winter Architect</strong> est la faction la 
      plus importante. L'exploration de leurs (nos) locaux permet au joueur de 
      se rendre compte de l'étendue des secrets et des anomalies qui y sont 
      enfermés, ainsi que de l'étendue des conséquences qu'aurait cette 
      entreprise sur l'humanité si la moindre de leurs innovations venait à 
      s'échapper ou à être capturée.</p>
    `,
  },```

Composent StorySub:

<template>
  <div
    class="w-[25vw] bg-gradient-to-r from-pearl-bush-300 to-outer-space-950 p-[1.5px] rounded-3xl"
  >
    <div class="bg-[#1B2A31] p-5 rounded-[calc(1.5rem-1px)]">
      <div
        class="bg-outer-space-950 p-2 rounded-full w-[10vh] h-[10vh] flex items-center justify-center"
      >
        <img :src="props.icon" alt="icon" />
      </div>
      <h1 class="text-pearl-bush-300 font-bold text-2xl my-[2vh]">
        {{ props.title }}
      </h1>

      <p v-if="props.content" v-html="props.content"></p>
    </div>
  </div>
</template>

<script setup>
const props = defineProps(["title", "content", "icon"]);
</script>

[sly abyss]

c'est bon problème résolu cela venait du ssr

[wary forum]

Salut alors j'ai installer un template avec **vite ** en local host avec npm run dev sa marche très bien mais sur mon site en host je n'y arrive pas sa fait 2h que je galère quelqu'un peux m'aider svp ?

[jovial bay]

T'as quoi comme erreur ?

(C'est plus du js en catégorie je pense)

[wary forum]

ba enfaite j'en ait pas mais mon problem c'est sa c'est mon index.html :

<!doctype html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="UTF-8" />
    <link rel="shortcut icon" href="/favicon.ico" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta name="description" content="Admin Template and Starter Kit with React, Tailwind Components and Vite">
    <title>WavePanel</title>
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>

et en local sa march trés bien mais en host ( sur mon site ) ba j'ai une page blanche

[jovial bay]

Et t'as lancé un build en remote ou pas ?

[wary forum]

avc ssh ?

[jovial bay]

Oui

[wary forum]

oe

[jovial bay]

T'as un vps ?

T'as bien configuré ton serveur pour que ton url pointe sur ta page html ?

[wary forum]

oe nn j'ai bien fait normalement après je load le main tsx sur l'index.html de base et pas l'index du build dcp jsp si il y a un problème a ce niveau la

[jovial bay]

Yes config ton serveur pour charger ton dossier build en racine

[wary forum]

comme sa ?

[jovial bay]

J'aurai plutôt dit via apache ou ce que t'as comme serveur web sur ton vps

T'es sur hostinger j'imagine. Tu peux mettre le contenu de ton dossier build dans public_html/

[wary forum]

ba enfaite ce qui me dérange unpeux c'est que la c'est juste l'ui pr le dashboard et dcp js pas trop

dcp j'ai tt mis dans le folder dashboard pr l'instant ( public_html/dashboard/build )

[jovial bay]

Ah d'acc. Tu peux mettre le contenu du build dans le dossier dashboard dans ce cas

En gros t'as pas besoin du reste c'est le build qui va s'afficher

Sauf si tu veux garder tout le dossier pour faire des modifs à l'avenir mais tu dois faire en sorte que ça pointe sur ton dossier build

Jsp comment tu gères le routing de ton dashboard. Au lieu de lui dire de charger le fichier dashboard/index.html dis lui de charger dashboard/build/index.html

[wary forum]

mais dcp tt sa j'en fais quoi je peux le laissait la ?

( dans public_html/dashboard )

prcq ya des fichier tsx essentiels que j'ai besoin

pr le dashboard

[jovial bay]

En soit tout le reste ça sert juste quand tu feras des modifs à l'avenir et que tu voudras rebuild

[jovial bay]

Tes fichiers typescript sont compilés en js

Mais garde ton code dans un repo github ça a pas besoin d'être sur ton serveur

[wary forum]

je peux synchro un repo github et les fichier de mon site ?

[jovial bay]

Oui tu peux mettre en place github actions pour faire le déploiement de ton dossier build de manière automatisé (à chaque push par exemple)

[wary forum]

t'aurais pas une doc ou un truc comme sa pr sa stp ?

[wary forum]

cbon j'ai mis tout les fichier de build dans public_html/dashboard et j'ai supprimer le fichier build sauf que quand je vais dans le chemin du fichier sa marche toujours mais quand je vais dans l'url normal sa marche pas

[jovial bay]

Ici https://github.com/sitek94/vite-deploy-demo t'as des infos sur comment faire un deploy sur github pages. Toi c'est pas ce que tu veux donc faudra que tu modifies la fin et que tu fasses plutôt une connexion ssh et que tu mettes le build sur ton propre serveur.

- name: Deploy to GitHub Pages
    uses: peaceiris/actions-gh-pages@v3
    with:
      github_token: ${{ secrets.GITHUB_TOKEN }}
      publish_dir: ./dist
``` 👆 ça tu retires

Et tu peux utiliser ça à la place : https://github.com/appleboy/ssh-action

[wary forum]

Merci

[jovial bay]

T'as du mettre base : /build

[wary forum]

non justement c'est en base : './' c'est pour sa je ne comprend pas

[jovial bay]

Bizarre que ça t'affiche qqch si t'as supprimer le dossier

[wary forum]

oe bon pas si grave sa doit juste etre mon cache

ou le cache du site

[jovial bay]

yes sûrement, et ton script fonctionne ?

[wary forum]

oe mais il me reste a faire marcher tsx

[jovial bay]

T'as plus de tsx normalement si t'as build

[shut parrot]

C'est quoi le site pour prendre des templates CSS deja?

[robust obsidian]

des templates ?

jsp si c ça mais il y a uiverse.io

[shut parrot]

oui c'est ca merci

[hidden yarrow]

oui c sa

[lyric canopy]

Salut ! J'ai développé mon portfolio en html/css il y a quelques semaine, c'est le premier site que je fais et j'aimerais des retours concernant la structure, le style etc (j'ai n'ai pas encore fais de responsive, c'est en cours) Merci beaucoup ! https://www.chrisgraph.fr

[clear escarp]

En vrai mis à part le responsive c'est cool

[lyric canopy]

C'est gentil merci, c'est mon premier site, j'ai oublié de le préciser

Si vous avez des critiques à me faire n'hésitez pas! Ça m'aidera a m'améliorer

[meager beacon]

étant donné qu'actuellement je ne suis que sur pc, je n'ai que le responsive à citer comme remarque
mais je te dirai mon point de vue dans une heure quand j'aurais accès à ton site sur pc

[lime vector]

c'est dommage que pour les avis, il n'y ait pas quelque chose pour défiler et voir les autres avis et le bouton qui permet de monter tout en haut est tout le temps visible, c'est un peu déstabilisant, mais sinon le reste je trouve que c'est globalement propre

[lyric canopy]

Merci beaucoup !

[lyric canopy]

Oui, je n'ai pas encore réussi à comprendre correctement le JS pour réussir à faire quelque chose de propre, et pour le bouton qui amène en haut je vais essayer de trouver la solution, merci beaucoup !

[clear escarp]

C'est pas du JS ça (enfin perso je fais ça sens JS)

[lyric canopy]

A ouais ? Seulement en html css ?

[clear escarp]

Je pense qu'on peut le faire en JS

[lyric canopy]

Si je peux les faire sans JS, je vais essayer, ca s'appelle bien des sliders ? (J'aimerais que ça glisse l'orque l'on change d'avis)

[lime vector]

je trouve ça plus pratique de faire les sliders avec JS

y a tout pleins de tuto dessus en plus

[lyric canopy]

Oui j'ai suivi quelques tuto, mais j'avoue que c'est le JS que je ne comprend pas forcément, mais je vais trouver ! Merci beaucoup 😄

[meager beacon]

Voici quelques améliorations que je pourrais te conseiller :

• Comme déjà dit afficher le bouton qui remets au début uniquement à partir d'un certain moment
• Réduire le footer, car par exemple si on va dans la page d'un des projets, il n'a pas la même largeur (et ça me saoule, après c'est très perso mais voilà)
• Faire des petites transitions, par exemple que les différents "onglets" sont survolés (au lieu du changement de couleur brut) ou au survol du langage
• Pourquoi pas mettre ton logo au début en plus grand, car je le trouve un peu petit (il faut t'imposer)
• Aussi déjà dit mais la possibilité de scroll pour voir les différents avis seraient super

Je pense que c'est déjà pas mal, mais ton site est vraiment très propre surtout pour un premier site, gg !

[clear escarp]

@lyric canopy si tu veux, il y a aussi univers c'est un site web avec plein de petits objets déjà fait

[meager beacon]

c'est uiverse.io le site

[lyric canopy]

Incroyable, merci beaucoup pour votre aide !

[clear escarp]

Ouais j'hésitais entre io et com 😂

[meager beacon]

(t'as surtout écrit univers mdr)

[clear escarp]

Parce que j'ai toujours lu ça 😂

[meager beacon]

c'est justement ça le jeu de mot mdrr, mais tqt pas de soucis

[clear escarp]

Bonjour, est-ce que c'est la bonne méthode de refaire entièrement le CSS d'une page pour chaque taille de responsive ?

Je refais tout ici
}

Exetera jusqu'à arriver au PC```

[woeful granite]

Oui effectivement !

[brave jay]

Non c’est pas bien, tu dois faire que ce dont tu as besoin, modifier les classes de taille par exemple

[clear escarp]

Ahah la contradiction

[restive fog]

Non pour faire simple tu doit d'abord faire ton CSS en mobile first ensuite les media query servent uniquement a adapte certains éléments aux différents écrans

[clear escarp]

Je crois que j'ai enfin compris

[restive fog]

Ça évite de dupliquer le code et ça rend tout plus facile à maintenir aussi, pense à utiliser flexbox ou grid, ça aide énormément pour adapter le layout sans trop de media queries

[clear escarp]

Le truc c'est que si je passe de mobile à PC il va falloir que je touche tous les éléments pourtant tout le monde dit que c'est beaucoup plus simple téléphone to pc

[restive fog]

en vrai, avec une approche mobile first, tu ne touches pas tous les éléments quand tu passes au PC l'idée, c'est que tu écris d'abord un CSS de base qui fonctionne bien sur mobile (avec des tailles flexibles et un layout simple) ensuite, tu ajoutes juste quelques ajustements pour les écrans plus grands avec des media queries.

Ça évite de devoir "refaire tout" et rend le code plus propre et plus facile à maintenir

Exemple :

/* Base (mobile par défaut) */
.container {
    display: flex;
    flex-direction: column; /* Empile les éléments sur mobile */
}

/* Sur écran plus large (PC) */
@media (min-width: 1024px) {
    .container {
        flex-direction: row; /* Mets les éléments côte à côte */
    }
}```

Au final tu aura moins de travail car le mobile sert de base, et tu fais juste des ajustements pour les écrans plus grands plutôt que de tout redéfinir 🫣

[clear escarp]

Ok je vois un peu l'idée mais j'ai pas assez le niveau pour faire ça

Merci bg

[pseudo sundial]

Vrm tkt suffit de s’entraîner et ça le fait, n’ai pas peur de pas avoir le niveau, essaye, fait le

[clear escarp]

oe je vais faire les 2 en mm temps

[deep mountain]

question, quelqu'un à une idée de comment je peut animé un background avec des gradients ?

j'essaye de faire une sorte d'effet de respiration smooth mais c'est trop brutal les changements si j'utilise keyframe

[icy whale]

Oui, utilise du js

ou bien regarde des librairies spécialisé dans les animations et les effets !

[feral mist]

Essaye de rajouter des étapes à ton keyframe peut-être, ça pourrait t'éviter à passer par du js

[limpid wren]

Salut tout le monde !
Petite question, j'utilise height 100vh et j'ai un élément en bas de page en version mobile à cause de en-tête de navigation je n'est pas min élément en bas du height. Auriez vous des informations pour palier à se problème ?

Mercia vous

[bitter sandal]

Tu peux lire cet article si tu veux https://www.digidop.com/fr/blog/comprendre-et-utiliser-unites-viewport-webflow-design-responsive

[frail pawn]

Bonsoir, qui pour m'aider s'il vous plait à indexer mon site ?

[frail pawn]

J'ai du mal avec les outils google en général

[clear escarp]

Tu est allé sur le premier lien déjà ?

[frail pawn]

www.google.com/webmasters/

Celui là ?

[clear escarp]

https://search.google.com/search-console/welcome?hl=fr normalement tout est expliqué ici 🤓☝🏼

[limpid wren]

Je vais lire ca merci

[tame forge]

Sinon tu peux simplement attendre 👀

[frail pawn]

Ah il suffit d'attendre pour qu'un site soit indexé ?

[tame forge]

Quand le crawler passera sur ton site il l'ajoutera

Je crois que tu peux accélerer le passage en incrivant ton site sur la search console, mais c'est tout

[broken parrot]

ta mis un sitemap?

[frail pawn]

oui

[frail pawn]

okk merci

[broken parrot]

ta un petit problème de responsive

[frail pawn]

je ne parlais pas de ce site mais https://deltastudios.fr, là où il y a une responsive ^^

[broken parrot]

Je sais mais je te préviens qd même

[frail pawn]

dans tous les cas, je compte entièrement refaire celui là

mais merci

[broken parrot]

oki

[broken parrot]

ça manque de détail

fin

de présentation

[frail pawn]

I know, je compte ajouter du contenu si c'est ce dont tu parlais

[broken parrot]

Okay

[fierce shard]

Salut !
On peux m'expliquer ce qui ne va pas là ?

[heady elm]

tout est indiqué

<style>
    .flex {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    }
  </style>
  
  <div class="flex">
  <!-- Les enfants de "flex" seront mis en mode "flex". -->
    <h1>Hello world!</h1>
    <p>Je suis un paragraphe...</p>
  </div>
<!-- etc.. -->

[fierce shard]

Mais je suis déjà en mode flex ! Pour l'élément et le parent.

[tame forge]

La preuve que non

[shrewd marlin]

comment faire cet effet ?

[tame forge]

Bonjour déjà,
et ensuite, tu devrais te renseigner sur des librairies comme https://lenis.darkroom.engineering/

Y'en a pleins d'autres bien sûr, juste que j'ai celle là de notée quelque par

[shrewd marlin]

yes déso, d'accord merci je regarde ça

yes ça fonctionne merci

[wild stump]

je sais que je suis le relou qui recommandes toujours d'autres outils mais pour le coup tu auras bcp plus d'aide avec des lib comme gsap,
globalement quand tu veux faire ce genre d'animation faut la décomposer :

1. il y a un effet de dé zoom :

• il est full screen,
• il te faut une image en ultra grosse qualité,

2. il y a le text :

• sa valeur en y augmente
• son opacité réduit a 0

3. tu fais ça en fonction du scroll

Donc en gros tu dois avoir une timeline sur la quelle tu dis a ton image de se réduire, et au text, de monter et de disparaitre, puis tu dois utiliser le scroll pour controller ta timeline

https://gsap.com/
https://gsap.com/docs/v3/GSAP/Timeline/
https://gsap.com/docs/v3/Plugins/ScrollTrigger/

il y a aussi d'autres tricks, comme le fait que le bord de l'iphone soit une image : superposé, ce qui permet de le faire apparaitre quand ils veulent

[thin merlin]

Bonsoir, es que quelqu'un sait regler ce problème d'aaparance captcha svp ?

[clear escarp]

C'est quoi le code ?

[thin merlin]

la pb viens pas de la première div

[restive fog]

Yo, vérifie si tu n'as pas des règles CSS (comme overflow: hidden, height, ou width) qui s'applique à la div parent ou à une autre div qui contiendrait le reCAPTCHA

[thin merlin]

j'ai retirer la 1ere div c'est pareil

[clear escarp]

Vous en pensez quoi de Google adsense ?

[broken parrot]

pour ?

[jovial tapir]

bonjour/bonsoir y aurait il des gens dispo pour m'aider sur un projet ou je dispose d'un hébergeur web ?

qui concerne un site

[clear escarp]

Dis-nous tout

[jovial tapir]

serait-tu disponible en voc si possible pour expliquer ce serait mieux ?

[clear escarp]

Perso je peux pas trop là

[plain haven]

explique ici un peux

[jovial tapir]

Je ne saurais pas plus expliquer par message

[jovial tapir]

je suis actuellement en voc

[clear escarp]

J'imagine que c'est pour garder son idée à lui

[clear escarp]

Au lieu de rendre, ça accessible à 14000 personnes, ils le rend. Ça accessible seulement aux personnes dans la voc

[feral mist]

En résumé: ça ne change rien

[clear escarp]

Si l'information est accessible une seule fois en vocal contre tout le temps pour du chat (oui les gens dans le voc peuvent tout dire)

On en parle quand même que je suis en train de défendre un truc aussi con 😂

[wild stump]

useless, l'ad block est devenu monnaie courrante donc tu vas pas gagner grand chose, et puis il y a des chances non négligables de se retrouver avec des pub chelou sur ton site

[remote cedar]

Bonjour.
J'ai supprimé des lignes dans mon CSS mais le navigateur (je suis sur firefox) continue d'afficher les styles que j'ai supprimé

• J'ai vidé le cache du navigateur ça ne change rien
• J'ai ajouté ?v=1 dans le path link du css ça ne change rien
• J'ai ouvert le html dans un navigateur privé ça ne change rien
• La case "disable cache" est activée dans l'outil dev

Y a t-il d'autres moyens de régler ça?

[agile helm]

Tu peux faire un ipconfig /flushdns

Tu peux aussi changer de navigateur

Firefox bug des fois c est frequent dans ce domaine ^^

[agile helm]

Hello, ça je le savais, mais je cherche une alternative, tu aurais pas d idées à tout hasard ? 😅

[wild stump]

Non, c’est globalement toujours les mêmes problèmes le seule moyen de faire de l’argent c’est les pubs pour les trucs nsfw pour les contenus consommés en navigation privée (en gros les pubs ça marche que sur les sites x).
Je ne connais pas ton projet mais la solution la plus simple c’est de vendre des trucs

Les pubs web c'est un des milieux les plus louches d'internet. Mon conseil c'est de rester le plus loin possible de ça

[remote cedar]

J'avais exactement le même problème en changeant de navigateur
Mais j'ai trouvé la solution ailleurs du coup, donc problème réglé, merci quand-même 👍

[agile helm]

Oui mdrr

[clear escarp]

Si tu trouves des trucs tu pourras me les partager (je trouve pas vraiment de truc un peu sympa j'ai quelques idées mais je recherche quelque chose pour bien compléter)

[agile helm]

faire une option premium x)

[clear escarp]

Oe c'est le projet pour l'instant mais je voudrais faire quelque chose d'un peu moins stupide que nitro (c'est pour ça que je voulais mettre des pubs)

[agile helm]

Hello, pour tout les dev qui galerent en css, j ai un exemple flagrant entre margin et padding :

margin-top: 150px;

padding-top: 150px;

je vous laisse constater ^^

[void anvil]

Est ce qu'il y a des dev spé front ?

[empty bough]

Nope mais pose direct ta question ça sera plus simple

[agile helm]

tu as besoin d'aide sur quoi ?

[void anvil]

J'ai pas de questions. Je veux juste voir ce que certains font de préférence des français.

[austere lark]

#1036572121683464222

[void anvil]

C'est plus généraliste non ?

Je ne suis intéressé que par des mecs qui se la mettent en front pour le coup.

[austere lark]

Tu peux utiliser les tags 👌

[valid estuary]

Hello!
Je créer en ce moment un site vitrine pour un projet et en cherchant de l'inspiration je suis tombé sur le site de bangumi, j'aimerais beaucup recréer cette effect sur le titre au chargement de la page mais malereusement j'ai peu de connaisance en développement web...
Quelqu'un saurait il me donner un idée de comment faire, une base ?
Je vous remercie d'avance.
Site de bangumi :
https://bangumi.fr
Mon site :
https://waves-studio.xyz

[shrewd marlin]

mais comment fait yt pour pas avoir de pub chelou sur YouTube ? car ils utilisent AdSense aussi

[clear escarp]

4 jours que je me pose cette question (j'imagine qu'il choisissent spécifiquement)

[shrewd marlin]

c'est presque impossible

[clear escarp]

Techniquement les 2 sont à Google

[wild stump]

C’est pas vraiment adSense, ils font un pré tri et vérifient manuellement les plus vue et celles qui passent en heures de pointe, mais si tu regardes le soir tu peux tomber très facilement sur des pseudo sciences et de la voyance (et pleins de conseils médicaux dangereux) et plus rarement sur du trafic de fausses monnaie (surtout dans les shorts) donc prendre YouTube comme référence pour des pubs saines je suis pas convaincu (pour rappel en 2019 il y avait des pubs qui faisaient l’apologie du terrorisme et des pubs pour de l’armement militaire)

Et puis on parle pas de toutes les formations pour devenir proxénète

Pardon manager of

[shrewd marlin]

après ça dépend aussi de ce que tu regardes, de ton sexe, et d'autres trucs si je me trompe pas

mais c'est chaud les pubs de 2019, je savais pas que y'avait eu ce problème 😂

[wild stump]

pas temps que ça vu qu'il y a de moins en moins de personnes qui acceptent les pubs ciblées. Et puis souvent sur ce genre de pubs il mettent la largeur du public cible au maximum plutôt que de cibler spécifiquement

[wild stump]

moi ce qui me dérange c'est que c'est devenu ok d'être proxénète

[shrewd marlin]

ouais c'est chaud mdr

imagine on te demande : "tu fais quoi dans la vie ?"

[wild stump]

"Je suis manager d'influenceuses qui produisent du contenu personnalisé"

[shrewd marlin]

HAHAHAH

mais aussi je trouve chelou que la prostitution est entre guillemets "autorisée"

pas proxénète mais de soi-meme

[wild stump]

en soit c'est pas temps un problème chacun fais ce qu'il veut de son corps la ou il y a malaise c'est quand il y a un intermédiaire

[shrewd marlin]

oui

d'accord avec toi

@wild stump ah bah tiens :
😂

[clear escarp]

C resonable encore

[storm relic]

yo je débute dans le code et j'ai un soucis d'allignement sur mon site avec un display:flex qui marche pas

[pseudo sundial]

Montre le code please

[storm relic]

quel partie ?

exemple ci dessus

dit moi se que tu ve voir je connais pas trop encore

[storm relic]

.

[raven mesa]

tu as bien link ton css à ton html et tu as bien mis ta classe sur ton élément ?

[pseudo sundial]

Frérot merci de me laisser dîner, jpp répondre comme ça au quart de tours, envoi ton html aussi, dans sa balise global

Comme le dit lm regarde si tu relis bien le css à html

[storm relic]

déso ct juste pour te tag

[pseudo sundial]

Ah merde tkt 😂

Envoie la partie html histoire qu’on fasse fonctionner ton code

[storm relic]

Ok jtenvoie sa ce soir

[brittle forge]

Quelqu’un m’aide pour faire un site bio link svp

[wild stump]

tu as besoin de quoi ?

[brittle forge]

Bio link

Jai fais une recherche

Mais comme d’hab dans 80% personne n’est professionnel

Ils postulent tous pour l’argent après ils répondent pas

🤣

[wild stump]

bah faut voir combien c'est payé

[brittle forge]

70

Juste pour être staff

J’ai fait 2 demandes différente une de 70

Et une de 60

Ils ouvrent une demande en mode j’ai écris argent gratuit

Ils croient qu’en postulant je vais envoyer l’argent

C’est pas comme ça que ça marche

[wild stump]

tu as essayé de mettre plus de détails dans ton offre ?

@brittle forge

[brittle forge]

Oui

Mais Prq ils ouvrent un ticket si ils ne comprennent pas

[wild stump]

Ton offre elle fait 3 lignes, normal tu trouves personne

[brittle forge]

2/13 personnes sont tellement intéressé

[brittle forge]

Mais

[brittle forge]

Regarde tout les truc ouvert

C’est juste des gens qui ouvrent pour rien

[wild stump]

Ton offres ne contient pas les bonnes info, tu utilises quoi comme techno, tu cherches des dev back ou front ? l'état du projet actuel ?...

[olive wind]

Mouais je pense que les raisons pour lesquelles les gens ne répondent pas ne sont pas forcément celles que tu avances... d'autant plus que je t'écris la réponse et tu me fermes le canal sous le nez. Un peu de remise en question de soi ne serait pas de trop. Par ailleurs si tu souhaites plus de professionnalisme, tu devrais peut-être commencer par reformuler ta demande de manière plus détaillée et mettre en place un cahier des charges. Les gens pourront mieux cerner ton projet et les profils qui postulent seront plus en adéquation avec ce que tu recherches.

[bitter sandal]

et toc

[open pond]

cold 🥶

[storm relic]

probleme regler deso c'etais une balise div pas fermer

[clear escarp]

#general message regarde les msg depuis ici comment tu veut taf avec ça ?

[wild stump]

#general message

[wise hamlet]

Citation du message de kiwizariu posté dans #discussion-libre

Mentalité de gobelin pas d’argent = pas de travail

➜ [Voir le message original](#general message)

Cité par parlabarbedemerlin · Feb 26, 2025, 6:17 PM

[wild stump]

[jolly edge]

Ça va je suis pas fou alors

[olive wind]

Je te confirme que non

[clear escarp]

On est 50 a Dire la même chose et il se remet mm pas en question loll

[olive wind]

Ça ne sert à rien de son perdre son temps avec des énergumènes comme ça, étant donné sa façon de parler on peut en déduire qu’il doit être assez jeune

[jolly edge]

J'avais eu la même conclusion

[clear escarp]

Le respect ça devrait être métrisé par tous le monde aussi bien par les jeunes et les "vieux"

[restive fog]

😭 Le nombre de clients qui ne savent pas comment présenter leur projet, leurs besoins ou rédiger un cahier des charges, c’est hallucinant…

Et encore, ça passe encore le pire ça reste les "développeurs" qui acceptent ces offres à bas prix, ce qui dévalorise totalement le marché du coup quand tu proposes un vrai devis qui reflète la valeur du travail les clients sont choqués

[olive wind]

On est d'accord là dessus, après beaucoup de gens (moi le premier) cliquent sur les offres pour voir ce qu'il en est et de quoi parle réellement le projet. Mais le vrai problème sont les annonces en elle-même c'est clair. D'autant plus que les projets acceptés à ces bas prix ne voient souvent pas le jour.
Un développeur peu chère apportera très certainement un travail de bien moins bonne qualité

[bleak yarrow]

Je commence à coder et je bloque un peu sur tout ce qui fonctionne autour de display flex quelqu’un serais dispo pour prendre quelque minute pour m’aider ?

[robust obsidian]

Srry je suis occuper mais est ce que tu as pris le temps de lire la doc sur MDN ?

il y a tout plein d'info sur l'html/css/js

https://developer.mozilla.org/fr/docs/Web/CSS/display

[bleak yarrow]

Mdn ?

Ok super je vais aller lire après si quelqu’un est dispo pour m’aider en voc ça reste plus cool 🙂

[robust obsidian]

Ya ça aussi : https://developer.mozilla.org/fr/docs/Web/CSS/CSS_flexible_box_layout/Basic_concepts_of_flexbox

C 'est plus pour le flexbox

[bleak yarrow]

Ok Nice

C’est les deux trucs sur quoi je bloque

[robust obsidian]

tu verras ya bien plus complexe que ça

[bleak yarrow]

Je me doute

[pastel finch]

C’est bien vrai !
Certains tu leurs lache un 300€ pour un site complet (qui est déjà largement en dessous du service proposé )

il choque😱😱😱😱

[clear escarp]

je crois que dans les vidéo code pareto de css il explique un peut

[olive heron]

Effectivement

Et malheureusement sans être méchant on en voit beaucoup ici

[dry condor]

Comme Afficher sur l'image join les page son mal afficher à ton avis c est du à quoi car moi je voudrais que sa soir afficher en dessous de AlarMilts

[dim valve]

https://developer.mozilla.org/fr/docs/Web/CSS/CSS_flexible_box_layout/Basic_concepts_of_flexbox

[errant cypress]

t’es sur gca toi

[wind tinsel]

coucou bjr

je voudrai de l aide svp^^

en css

bon samedi a tous

il y a quelle qu' un dans sa salon?

[clear escarp]

N'hésite pas à bien mettre ton code et le problème 😏

[wise hamlet]

❓ Obtenir de l'aide

Tu as besoin d'informations ? Tu es au bon endroit !
Consulte la liste des sujets pour en savoir plus sur Creators Area.

💻 Comment on envoie du code ? 💻

Pour envoyer du code sur Discord c'est très simple !
||Il vous faut d'abord du code... Et deux cubes de Kubor ! ||

En vrai, il faut utiliser les blocs de code de Discord :
Pour cela entoure ton code de ceci : ```

Par exemple :
```js
console.log("Salut Creators Area !")
```

Le résultat sera le suivant :

console.log("Salut Creators Area !")
```*Si tu es sur téléphone, tu ne verras pas le bloc de code*

> *TIPS: Si ton code est trop long, tu peux le coller sur [pastebin.com](https://pastebin.com/) et envoyer le lien par message.*

[wind tinsel]

je suis bien salon html css

pour ma question c est en

image backgrund

[clear escarp]

c quoi le code ?

et ce qui vas pas ?

[wind tinsel]

merci de me repondre

je vous le dit se qui va pas

je peut pas en Visio pour vous montrai mon erreur

[clear escarp]

fait une capture d'écran si non

[wind tinsel]

ok

j ariive pas a trouver le chemin et le code bon

il appaarai pas

[clear escarp]

Ton image il faut pas que tu la définisses en css mais en html en gros tu vas afficher l'image avec du HTML ensuite tu vas manipuler sa position et sa taille et d'autres choses en CSS

Pour mettre une image du coup tu remplaces par ça<img src="chemin/de/ton/image.jpg" alt="Description de l'image">

[wind tinsel]

ok pa de div

<div class="imgplateau"><img src="imgmonopolyff/img.jpg" alt="Description de l'image"></div>
<script>

je peut faire sa

pour travailler en css avec la div class?

[clear escarp]

oui bien sur mais ça dépend le projet

[wind tinsel]

je les pas fait

j ai fait se que vous ma dit

comment mettre la photo ds mon plataux de jeux

je fait un plateau jeux finalfantasy monopoly go

je voudrai le mettre au centre de mon plateux

jarrive pas la deplacer

la mettre au centre

display?

display: flex;
justify-content: center; /* Centre horizontalement /
align-items: center; / Centre verticalement /
width: 100%; / Ajustez selon la taille de votre plateau /
height: 100%; / Ajustez selon la taille de votre plateau /
position: relative; / Nécessaire pour le positionnement absolu de l'image */
}

[slow sphinx]

qlq saurait pourquoi j'ai un écart autour de ma page et dans cette écart précis je n'ai pas mon background effect motion blur

[errant cypress]

tu as mis ça ? :

body, html {
    margin: 0;
    padding: 0;
}

[slow sphinx]

nan

j'ai que ca

[shrewd marlin]

bah met ce qu'il t'a dit

et regardes

[slow sphinx]

j'ai fait

mais rien change

[remote cedar]

• check le margin et padding de chacun de tes composants dans l'inspecteur, en particulier body, html, .top-page (et parfois de manière inattendu un élément du contenu) .
• bidouille le css dans l'inspecteur (essaie position relative ou absolute par exemple)
• pour vérifier que ce n'est pas provoqué par le contenu de la page met en commentaire (ou désactive) le css de tout le contenu de la page. Si l'étendu du motion blur change c'est que le css d'un des composants du contenu de la page affecte son comportement.
• check la hiérarchie de tes conteneurs, si .top-page est à l'intérieure d'un autre conteneur autre que body ça peut affecter l'espace
• Essaie la propriété box-sizing

[steady gazelle]

salut, j'ai mis grafana avec node exporter sur un vps et j'aimerais quelqu'un qui sy connais bien en alert pour que j'ai des alert sur l'utilisation de mon vps sur discord svp ces assez urgent

[clear escarp]

c plutôt du js non ?

[heady elm]

oui

[rose basin]

bonjour je voudrait de laide il a til possibiliter que une personne pas en voc ses pour du css

[steep yew]

Peux pas voc actuellement mais explique ton problème ici

Ou privé si tu préfères 🤷‍♂️

@rose basin

[brave ice]

Hello!

je cherche les Meta Tags qui permete a FaceBook Twitter, Discord et Whats d'afficher une image, title et description differante

vous seriez c'est quoi?

[clear escarp]

Comme sur les emmbed ?

Vas sur yt ou ggl tu seras mieux renseigné

[brave ice]

Ouais

[restive fog]

universel :

<meta property="og:title" content="Titre personnalisé pour Facebook/WhatsApp/Discord" />
<meta property="og:description" content="Description pour les réseaux" />
<meta property="og:image" content="URL_de_votre_image.jpg" />
<meta property="og:url" content="URL_de_la_page" />
<meta property="og:type" content="website" />

twitter:

<meta name="twitter:card" content="summary|summary_large_image" />
<meta name="twitter:title" content="Titre spécifique pour Twitter" />
<meta name="twitter:description" content="Description pour Twitter" />
<meta name="twitter:image" content="URL_image_pour_Twitter.jpg" />
<meta name="twitter:site" content="@votrecompte" />

[brave ice]

Twitter c’est différent ?

[steep yew]

Tu parles des balises open graph ? Ou je fais fausse route

Ah bah quelqu'un a déjà répondu, j'avais pas vu 😂

[raven reef]

Bonjour, je cherche de l'aide je n'arrive pas a mettre les loads sur plusieurs lignes.

merci pour votre aide

[void anvil]

Alors, j'ai deux questions. C'est quoi cette codebase ? Et qu'est-ce que tu cherches à faire précisément ? Car ce que tu nous dis ça nous aide pas, sachant qu'en plus on doit crawl dans 2300 lignes, ce serait bien de juste donner le bout de code qui nous intéresse

[raven reef]

le problème c'est que le code ce n'est pas moi qui l'ai écrit. ça donne ceci

je voudrais obtenir ce qu'il y a a droite en bleu clair

en haut les loads sur trois lignes de 8 et en bas pareil

sur l'image il y en a 5

[void anvil]

Tu feras gaffe, tu viens de donner le nom de ta ville et le nom de quelque de chez toi

[raven reef]

ha bon

ou ça

[void anvil]

En haut à Gauche, il y a une ville, et dans les appareils, il a le " L'ordinateur de Franck "

[raven reef]

voilà, je voudrais obtenir ce qu'il y a a droite en bleu clair
en haut les loads sur trois lignes de 8 et en bas pareil
pour le moment c'est comme l'image

[errant cypress]

oh le gros bordel, compliqué à maintenir et à t'aider dans cette usine à gaz..

[vivid cliff]

🤯

[midnight willow]

Bonjour ! J'suis débutant developpement web et j'apprend le le HTML et CSS.
Je n'arrive pas à comprendre comment, en fonction de la taille de la page, adapter la marge entre deux ou trois blocs centrés et se trouvant sur la même ligne. Aussi, je n'arrive pas à bien comprendre comment utilisé la fonction @media (@media screen).
Est-ce que quelqu'un pourait m'expliquer en vocal ?

[empty tartan]

Utilise les flex

Et aussi tu peux utiliser des unités qui vont varier par rapport à la view port genre vw pour les width et vh pour les height

width:10vw; par exemple

height:10vh;

Ça va bien changer par rapport à la taille de la fenêtre

[midnight willow]

ok ! j'essaierais ça merci

[bitter sandal]

j'ai jamais capté l'intérêt de ces deux unités, j'ai l'impression que c'est plus un nid à pb qu'autre chose

[tame forge]

Ça dépend totalement du usecase 🤷‍♂️

Cas tout con, tu veux que ton hero header prenne tout l’écran (qu’on voit pas ce qu’il y a en dessous), ben min-height à 100vh

C’est le cas sur énormément de sites

[bitter sandal]

ah oui j'avais oublié ce cas que moi-même j'utilise mdr

[tame forge]

[rich briar]

Yo, j'étais entrain de voir pour me faire un portfolio pour après mes études etc mais j'aurai besoin d'un avis niveau améliorations possible a faire sur le site : https://eiprox.github.io/portfolio/

[pseudo sundial]

yo, y a des petites choses à revoir, deja le margin au dessu de la navbar remove le, pour la rangé des langages que tu connais, place les logos

Essaye de partir sur une palette de couleur pour le design de ton site

[rich briar]

J'ai peur que les couleurs fassent pas super pro la dessus

[pseudo sundial]

elle : https://www.melaniedev.com elle a ses couleur bleu foncé plus noir ou blanc et ca fait très pro, ce n'est pas la seul

organise certaine de tes parties avec des card ( en gros tu fait une structure interne avec un border et un shadow autour, pimpe le selon tes envies

analyse d'autre portfolio

[rich briar]

Ouais faire une grid

[pseudo sundial]

une grid en background css ou dans le card

[rich briar]

ça marche merci beaucoup

[iron stone]

salut, fais attention au responsive

[queen heart]

Ca fait combien de temps que tu apprend ?

[pseudo sundial]

j'ai commencé il y a 2 ans, d'abord du html-css-js / react, puis je suis passé sur du backend js pour des petites app puis la je suis sur du Java pour des backend d'entrprise. J'ai arrété le front c pas trop ma tasse de thé

[void anvil]

Any English here?

I have an question

[pseudo sundial]

what is?

[lusty maple]

Je rejoins ce que dit Gaspard, n'hésite surtout pas à te faire une petite palette de couleurs (ou à en prendre une qui te plait). Si tu veux avoir un site portfolio, essaye de faire en sorte qu'il soit mémorable ! On a souvent tendance à se rappeler des devs qui mettent le paquet sur leur site portfolio avant de se faire leur propre réputation. Tu pourras te permettre d'avoir un site super simple une fois que tu auras une réputation bien établie 😉

Autre truc aussi, pour ta nav, comme tu as pas mal d'éléments, n'hésite pas à faire un burger menu en mobile, ça sera un peu plus épuré.

Aussi, lors de la création de ta DA, n'hésite pas à te faire un moodboard et à prendre des inspirations sur des sites comme Awwwards, Dribbble, Pinterest, etc. Ta DA va aller bien au delà du choix de couleurs, ça va être ton choix de fonts, ta structure de page, le look de ta nav par exemple, des petites animations si t'as envie de te chauffer, et j'en passe

Je ne suis pas sur mon ordi donc je ne sais pas ce que ça donne comme affichage, je me base uniquement sur ce que j'ai vu sur mon téléphone haha

(Pavê César, navré du ping si tard la nuit)

[white flame]

https://nexxlokesh.pro hey dear devs please check out once my portfolio and give me suggestions how can i imporove this one 😀

[storm folio]

.. Is that a template ?

[white flame]

no bro that is not a template its created by me

[storm folio]

yeah so maybe fill those and add a project page

[white flame]

okay , thanks man i'll soon as soon possible

[storm folio]

and if you say that your a creative web developer maybe show it ? Because right now the website look like any other portfolio

[rich briar]

J’ai pas fais du tout l’adaptation téléphone atm c’est un p’tit bout de css en soit mais j’ai pas eu le temps encore

[spice zinc]

Quelqu’un peut me proposer un site d’hébergement gratuit ?

[granite orbit]

vercel

[spice zinc]

C'est plus gratos si ?

[lapis flicker]

Netlify

[granite orbit]

il me semble que si

[lapis flicker]

C'est gratuit pour leur techno je crois ?

[remote hamlet]

WHAT

[light field]

yen a ils sont chaud de programmer tranquille ?

[void anvil]

N'hésite pas a redemander parfois tu pourrais tombé sur des gens qui le voudront

[tame forge]

C’est à dire……

[light field]

??

[light field]

ok merci

[tame forge]

Ben je comprends pas ce que tu veux du coup je te demande de préciser

[light field]

bah en mode si ya des gens qui serais intéressé de programmer ensemble

[tame forge]

Ah ok

Du coup non pour moi

[light field]

vazy 👍

[quasi cave]

J'ai pu mettre une api express dessus donc il me semble que tu peux mettre n'importe quoi

[muted parrot]

sa fait ni clean ni pro pitié que qlq me prpose comment l'ameliorer ne serait-ce que l'acceuil (calculez pas les description c juste pour donner un apercu)

[lapis flicker]

Si tu veux du pro, tu peux :

• mettre le titre à gauche avec le bouton juste en dessous
• Mettre un fond (vidéo, image) ou mettre une sorte de dessin de ton activité à droite du titre
• Avoir des couleurs vive qui sépare les différentes parties
• Au lieu de faire 3 petites card tu peux faire une grande bannière pour chaque card

[muted parrot]

mercii grave j'essaye sa, en plus j'y est pensée au background image

[lapis flicker]

en vrai je pense que tu peux reprendre les styles des portfolios que tu peux trouver dans #969334925545316372

celui de #1362757139705233659 est pas mal

pour le côté titre

[muted parrot]

ouii j'aime grv

sa vas faire du pro la

[light field]

salut yen a qui serait chaud de programmer et coder emsemble chill ?

[light field]

@toxic sonnet tes chaud coder emsemble ?

[wraith snow]

Hi, do you have some advice for css animations? They are so difficult to learn

[quasi cave]

Hi, first u can start using the keyframes selector in css allow you to create simple animation very easily

[humble sentinel]

anyond dnglish?

[fathom stag]

i know a good streamer who makes videos about programming, but he is from spain so the videos are in spanish, if u want to take a look, his name is "midudev" at youtube, search for the css animations video

[quasi cave]

Salut, tu as déja des idées de projets ?

[light field]

pas vraiment le but netant jsute de programmer quelque chose de sympa, ou un peut n'importe quoi.
mais si toi tu as des idées c'est avec plasir

[light field]

mais en vrai j'avais une idée sympa, trop galère a mon avis mais bon on peut tjr try

[elder igloo]

Bonjour tout le monde ! j'aurais besoin d'aide pour savoir quel thème je garde le premier c'est celui actuelle et le deuxième c'est celui que j'ajouterais ou pas selon votre avis, merci d'avance.

[arctic steeple]

le 2 est vrm sympa

[crude karma]

ton site est juste hyper utile merci

sinon j'aime bien la 2e

[elder igloo]

serieux ? je l'utilise juste personnellement donc jsp trop

[elder igloo]

merci de l'avis

[crude karma]

bah j'avais déja chercher quelques choses de ce genre et tu l'as fait (donc j'ai pas besoin de le faire)

donc merci bien

[elder igloo]

faut encore creer les manwha manuellement donc un peu chiant

[polar thorn]

ca

[crude karma]

ca ?

[polar thorn]

cac

[crude karma]

oui mais pour le moment ça marche

[elder igloo]

si tu trouves des bugs dit le moi

[crude karma]

ok

[stark garden]

moooore lights

[elder igloo]

yo si vous voyez ca vous comprenez que c'est un exemple et que vous pouvez faire toute les compositions possible ou juste faire 1+9 ?

[elder igloo]

add dark and light modes ?

[narrow lake]

Opa

[queen heart]

Bonsoir pardonnez moi du derangement mais que me conseilleriez vous pour commencer html/css (débutant)
Merci à ceux qui répondrons 😄

[midnight violet]

OpenClassroom, youtube et surtout un projet qui te tient a coeur

[queen heart]

Vscode c bien ou pas ?

Et j'ai pensé à un livre prcq ca prend normalement plus le temps d'expliquer

Mais jsp

[midnight violet]

c'est l'ide par défaut et oui très bien vue la multitude de plugins

(c'est mon avis hein) mais les livres c'est bien pour les thèmes généraux pour un langage spécifique autant guetter les ressources sur le net et si ta des truc que tu comprend les serveurs comme ici sont fais pour cela

[queen heart]

Ok mais j'ai peur d'être chiant ...

Je bloquait sur les div

Je ne comprenais rien

Mais bref

[midnight violet]

T'es pas chiant, on a trous débuter, je suis le premier a avoir poser et encore poser des questions a mon lead / senior ou avant sur des serveurs comme cela si

et alors ? Tu bloquais et mt nest tu encore bloqué ?

[queen heart]

Oui

Les divs je les ai pas compris

Es

[midnight violet]

c'est quoi que ta pas compris dans les div ?

[queen heart]

Je me base sur la vidéo ytb de fromscratch

[queen heart]

Leurs utilisation leur principes enft tout

😅

Att

On va écrire dans le fil pour pas monopoliser le truc

[clear escarp]

Tkt c'est fait pour moi aussi j'ai jamais compris ces div

[void anvil]

https://mvhadetp.ovh je pourrais améliorer quoi ?

[rose salmon]

hello !

Dans mon code j'ai ajouté des images une banniere est un logo/ mais sur le site ça ne saffiche pas

j'ai testé plusieurs solutions mais j'ai pas trouvé :/

[high remnant]

Toujours besoin d'aide

[lost cove]

fais F12 sur la page et sélectionne l'élément qui est sensé afficher l'image sur ta page. tu survole le lien dans le code et tu regardes ce que ça affiche comme lien exact

[rose salmon]

Ouep j’ai fait ça ça a marché 👍

[lost cove]

okay

[high remnant]

Nice

[summer urchin]

oh

salut vous avez besoin d'aide ou pas

[lost cove]

nah

[summer urchin]

quenk_ fait mieux fait aider stikzy sur les div

[high remnant]

Nop et toi ?

[summer urchin]

non tout va bien

[high remnant]

Rien compris à ton orthographe.

[summer urchin]

désolé j'ai fait une faute

[tame forge]

@storm tendon => #poster-une-recherche

[scenic sparrow]

bonjour quelqu'un sait il comment créer un effet 3d sur une image, pour faire en sorte que quand je suis en hover dessus sa fais un effet 3d, merci

.

aussi une autre question, comment faire un effet degrader Animer, et tout sa en css pls !

[scenic sparrow]

ta nav bar en haut, tu devrais la recadrer pr faiure en sorte qu'elle soit centrer, et definir un sujet a ton site, on ne sait pas vraiment ce que sais et a quoi ca sert

[sly jewel]

suis preneur aussi mdr !!

[midnight violet]

css transform pour la 3d

pour l'effet de degrader une animation avec un linear-gradient

[restive fog]

transform & perspective et pour les dégradés t'as juste à utiliser du linear-gradient et à utiliser une keyframe pour gérer ton animation

ex img 3D avec hover effect:

.image-container {
  width: 300px;
  height: 200px;
  perspective: 1000px;
}

.image-container img {
  width: 100%;
  height: 100%;
  transition: transform 0.5s ease;
  transform-style: preserve-3d;
}

.image-container:hover img {
  transform: rotateY(15deg) rotateX(10deg) scale(1.05);
}

ex gradient animer:

.animated-gradient {
  background: linear-gradient(270deg, #ff00cc, #3333ff, #00ffcc, #ffcc00);
  background-size: 800% 800%;
  animation: gradientAnim 8s ease infinite;
  color: white;
  padding: 50px;
  text-align: center;
  border-radius: 20px;
}

@keyframes gradientAnim {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

[scenic sparrow]

okok merci les gars !

[restive fog]

Avec plaisir ^^

[spice cloud]

Yo les gars je suis entrain de faire mon projet de creer un site de casino, sauf que j'ai un probleme ( https://bloxixe-game.onrender.com/ ) dans la categorie coinflip je veux que les paries des autres soit visibles par tout les autres utilisateurs, comme un casino en ligne ( coinflip game )

[zenith lion]

C'est quoi le problème du coup ?

[spice cloud]

je sais pas comment faire une page partager

tout les gens qui vont sur mon site voie la meme page coinflip

[zenith lion]

Websocket peut-être

[inner remnant]

Moi, je suis sur un projet pour aider les newbies à créer leurs propres sites. Pour l'instant, c'est qu'un début et c'est hébergé sur GitHub: Mark2WebGen

[sweet nova]

@willow zephyr

[pseudo sundial]

c quoi le backend ? a tu placer un syetm de web socket dednas afin de créer une socket avec tous les player ?

Et aussi, tu pars sur une platforme crypto ?

[spice cloud]

yo mec, c'est gentil d'avoir essayer dm'aider, mais j'ai enfin reussi avec un peu de persistance, j'ai utiliser websocket afin de rendre ma page visible pour touts les utilisateurs

[dry condor]

On peux me donner un avis https://cmilts-asso.netlify.app/

[quasi pagoda]

Manque d'image je trouve ?

[dry condor]

Q bon il y en n'a derail se que tu veux dire e

[quasi pagoda]

Tu pourrais mettre des images par rapport à ce que tu dis, tu prouve t'es compétence.

[dry condor]

C est dans site exemple

[tame forge]

Des petites mentions légales ça serait pas de refus

On nous mentionne une asso partout mais on ne peux pas l'identifier

Et les pricing card, c'est bien, mais c'est quand même tout le temps la même chose

Et autre chose qui est quand même un peu honteuse, c'est marqué partout "sans IA" mais dès qu'on zoome....

[dry condor]

L'image ???@tame forge

[tame forge]

Tiens t'y verras ptet mieux comme ça

Parce que les textes sont pas nets, mais la visio entre zombies est pas mal non plus

[void anvil]

[clear escarp]

Lollll

[dry condor]

Mdr

[tame forge]

Je vois pas ce qu'il y a de drôle

[queen heart]

Comment je peux faire pour réduire la taille des background de paragraphe ?

Svp

Je n'utilise pas de box,flexbox

[tame forge]

width: fit-content

[queen heart]

Avec cette commande mon texte ne s'aligne plus...

[junior tulip]

que veux-tu dire par réduire la taille des background?
Voulez-vous que le background du paragraphe ne couvre que l'espace occupé par le texte ?

[queen heart]

Oui voilà

[junior tulip]

tu dois utiliser fit-content comme Nolhan te l'a déjà dit

@queen heart
Tu dois mettre les paragraphes dans une div, lui attribuer une classe (moi je l’ai appelée test) et dans le CSS de cette classe, tu mets ça :

.test {
background: white;
width: fit-content; // pour adapter le fond à la taille du texte
margin: 1rem auto; // pour centrer le bloc au milieu de l’écran
text-align: center; // pour centrer le texte à l’intérieur du bloc
}

[tame forge]

Mets tous tes textes dans une flexbox et tu mets un align-items: center

[queen heart]

Comment mettre une address mail cliquable qui nous envoie sur gmail ?
C java script ou pas ?

[lapis flicker]

tu fais un html <a href"mailto:[e-mail]">Envoyer un mail</a>

• mailto: pour les mails
• tel: pour les numéros de téléphones

Aucun JS là dedans

c'est de base dans ton navigateur

[queen heart]

Ca m'envoie sur une page blanche

[tame forge]

Faut configurer une boite mail pour que ça soit utile

[queen heart]

Pour le tel c bon

[tame forge]

Yep parce que t'as une app dédiée

[queen heart]

...

Ya moyen de voc en vif ...

[tame forge]

Sur PC c'est rarement le cas, du coup il faut que tu configure ta boite mail dans ton navigateur

[tame forge]

nop

[queen heart]

Ok pg

[tame forge]

Sur firefox :

[queen heart]

Comment ?

[tame forge]

https://support.google.com/chrome/thread/57026170/how-to-add-gmail-as-default-mailto-handler?hl=en

pour chrome

[queen heart]

Dcp je dois le faire pour tout les navigateur ?

Poiur les autres utilisateurs

[mild oak]

hello

[tame forge]

Sinon parfois quand tu vas dans tes mails t'as un popup "voulez vous utiliser Gmail pour ouvrir les liens"

[tame forge]

Ben ils faut qu'ils l'aient fait ouais

[queen heart]

Woaw

[tame forge]

Bah ouais mais le navigateur peut pas deviner quelle messagerie tu utilises

[queen heart]

[queen heart]

On peut faire une flexbox avec une section ?

Ou que div ?

[tame forge]

tu peux avec tout

[queen heart]

Commt gérer l'espace entre 2 zone de texte (en flexbox) tout en les gardant centré

Pour le moment c'est ca

[tame forge]

gap: 1rem met un espace de 16px entre chaque éléments

Et faut évidemment remettre ça pour que ça reste au milieu :

align-items: center;
justify-content: center;

[candid cape]

hello jai un site en html et css, js. je voudrais que mon reseau y accedent. comment est possible ?

[tame forge]

Ton réseau ?

[queen heart]

Salut excusez moi comment je ferai qd je voudrais mettre mon code sur internet ?
.
Y'aura un nouveau langage à connaître ou juste jle met sur un truc exprès ?

[fleet tiger]

c'est à dire ?

[queen heart]

Genre en ligne sur internet ne pas avoir à lancer vscode

[fleet tiger]

alors pour héberger une page web, il te faut un serveur, tu peux soit en louer un à une entreprise (webstrator par exemple est pas cher) ou si tu n'as pas de moyens financiers tu peux l'héberger toi même sur un vieux pc, pour ça tu peux utiliser nginx ou apache, louer un nom de domaine à 6 balles par an chez ovh et faire un certificat avec Let's encrypt (certbot est un bon outil pour ça)

[inner remnant]

Sinon tu peux utiliser github et même avoir un aperçu mais avec decalage de ~ 5min.

[sinful axle]

je suis entrain de faire un site comme projet pour ma spé nsi en premiere general , j'ai un probleme , j'ai cree un bouton couleur qui permet de passer le fond en blanc , il est sensé marcher sur toute les pages mais ne fonctionne seulement sur la page ou je l'avais coder a l'origine ( je l'avais coder pour 1 seule page au debut puis j'ai changer pour toute ) .

et si quelqu'un aurait du temps pour m'aider / rendre le code plus propre je suis preneur

[midnight violet]

Sans code on va pas pouvoir t'aider frérot

Mais bon vue que tu la codé pouru ne page de base et après tu la fais pour du multi page ta pas du faire une page générique je pense

[sinful axle]

oui j'ai pas envoyé le code prcq je voulais savoir si je devais l'envoyer e nfichier ou si je copie colle

function slideDown() {
    const transition = document.getElementById('pageTransition');
    transition.style.top = '0';
}

document.querySelectorAll('a[href*=".html"]').forEach(link => {
    link.addEventListener('click', function(e) {
        e.preventDefault(); 
        slideDown(); 

        setTimeout(() => {
            window.location.href = this.href; 
        }, 700);
    });
});


var titreAvis = document.querySelector('#titreAvis')

titreAvis.addEventListener('click', changerPolice)

function changerPolice() {
    titreAvis.classList.toggle('active');   
}



var bCouleur = document.querySelector('.btnCouleur');
var isNormal = false;

bCouleur.addEventListener('click', function() {
    var body = document.body
    if (isNormal) {
        body.style.backgroundColor = "#ffffff";
    } else {
        body.style.backgroundColor = "#161725"; 
    }
    isNormal = !isNormal;
});

.btnCouleur {
    padding: 10px 20px;
    background-color: #e5be45;
    color: #161725;
    text-decoration: none;
    border-radius: 5px;
    font-family: "Bebas Neue", sans-serif;
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 100;
    cursor: pointer;
  }

<button class="btnCouleur">Couleur</button>

dis moi si il te manque des informations

[dull dragon]

Si ton script ne fonctionne que sur une seule page, je me dis qu'il faut probablement que tu le rappelle sur tes autres pages avec la balise <script>

[lapis flicker]

Je pense qu'il veut que ça garde en mémoire le choix entre les pages

[midnight violet]

si c'est cela un cookie est donc nécessaire

[lapis flicker]

ou du LS c'est plus simple

[dull dragon]

Haaaanw.. Mmmh.. le localStorage ou les cookies seraient le plus simple

[midnight violet]

Oui LS aussi, c'est vrai que par habitude je fous tout en cookie mais ud ls fais l'affaire

[sinful axle]

nn pas forcement juste que je puis switch de couleur sur la page c'est vrmt pas du haut niveau ce qu'on fait en ce moment , juste je comprends pas pourquoi le bouton qui change le fond marche seulement sur ma page des avis

[midnight violet]

fais voir ta page avis et une page random au niveau du html

[lapis flicker]

Dans ce cas c'est ta balise script qui n'est pas importé ou juste que tu n'as pas le btnCouleur sur tes autres pages

[sinful axle]

si pourtant j'ai tout je comprends pas dans mon js la transition au moment du changement de page marche partout mais le bouton ne marche pas sur les autres pages jsp

il faut que je vous envoie plus de code peut etre ?

[midnight violet]

Oui

[sinful axle]

<!DOCTYPE html>
<html>
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
    <title>Backstory</title>
    <title>Reviews</title>
    <link rel="stylesheet" href="style.css">
    </head>

    <body id="reviews">
        <div id="pageTransition"></div>
        <h1 id="titreAvis">Avis</h1>





        <button class="btnCouleur">Couleur</button>
        <a href="index.html" class="home-button">Accueil</a>
        <script src="script.js"></script>

    </body>
</html>

[sinful axle]

c'est la page ou sa marche celle la

[dull dragon]

Est-ce que tes deux pages sont dans le même dossier ?

[sinful axle]

oui

le dossier js est vide j'ai juste oublier de l'effacer

[dull dragon]

Ok après avoir fait des tests de mon côté, j'ai pu remarquer que ton script JS plante lorsque tu es sur ta page "backstory" parce qu'il ne trouve pas l'id "titreAvis" et ne peut donc pas lui ajouter d'event (ligne 19 de script.js) ^^

je te conseille d'avoir des fichiers de script propres à chaque fonctionnalité, afin d'éviter ce problème 🙂

[sinful axle]

d'accord merci

[midnight violet]

Pour ne pas te faire chier vu que tu apprends là, fais juste un if sur ton titreAvis et il devrait l'ignorer

[sinful axle]

j'ai deplacer le code du changement de la couleur de la page au dessus de titre avis et ca fonctionne

[sinful axle]

je vais faire ca

[midnight violet]

Déplacer le problème ahah, fait attention il reviendras si tu fais des modifs en dessous

[sinful axle]

je ferais attention merci

[dull dragon]

Bonne chance avec la suite de ton projet 🙂

Si tu ne l'as pas encore, essaye d'avoir le réflexe de regarder l'inspecteur de ton navigateur, dans l'onglet console. Généralement quand tu as un truc qui ne fonctionne pas, il te donne pas mal d'infos utiles 🙂

[sinful axle]

et si jamais quelqu'un a le temps, je dois faire un bouton qui sort une citation au hasard de la serie car mon prof le demande dans le site , je sais pas trop comment m'y prendre pour sortir une citation aléatoire

[sinful axle]

oui je regarderais plus souvent vu que j'ai seulement fais du python j'ai moins le reflexc

[sinful axle]

quelqu'un viens de me dire d'utiliser math.random pour le realiser

[dull dragon]

Pour le random, tu peux utiliser math.random() https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/Math/random
Si tu as toutes les citations dans un tableau, tu peux faire une formule à partir de Math.random() pour générer un chiffre entre 0 et la taille de ton tableau et lire à l'index du numéro obtenu

Ah bah j'allais te dire la même chose xD

[sinful axle]

merci encore

[midnight violet]

tu les récupére comment tes citations ?

[sinful axle]

je sais pas je penses demander a genre chat gpt de m'en ecrire plein de la serie puis de les copier et les coller quelque part pour les stocker

[midnight violet]

demande lui direct de tes les fournir en tableau js comme sa t trql et ta juste a target l'index de la ligne avec ton math random

[sinful axle]

d'accord

merci

j'ai encore une demande que je n'arrive pas a trouver , j'ai le meme css pour mes 2 boutons mais ils n'apparaissent pas exactement pareil

je ne sais pas pourquoi il y a un petit contour pas tres beau autour de mon bouton couleur

comparé a mon bouton accueil

c'est tres leger mais ca me derange un peu quand meme

.home-button {
    padding: 10px 20px;
    background-color: #e5be45;
    color: #161725;
    text-decoration: none;
    border-radius: 5px;
    font-family: "Bebas Neue", sans-serif;
    position: fixed;
    top: 10px;
    left: 10px;
    z-index: 100;
  }

.btnCouleur {
    padding: 10px 20px;
    background-color: #e5be45;
    color: #161725;
    text-decoration: none;
    border-radius: 5px;
    font-family: "Bebas Neue", sans-serif;
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 100;
    cursor: pointer;
  }

sauf que celui avec le petit contour est un <button> est l'autre c'est :

<a href="index.html" class="home-button">Accueil</a>

[lapis flicker]

Il y en a un ça doit être un <button> et l'autre t'as du faire un <a>

le <button> à déjà un style par défaut (bordure moche)

tu peux forcer dans le css à le retirer

jsplu si c'est border: 0

[sinful axle]

d'accord merci

[heady elm]

fait attention à bien utiliser la sémantique

[slate mesa]

les gars pour mon fichier html je n'arrive pas a faire en sorte que sa envoie un msg sur l'adresse mail

<h2>Me contacter</h2>
<p>Email : <a href="mailto:[e-mail]">[e-mail]</a></p>
<form>
<input type="text" name="nom" placeholder="Votre nom" required><br>
<input type="email" name="email" placeholder="Votre email" required><br>
<textarea name="message" placeholder="Votre message" required></textarea><br>
<button type="submit">Envoyer</button>
</form>

[agile helm]

il te faut la partie back 🙂

[slate mesa]

comment on fait une partie back?

[agile helm]

tu peux la faire en php

[slate mesa]

ok

[queen heart]

Slt désolé du dérangement j'aurais une question par rapport à css :
Comment je fais si je veux définir une couleur en fonction de si le thème de l'utilisateur et sombre ou clair
Merci
excellente soirée !

[restive fog]

Salut il existe plusieurs façons de gérer les couleurs selon le thème sombre ou clair de l'utilisateur :

Avec les media query css prefers-color-schema

[midnight violet]

ou juste des variables ":"

[restive fog]

ou une classe dark sur le <html> ou <body> souvent utilisé avec JS ou Tailwind CSS

ex:

.body {} /* white */
.dark body {} /* dark mode */

[midnight violet]

yep si tu prend un framework plus tard tu auras pas mal de truc préfait pour les thémes

[queen heart]

Ok pour que les couleur ne changent pas ont fait comment

Prcq le site est deja sombre voila pour le mm

stikzy1.netlify.app

[dry condor]

Comment on fait pour que quand je apuiit sur sa maffiche le logo de mon website Ajouter à l'écran d'accueil

citationsapp.netlify.app/

[spark timber]

Comment ça ?

[lapis flicker]

<a href="/"> <img src="logo.png"/> </a> 

ceci ?

[sharp cairn]

Bonjour à tous, je voulais savoir si quelqu'un aurait une solution à me proposer pour le problème suivant : je fais actuellement un site sur lequel je souhaiterais ajouter une ombre sur le header qui ai (je parle bien de l'ombre en elle même) une propriété de blur sur le backdrop-filter, avec donc la possibilité de flouter progressivement les éléments sous l'ombre au fur et à mesure du scroll. J'ai déjà essayé des choses telles que de créer une fausse ombre avec un pseudo-élément after ou encore avec un mask de gradient, mais à chaque fois, le résultat n'étais pas celui que j'attendais, notamment à cause de la propriété fixed sur la position du header. Je sais que ma demande est pointue, mais si quelqu'un a une proposition, j'en serais très reconnaissant. Merci d'avance !

[storm folio]

euhh utiliser un élément before ou after en position absolute que tu met en dessous en tant qu'ombre ça devrait le faire 😉

met lui les propriété que tu veux après bien sur

[sharp cairn]

J'ai déjà essayé après peut-être que je me suis trompé t'aurais un exemple ?

Si tu veux je peux t'envoyer mon code

[storm folio]

donne ton code je veut bien tenter ou met sur un codepen

[sharp cairn]

je vais créer un codepen

[storm folio]

Mais apriori tu met ton élément en absolute, avec un background pas opaque, puis tu applique un filter:blur() dessus

après en JS faut géré le scroll

[sharp cairn]

CodePen voilà le codepen avec mon header extrait de mon projet. Pour l'instant l'ombre est juste une box-shadow

[inner remnant]

Comme ça?

C'est fait

Sinon j'ai fait un site pour joier au jeu de Nim. Il y a aussi un historique et la stratégie gagnante: Nim Game - By Nitnaf

[sharp cairn]

Le but était d'avoir un effet de blur sur le backdrop-filter de l'ombre mais sinon oui

[inner remnant]

Te veux dire que l'effet doit aussi etre sur l'ombre?

[quiet brook]

Bonjour tout le monde, je débute actuellement en html et css et je voulais avoir des retours sur mon premier site pour savoir s'il y aurait des choses à améliorer, merci aux gens qui prendront le temps de le faire !

D'ailleurs y aurait-il moyen d'héberger gratuitement du html pour qu'on ait pas ainsi à télécharger le fichier html ?

[meager beacon]

Salut, tu peux te tourner vers GitHub Pages ou Vercel pour host ton app
GitHub Pages est plus simple à mettre en place mais ton code est accessible par tout le monde, ce qui peut être plus ou moins bien selon le site
Quant à Vercel, c'est un peu plus compliqué mais ça te permet d'avoir un code avec des identifiants secrets par exemple

_ _
Il est sympa, il reste simple et efficace
pour un début c'est bien je trouve

[queen heart]

Le plus simple je trouve c netlify

[queen heart]

Salut comment tu as fait pour avoir le texte comme ca ?

À côté et fini en dessous

[quiet brook]

Ok merci je vais me renseigner 👍

[quiet brook]

J’ai ajouté un habillage au texte avec l’attribut « float » qui permet de placer l’image dans le bloc texte
Après j’ai essayé de le faire avec une flexbox mais j’ai pas réussi à avoir le même rendu

[sharp cairn]

Oui justement l'effet doit être uniquement sur l'ombre

[inner remnant]

Il suffit de deplcer la zone a blur

[inner remnant]

Améliore le css pour addater aux mobiles

[quiet brook]

Tu me conseilles quoi pour faire cela ? Mettre des flexbox ?

[inner remnant]

Tu rappetusse la police de paragraphe sinon voici quelques captures:

[inner remnant]

Sinon tu peux utiliser firefox faire Ctrl+Maj+i et tu selectionne panneau a drote après tu regle la taille du panneau et tu peux meme modifier et enregistrer le css.

[winged mango]

Salut quelqu'un pourrait m'aider ?

Je fais une form box et j'ai ce probleme j'arrive pas a savoir d'ou ca peut provenir

je peux pas mettre d'image

[meager beacon]

si on la voit l'image t'inquiète pas

@winged mango c'est quoi le problème là

[winged mango]

Ya pas un endroit ou je peux mettre mon screen

Quand je veux envoyer il s'envoi pas

Mais en gros mon bouton se connecter il est sur la checkbox Se souvenir de moi

[meager beacon]

on les voit tes images je te promets

et sinon il nous faudrait ton code
un fix simple serait de mettre un margin-top au bouton (normalement)

[lime vector]

Mais le mieux serait de régler les positions non?

[calm socket]

Montre nous le code c'est plus facile

[winged mango]

ah je voyais pas les images dsl

je vais essayer ce que vous m'avez dit pr voir et si ca marche pas j'enverrai le code

[winged mango]

C'est bon j'ai changer le margin-bottom du checkbox se souvenir de moi

[flat fossil]

Hello

[meager beacon]

also https://dontasktoask.com/

you should send you message directly, no say "Hello" then wait for someone to answer you

[flat fossil]

Yeah, I understand

[pallid flicker]

svp deuis hier j'ai un prblm que jarrive pas a fix