Adding projects pagas, missing fantomgames page only
continuous-integration/drone/push Build is passing Details

master
Dorian HODIN 12 months ago
parent ba1f654b90
commit f5392fda73

File diff suppressed because one or more lines are too long

@ -1,14 +1,3 @@
/**
* Template Name: Personal
* Template URL: https://bootstrapmade.com/personal-free-resume-bootstrap-template/
* Updated: Mar 17 2024 with Bootstrap v5.3.3
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
*/
/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body {
font-family: "Open Sans", sans-serif;
background-color: #040404;
@ -17,6 +6,32 @@ body {
background: transparent;
}
.projectContainer{
width: 80%;
margin: 0 auto;
padding: 20px;
}
.project {
border: 5px solid #18d26e;
border-radius: 8px;
margin: 20px 0;
padding: 20px;
text-align: center;
transition: box-shadow 0.3s;
background-color: #040404;
}
.project:hover {
box-shadow: 0 7px 12px #18d26e;
}
.project-title {
font-size: 24px;
margin: 15px 0;
}
.project-link {
text-decoration: none;
color: #007BFF;
}
.container_perso {
display: flex;
flex-wrap: wrap;
@ -41,6 +56,35 @@ body::before {
z-index: -1;
}
.container.experience {
float: right;
position: relative;
}
.timeline-img {
float: left;
margin-left: 20px;
top: 0;
transform: scaleX(-1);
}
.experience-item {
position: relative;
}
.more-info {
position: absolute;
top: 15%;
left: 70%;
width: 30%;
background-color: black;
border: 1px solid #18d26e;
box-shadow: 0 7px 12px #18d26e;
z-index: 10;
font-size: 85%;
overflow: hidden;
transition: opacity 0.3s ease, max-height 0.3s ease;
}
@media (min-width: 1024px) {
body::before {
background-attachment: fixed;
@ -66,9 +110,6 @@ h6 {
font-family: "Raleway", sans-serif;
}
/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {
transition: ease-in-out 0.3s;
position: relative;
@ -204,12 +245,6 @@ h6 {
}
}
/*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
/**
* Desktop Navigation
*/
.navbar {
padding: 0;
margin-top: 35px;
@ -279,9 +314,6 @@ h6 {
color: #fff;
}
/**
* Mobile Navigation
*/
.mobile-nav-toggle {
color: #fff;
font-size: 28px;
@ -350,9 +382,6 @@ h6 {
position: relative;
}
/*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
section {
overflow: hidden;
position: absolute;
@ -370,6 +399,10 @@ section.section-show {
opacity: 1;
padding-bottom: 45px;
}
.project-title {
font-size: 300%;
margin: 15px 0;
}
section .container {
background: rgba(0, 0, 0, 0.9);
@ -417,9 +450,6 @@ section .container {
color: #fff;
}
/*--------------------------------------------------------------
# About
--------------------------------------------------------------*/
.about-me .content h3 {
font-weight: 700;
font-size: 26px;
@ -452,9 +482,6 @@ section .container {
margin-bottom: 0;
}
/*--------------------------------------------------------------
# Counts
--------------------------------------------------------------*/
.counts {
padding: 70px 0 60px;
}
@ -494,9 +521,7 @@ section .container {
font-size: 14px;
}
/*--------------------------------------------------------------
# Skills
--------------------------------------------------------------*/
.skills .progress {
height: 60px;
display: block;
@ -530,9 +555,7 @@ section .container {
background-color: #18d26e;
}
/*--------------------------------------------------------------
# Interests
--------------------------------------------------------------*/
.interests .icon-box {
display: flex;
align-items: center;
@ -558,645 +581,4 @@ section .container {
.interests .icon-box:hover {
background: rgba(255, 255, 255, 0.12);
}
/*--------------------------------------------------------------
# Testimonials
--------------------------------------------------------------*/
.testimonials .testimonials-carousel,
.testimonials .testimonials-slider {
overflow: hidden;
}
.testimonials .testimonial-item {
box-sizing: content-box;
min-height: 320px;
}
.testimonials .testimonial-item .testimonial-img {
width: 90px;
border-radius: 50%;
margin: -40px 0 0 40px;
position: relative;
z-index: 2;
border: 6px solid rgba(255, 255, 255, 0.12);
}
.testimonials .testimonial-item h3 {
font-size: 18px;
font-weight: bold;
margin: 10px 0 5px 45px;
color: #fff;
}
.testimonials .testimonial-item h4 {
font-size: 14px;
color: #999;
margin: 0 0 0 45px;
}
.testimonials .testimonial-item .quote-icon-left,
.testimonials .testimonial-item .quote-icon-right {
color: rgba(255, 255, 255, 0.25);
font-size: 26px;
}
.testimonials .testimonial-item .quote-icon-left {
display: inline-block;
left: -5px;
position: relative;
}
.testimonials .testimonial-item .quote-icon-right {
display: inline-block;
right: -5px;
position: relative;
top: 10px;
}
.testimonials .testimonial-item p {
font-style: italic;
margin: 0 15px 0 15px;
padding: 20px 20px 60px 20px;
background: rgba(255, 255, 255, 0.1);
position: relative;
border-radius: 6px;
position: relative;
z-index: 1;
}
.testimonials .swiper-pagination {
margin-top: 20px;
position: relative;
}
.testimonials .swiper-pagination .swiper-pagination-bullet {
width: 12px;
height: 12px;
opacity: 1;
background-color: rgba(255, 255, 255, 0.3);
}
.testimonials .swiper-pagination .swiper-pagination-bullet-active {
background-color: #18d26e;
}
/*--------------------------------------------------------------
# Resume
--------------------------------------------------------------*/
.resume .resume-title {
font-size: 26px;
font-weight: 700;
margin-top: 20px;
margin-bottom: 20px;
color: #fff;
}
.resume .resume-item {
padding: 0 0 20px 20px;
margin-top: -2px;
border-left: 2px solid rgba(255, 255, 255, 0.2);
position: relative;
}
.resume .resume-item h4 {
line-height: 18px;
font-size: 18px;
font-weight: 600;
text-transform: uppercase;
font-family: "Poppins", sans-serif;
color: #18d26e;
margin-bottom: 10px;
}
.resume .resume-item h5 {
font-size: 16px;
background: rgba(255, 255, 255, 0.15);
padding: 5px 15px;
display: inline-block;
font-weight: 600;
margin-bottom: 10px;
}
.resume .resume-item ul {
padding-left: 20px;
}
.resume .resume-item ul li {
padding-bottom: 10px;
}
.resume .resume-item:last-child {
padding-bottom: 0;
}
.resume .resume-item::before {
content: "";
position: absolute;
width: 16px;
height: 16px;
border-radius: 50px;
left: -9px;
top: 0;
background: #18d26e;
border: 2px solid #18d26e;
}
/*--------------------------------------------------------------
# Services
--------------------------------------------------------------*/
.services .icon-box {
text-align: center;
background: rgba(204, 204, 204, 0.1);
padding: 80px 20px;
transition: all ease-in-out 0.3s;
}
.services .icon-box .icon {
margin: 0 auto;
width: 64px;
height: 64px;
background: #18d26e;
border-radius: 5px;
transition: all 0.3s ease-out 0s;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20px;
transform-style: preserve-3d;
}
.services .icon-box .icon i {
color: #fff;
font-size: 28px;
}
.services .icon-box .icon::before {
position: absolute;
content: "";
left: -8px;
top: -8px;
height: 100%;
width: 100%;
background: rgba(255, 255, 255, 0.15);
border-radius: 5px;
transition: all 0.3s ease-out 0s;
transform: translateZ(-1px);
}
.services .icon-box h4 {
font-weight: 700;
margin-bottom: 15px;
font-size: 24px;
}
.services .icon-box h4 a {
color: #fff;
}
.services .icon-box p {
line-height: 24px;
font-size: 14px;
margin-bottom: 0;
}
.services .icon-box:hover {
background: #18d26e;
border-color: #18d26e;
}
.services .icon-box:hover .icon {
background: #fff;
}
.services .icon-box:hover .icon i {
color: #18d26e;
}
.services .icon-box:hover .icon::before {
background: #35e888;
}
.services .icon-box:hover h4 a,
.services .icon-box:hover p {
color: #fff;
}
/*--------------------------------------------------------------
# Portfolio
--------------------------------------------------------------*/
.portfolio .portfolio-item {
margin-bottom: 30px;
}
.portfolio #portfolio-flters {
padding: 0;
margin: 0 auto 15px auto;
list-style: none;
text-align: center;
border-radius: 50px;
padding: 2px 15px;
}
.portfolio #portfolio-flters li {
cursor: pointer;
display: inline-block;
padding: 8px 16px 10px 16px;
font-size: 14px;
font-weight: 600;
line-height: 1;
text-transform: uppercase;
color: #fff;
background: rgba(255, 255, 255, 0.1);
margin: 0 3px 10px 3px;
transition: all 0.3s ease-in-out;
border-radius: 4px;
}
.portfolio #portfolio-flters li:hover,
.portfolio #portfolio-flters li.filter-active {
background: #18d26e;
}
.portfolio #portfolio-flters li:last-child {
margin-right: 0;
}
.portfolio .portfolio-wrap {
transition: 0.3s;
position: relative;
overflow: hidden;
z-index: 1;
background: rgba(0, 0, 0, 0.6);
}
.portfolio .portfolio-wrap::before {
content: "";
background: rgba(0, 0, 0, 0.6);
position: absolute;
left: 30px;
right: 30px;
top: 30px;
bottom: 30px;
transition: all ease-in-out 0.3s;
z-index: 2;
opacity: 0;
}
.portfolio .portfolio-wrap .portfolio-info {
opacity: 0;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
text-align: center;
z-index: 3;
transition: all ease-in-out 0.3s;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.portfolio .portfolio-wrap .portfolio-info::before {
display: block;
content: "";
width: 48px;
height: 48px;
position: absolute;
top: 35px;
left: 35px;
border-top: 3px solid #fff;
border-left: 3px solid #fff;
transition: all 0.5s ease 0s;
z-index: 9994;
}
.portfolio .portfolio-wrap .portfolio-info::after {
display: block;
content: "";
width: 48px;
height: 48px;
position: absolute;
bottom: 35px;
right: 35px;
border-bottom: 3px solid #fff;
border-right: 3px solid #fff;
transition: all 0.5s ease 0s;
z-index: 9994;
}
.portfolio .portfolio-wrap .portfolio-info h4 {
font-size: 20px;
color: #fff;
font-weight: 600;
}
.portfolio .portfolio-wrap .portfolio-info p {
color: #ffffff;
font-size: 14px;
text-transform: uppercase;
padding: 0;
margin: 0;
}
.portfolio .portfolio-wrap .portfolio-links {
text-align: center;
z-index: 4;
}
.portfolio .portfolio-wrap .portfolio-links a {
color: #fff;
margin: 0 2px;
font-size: 28px;
display: inline-block;
transition: 0.3s;
}
.portfolio .portfolio-wrap .portfolio-links a:hover {
color: #63eda3;
}
.portfolio .portfolio-wrap:hover::before {
top: 0;
left: 0;
right: 0;
bottom: 0;
opacity: 1;
}
.portfolio .portfolio-wrap:hover .portfolio-info {
opacity: 1;
}
.portfolio .portfolio-wrap:hover .portfolio-info::before {
top: 15px;
left: 15px;
}
.portfolio .portfolio-wrap:hover .portfolio-info::after {
bottom: 15px;
right: 15px;
}
/*--------------------------------------------------------------
# Portfolio Details
--------------------------------------------------------------*/
.portfolio-details {
padding-top: 40px;
background: rgba(0, 0, 0, 0.8);
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
overflow-y: auto;
}
.portfolio-details .container {
padding-top: 20px;
padding-bottom: 40px;
}
.portfolio-details .portfolio-title {
font-size: 26px;
font-weight: 700;
margin-bottom: 20px;
}
.portfolio-details .portfolio-info {
padding-top: 45px;
}
.portfolio-details .portfolio-info h3 {
font-size: 22px;
font-weight: 400;
margin-bottom: 20px;
}
.portfolio-details .portfolio-info ul {
list-style: none;
padding: 0;
font-size: 15px;
}
.portfolio-details .portfolio-info ul li+li {
margin-top: 10px;
}
.portfolio-details .portfolio-info p {
font-size: 15px;
padding: 15px 0 0 0;
}
@media (max-width: 992px) {
.portfolio-details .portfolio-info {
padding-top: 20px;
}
}
.portfolio-details .swiper-pagination {
margin-top: 20px;
position: relative;
}
.portfolio-details .swiper-pagination .swiper-pagination-bullet {
width: 12px;
height: 12px;
opacity: 1;
background-color: rgba(255, 255, 255, 0.3);
}
.portfolio-details .swiper-pagination .swiper-pagination-bullet-active {
background-color: #18d26e;
}
/*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/
.contact .info-box {
color: #444444;
padding: 20px;
width: 100%;
background: rgba(255, 255, 255, 0.08);
}
.contact .info-box i.bx {
font-size: 24px;
color: #18d26e;
border-radius: 50%;
padding: 14px;
float: left;
background: rgba(255, 255, 255, 0.1);
}
.contact .info-box h3 {
font-size: 20px;
color: rgba(255, 255, 255, 0.5);
font-weight: 700;
margin: 10px 0 8px 68px;
}
.contact .info-box p {
padding: 0;
color: #fff;
line-height: 24px;
font-size: 14px;
margin: 0 0 0 68px;
}
.contact .info-box .social-links {
margin: 5px 0 0 68px;
display: flex;
}
.contact .info-box .social-links a {
font-size: 18px;
display: inline-block;
color: #fff;
line-height: 1;
margin-right: 12px;
transition: 0.3s;
}
.contact .info-box .social-links a:hover {
color: #18d26e;
}
.contact .php-email-form {
padding: 30px;
background: rgba(255, 255, 255, 0.08);
}
.contact .php-email-form .error-message {
display: none;
background: rgba(255, 255, 255, 0.08);
background: #ed3c0d;
text-align: left;
padding: 15px;
font-weight: 600;
}
.contact .php-email-form .error-message br+br {
margin-top: 25px;
}
.contact .php-email-form .sent-message {
display: none;
background: rgba(255, 255, 255, 0.08);
background: #18d26e;
text-align: center;
padding: 15px;
font-weight: 600;
}
.contact .php-email-form .loading {
display: none;
background: rgba(255, 255, 255, 0.08);
text-align: center;
padding: 15px;
}
.contact .php-email-form .loading:before {
content: "";
display: inline-block;
border-radius: 50%;
width: 24px;
height: 24px;
margin: 0 10px -6px 0;
border: 3px solid #18d26e;
border-top-color: #eee;
animation: animate-loading 1s linear infinite;
}
.contact .php-email-form input,
.contact .php-email-form textarea {
border-radius: 0;
box-shadow: none;
font-size: 14px;
background: rgba(255, 255, 255, 0.08);
border: 0;
transition: 0.3s;
color: #fff;
}
.contact .php-email-form input:focus,
.contact .php-email-form textarea:focus {
background-color: rgba(255, 255, 255, 0.11);
}
.contact .php-email-form input::-moz-placeholder,
.contact .php-email-form textarea::-moz-placeholder {
color: rgba(255, 255, 255, 0.3);
opacity: 1;
}
.contact .php-email-form input::placeholder,
.contact .php-email-form textarea::placeholder {
color: rgba(255, 255, 255, 0.3);
opacity: 1;
}
.contact .php-email-form input {
padding: 10px 15px;
}
.contact .php-email-form textarea {
padding: 12px 15px;
}
.contact .php-email-form button[type=submit] {
background: #18d26e;
border: 0;
padding: 10px 30px;
color: #fff;
transition: 0.4s;
border-radius: 4px;
}
.contact .php-email-form button[type=submit]:hover {
background: #15bb62;
}
@keyframes animate-loading {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
/*--------------------------------------------------------------
# Credits
--------------------------------------------------------------*/
.credits {
position: fixed;
right: 0;
left: 0;
bottom: 0;
padding: 15px;
text-align: right;
font-size: 13px;
color: #fff;
z-index: 999999;
}
@media (max-width: 992px) {
.credits {
text-align: center;
padding: 10px;
background: rgba(0, 0, 0, 0.8);
}
}
.credits a {
color: #18d26e;
transition: 0.3s;
}
.credits a:hover {
color: #fff;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 167 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 717 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 512 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 109 KiB

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 75 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 114 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.9 KiB

@ -1,16 +1,10 @@
/*!
Waypoints - 4.0.1
Copyright © 2011-2016 Caleb Troughton
Licensed under the MIT license.
https://github.com/imakewebthings/waypoints/blob/master/licenses.txt
*/
(function() {
'use strict'
var keyCounter = 0
var allWaypoints = {}
/* http://imakewebthings.com/waypoints/api/waypoint */
function Waypoint(options) {
if (!options) {
throw new Error('No options passed to Waypoint constructor')

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

@ -1,11 +1,15 @@
/**
* Template Name: Personal
* Template URL: https://bootstrapmade.com/personal-free-resume-bootstrap-template/
* Updated: Mar 17 2024 with Bootstrap v5.3.3
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
*/
document.querySelectorAll('.experience-item').forEach(item => {
item.addEventListener('mouseenter', () => {
const moreInfo = item.querySelector('.more-info');
moreInfo.textContent = item.getAttribute('data-info');
});
item.addEventListener('mouseleave', () => {
const moreInfo = item.querySelector('.more-info');
moreInfo.textContent = '';
});
});
(function() {
"use strict";

@ -122,8 +122,50 @@
</section>
<section id="experience" class="experience">
<div class="container">
<div class="section-title">
<h2>Experiences :</h2>
</div>
<div class="container experience">
<img src="./assets/img/timeline.png" class="timeline-img" width="15%">
<div class="experience-item" data-info="Mon premier travail d'été, j'ai pu découvrir le monde de l'entreprise et les relations clients. J'ai eu beaucoup de mal au début à réussir à aller voir les clients, mais au final je me suis vite adapté, mon patron était satisfait de mon travail et j'ai été content de pouvoir améliorer mes relations sociales et mon sens de l'organisation.">
<h2>Juillet 2022</h2>
<p>Conseiller clientèle chez Sarl Top Modèle, Lozanne, 69380</p>
<ul>
<li>Vente, caisse</li>
<li>Travail dans une équipe</li>
<li>Réception et tri de la réserve</li>
</ul>
<div class="more-info"></div>
</div>
<div class="experience-item" data-info="Premier stage dans le cadre de mon BUT de deuxième année, et première fois dans une entreprise informatique. J'ai eu une très bonne équipe lors de mon stage, j'ai donc vite été à l'aise et mon travail m'as baeaucoup plus. J'ai même eu l'occasion de présenter ce que j'avais réalisé lors d'une réunion devant une dizaine de responsable Michelin.">
<h2>10 Avril - 16 Juin 2023</h2>
<p>Stage chez CGI pour Michelin</p>
<ul>
<li>Développement d'une application de gestion de flux monitoring</li>
<li>Écriture de nombreux scripts SQL avec Oracle, utilisation de SQL developer</li>
<li>Utilisation de Splunk</li>
</ul>
<div class="more-info"></div>
</div>
<div class="experience-item" data-info="Après mon stage, CGI m'as proposé une alternance pour suivre ma troisième année de BUT Informatique. J'ai encore une fois eu une équipe formidable, et j'ai l'occasion de développer mes capacitésde développement grâce à une organisation au sein de l'équipe assez stricte, mais c'est aussi l'occasion de développer des compétences de management et d'organisation plus poussée.">
<h2>Septembre 2023 - Aout 2024</h2>
<p>Alternance chez CGI pour Michelin</p>
<ul>
<li>Développement de services pour permettre la réalisation de tests sur loutil Kafka</li>
<li>Création de Dashboard Grafana pour extraire les erreurs présentes dans les logs</li>
<li>Création de micro-services SpringBoot (langage Java)</li>
<li>Création et configuration dun serveur Kafka et dun outil AKHQ avec Docker</li>
</ul>
<div class="more-info"></div>
</div>
</div>
</div>
</section>
<section id="competence" class="competence">
<div class="skills container">
<div class="section-title">
@ -222,12 +264,32 @@
</section>
<section id="projects" class="projects">
<div class="container projectContainer">
<div class="section-title">
<h2>Mes projets :</h2>
</div>
<div class="project">
<a href="projetcs/dafl.html" target="_blank">
<img src="assets/img/dafl.png" alt="DAFL Music" width="100%">
</a>
</div>
<div class="project">
<a href="projetcs/temoignages.html" target="_blank">
<img src="assets/img/temoignages.png" alt="Temoignages" width="100%">
</a>
</div>
<div class="project">
<a href="projetcs/fantomgames.html" target="_blank">
<img src="assets/img/fantomgames.png" alt="Fantom Games" width="100%">
</a>
</div>
</div>
</section>
<section id="perso" class="perso">
<div class="interests container">
<div class="section-title">
<h2>Interests</h2>
<h2>Intérêt personnel</h2>
</div>
<div class="row">
<div class="container_perso">
@ -273,5 +335,6 @@
<script src="assets/js/bootstrap-js/swiper-bundle.min.js"></script>
<script src="assets/js/bootstrap-js/noframework.waypoints.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>

@ -0,0 +1,51 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Portfolio-DAFL Music</title>
<link href="https://codefirst.iut.uca.fr/containers/dorianhodin-portfolio/assets/img/favicon.ico" rel="icon">
<link href="../assets/css/bootstrap-css/bootstrap.min.css" rel="stylesheet">
<link href="../assets/css/style.css" rel="stylesheet">
</head>
<body>
<div class="container projectContainer">
<div class="section-title">
<h2><a href="../index.html#projects">Retour Site</a></h2>
</div>
<div class="projectContainer project" >
<h1 class="project-title">DAFL Music</h1>
<img src="../assets/img/dafl.png" alt="DAFL Music" class="project-image" width="80%">
<br><br>
<div class="project-details">
<p><strong>Technologies utilisées:</strong> Flutter, PHP Slim, SQL</p>
<p><strong>Année de réalisation:</strong> 2022-2023</p>
<p><strong>Note finale:</strong> 13.5/20</p>
</div>
<div class="project-description">
<p>
DAFL Music est un projet que j'ai réalisé à l'aide de 3 de mes camarades dans le cadre de notre BUT Informatique de deuxième année.
<br><br>
Le concept du projet s'inspire de Tinder et de Spotify. Par exemple, vous avez installé l'application mobile DAFL Music et vous croisez quelqu'un qui a aussi l'application, par conséquent cela va afficher la musique qu'écoutait l'utilisateur que vous avez croisé sur votre téléphone.
Cela permet de découvrir de nouveaux sons et de nouveaux artistes.
Une fois que vous avez aimé le son de la personne que vous avez croisé, si cette personne a aussi aimé le son que vous avez écoutez quand vous vous êtes croisés vous allez pouvoir discuter ensemble, afin de faire de nouvelles découvertes de sons et d'artistes.
<br><br>
Ce projet était un vrai challenge technique, car nous avons utilisé une technologie que nous ne connaissions pas, Flutter, et nous devions réalisés différents serveurs comme le serveur de messagerie.
Nous avons plutôt bien réussi le projet, mais nous avons pas eu le temps de le finir malheuresement.
<br><br>
Voici ci-dessous quelques images de notre projet, ainsi que le lien du répo :
<a href="https://codefirst.iut.uca.fr/git/DAFLDev/dafl_music" target="_blank">DAFL Music</a>
<br><br>
Vues :
<img src="../assets/img/dafl_exemple.png" width="100%">
<br><br>
MCD de notre application :
<img src="../assets/img/dafl_mcd.png" width="100%">
</div>
</div>
</div>
</body>
</html>

@ -0,0 +1,50 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Portfolio-Témoignage</title>
<link href="https://codefirst.iut.uca.fr/containers/dorianhodin-portfolio/assets/img/favicon.ico" rel="icon">
<link href="../assets/css/bootstrap-css/bootstrap.min.css" rel="stylesheet">
<link href="../assets/css/style.css" rel="stylesheet">
</head>
<body>
<div class="container projectContainer">
<div class="section-title">
<h2><a href="../index.html#projects">Retour Site</a></h2>
</div>
<div class="projectContainer project" >
<h1 class="project-title">Témoignage</h1>
<img src="../assets/img/temoignages.png" alt="DAFL Music" class="project-image" width="80%">
<br><br>
<div class="project-details">
<p><strong>Technologies utilisées:</strong> HTML, CSS, PHP, PHP Slim, SQL</p>
<p><strong>Année de réalisation:</strong> 2023</p>
<p><strong>Note finale:</strong> 12/20</p>
</div>
<div class="project-description">
<p>
Dernier projet de 2ème année, Témoignage est un projet qui a pour but de récupérer des témoignages d'étudiants et de prof et de les afficher en ligne.
<br><br>
Le sujet était donné par notre département, et il permettait de mettre en avant les vrais témoignages des gens qui ont suivi la formation, afin de guider au mieux les personnes souhaitant rejoindre cette formation.
Par exemple, on intérogeait différents élèves et profs, et on filmait ensuite avec eux une petite vidéo de 5 minutes ou on pose quelque questions pour en savoir plus.
<br><br>
Ce projet était assez simple sur papier, mais nous avons eu pas mal de difficulté comme par exemple le déploiment du site.
Nous avons aussi eu des problèmes de charge de travail au sein du groupe, ce qui a empeché de rendre un site parfait et fonctionnel.
<br><br>
Voici ci-dessous quelques images de notre projet, ainsi que le lien du répo :
<a href="https://codefirst.iut.uca.fr/git/Temoignages/SAE4.01_Temoignages" target="_blank">Témoignage</a>
<br><br>
Diagramme d'utilisation :
<img src="../assets/img/temoignage_usecase.png" width="100%">
<br><br>
MLD de notre application :
<img src="../assets/img/temoignage_mld.svg" width="100%">
</div>
</div>
</div>
</body>
</html>
Loading…
Cancel
Save