| Current File : /home/digitaw/teste_ecarte/djibrildiouf/.history/index_20231206125019.html |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Djibril Diouf</title>
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<meta content="Free Website Template" name="keywords">
<meta content="Free Website Template" name="description">
<!-- Favicon -->
<link href="img/logo.png" rel="icon">
<!-- Google Font -->
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap"
rel="stylesheet">
<!-- CSS Libraries -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css" rel="stylesheet">
<link href="lib/animate/animate.min.css" rel="stylesheet">
<link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet">
<link href="lib/lightbox/css/lightbox.min.css" rel="stylesheet">
<!-- Template Stylesheet -->
<link href="css/style.css" rel="stylesheet">
</head>
<body data-spy="scroll" data-target=".navbar" data-offset="51">
<!-- Nav Bar Start -->
<div class="navbar navbar-expand-lg bg-light navbar-light">
<div class="container-fluid" style="background-color: #fff;">
<a href="index.html" class="navbar-brand"><img src="img/logo.png" width="100%" height="100%" alt=""></a>
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#navbarCollapse">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-between" id="navbarCollapse">
<div class="navbar-nav ml-auto">
<a href="#home" class="nav-item nav-link active">Accueil</a>
<a href="#about" class="nav-item nav-link">A propos</a>
<a href="#service" class="nav-item nav-link">Compétences</a>
<a href="#experience" class="nav-item nav-link">Expériences</a>
<a href="#portfolio" class="nav-item nav-link">Réalisation</a>
<a href="#price" class="nav-item nav-link">Services</a>
<a href="#contact" class="nav-item nav-link">Contact</a>
</div>
</div>
</div>
</div>
<!-- Nav Bar End -->
<!-- Hero Start -->
<div class="hero" id="home">
<div class="container-fluid">
<div class="row align-items-center">
<div class="col-sm-12 col-md-6">
<div class="hero-content">
<div class="hero-text">
<p>Je suis</p>
<h1>Djibril Diouf</h1>
<h2></h2>
<div class="typed-text">Developpement d'applications web et mobile</div>
</div>
<div class="hero-btn">
<a class="btn" href="">Hire Me</a>
<a class="btn" href="">Contact</a>
</div>
</div>
</div>
<div class="col-sm-12 col-md-6 d-none d-md-block">
<div class="hero-image">
<img src="img/djibril.png" width="80%" alt="Hero Image">
</div>
</div>
</div>
</div>
</div>
<!-- Hero End -->
<!-- About Start -->
<div class="about wow fadeInUp" data-wow-delay="0.1s" id="about">
<div class="container-fluid">
<div class="row align-items-center">
<div class="col-lg-6">
<div class="about-img">
<img src="img/djibrilpropos1.png" width="30%" alt="Image">
</div>
</div>
<div class="col-lg-6">
<div class="about-content">
<div class="section-header text-left">
<p>A propos de moi</p>
<h2>5 ans Experience</h2>
</div>
<div class="about-text">
<p>
En tant que concepteur de logiciels, je suis passionné par la création d'applications intuitives et fonctionnelles pour la conception Web, mobile et système. J'apprends constamment et me tiens au courant des dernières technologies pour m'assurer que mes solutions sont innovantes et efficaces. Avec une base solide en informatique et un dévouement à fournir des produits de haute qualité, je suis confiant dans ma capacité à développer des solutions logicielles réussies pour n'importe quel projet. </p>
</div>
<div class="skills">
<div class="skill-name">
<p>Langue de programmation</p>
<p>85%</p>
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="85" aria-valuemin="0"
aria-valuemax="100"></div>
</div>
<div class="skill-name">
<p>Framework</p>
<p>95%</p>
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="95" aria-valuemin="0"
aria-valuemax="100"></div>
</div>
<div class="skill-name">
<p>Administration de base de données</p>
<p>90%</p>
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="90" aria-valuemin="0"
aria-valuemax="100"></div>
</div>
<div class="skill-name">
<p>Services Réseaux et Securité</p>
<p>85%</p>
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="85" aria-valuemin="0"
aria-valuemax="100"></div>
</div>
</div>
<a class="btn" href="#contact">Contact</a>
</div>
</div>
</div>
</div>
</div>
<!-- About End -->
<!-- Service Start -->
<div class="service" id="service">
<div class="container">
<div class="section-header text-center wow zoomIn" data-wow-delay="0.1s">
<p>Mes Compétences</p>
<h2>Compétences</h2>
</div>
<div class="row">
<div class="col-lg-6 wow fadeInUp" data-wow-delay="0.0s">
<div class="service-item">
<div class="service-icon">
<i class="fa fa-laptop"></i>
</div>
<div class="service-text">
<h3>Langue de programmation</h3>
<p>
Python, HTML, CSS, PHP, JavaScript, JAVA, C, C++, C#, TypeScript.
</p>
</div>
</div>
</div>
<div class="col-lg-6 wow fadeInUp" data-wow-delay="0.2s">
<div class="service-item">
<div class="service-icon">
<i class="fa fa-laptop-code"></i>
</div>
<div class="service-text">
<h3>FrameWork</h3>
<p>
Bootstrap, Angular, Ionic, Symfony, Api Platform, Swagger, JEE Spring, Hibernate, Spring Boot, Thymleaf, ASP.NET.
</p>
</div>
</div>
</div>
<div class="col-lg-6 wow fadeInUp" data-wow-delay="0.4s">
<div class="service-item">
<div class="service-icon">
<i class="fa fa-database"></i>
</div>
<div class="service-text">
<h3>Administration de base de données</h3>
<p>
Oracle 10g, Sql Serveur
</p>
</div>
</div>
</div>
<div class="col-lg-6 wow fadeInUp" data-wow-delay="0.6s">
<div class="service-item">
<div class="service-icon">
<i class="fa fa-network-wired"></i>
</div>
<div class="service-text">
<h3>Services Réseaux et Securité</h3>
<p>
Zimbra, Ftp, Nfs, Samba, DHCP, DNS ,DNS, Snort, IPTABLE, ACL étendus et standards
</p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Service End -->
<!-- Experience Start -->
<div class="experience" id="experience">
<div class="container">
<header class="section-header text-center wow zoomIn" data-wow-delay="0.1s">
<p>Mes expériences</p>
<h2>Experience</h2>
</header>
<div class="timeline">
<div class="timeline-item left wow slideInLeft" data-wow-delay="0.1s">
<div class="timeline-text">
<div class="timeline-date">2045 - 2050</div>
<h2>Developpeur Web & mobile </h2>
<h4>Digitalis SN</h4>
<p>
Lorem ipsum dolor sit amet elit. Aliquam odio dolor, id luctus erat sagittis non. Ut blandit
semper pretium.
</p>
</div>
</div>
<div class="timeline-item right wow slideInRight" data-wow-delay="0.1s">
<div class="timeline-text">
<div class="timeline-date">2045 - 2050</div>
<h2>Ingénieur système d'information</h2>
<h4>Groupe Soterco</h4>
<p>
Lorem ipsum dolor sit amet elit. Aliquam odio dolor, id luctus erat sagittis non. Ut blandit
semper pretium.
</p>
</div>
</div>
<div class="timeline-item left wow slideInLeft" data-wow-delay="0.1s">
<div class="timeline-text">
<div class="timeline-date">2045 - 2050</div>
<h2>Devops</h2>
<h4>Sangomar Global Services</h4>
<p>
Lorem ipsum dolor sit amet elit. Aliquam odio dolor, id luctus erat sagittis non. Ut blandit
semper pretium.
</p>
</div>
</div>
<div class="timeline-item right wow slideInRight" data-wow-delay="0.1s">
<div class="timeline-text">
<div class="timeline-date">2045 - 2050</div>
<h2>Developpeur web et mobile</h2>
<h4>Soft Agency, San Francisco, CA</h4>
<p>
Lorem ipsum dolor sit amet elit. Aliquam odio dolor, id luctus erat sagittis non. Ut blandit
semper pretium.
</p>
</div>
</div>
<!-- <div class="timeline-item left wow slideInLeft" data-wow-delay="0.1s">
<div class="timeline-text">
<div class="timeline-date">2045 - 2050</div>
<h2>Web Developer</h2>
<h4>Soft Agency, San Francisco, CA</h4>
<p>
Lorem ipsum dolor sit amet elit. Aliquam odio dolor, id luctus erat sagittis non. Ut blandit
semper pretium.
</p>
</div>
</div>
<div class="timeline-item right wow slideInRight" data-wow-delay="0.1s">
<div class="timeline-text">
<div class="timeline-date">2045 - 2050</div>
<h2>Web Developer</h2>
<h4>Soft Agency, San Francisco, CA</h4>
<p>
Lorem ipsum dolor sit amet elit. Aliquam odio dolor, id luctus erat sagittis non. Ut blandit
semper pretium.
</p>
</div>
</div>
</div> -->
</div>
</div>
<!-- Job Experience End -->
<!-- Banner Start -->
<div class="banner wow zoomIn" data-wow-delay="0.1s">
<div class="container">
<div class="section-header text-center">
</div>
<div class="container banner-text">
<p>
Êtes-vous prêt à transformer vos idées en une présence en ligne exceptionnelle? Nous somme Digitalis SN,
votre partenaire de confiance dans le monde du développement web. Avec une passion dévorante pour
la création de sites web intuitifs et percutants.
</p>
<a class="btn">Contact</a>
</div>
</div>
</div>
<!-- Banner End -->
<!-- Portfolio Start -->
<div class="portfolio" id="portfolio">
<div class="container">
<div class="section-header text-center wow zoomIn" data-wow-delay="0.1s">
<p>Mes réalisations</p>
<h2>Réalisations</h2>
</div>
<div class="row">
<div class="col-12">
<ul id="portfolio-filter">
<li data-filter="*" class="filter-active">All</li>
<li data-filter=".filter-1">Site web</li>
<li data-filter=".filter-2">site e-commerce</li>
<!-- <li data-filter=".filter-3">mobile</li> -->
</ul>
</div>
</div>
<div class="row portfolio-container">
<div class="col-lg-4 col-md-6 col-sm-12 portfolio-item filter-1 wow fadeInUp" data-wow-delay="0.0s">
<div class="portfolio-wrap">
<div class="portfolio-img">
<img src="img/toptours.png" alt="Image">
</div>
<div class="portfolio-text">
<h3>Top Tours Sénégal</h3>
<a class="btn" href="img/toptours.png" data-lightbox="portfolio">+</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 col-sm-12 portfolio-item filter-2 wow fadeInUp" data-wow-delay="0.2s">
<div class="portfolio-wrap">
<div class="portfolio-img">
<img src="img/coragro.png" alt="Image">
</div>
<div class="portfolio-text">
<h3>Coragro</h3>
<a class="btn" href="img/portfolio-2.jpg" data-lightbox="portfolio">+</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 col-sm-12 portfolio-item filter-2 wow fadeInUp" data-wow-delay="0.2s">
<div class="portfolio-wrap">
<div class="portfolio-img">
<img src="img/fanamed.png" alt="Image">
</div>
<div class="portfolio-text">
<h3>Fana medical Service</h3>
<a class="btn" href="img/fanamed.png" data-lightbox="portfolio">+</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 col-sm-12 portfolio-item filter-3 wow fadeInUp" data-wow-delay="0.4s">
<div class="portfolio-wrap">
<div class="portfolio-img">
<img src="img/senstrategie.png" alt="Image">
</div>
<div class="portfolio-text">
<h3>Faadel Bisiness Company</h3>
<a class="btn" href="img/senstrategie.png" data-lightbox="portfolio">+</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 col-sm-12 portfolio-item filter-1 wow fadeInUp" data-wow-delay="0.6s">
<div class="portfolio-wrap">
<div class="portfolio-img">
<img src="img/senstrategie.png" alt="Image">
</div>
<div class="portfolio-text">
<h3>Sen Stratégie</h3>
<a class="btn" href="img/senstrategie.png" data-lightbox="portfolio">+</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 col-sm-12 portfolio-item filter-2 wow fadeInUp" data-wow-delay="0.8s">
<div class="portfolio-wrap">
<div class="portfolio-img">
<img src="img/jayymusic.png" alt="Image">
</div>
<div class="portfolio-text">
<h3>jayy music</h3>
<a class="btn" href="img/jayymusic.png" data-lightbox="portfolio">+</a>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Portfolio End -->
<!-- Banner Start -->
<div class="banner wow zoomIn" data-wow-delay="0.1s">
<div class="container">
<div class="section-header text-center">
<h2>Vidéo présentation</h2>
</div>
<div class="container banner-text">
<video controls width="800">
<source src="/media/cc0-videos/flower.webm" type="video/webm" />
<source src="/media/cc0-videos/flower.mp4" type="video/mp4" />
Download the
<a href="/media/cc0-videos/flower.webm">WEBM</a>
or
<a href="/media/cc0-videos/flower.mp4">MP4</a>
video.
</video>
</div>
</div>
</div>
<!-- Banner End -->
<!-- Price Start -->
<div class="price" id="price">
<div class="container">
<div class="section-header text-center wow zoomIn" data-wow-delay="0.1s">
<p>Nos services</p>
<h2>Services</h2>
</div>
<div class="row">
<div class="col-md-4 wow fadeInUp" data-wow-delay="0.5s">
<div class="price-item featured-item">
<div class="price-header">
<div class="price-title">
<h2>
Développement web
</h2>
</div>
</div>
<div class="price-body">
<div class="price-description">
Refonte de site web, Développement d'application
</div>
</div>
<div class="price-footer">
<div class="price-action">
</div>
</div>
</div>
</div>
<div class="col-md-4 wow fadeInUp" data-wow-delay="0.0s">
<div class="price-item featured-item">
<div class="price-header">
<div class="price-title">
<h2>Création Graphique</h2>
</div>
</div>
<div class="price-body">
<div class="price-description">
Création de Logo Création de charte graphique
</div>
</div>
<div class="price-footer">
<div class="price-action">
</div>
</div>
</div>
</div>
<div class="col-md-4 wow fadeInUp" data-wow-delay="0.5s">
<div class="price-item featured-item">
<div class="price-header">
<div class="price-title">
<h2>Web Marketing</h2>
</div>
</div>
<div class="price-body">
<div class="price-description">
Community Management Référencement SEO, SEA, SMO
</div>
</div>
<div class="price-footer">
<div class="price-action">
</div>
</div>
</div>
</div>
<div class="col-md-4 wow fadeInUp" data-wow-delay="0.5s">
<div class="price-item featured-item">
<div class="price-header">
<div class="price-title">
<h2>Audiovisuel</h2>
</div>
</div>
<div class="price-body">
<div class="price-description">Imprimante et photocopieuse, Imprimante grand format
</div>
</div>
<div class="price-footer">
<div class="price-action">
</div>
</div>
</div>
</div> <div class="col-md-4 wow fadeInUp" data-wow-delay="0.5s">
<div class="price-item featured-item">
<div class="price-header">
<div class="price-title">
<h2>Gestion et Data</h2>
</div>
</div>
<div class="price-body">
<div class="price-description">Gestion, comptabilité, finance, Business Intelligence
</div>
</div>
<div class="price-footer">
<div class="price-action">
</div>
</div>
</div>
</div>
<div class="col-md-4 wow fadeInUp" data-wow-delay="0.5s">
<div class="price-item featured-item">
<div class="price-header">
<div class="price-title">
<h2>Cybersécurité</h2>
</div>
</div>
<div class="price-body">
<div class="price-description">Sécurité de votre site web, Test d’intrusion
</div>
</div>
<div class="price-footer">
<div class="price-action">
</div>
</div>
</div>
</div>
<div class="col-md-4 wow fadeInUp" data-wow-delay="0.5s">
<div class="price-item featured-item">
<div class="price-header">
<div class="price-title">
<h2>Informatique</h2>
</div>
</div>
<div class="price-body">
<div class="price-description">
Environnement utilisateurs Hébergement & Cloud
</div>
</div>
<div class="price-footer">
<div class="price-action">
</div>
</div>
</div>
</div> <div class="col-md-4 wow fadeInUp" data-wow-delay="0.5s">
<div class="price-item featured-item">
<div class="price-header">
<div class="price-title">
<h2>Impression</h2>
</div>
</div>
<div class="price-body">
<div class="price-description">SImprimante et photocopieuse, Imprimante grand format
</div>
</div>
<div class="price-footer">
<div class="price-action">
</div>
</div>
</div>
</div> <div class="col-md-4 wow fadeInUp" data-wow-delay="0.5s">
<div class="price-item featured-item">
<div class="price-header">
<div class="price-title">
<h2>Autres Services</h2>
</div>
</div>
<div class="price-body">
<div class="price-description">Formation, Coaching, conseil et accompagnement
</div>
</div>
<div class="price-footer">
<div class="price-action">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Price End -->
<!-- Contact Start -->
<div class="contact wow fadeInUp" data-wow-delay="0.1s" id="contact">
<div class="container-fluid">
<div class="container">
<div class="row align-items-center">
<div class="col-md-4"></div>
<div class="col-md-8">
<div class="contact-form">
<div id="success"></div>
<form name="sentMessage" id="contactForm" novalidate="novalidate">
<div class="control-group">
<input type="text" class="form-control" id="name" placeholder="Votre nom complet"
required="required" data-validation-required-message="Please enter your name" />
<p class="help-block"></p>
</div>
<div class="control-group">
<input type="email" class="form-control" id="email" placeholder="Email"
required="required"
data-validation-required-message="Please enter your email" />
<p class="help-block"></p>
</div>
<div class="control-group">
<input type="text" class="form-control" id="subject" placeholder="Sujet"
required="required" data-validation-required-message="Please enter a subject" />
<p class="help-block"></p>
</div>
<div class="control-group">
<textarea class="form-control" id="message" placeholder="Ecrivez votre message ici..."
required="required"
data-validation-required-message="Please enter your message"></textarea>
<p class="help-block"></p>
</div>
<div>
<button class="btn" type="submit" id="sendMessageButton">Envoyer</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Contact End -->
<!-- Team Start -->
<div class="team" id="team">
</div>
<!-- Team End -->
<!-- Footer Start -->
<div class="footer wow fadeIn" data-wow-delay="0.3s">
<div class="container-fluid">
<div class="container">
<div class="footer-info">
<h2>Djibril DIOUF</h2>
<h3>Dakar, Sénégal</h3>
<div class="footer-menu">
<p>(+221) 76 167 53 52</p>
<p> djibrildiouf@digitalis-sn.com
</p>
</div>
<div class="footer-social">
<a href=""><i class="fab fa-twitter"></i></a>
<a href=""><i class="fab fa-facebook-f"></i></a>
<a href=""><i class="fab fa-youtube"></i></a>
<a href=""><i class="fab fa-instagram"></i></a>
<a href=""><i class="fab fa-linkedin-in"></i></a>
</div>
</div>
</div>
<div class="container copyright">
<p>© All Right Reserved |
<!--/*** This template is free as long as you keep the footer author’s credit link/attribution link/backlink. If you'd like to use the template without the footer author’s credit link/attribution link/backlink, you can purchase the Credit Removal License from "https://htmlcodex.com/credit-removal". Thank you for your support. ***/-->
Développer et Désigner par <a href="https://digitalis-sn.com">DIGITALIS SN</a>
</p>
</div>
</div>
</div>
<!-- Footer End -->
<!-- Back to top button -->
<a href="#" class="btn back-to-top"><i class="fa fa-chevron-up"></i></a>
<!-- Pre Loader -->
<div id="loader" class="show">
<div class="loader"></div>
</div>
<!-- JavaScript Libraries -->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>
<script src="lib/easing/easing.min.js"></script>
<script src="lib/wow/wow.min.js"></script>
<script src="lib/waypoints/waypoints.min.js"></script>
<script src="lib/typed/typed.min.js"></script>
<script src="lib/owlcarousel/owl.carousel.min.js"></script>
<script src="lib/isotope/isotope.pkgd.min.js"></script>
<script src="lib/lightbox/js/lightbox.min.js"></script>
<!-- Contact Javascript File -->
<script src="mail/jqBootstrapValidation.min.js"></script>
<script src="mail/contact.js"></script>
<!-- Template Javascript -->
<script src="js/main.js"></script>
</body>
</html>