JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html>

	<head>
		<style>
		
			#CorpsLeft { background-color: green; }
			#CorpsCenter { background-color: blue; }
			#CorpsRight { background-color: yellow; }
		
		</style>
	
	</head>

	<body>
		
		<div id="Header0"></div>

		<div id="Header1">
			
			<div class="HeaderRecherche">
				
				<center>

					<input type="text" id="champ" size="70"/>
          <BR/>
					<button onclick="recherche();">Rechercher</button>

					<noscript>
						<p>Ton navigateur est trop vieux, tu es le maillon faible, au revoir !</p>
					</noscript>
					
				</center>
				
			</div>
			
		</div>

		<div id="Corps">
		
			<div id="onError"></div>
			<div id="CorpsLeft"></div>
			<div id="CorpsCenter"></div>
			<div id="CorpsRight"></div>
			
		</div>

		<div id="Footer"></div>

	</body>

</html>

JavaScript

// fonction que tu peux mettre dans une autre page !
const getStore = function() {

  let data = [];

  data[0] = ["BIBLI 0", "", "02-2020", "doc/Bpc.pdf"];
  data[1] = ["CONNEXION 1", "", "02-2020", "doc/connexion.pdf"];
  data[2] = ["PERSONNAGE 2", "", "03-2020", "doc/personnage.pdf"];
  data[3] = ["MATRICE 3", "", "03-2020", "doc/NouvelleMatrice.pdf"];
  data[4] = ["REVISION 4", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[5] = ["REVISION 5", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[6] = ["REVISION 6", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[7] = ["REVISION 7", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[8] = ["REVISION 8", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[9] = ["REVISION 9", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[10] = ["BIBLI 10", "", "02-2020", "doc/Bpc.pdf"];
  data[11] = ["CONNEXION 11", "", "02-2020", "doc/connexion.pdf"];
  data[12] = ["PERSONNAGE 12 ", "", "03-2020", "doc/personnage.pdf"];
  data[13] = ["MATRICE 13", "", "03-2020", "doc/NouvelleMatrice.pdf"];
  data[14] = ["REVISION 14", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[15] = ["REVISION 15", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[16] = ["REVISION 16", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[17] = ["REVISION 17", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[18] = ["REVISION 18", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[19] = ["REVISION 19", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[20] = ["BIBLI 20", "", "02-2020", "doc/Bpc.pdf"];
  data[21] = ["CONNEXION 21", "", "02-2020", "doc/connexion.pdf"];
  data[22] = ["PERSONNAGE 22", "", "03-2020", "doc/personnage.pdf"];
  data[23] = ["MATRICE 23", "", "03-2020", "doc/NouvelleMatrice.pdf"];
  data[24] = ["REVISION 24", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[25] = ["REVISION 25", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[26] = ["REVISION 26", "", "03-2020", "doc/RelectureRapide.pdf"];
  data[27] = ["REVISION 27", "",...