From b76fdc2b9b9a7de1a32d90590a2f3316f5144438 Mon Sep 17 00:00:00 2001 From: Tom Bray <tom.bray@student-cs.fr> Date: Fri, 3 Jun 2022 10:32:11 +0200 Subject: [PATCH 1/3] Initialisation de la branche --- frontend/src/views/Home.vue | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/frontend/src/views/Home.vue b/frontend/src/views/Home.vue index afd2064..71a259c 100644 --- a/frontend/src/views/Home.vue +++ b/frontend/src/views/Home.vue @@ -2,6 +2,8 @@ <div class="home"> <img alt="Vue logo" src="../assets/logo.png" /> <h1>Welcome to Your Vue.js App</h1> + <input type="text" v-model="moviename" /> + <div class="film-name">Le film est : {{ moviename }}</div> <p> For a guide and recipes on how to configure / customize this project,<br /> check out the @@ -79,6 +81,11 @@ <script> export default { name: "Home", + data: function () { + return { + moviename: 'test', + }; + }, }; </script> -- GitLab From 09a1f0d571af56ba9613f661b0c6742075bf67cf Mon Sep 17 00:00:00 2001 From: Tom Bray <tom.bray@student-cs.fr> Date: Fri, 3 Jun 2022 16:11:36 +0200 Subject: [PATCH 2/3] Initialisation front --- frontend/src/App.vue | 36 +++++----- frontend/src/components/Banner.vue | 17 +++++ frontend/src/components/Footer.vue | 17 +++++ frontend/src/components/NavBar.vue | 30 +++++++++ frontend/src/views/Home.vue | 103 ++++++++--------------------- 5 files changed, 109 insertions(+), 94 deletions(-) create mode 100644 frontend/src/components/Banner.vue create mode 100644 frontend/src/components/Footer.vue create mode 100644 frontend/src/components/NavBar.vue diff --git a/frontend/src/App.vue b/frontend/src/App.vue index 7aaa95a..bfc1057 100644 --- a/frontend/src/App.vue +++ b/frontend/src/App.vue @@ -1,25 +1,23 @@ <template> - <div class="nav"> - <router-link class="nav-link" to="/">Home</router-link> | - <router-link class="nav-link" to="/counter">Counter</router-link> | - <router-link class="nav-link" to="/users">Users</router-link> | - <router-link class="nav-link" to="/about">About</router-link> - </div> + <Banner /> + <NavBar /> <router-view /> + <Footer /> </template> -<style scoped> -.nav { - text-align: center; - padding: 30px; -} +<script> +import NavBar from "@/components/NavBar.vue"; +import Footer from "@/components/Footer.vue"; +import Banner from "@/components/Banner.vue"; -.nav-link { - font-weight: bold; - color: #2c3e50; -} +export default { + name: "App", + components: { + NavBar, + Footer, + Banner, + }, +}; +</script> -.nav-link.router-link-exact-active { - color: #42b983; -} -</style> +<style scoped></style> diff --git a/frontend/src/components/Banner.vue b/frontend/src/components/Banner.vue new file mode 100644 index 0000000..7c8e48e --- /dev/null +++ b/frontend/src/components/Banner.vue @@ -0,0 +1,17 @@ +<template> + <div class="banner"> + <img alt="Vue logo" src="../assets/logo.png" /> + </div> +</template> + +<script> +export default { + name: "Banner", +}; +</script> + +<style> +.banner { + text-align: center; +} +</style> diff --git a/frontend/src/components/Footer.vue b/frontend/src/components/Footer.vue new file mode 100644 index 0000000..83fcd50 --- /dev/null +++ b/frontend/src/components/Footer.vue @@ -0,0 +1,17 @@ +<template> + <div class="footer"> + <h4>Footer</h4> + </div> +</template> + +<script> +export default { + name: "Footer", +}; +</script> + +<style> +.footer { + text-align: center; +} +</style> diff --git a/frontend/src/components/NavBar.vue b/frontend/src/components/NavBar.vue new file mode 100644 index 0000000..5ff3a30 --- /dev/null +++ b/frontend/src/components/NavBar.vue @@ -0,0 +1,30 @@ +<template> + <div class="nav"> + <router-link class="nav-link" to="/">Accueil</router-link> | + <router-link class="nav-link" to="/counter">Counter</router-link> | + <router-link class="nav-link" to="/users">Users</router-link> | + <router-link class="nav-link" to="/about">About</router-link> + </div> +</template> + +<script> +export default { + name: "NavBar", +}; +</script> + +<style scoped> +.nav { + text-align: center; + padding: 30px; +} + +.nav-link { + font-weight: bold; + color: #2c3e50; +} + +.nav-link.router-link-exact-active { + color: #42b983; +} +</style> diff --git a/frontend/src/views/Home.vue b/frontend/src/views/Home.vue index 71a259c..2fb75bb 100644 --- a/frontend/src/views/Home.vue +++ b/frontend/src/views/Home.vue @@ -1,91 +1,44 @@ <template> <div class="home"> - <img alt="Vue logo" src="../assets/logo.png" /> - <h1>Welcome to Your Vue.js App</h1> - <input type="text" v-model="moviename" /> + <h1>Bienvenue sur CaCaoCritics</h1> + <input type="text" v-model="moviename" /> <div class="film-name">Le film est : {{ moviename }}</div> - <p> - For a guide and recipes on how to configure / customize this project,<br /> - check out the - <a href="https://cli.vuejs.org" target="_blank">vue-cli documentation</a>. - </p> - <h3>Installed CLI Plugins</h3> - <ul> - <li> - <a - href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" - target="_blank" - >babel</a - > - </li> - <li> - <a - href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" - target="_blank" - >router</a - > - </li> - <li> - <a - href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" - target="_blank" - >eslint</a - > - </li> - </ul> - <h3>Essential Links</h3> - <ul> - <li> - <a href="https://vuejs.org" target="_blank">Core Docs</a> - </li> - <li> - <a href="https://forum.vuejs.org" target="_blank">Forum</a> - </li> - <li> - <a href="https://chat.vuejs.org" target="_blank">Community Chat</a> - </li> - <li> - <a href="https://twitter.com/vuejs" target="_blank">Twitter</a> - </li> - <li> - <a href="https://news.vuejs.org" target="_blank">News</a> - </li> - </ul> - <h3>Ecosystem</h3> - <ul> - <li> - <a href="https://router.vuejs.org" target="_blank">vue-router</a> - </li> - <li> - <a href="https://vuex.vuejs.org" target="_blank">vuex</a> - </li> - <li> - <a - href="https://github.com/vuejs/vue-devtools#vue-devtools" - target="_blank" - >vue-devtools</a - > - </li> - <li> - <a href="https://vue-loader.vuejs.org" target="_blank">vue-loader</a> - </li> - <li> - <a href="https://github.com/vuejs/awesome-vue" target="_blank" - >awesome-vue</a - > - </li> - </ul> + <li v-for="movie in movies" :key="movie.id"> + {{ movie.title }} + </li> </div> </template> <script> +import axios from "axios"; + export default { name: "Home", data: function () { return { - moviename: 'test', + moviename: "test", + movies: [], + moviesLoadingError: "", }; }, + methods: { + fetchMovies: function () { + axios + .get( + `https://api.themoviedb.org/3/movie/popular?api_key=522d421671cf75c2cba341597d86403a` + ) + .then((response) => { + this.movies = response.data.results; + }) + .catch((error) => { + this.moviesLoadingError = "An error occured while fetching movies."; + console.error(error); + }); + }, + }, + created() { + this.fetchMovies(); + }, }; </script> -- GitLab From a244548e71338b1ed89608177ad68899ee421e71 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Juliette=20Kalfl=C3=A8che?= <juliette.kalfleche@student-cs.fr> Date: Fri, 3 Jun 2022 17:05:31 +0200 Subject: [PATCH 3/3] initialisation --- frontend/src/assets/logo.png | Bin 6849 -> 3026 bytes frontend/src/components/Banner.vue | 5 +++-- frontend/src/components/Footer.vue | 1 + frontend/src/components/Movie.vue | 27 +++++++++++++++++++++++++++ frontend/src/components/NavBar.vue | 2 +- frontend/src/views/Home.vue | 15 +++++++++++---- 6 files changed, 43 insertions(+), 7 deletions(-) create mode 100644 frontend/src/components/Movie.vue diff --git a/frontend/src/assets/logo.png b/frontend/src/assets/logo.png index f3d2503fc2a44b5053b0837ebea6e87a2d339a43..abae93914fcfa57de1be67d23b56816fa21f8975 100644 GIT binary patch literal 3026 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 literal 6849 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 Hr-UW|hR3J6 diff --git a/frontend/src/components/Banner.vue b/frontend/src/components/Banner.vue index 7c8e48e..1080e09 100644 --- a/frontend/src/components/Banner.vue +++ b/frontend/src/components/Banner.vue @@ -1,6 +1,6 @@ <template> <div class="banner"> - <img alt="Vue logo" src="../assets/logo.png" /> + <Text>CaCaoCritics</Text> </div> </template> @@ -12,6 +12,7 @@ export default { <style> .banner { - text-align: center; + text-align: left; + background-color: #FF68AD; } </style> diff --git a/frontend/src/components/Footer.vue b/frontend/src/components/Footer.vue index 83fcd50..12c47ba 100644 --- a/frontend/src/components/Footer.vue +++ b/frontend/src/components/Footer.vue @@ -13,5 +13,6 @@ export default { <style> .footer { text-align: center; + background-color: #FF68AD; } </style> diff --git a/frontend/src/components/Movie.vue b/frontend/src/components/Movie.vue new file mode 100644 index 0000000..2e8ab7e --- /dev/null +++ b/frontend/src/components/Movie.vue @@ -0,0 +1,27 @@ +<template> + <table> + <thead> + <th>Titre</th> + <th>Date de sortie</th> + <th>Image</th> + </thead> + <tbody> + <tr v-for="movie in movies" :key="movie.id"> + <td>{{ movie.title }}</td> + <td>{{ movie.release_date }}</td> + <td> <img :src= "'https://image.tmdb.org/t/p/original/' + movie.poster_path" /> </td> + </tr> + </tbody> + </table> +</template> + +<script> +export default { + props: { + movies: Array, + }, +}; +</script> + +<style scoped> +</style> diff --git a/frontend/src/components/NavBar.vue b/frontend/src/components/NavBar.vue index 5ff3a30..f87eacb 100644 --- a/frontend/src/components/NavBar.vue +++ b/frontend/src/components/NavBar.vue @@ -25,6 +25,6 @@ export default { } .nav-link.router-link-exact-active { - color: #42b983; + color: #FF68AD; } </style> diff --git a/frontend/src/views/Home.vue b/frontend/src/views/Home.vue index 2fb75bb..0a2fe0f 100644 --- a/frontend/src/views/Home.vue +++ b/frontend/src/views/Home.vue @@ -1,10 +1,17 @@ <template> <div class="home"> <h1>Bienvenue sur CaCaoCritics</h1> - <input type="text" v-model="moviename" /> + <img alt="Vue logo" src="../assets/logo.png" /> + <br /> + <input type="text" v-model="moviename" placeholder="enter a movie name"/> <div class="film-name">Le film est : {{ moviename }}</div> <li v-for="movie in movies" :key="movie.id"> - {{ movie.title }} + <p> + {{ movie.title }} + </p> + <p> + <img :src= "'https://image.tmdb.org/t/p/original/' + movie.poster_path" withd="100" height="300" /> + </p> </li> </div> </template> @@ -16,7 +23,7 @@ export default { name: "Home", data: function () { return { - moviename: "test", + moviename: "", movies: [], moviesLoadingError: "", }; @@ -63,6 +70,6 @@ li { } a { - color: #42b983; + color: #FF68AD; } </style> -- GitLab