Faire un simple site web a l'aide d'une simple base de données

En ce qui concerne les sites dynamiques il vont charger dans la page le contenu d'une base de données.
Vous devez assimiler ceci:
https://www.commentcamarche.net/contents/221-reseaux-architecture-client-serveur-a-3-niveaux

Concrètement la page va charger(mais pas seulement je vais y venir plus tard) des informations à afficher(entre autres) par le biais du programme. Les 3 parties sont l'affichage(HTML), la base de donnés et le programme.

Une base de données stocke(pour la plupart et pour Internet) uniquement du texte.
Si dans un site nous voulons que le texte d'accueil soit modifiable pour indiquer les dernières actualités ceci ressemblera à ça(ce n'est pas du code mais une représentation symbolique)

<p id="zone_actu">[ ici est chargé le dernier texte actualisé de la base de données]</p>

Ce qui se trouve entre crochets(les crochets n'existe pas, ce n'est qu'une image de la programmation nécessaire) est la partie programme qui interroge(requête) la base pour obtenir le texte à écrire dans la page.
Le programme qui fait la liaison entre la base et la page va aussi fonctionner dans l'autre sens: il va permettre d'envoyer à partir de la page HTML(balise de formulaire <form>et </form>) les informations que l'on veut modifier.
Donc l'utilisateur/administrateur(dûment identifié dans une zone qui n'est pas accessible au public(intranet)) va pouvoir facilement changer le contenu d'une table. Il n'a pas besoin de modifier le HTML à chaque fois.

La majorité des sites sont dynamiques, un site statique étant non actualisable facilement(et pas sur le long terme).

En étant toujours sommaire dans mes explications je vais m'attacher à décrire les nécessités de la conception(plutôt que celles du développement que j'ai décrites pour l'instant).

On parle d'analyse et de conception dans le cas du fonctionnement tri-partie(HTML,programme(PHP entre autres), base de données(comme mySQL)).

En effet la conception(et l'analyse) vont s'attacher à définir les zones qui sont à modifier, donc ce qui doit être modifiable. Comme résultat concret ce seront les tables de donnés de la base.

On parle de Modèles Logique de Données(MLD) pour les tables et leur structures(regroupement des champs) et liaisons(les références entre les tables pour les mettre en rapport).

Bon je suis sûr de ne plus être clair sur ce point. Ceci est une partie primordiale et essentielle, une discipline à part entière permettant de créer un Modèle Conceptuel de Donnés (MCD)à partir de l'analyse des renseignements et valeurs nécessaires pour un Système d'Information.

En voici une présentation:
https://www.commentcamarche.net/contents/655-merise-initiation-a-la-conception-de-systemes-d-information

Pour ce 3ème message/partie je vais vous orienter vers les questions spécifique à votre demande.

Tout d'abord par une mise au point:
Q:"---- l'utilisateur de mon site va chercher (dans la base de données"
R:Certainement pas! C'est le rôle du programme, le fonctionnement tripartie est indispensable car la base de données ne doit jamais être accessible directement. Cela voudrais dire que n'importe qui peut tout y supprimer ou pire la modifier pour la rendre fausse(le résultat étant le même=plus de site qui fonctionne, pertes des données souvent sensibles et privées).

_Q:"les objet qui va les additionner a l'aide de l'onglet recherche [1]"
_R:Ce qui m'a poussé à faire une explication détaillé partant des bases c'est cette partie.
additionner ? je n'ai toujours pas compris, vous voulez dire ajouter? Bon passons.
Dans la première partie de ma réponse j'ai décrit le fonctionnement de HTML. En HTML(contrairement au secrétariat et graphisme print où le rendu/visuel final est la seule règle) il faut différencier le contenu(textes, images, vidéos etc...) du contenant. Le fond ou sujet de la forme. Ceci permet de proposer un langage simple et standardisé pour tout les créateurs d'HTML. Je n'ai qu'évoqué CSS mais son grand avantage est aussi dans cette séparation du contenu et contenant. CSS décrit des propriétés de mise en page dont la grande force est de pouvoir les reproduire simplement. Sans rentrer l'écriture de ses règles on peut avec CSS utiliser une même règle pour plusieurs paragraphes de textes pour une ou plusieurs pages Ainsi pas la peine de faire plusieurs fois la même mise en page ce qui serait plus que fastidieux. On peut aussi changer toute l'apparence du site en modifiant quelques lignes du CSS et beaucoup d'autres avantages que je ne préciserais pas.
Quand on arrive au sites dynamiques cette séparation contenu/contenant et d'autant plus indispensable.
objet? Vous parlez d'éléments visuels donc. Le terme est mal choisit car corresponds à bien autre chose, c'est un terme de programmation fréquent(On parle de Programmation Orienté Objet(POO) mais là n'est pas encore le sujet).
Hors comme vous devez l'avoir compris:

Un élément visuel est composé: de sa structure HTML(et son CSS) ainsi que de son contenu(le texte, l'image éventuelle etc...).
Mais où veux je en venir vous dites vous peut être?
Si j'ai montré qu'on peut changer le contenu d'une balise dynamiquement en stockant le texte ou l'adresse de l'image à afficher dans la page et changer celui ci facilement par le biais du programme on peut faire bien d'autre chose.
En PHP(pour ne citer que lui) on écris ce programme faisant la passerelle avec la base.
Les 2 fonctionnalités principale de PHP sont:
1_ de pouvoir récupérer des résultats ou en envoyer vers/de la base. Si vous êtes familier avec les bases de donnés vous savez que ça corresponds aux requêtes de SQL(Structured Query Language pour langage de requête structuré).
2_ de pouvoir écrire dans la page HTML.

Attardons nous sur le 2ème point:
Le programme écris dans la page HTML. HTML étant du texte PHP écris du texte.
Dans ce cas rien ne nous empêche plutôt que d'écrire dans la balise le texte à afficher d'écrire la balise elle même.

Si vous avez suivis et compris les parties précédentes cela veut dire:
Au lieu décrire:
Marque moi ce texte dans la alise du paragraphe d'actualités on peut tout à fait (faire)écrire par le programme non seulement ce texte actualisable(provenant de la base) mais aussi les balise elles mêmes.
Et bien sûr les règles de présentation/affichage de cette même balise(le CSS).

Nous en revenons au principe de l'analyse.
Si dans notre programme l'apparence du texte est soumise à des changements ce sont des données qui doivent être stockées dans la base.

Je vais tenter de représenter ce que le résultat donne:

En statique: balise + contenu de la balise écris de manière fixe dans le fichier.

En dynamique pour changer le contenu d'une balise:balise + résultat de la requête correspondant au contenu(texte, images...) à afficher
En dynamique toujours:résultat de la requête correspondant à la balise à afficher + résultat de la requête du contenu à afficher.

Q:"----l'onglet résultat de recherche va montrer --instantanément-- toutes les objets correspondant a ça recherche [2]. "
R:Donc toutes les éléments de mise en page qui seront prévus et enregistrés dans la base, les critères et catégories étant bien sûr des données des tables. Elles vont être assemblées selon leurs valeurs, exemple on propose un cadre rectangulaire et sa couleur, ces deux valeurs sont des données distinctes(puisqu'on peut avoir un cadre rouge ou bleu les tables doivent pouvoir adapter, voir partie dictionnaire de données de l'analyse: faire la liste exhaustive de tout ce qui peut être pris en compte).


Q:"---- [3]l'utilisateur va choisir de l'onglet [2] ( hold and drag si possible) et mettre les objets qui l'a choisit dans l'onglet [4]. "
R:Ces fonctionnalités correpondent au langage de programmation Javascript. Je ne l'ai pas évoqué et le détaillerais plus tard dans la partie outil.

Q:"---- Enfin il clique sur le bouton [done] pour avoir le résultat "
R:Comme décrit précédemment la liaison avec la base marche dans 2 sens.
De la base vers la page pour obtenir/afficher un contenu.
Du client(navigateur) vers la base(serveur) pour enregistrer des données dans les tables.
Cela correspond à enregistrer dans la table correspondante les données choisies pour l'utilisateur donné(lui aussi représentée par un jeu ou ligne de données d'une ou plusieurs tables). L'analyse et modélisation(des tables) et encore une fois la réponse à tout ça. c.a.d faire vos tables pour qu'elles correspondent aux besoins exprimées par tout votre système d'information(en suivant la logique informatique bien différente de la logique humaine, Merise est là pour ça).

q:"---- a la fin le résultat sera enregistrer dans le compte de l'utilisateur s'il est connecté."
r:voir réponse précédente. La gestion du clic n'est pas un question puisque correspond à une balise HTML. Les informations de la table sont présentes dans la page même si invible pour l'utilisateur. C'est le principe normal des formulaires.

merci bien.