diff --git a/.idea/.gitignore b/.idea/.gitignore
new file mode 100644
index 0000000..26d3352
--- /dev/null
+++ b/.idea/.gitignore
@@ -0,0 +1,3 @@
+# Default ignored files
+/shelf/
+/workspace.xml
diff --git a/.idea/TP_JavaScript.iml b/.idea/TP_JavaScript.iml
new file mode 100644
index 0000000..d6ebd48
--- /dev/null
+++ b/.idea/TP_JavaScript.iml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module type="JAVA_MODULE" version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="inheritedJdk" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>
\ No newline at end of file
diff --git a/.idea/misc.xml b/.idea/misc.xml
new file mode 100644
index 0000000..639900d
--- /dev/null
+++ b/.idea/misc.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectRootManager">
+    <output url="file://$PROJECT_DIR$/out" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/modules.xml b/.idea/modules.xml
new file mode 100644
index 0000000..1e0f82e
--- /dev/null
+++ b/.idea/modules.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/TP_JavaScript.iml" filepath="$PROJECT_DIR$/.idea/TP_JavaScript.iml" />
+    </modules>
+  </component>
+</project>
\ No newline at end of file
diff --git a/.idea/vcs.xml b/.idea/vcs.xml
new file mode 100644
index 0000000..35eb1dd
--- /dev/null
+++ b/.idea/vcs.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="" vcs="Git" />
+  </component>
+</project>
\ No newline at end of file
diff --git a/index.html b/index.html
index 911ea83..c98627d 100644
--- a/index.html
+++ b/index.html
@@ -19,7 +19,7 @@
         <div id="SECOND" style="overflow-y: scroll; height:100%;">
 
             <div id="HOME" style="display: none">
-                       
+
                 <div id="newsList"></div>
 
                 <!-- <newscard v-for="news in this.allNews"
@@ -46,13 +46,14 @@
                 <team-fight v-bind:allTeam="allTeam"></team-fight>
             </div>
         </div>
-        
 
-            
+
+
     </div>
 
     <script src="./src/misc/constant.js"></script>
     <script src="./src/error/required_field_error.js"></script>
+    <script src="./src/error/string_size.js"></script>
     <script src="./src/error/connection_error.js"></script>
     <script src="./src/service/api_service.js"></script>
     <script src="./src/service/news-service.js"></script>
@@ -88,18 +89,21 @@
             })
             .catch(error => {
                 console.error(error);
-            });    
+            });
     </script>
 
     <script type="module">
+
         import { createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js';
+        import Navbar from './src/view/navbar.js';
+        import Team from './src/view/team.js'
 
         import Navbar from '/src/view/navbar.js';
         import TeamAdd from '/src/view/team_add.js';
         import Teamcard from '/src/view/teamcard.js';
         import Newscard from '/src/view/newscard.js';
         import TeamFight from '/src/view/team-fight.js';
-      
+
         const app = createApp({
             data() {
                 return {
@@ -117,14 +121,18 @@
                 }
             }
         })
+        const app = createApp();
+
         app.component('Navbar', Navbar)
            .component('TeamAdd', TeamAdd)
            .component('Teamcard',Teamcard)
            .component('TeamFight',TeamFight)
-           .component('Newscard',Newscard);
-
+           .component('Newscard',Newscard)
+           .component('Team', Team);
         app.mount('#app');
     </script>
 </body>
 
-</html>
\ No newline at end of file
+</html>
+
+<!--Ctrl Maj R-->
\ No newline at end of file
diff --git a/src/error/string_size.js b/src/error/string_size.js
new file mode 100644
index 0000000..96f207e
--- /dev/null
+++ b/src/error/string_size.js
@@ -0,0 +1,5 @@
+class StringSize extends Error {
+    constructor(field,sSize) {
+        super('Le champ ' + field + ' doit avoir une taille superieur à '+sSize);
+    }
+}
\ No newline at end of file
diff --git a/src/misc/constant.js b/src/misc/constant.js
index 322ba48..fd5147e 100644
--- a/src/misc/constant.js
+++ b/src/misc/constant.js
@@ -1 +1,3 @@
-const ERROR_COLOR = 'red';
\ No newline at end of file
+const ERROR_COLOR = 'red';
+const DESCRIPTION_MINIMAL_SIZE = 1;
+const NAME_MINIMAL_SIZE = 1;
\ No newline at end of file
diff --git a/src/view/navbar.js b/src/view/navbar.js
index 2b8dbe3..5a86813 100644
--- a/src/view/navbar.js
+++ b/src/view/navbar.js
@@ -20,5 +20,4 @@ export default {
             <li onclick="showResults()"><a :href="linkResults">Results</a></li>
         </ul>
     `
-
 };
\ No newline at end of file
diff --git a/src/view/team_add.js b/src/view/team-add.js
similarity index 69%
rename from src/view/team_add.js
rename to src/view/team-add.js
index 44ac427..abee04c 100644
--- a/src/view/team_add.js
+++ b/src/view/team-add.js
@@ -1,7 +1,13 @@
 export default {
+    props: {
+        teamAEdit: {
+            type: String,
+            require: true
+        },
+    },
     data: function() {
         return {
-            id: '',
+            id:'',
             name: '',
             description: '',
             errorMessage: '',
@@ -11,25 +17,31 @@ export default {
     methods: {
         addTeam: function () {
             try {
+
                 this.errorMessage = '';
                 if (!this.id) {
-                    this.name = '';
-                    this.description= '';
                     throw new RequiredFieldError("ID");
                 }
                 if (!this.name) {
-                    this.id = '';
-                    this.description= '';
                     throw new RequiredFieldError("Name");
                 }
                 if (!this.description){
-                    this.id = '';
-                    this.name = '';
                     throw new RequiredFieldError("Description");
                 }
+                if (this.description.length < DESCRIPTION_MINIMAL_SIZE) {
+                    throw new StringSize("Description", DESCRIPTION_MINIMAL_SIZE)
+                }
+                if (this.name.length < NAME_MINIMAL_SIZE) {
+                    throw new StringSize("Name", NAME_MINIMAL_SIZE)
+                }
+
                 const team = { id: this.id, name: this.name, description: this.description};
 
-                this.$emit('addTeam', team);
+                if (this.teamAEdit != null) {
+                    this.$emit('teamModifie', team);
+                } else {
+                    this.$emit('teamAjoute', team);
+                }
 
                 this.id = '';
                 this.name = '';
@@ -39,17 +51,20 @@ export default {
                 if (error instanceof RequiredFieldError) {
                     this.errorMessage=error
                 }
+                if (error instanceof StringSize) {
+                    this.errorMessage = error
+                }
                 return null;
             }
         },
     },
     template: `<section>
-                <h2>News form</h2>
                 <form @submit.prevent>
                     <div v-bind:style="{ color: errorColor}">{{ errorMessage }}</div>
                     <div>
                         <label>ID</label><br/>
                         <input type="text" v-model="id"/>
+                        {{this.id}}
                     </div>
                     <div>
                         <label>Name</label><br/>
diff --git a/src/view/team.js b/src/view/team.js
new file mode 100644
index 0000000..be3fa85
--- /dev/null
+++ b/src/view/team.js
@@ -0,0 +1,52 @@
+import teamAdd from './team-add.js';
+import teamCard from './teamcard.js';
+
+
+export default {
+    data: function() {
+        return {
+            allTeam: [],
+            teamAEdit: null
+        }
+    },
+    methods: {
+        recupTeam: function (team) {
+            console.log('team.addTeam', team);
+            this.allTeam.push(team);
+        },
+        editParam: function (team) {
+            this.teamAEdit=team
+            console.log('lanceEdit')
+        },
+        updateTeam: function (team) {
+            console.log('update')
+            for (var i = 0; i < this.allTeam.length; i++) {
+                if (this.allTeam[i].id == this.teamAEdit.id) {
+                    console.log('update + +')
+                    this.allTeam[i].name = team.name
+                    this.allTeam[i].description=team.description
+                }
+            }
+        }
+
+
+    },
+    components: {
+        teamCard,
+        teamAdd
+    },
+    template: `
+        <section>
+            <h2>News form</h2>
+            <div class="team">
+                <teamAdd :teamAEdit="this.teamAEdit" v-on:teamAjoute="recupTeam" v-on:teamModifie="updateTeam"></teamAdd>
+            </div>
+            <teamCard v-for="team in allTeam"
+                      :id="team.id"
+                      :name="team.name"
+                      :description="team.description"
+                      v-on:teamEditer="editParam">
+            </teamCard>
+        </section>
+    `
+}
diff --git a/src/view/teamcard.js b/src/view/teamcard.js
index 2cf8b08..d3351b9 100644
--- a/src/view/teamcard.js
+++ b/src/view/teamcard.js
@@ -13,6 +13,19 @@ export default {
             require : true
         }
     },
+    data: function () {
+        return {
+            isEdit: false
+        }
+    },
+    methods: {
+        editTeam: function () {
+            this.isEdit = !this.isEdit;
+            const team = { id: this.id, name: this.name, description: this.description };
+            this.$emit('teamEditer', team);
+
+        }
+    },
     computed: {
         description20(){
             if (this.description.length > 20) {
@@ -21,12 +34,13 @@ export default {
                 return this.description;
               }
             }
-        },
+    },
     template: `
         <div class="card">
             <span>ID of the Team : {{ id }}</span>
             <p>Name : {{ name }}</p>
             <p>Description : {{ description20 }}</p>
+            <input type="submit" value="Edit" @click="editTeam"/>
         </div>
     `
 }
\ No newline at end of file