diff --git a/components/search.riot b/components/search.riot
index dd5b3a1..cab63af 100644
--- a/components/search.riot
+++ b/components/search.riot
@@ -1,33 +1,50 @@
 <search>
     <label>
-	    <input oninput={search} type="input" placeholder= {state.formation}>
-        <p class="error"></p>
+	    <input oninput={searchF} type="input" placeholder= {state.formation}>
 		<div id="list-formations">
+            <ul>
+	            <li each={item in this.state.items}>
+		           <a href={item.path} target="_blank">{item.name}</a>
+                   <span>{item.count}</span>
+	            </li>
+            </ul>
 		</div>
     </label>
-
     <script>
-        import model from '../javascript/modelSearch.js';
-    	import Controller from '../javascript/controllerSearch.js';
-    	import View from '../javascript/viewSearch.js';
+
+        async function formation(){
+            let result = await fetch("https://data.enseignementsup-recherche.gouv.fr/api/records/1.0/search/?dataset=fr-esr-parcoursup&q=&sort=tri&facet=fili&timezone=Europe%2FBerlin")
+            let resultats = await result.json()
+            let table = resultats["facet_groups"][0]["facets"]
+            return table
+        }
 
         export default function search(){
-			return {
-				onBeforeMount(props, state) {
-					// initial state
-					this.state = {
-						formation: props.formation
-					}
-				},
-                search(){
-                    
-                    console.log("test1")
-                    const view = new View()
-                    const app = new Controller(view,model)
+            return {
+                onBeforeMount(props, state) {
+                // initial state
+                    this.state = {
+                        formation: props.formation,
+                        items: null
+                    }
+                    formation().then((response) => {
+			            this.update({
+                            items: response
+					    })
+		            })
+                    console.log(this.state.items)
+                },
+                searchF(){
+                    formation().then((response) => {
+			            this.update({
+                            items: response
+					    })
+		            })
+                    console.log(this.state.items)
                 }
-                
             }
         }
+
         
     </script>
 </search>
\ No newline at end of file
diff --git a/components/testformation.riot b/components/testformation.riot
new file mode 100644
index 0000000..d4eec3e
--- /dev/null
+++ b/components/testformation.riot
@@ -0,0 +1,52 @@
+<formation>
+<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.3/css/bulma.min.css">
+<table class="table is-fullwidth is-hoverable">
+                <tbody1>
+                    <tr >
+                        <th></th>
+                        <th></th>
+                    </tr>
+                </tbody1>
+</table>
+
+<script>
+async function formation (){
+
+
+
+    let result = await fetch("https://data.enseignementsup-recherche.gouv.fr/api/records/1.0/search/?dataset=fr-esr-parcoursup&q=&sort=tri&facet=fili&timezone=Europe%2FBerlin")
+    let resultats = await result.json()
+    console.log(result)
+    console.log(resultats)
+    let base=[]
+    let filieretable=[]
+    let filieredetail=[] 
+
+    let table = resultats["facet_groups"][0]["facets"]
+    console.log(table)
+    
+    const tableBody = document.querySelector("tbody1")
+    for(tes of table){
+        const tableRow = document.createElement("tr")
+
+        const formationCell = document.createElement("td")
+        let texteformation = document.createTextNode(tes.name)
+        formationCell.appendChild(texteformation)
+        tableRow.appendChild(formationCell)
+
+        const nombredeplaceCell = document.createElement("td")
+        const nombredeplace = document.createTextNode(tes.count)
+        nombredeplaceCell.appendChild(nombredeplace)
+        tableRow.appendChild(nombredeplaceCell)
+        
+        tableBody.appendChild(tableRow)        
+    }
+}
+    export default{
+            onMounted(){
+                formation()
+            }
+    }
+
+</script>
+</formation>
\ No newline at end of file
diff --git a/index.html b/index.html
index 74d0517..f00be26 100644
--- a/index.html
+++ b/index.html
@@ -7,10 +7,21 @@
 		<script src="riot.min.js"></script>
 		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.9.3/css/bulma.min.css">
 		<script src="loader.js" type="module"></script>
+		<script src="components/search.riot" type="riot"></script>
+		<script src="https://cdnjs.cloudflare.com/ajax/libs/riot/7.1.0/riot+compiler.min.js" integrity="sha512-sSGKGR9MvL0bUx3CScaBb56crXwspwDkL/JnB0IrLFQfw3uvSUlITQtsTtDZctshhv5wdwIt+qZeN8zThRF4Dw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
 	</head>
 
 	<body>
 		<search></search>
-		<school-info></school-info>
+		<script src="javascript/school-info.js" type="javascript"></script>
+		<script>
+			riot.compile().then(() => {
+				riot.mount('search', {
+					formation:'Formation',
+					items: null,
+					text: null
+				})
+			})
+		</script>
 	</body>
 </html>
diff --git a/javascript/controllerSearch.js b/javascript/controllerSearch.js
deleted file mode 100644
index 3788a29..0000000
--- a/javascript/controllerSearch.js
+++ /dev/null
@@ -1,31 +0,0 @@
-class   Controller  {
-	constructor(view,model){
-		this.view = view
-		this.model = model
-
-		this.loading = false
-		this.lastSearch = null
-		this.error = null
-		this.results = []
-
-		this.view.setLoading(false)
-		this.view.bindSearch(this.search.bind(this))
-	}
-	reset() {
-		this.loading = false
-		this.error = null
-		this.results = []
-	}
-
-	async search(formation) {
-        this.model.getFormations(formation).then((response) => {
-			let table = response["facet groups"][0]["facets"]
-            this.view.renderList(table)
-        }).catch((error) => {
-        this.view.renderMessage(error)
-        })
-    }
-} 
-
-export default Controller
-
diff --git a/javascript/modelSearch.js b/javascript/modelSearch.js
deleted file mode 100644
index 4e78cb8..0000000
--- a/javascript/modelSearch.js
+++ /dev/null
@@ -1,21 +0,0 @@
-let model = {
-	getFormations(search) {
-		return new Promise((resolve, reject) => {
-			let xhr = new XMLHttpRequest()
-			xhr.open("GET", "/api/records/1.0/search/?dataset=fr-esr-parcoursup&q=&sort=tri&facet=fili&timezone=Europe%2FBerlin")
-			xhr.responseType = "json"
-
-			xhr.onload = (ev) => {
-				if (xhr.status == 200)
-					resolve(xhr.response)
-			}
-			xhr.onerror = () => {
-				reject("error")
-			}
-			xhr.send()
-		})
-
-	}
-}
-
-export default model
\ No newline at end of file
diff --git a/javascript/viewSearch.js b/javascript/viewSearch.js
deleted file mode 100644
index 5b8043b..0000000
--- a/javascript/viewSearch.js
+++ /dev/null
@@ -1,51 +0,0 @@
-function debounce(fn, wait) {
-	let timeout
-
-	return (...args) => {
-		clearTimeout(timeout)
-		timeout = setTimeout(() => fn(...args), wait)
-	}
-}
-
-class View {
-	constructor(){
-		this.listFormations = document.querySelector("#list-formations")
-		this.inputSearch = document.querySelector("input")
-		this.message = document.querySelector("p.error")
-	}
-
-	_getInput(){
-		return this.inputSearch.value
-	}
-	renderMessage(error){
-		this.message.style.display = "block"
-		this.message.textContent = error
-	}
-
-	renderList(formations){
-		let ul = document.createElement("ul")
-		formations.forEach((formation)=>{
-			let li = document.createElement("li")
-			let a = document.createElement("a")
-			let span = document.createElement("span")
-			//a.href = `test`
-			a.target="_blank"
-			a.textContent = formation.name
-			span.textContent = formation.name
-
-			li.appendChild(a)
-			li.appendChild(span)
-			ul.appendChild(li)
-		})
-
-		this.listFormations.replaceChildren(ul)
-	}
-
-	bindSearch(handler){
-		this.inputSearch.addEventListener("input",debounce((e)=>{
-			handler(this._getInput())	
-		},500))
-	}
-}
-
-export default View