{"id":134,"date":"2026-10-16T21:01:49","date_gmt":"2026-10-16T19:01:49","guid":{"rendered":"https:\/\/easyservices.store\/?page_id=134"},"modified":"2026-10-16T22:35:13","modified_gmt":"2026-10-16T20:35:13","slug":"elementor-134","status":"publish","type":"page","link":"https:\/\/easyservices.store\/","title":{"rendered":"JalilBT."},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"134\" class=\"elementor elementor-134\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a5f701d e-con-full e-flex e-con e-parent\" data-id=\"a5f701d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-19136e5 elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"19136e5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n<div id=\"jalil-portfolio\" lang=\"fr\" dir=\"ltr\">\n<style>\n\/* ===== JALIL \u2014 FULL STACK PORTFOLIO ===== *\/\n#jalil-portfolio{\n  --bg:#050b12;\n  --panel:#0d1b29;\n  --line:#21394a;\n  --text:#f2f7fc;\n  --muted:#9bb1c5;\n  --green:#00f5a0;\n  --cyan:#54c7ff;\n  position:relative;\n  left:50%;\n  margin-left:-50vw;\n  width:100vw;\n  max-width:100vw;\n  overflow:hidden;\n  isolation:isolate;\n  background:var(--bg);\n  color:var(--text);\n  font-family:Inter,system-ui,Arial,sans-serif;\n  line-height:1.65;\n}\n#jalil-portfolio *,\n#jalil-portfolio *::before,\n#jalil-portfolio *::after{box-sizing:border-box}\n#jalil-portfolio a{color:inherit;text-decoration:none}\n#jalil-portfolio button{font:inherit;cursor:pointer}\n#jalil-portfolio a:focus-visible,\n#jalil-portfolio button:focus-visible{\n  outline:2px solid var(--green);\n  outline-offset:3px;\n}\n#jalil-portfolio .container{\n  width:min(1240px,92%);\n  margin-inline:auto;\n}\n#jalil-portfolio .mono{\n  font-family:Consolas,\"Courier New\",monospace;\n}\n#jalil-portfolio .green{color:var(--green)}\n#jalil-portfolio .muted{color:var(--muted)}\n\n\/* ===== HEADER DESKTOP ORIGINAL ===== *\/\n#jalil-portfolio .nav{\n  display:flex;\n  align-items:center;\n  justify-content:space-between;\n  gap:20px;\n  padding:20px 0;\n  flex-wrap:wrap;\n}\n#jalil-portfolio .brand{\n  font:800 25px Consolas,monospace;\n  color:var(--green);\n  letter-spacing:-1px;\n  white-space:nowrap;\n}\n#jalil-portfolio .nav-links{\n  display:flex;\n  align-items:center;\n  gap:23px;\n  flex-wrap:wrap;\n}\n#jalil-portfolio .nav-links a{\n  color:#d3e1ed;\n  font-size:13px;\n  transition:color .2s;\n}\n#jalil-portfolio .nav-links a:hover{\n  color:var(--green);\n}\n#jalil-portfolio .lang-switch{\n  display:flex;\n  gap:3px;\n  padding:4px;\n  border:1px solid var(--line);\n  border-radius:9px;\n  background:#10202e;\n}\n#jalil-portfolio .lang-switch button{\n  padding:7px 10px;\n  border:0;\n  border-radius:6px;\n  background:transparent;\n  color:#b7cad9;\n  font-size:12px;\n}\n#jalil-portfolio .lang-switch button.active{\n  background:var(--green);\n  color:#03130d;\n  font-weight:800;\n}\n#jalil-portfolio .mobile-toggle{\n  display:none;\n  align-items:center;\n  justify-content:center;\n  width:40px;\n  height:40px;\n  padding:0;\n  border:1px solid #315365;\n  border-radius:9px;\n  background:#10202e;\n  color:var(--green);\n  font-size:23px;\n  line-height:1;\n}\n\n\/* ===== HERO DESKTOP ===== *\/\n#jalil-portfolio .hero{\n  position:relative;\n  min-height:720px;\n  display:flex;\n  align-items:center;\n  border-top:1px solid var(--line);\n  background-image:\n    linear-gradient(#17324350 1px,transparent 1px),\n    linear-gradient(90deg,#17324350 1px,transparent 1px);\n  background-size:52px 52px;\n}\n#jalil-portfolio .hero::before{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  pointer-events:none;\n  background:\n    radial-gradient(circle at 75% 35%,#00f5a014,transparent 42%),\n    linear-gradient(180deg,transparent 65%,var(--bg));\n}\n#jalil-portfolio .hero-layout{\n  position:relative;\n  z-index:2;\n  display:grid;\n  grid-template-columns:minmax(0,1fr) minmax(0,1fr);\n  gap:55px;\n  align-items:center;\n  padding:105px 0;\n}\n#jalil-portfolio .eyebrow{\n  margin-bottom:22px;\n  color:var(--cyan);\n  font:14px Consolas,monospace;\n}\n#jalil-portfolio h1{\n  margin:0 0 25px;\n  color:white;\n  font-size:clamp(43px,5.5vw,78px);\n  font-weight:850;\n  line-height:1.12;\n  letter-spacing:-3px;\n}\n#jalil-portfolio .hero-name{\n  color:var(--green);\n  text-shadow:0 0 35px #00f5a044;\n}\n#jalil-portfolio .hero-desc{\n  max-width:620px;\n  color:var(--muted);\n  font-size:18px;\n}\n#jalil-portfolio .actions{\n  display:flex;\n  flex-wrap:wrap;\n  gap:13px;\n  margin-top:30px;\n}\n#jalil-portfolio .btn{\n  display:inline-flex;\n  align-items:center;\n  justify-content:center;\n  gap:9px;\n  min-height:44px;\n  padding:13px 21px;\n  border:1px solid var(--green);\n  border-radius:8px;\n  font:700 13px Consolas,monospace;\n  transition:transform .25s,box-shadow .25s;\n}\n#jalil-portfolio .btn-primary{\n  background:var(--green);\n  color:#04140e!important;\n}\n#jalil-portfolio .btn:hover{\n  transform:translateY(-4px);\n  box-shadow:0 10px 35px #00f5a02e;\n}\n#jalil-portfolio .hero-meta{\n  display:flex;\n  flex-wrap:wrap;\n  gap:20px;\n  margin-top:35px;\n  color:#aac1d2;\n  font-size:12px;\n}\n#jalil-portfolio .hero-meta b{\n  color:var(--green);\n}\n\n\/* ===== TERMINAL ===== *\/\n#jalil-portfolio .terminal{\n  min-width:0;\n  overflow:hidden;\n  border:1px solid #315365;\n  border-radius:13px;\n  background:#081522;\n  box-shadow:0 30px 90px #0009,0 0 40px #00f5a00b;\n  animation:jalilFloat 7s ease-in-out infinite;\n}\n@keyframes jalilFloat{\n  0%,100%{transform:translateY(0)}\n  50%{transform:translateY(-9px)}\n}\n#jalil-portfolio .terminal-head{\n  display:flex;\n  align-items:center;\n  gap:7px;\n  padding:14px 18px;\n  background:#142537;\n}\n#jalil-portfolio .dot{\n  width:11px;\n  height:11px;\n  border-radius:50%;\n  background:#ff5f57;\n}\n#jalil-portfolio .dot:nth-child(2){\n  background:#ffbd2e;\n}\n#jalil-portfolio .dot:nth-child(3){\n  background:#28c840;\n}\n#jalil-portfolio .terminal-head small{\n  margin-left:auto;\n  color:#92aabe;\n  font-size:10px;\n}\n#jalil-portfolio .terminal-body{\n  min-height:390px;\n  padding:27px;\n  color:#dbeaf4;\n  font:13px\/2 Consolas,monospace;\n  overflow-wrap:anywhere;\n  direction:ltr;\n  text-align:left;\n}\n#jalil-portfolio .command{\n  color:var(--cyan);\n}\n#jalil-portfolio .prompt,\n#jalil-portfolio .value{\n  color:var(--green);\n}\n#jalil-portfolio .cursor{\n  display:inline-block;\n  width:8px;\n  height:15px;\n  vertical-align:middle;\n  background:var(--green);\n  animation:jalilBlink 1s steps(1) infinite;\n}\n@keyframes jalilBlink{\n  50%{opacity:0}\n}\n#jalil-portfolio .system-status{\n  display:inline-flex;\n  align-items:center;\n  gap:7px;\n  margin-top:14px;\n  padding:5px 10px;\n  border:1px solid #285743;\n  border-radius:5px;\n  background:#0b2921;\n  color:var(--green);\n  font:10px Consolas,monospace;\n}\n#jalil-portfolio .system-status::before{\n  content:\"\";\n  width:6px;\n  height:6px;\n  border-radius:50%;\n  background:var(--green);\n  box-shadow:0 0 10px var(--green);\n}\n\n\/* ===== TECHNOLOGIES ===== *\/\n#jalil-portfolio .tech-strip{\n  padding:24px 0;\n  border-block:1px solid var(--line);\n  background:#091522;\n}\n#jalil-portfolio .tech-items{\n  display:flex;\n  flex-wrap:wrap;\n  justify-content:space-around;\n  gap:20px;\n  color:#c0d6e5;\n  font:13px Consolas,monospace;\n}\n#jalil-portfolio .tech-items span{\n  transition:color .25s,transform .25s;\n}\n#jalil-portfolio .tech-items span:hover{\n  color:var(--green);\n  transform:translateY(-4px);\n}\n\n\/* ===== SECTIONS ===== *\/\n#jalil-portfolio .section{\n  position:relative;\n  padding:105px 0;\n  border-bottom:1px solid var(--line);\n}\n#jalil-portfolio .section-label{\n  margin-bottom:16px;\n  color:var(--green);\n  font:14px Consolas,monospace;\n}\n#jalil-portfolio h2{\n  margin:0 0 25px;\n  color:white;\n  font-size:clamp(32px,4vw,50px);\n  line-height:1.2;\n  letter-spacing:-1.5px;\n}\n#jalil-portfolio .section-desc{\n  max-width:850px;\n  color:var(--muted);\n  font-size:16px;\n}\n#jalil-portfolio .cards{\n  display:grid;\n  grid-template-columns:repeat(3,minmax(0,1fr));\n  gap:20px;\n  margin-top:42px;\n}\n#jalil-portfolio .card{\n  position:relative;\n  min-width:0;\n  overflow:hidden;\n  padding:30px;\n  border:1px solid #294557;\n  border-radius:14px;\n  background:linear-gradient(145deg,#102334,#091724);\n  transition:transform .3s,border-color .3s,box-shadow .3s;\n}\n#jalil-portfolio .card::before{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  pointer-events:none;\n  opacity:0;\n  background:radial-gradient(\n    300px circle at var(--mx,50%) var(--my,50%),\n    #00f5a013,transparent 70%\n  );\n  transition:opacity .3s;\n}\n#jalil-portfolio .card:hover{\n  transform:translateY(-8px);\n  border-color:var(--green);\n  box-shadow:0 20px 50px #00f5a012;\n}\n#jalil-portfolio .card:hover::before{\n  opacity:1;\n}\n#jalil-portfolio .card-icon{\n  color:var(--green);\n  font:700 26px Consolas,monospace;\n}\n#jalil-portfolio .card h3{\n  margin:15px 0 10px;\n  color:white;\n  font-size:20px;\n}\n#jalil-portfolio .card p{\n  margin:0;\n  color:var(--muted);\n  font-size:14px;\n}\n#jalil-portfolio .tags{\n  display:flex;\n  flex-wrap:wrap;\n  gap:8px;\n  margin-top:20px;\n}\n#jalil-portfolio .tag{\n  padding:6px 10px;\n  border:1px solid #315266;\n  border-radius:5px;\n  background:#132a3b;\n  color:#bde5ed;\n  font:11px Consolas,monospace;\n}\n\n\/* ===== PROJECT ===== *\/\n#jalil-portfolio .project{\n  display:grid;\n  grid-template-columns:minmax(0,1fr) minmax(0,1fr);\n  gap:40px;\n  align-items:center;\n  margin-top:45px;\n  padding:32px;\n  border:1px solid #315062;\n  border-radius:15px;\n  background:linear-gradient(140deg,#102536,#091724);\n}\n#jalil-portfolio .project-screen{\n  min-width:0;\n  min-height:320px;\n  padding:23px;\n  border:1px solid #315568;\n  border-radius:12px;\n  background:#07131e;\n  direction:ltr;\n  text-align:left;\n}\n#jalil-portfolio .screen-head{\n  display:flex;\n  align-items:center;\n  gap:8px;\n  padding-bottom:18px;\n  border-bottom:1px solid #294658;\n  color:var(--green);\n  font:12px Consolas,monospace;\n}\n#jalil-portfolio .screen-stat{\n  display:grid;\n  grid-template-columns:repeat(3,minmax(0,1fr));\n  gap:10px;\n  margin-top:22px;\n}\n#jalil-portfolio .stat{\n  min-width:0;\n  padding:15px 9px;\n  border:1px solid #254658;\n  border-radius:8px;\n  background:#102738;\n  text-align:center;\n}\n#jalil-portfolio .stat strong{\n  display:block;\n  color:var(--green);\n  font-size:20px;\n}\n#jalil-portfolio .stat small{\n  display:block;\n  color:#a7bdcd;\n  font-size:10px;\n}\n#jalil-portfolio .bars{\n  display:flex;\n  align-items:end;\n  gap:11px;\n  height:95px;\n  margin-top:26px;\n}\n#jalil-portfolio .bar{\n  flex:1;\n  height:var(--h);\n  border-radius:4px 4px 0 0;\n  background:linear-gradient(0deg,#008d73,var(--green));\n  animation:jalilBars 2s ease-in-out infinite alternate;\n}\n#jalil-portfolio .bar:nth-child(even){\n  background:linear-gradient(0deg,#176c9b,var(--cyan));\n  animation-delay:.5s;\n}\n@keyframes jalilBars{\n  from{transform:scaleY(.75);transform-origin:bottom}\n  to{transform:scaleY(1);transform-origin:bottom}\n}\n#jalil-portfolio .project-title{\n  margin:12px 0;\n  color:white;\n  font-size:35px;\n}\n\n\/* ===== CONTACT ===== *\/\n#jalil-portfolio .contact-box{\n  padding:75px 30px;\n  border:1px solid #2e6654;\n  border-radius:16px;\n  background:radial-gradient(ellipse at top,#123d32,#091725 70%);\n  text-align:center;\n}\n#jalil-portfolio .contact-box .section-desc{\n  margin:0 auto 28px;\n}\n#jalil-portfolio .contact-box .actions{\n  justify-content:center;\n}\n#jalil-portfolio .footer{\n  padding:30px 15px;\n  color:#93acbe;\n  font:12px Consolas,monospace;\n  text-align:center;\n}\n\n\/* ===== ANIMATIONS ===== *\/\n#jalil-portfolio .reveal{\n  opacity:1;\n  transform:none;\n}\n#jalil-portfolio.animations-ready .reveal{\n  opacity:0;\n  transform:translateY(28px);\n  transition:opacity .8s,transform .8s;\n}\n#jalil-portfolio.animations-ready .reveal.visible{\n  opacity:1;\n  transform:none;\n}\n\n\/* ===== TABLETTE ===== *\/\n@media(max-width:1023px){\n  #jalil-portfolio .nav{\n    position:relative;\n    display:grid;\n    grid-template-columns:minmax(0,1fr) auto auto;\n    align-items:center;\n    gap:10px;\n    padding:12px 0;\n  }\n  #jalil-portfolio .brand{\n    font-size:22px;\n  }\n  #jalil-portfolio .lang-switch{\n    grid-column:2;\n    grid-row:1;\n  }\n  #jalil-portfolio .mobile-toggle{\n    display:inline-flex;\n    grid-column:3;\n    grid-row:1;\n  }\n  #jalil-portfolio .nav-links{\n    display:none;\n    position:absolute;\n    z-index:50;\n    top:100%;\n    left:0;\n    right:0;\n    flex-direction:column;\n    align-items:stretch;\n    gap:0;\n    padding:10px 15px;\n    border:1px solid #315365;\n    border-radius:0 0 12px 12px;\n    background:#0b1b29;\n    box-shadow:0 20px 40px #0009;\n  }\n  #jalil-portfolio .nav-links.is-open{\n    display:flex;\n  }\n  #jalil-portfolio .nav-links a{\n    display:block;\n    padding:12px 10px;\n    border-bottom:1px solid #21394a;\n    text-align:center;\n    font-size:14px;\n  }\n  #jalil-portfolio .nav-links a:last-child{\n    border-bottom:0;\n  }\n  #jalil-portfolio .hero-layout{\n    grid-template-columns:minmax(0,1fr);\n    gap:38px;\n    padding:70px 0;\n  }\n  #jalil-portfolio .hero{\n    min-height:0;\n  }\n  #jalil-portfolio .hero-layout>div{\n    min-width:0;\n  }\n  #jalil-portfolio .cards{\n    grid-template-columns:repeat(2,minmax(0,1fr));\n  }\n  #jalil-portfolio .project{\n    grid-template-columns:minmax(0,1fr);\n  }\n}\n\n\/* ===== TELEPHONE ===== *\/\n@media(max-width:650px){\n  #jalil-portfolio{\n    left:50%;\n    margin-left:-50vw;\n    width:100vw;\n    max-width:100vw;\n  }\n  #jalil-portfolio .container{\n    width:calc(100% - 32px);\n  }\n  #jalil-portfolio .nav{\n    min-height:62px;\n    gap:7px;\n    padding:10px 0;\n  }\n  #jalil-portfolio .brand{\n    font-size:19px;\n    letter-spacing:-1px;\n  }\n  #jalil-portfolio .lang-switch{\n    padding:3px;\n    gap:1px;\n  }\n  #jalil-portfolio .lang-switch button{\n    padding:6px 7px;\n    font-size:11px;\n  }\n  #jalil-portfolio .mobile-toggle{\n    width:38px;\n    height:38px;\n    font-size:22px;\n  }\n  #jalil-portfolio .hero-layout{\n    gap:28px;\n    padding:42px 0 46px;\n  }\n  #jalil-portfolio .eyebrow{\n    margin-bottom:16px;\n    font-size:11px;\n  }\n  #jalil-portfolio h1{\n    margin-bottom:17px;\n    font-size:clamp(29px,7.7vw,41px);\n    line-height:1.18;\n    letter-spacing:-1px;\n    overflow-wrap:break-word;\n  }\n  #jalil-portfolio .hero-desc{\n    font-size:14px;\n    line-height:1.75;\n  }\n  #jalil-portfolio .actions{\n    gap:9px;\n    margin-top:22px;\n  }\n  #jalil-portfolio .btn{\n    min-height:43px;\n    padding:11px 13px;\n    font-size:11px;\n  }\n  #jalil-portfolio .hero-meta{\n    gap:8px 13px;\n    margin-top:22px;\n    font-size:10px;\n  }\n  #jalil-portfolio .terminal{\n    animation:none;\n  }\n  #jalil-portfolio .terminal-head{\n    padding:11px 13px;\n  }\n  #jalil-portfolio .terminal-body{\n    min-height:0;\n    padding:16px;\n    font-size:10px;\n    line-height:1.85;\n  }\n  #jalil-portfolio .tech-strip{\n    padding:17px 0;\n  }\n  #jalil-portfolio .tech-items{\n    justify-content:center;\n    gap:10px 16px;\n    font-size:11px;\n  }\n  #jalil-portfolio .section{\n    padding:60px 0;\n  }\n  #jalil-portfolio .section-label{\n    font-size:12px;\n  }\n  #jalil-portfolio h2{\n    margin-bottom:19px;\n    font-size:clamp(28px,7vw,36px);\n    letter-spacing:-.6px;\n  }\n  #jalil-portfolio .section-desc{\n    font-size:14px;\n    line-height:1.8;\n  }\n  #jalil-portfolio .cards{\n    grid-template-columns:minmax(0,1fr);\n    gap:15px;\n    margin-top:27px;\n  }\n  #jalil-portfolio .card{\n    padding:23px;\n  }\n  #jalil-portfolio .project{\n    gap:23px;\n    margin-top:29px;\n    padding:15px;\n  }\n  #jalil-portfolio .project-screen{\n    min-height:0;\n    padding:14px;\n  }\n  #jalil-portfolio .screen-stat{\n    gap:6px;\n  }\n  #jalil-portfolio .stat{\n    padding:12px 5px;\n  }\n  #jalil-portfolio .stat strong{\n    font-size:17px;\n  }\n  #jalil-portfolio .stat small{\n    font-size:9px;\n    overflow-wrap:anywhere;\n  }\n  #jalil-portfolio .project-title{\n    font-size:29px;\n  }\n  #jalil-portfolio .contact-box{\n    padding:43px 18px;\n  }\n  #jalil-portfolio .footer{\n    font-size:10px;\n    line-height:1.8;\n  }\n}\n\n\/* ===== PETITS TELEPHONES ===== *\/\n@media(max-width:360px){\n  #jalil-portfolio .container{\n    width:calc(100% - 24px);\n  }\n  #jalil-portfolio .brand{\n    font-size:16px;\n  }\n  #jalil-portfolio .lang-switch button{\n    padding:5px;\n    font-size:10px;\n  }\n  #jalil-portfolio .mobile-toggle{\n    width:35px;\n    height:35px;\n  }\n  #jalil-portfolio h1{\n    font-size:27px;\n  }\n  #jalil-portfolio .btn{\n    padding:10px 11px;\n    font-size:10px;\n  }\n}\n\n\/* ===== ARABE RTL ===== *\/\n#jalil-portfolio[dir=\"rtl\"] .hero-layout,\n#jalil-portfolio[dir=\"rtl\"] .project{\n  direction:rtl;\n}\n#jalil-portfolio[dir=\"rtl\"] .brand,\n#jalil-portfolio[dir=\"rtl\"] .terminal,\n#jalil-portfolio[dir=\"rtl\"] .tech-items,\n#jalil-portfolio[dir=\"rtl\"] .footer{\n  direction:ltr;\n}\n#jalil-portfolio[dir=\"rtl\"] .terminal-head small{\n  margin-left:auto;\n  margin-right:0;\n}\n\n\/* ===== ACCESSIBILITE ===== *\/\n@media(prefers-reduced-motion:reduce){\n  #jalil-portfolio *,\n  #jalil-portfolio *::before,\n  #jalil-portfolio *::after{\n    animation:none!important;\n    transition:none!important;\n  }\n  #jalil-portfolio.animations-ready .reveal{\n    opacity:1;\n    transform:none;\n  }\n}\n<\/style>\n\n<!-- HEADER -->\n<header class=\"container nav\">\n  <a class=\"brand\" href=\"#jalil-home\">&lt;Jalil \/&gt;_<\/a>\n\n  <nav class=\"nav-links\"\n       id=\"jalil-mobile-navigation\"\n       aria-label=\"Navigation principale\">\n\n    <a href=\"#jalil-home\" data-t=\"home\">Accueil<\/a>\n    <a href=\"#jalil-about\" data-t=\"about\">\u00c0 propos<\/a>\n    <a href=\"#jalil-skills\" data-t=\"skills\">Comp\u00e9tences<\/a>\n    <a href=\"#jalil-projects\" data-t=\"projects\">Projets<\/a>\n    <a href=\"#jalil-services\" data-t=\"services\">Services<\/a>\n    <a href=\"#jalil-contact\" data-t=\"contact\">Contact<\/a>\n  <\/nav>\n\n  <div class=\"lang-switch\" aria-label=\"Choisir la langue\">\n    <button type=\"button\" data-lang=\"fr\"\n            class=\"active\" aria-pressed=\"true\">FR<\/button>\n    <button type=\"button\" data-lang=\"en\"\n            aria-pressed=\"false\">EN<\/button>\n    <button type=\"button\" data-lang=\"ar\"\n            aria-pressed=\"false\">AR<\/button>\n  <\/div>\n\n  <button type=\"button\"\n          class=\"mobile-toggle\"\n          id=\"jalil-mobile-toggle\"\n          aria-label=\"Ouvrir le menu\"\n          aria-expanded=\"false\"\n          aria-controls=\"jalil-mobile-navigation\">\u2630<\/button>\n<\/header>\n\n<main>\n\n<!-- HERO -->\n<section class=\"hero\" id=\"jalil-home\">\n  <div class=\"container hero-layout\">\n\n    <div>\n      <div class=\"eyebrow\">\u279c portfolio.init()<\/div>\n\n      <h1>\n        <span data-t=\"hello\">Salut, moi c'est<\/span>\n        <span class=\"hero-name\">Jalil.<\/span>\n        <br>\n        <span data-t=\"job\">D\u00e9veloppeur Full Stack<\/span><span class=\"green\">_<\/span>\n      <\/h1>\n\n      <p class=\"hero-desc\" data-t=\"heroText\">\n        Je transforme des id\u00e9es en applications web modernes,\n        plateformes SaaS et solutions digitales fiables.\n      <\/p>\n\n      <div class=\"actions\">\n        <a class=\"btn btn-primary\" href=\"#jalil-projects\">\n          <span data-t=\"explore\">Explorer mes projets<\/span> \u2197\n        <\/a>\n        <a class=\"btn\" href=\"#jalil-contact\">\n          <span data-t=\"contactMe\">Me contacter<\/span> \u2192\n        <\/a>\n      <\/div>\n\n      <div class=\"hero-meta\">\n        <span><b>\u25cf<\/b> React \/ TypeScript<\/span>\n        <span><b>\u25cf<\/b> Supabase \/ PostgreSQL<\/span>\n        <span><b>\u25cf<\/b> SaaS Development<\/span>\n      <\/div>\n    <\/div>\n\n    <div class=\"terminal\">\n      <div class=\"terminal-head\">\n        <i class=\"dot\"><\/i>\n        <i class=\"dot\"><\/i>\n        <i class=\"dot\"><\/i>\n        <small>jalil@portfolio: ~<\/small>\n      <\/div>\n\n      <div class=\"terminal-body mono\">\n        <div>\n          <span class=\"prompt\">\u279c<\/span>\n          <span class=\"command\">~ whoami<\/span>\n        <\/div>\n\n        <div>Jalil BEN ABBES TAARJI<\/div>\n        <div class=\"muted\">Full Stack Developer<\/div>\n\n        <div style=\"height:15px\"><\/div>\n\n        <div>\n          <span class=\"prompt\">\u279c<\/span>\n          <span class=\"command\">~ cat developer.json<\/span>\n        <\/div>\n\n        <div>{<\/div>\n        <div>&nbsp; \"frontend\": <span class=\"value\">[\"React\",\"TypeScript\",\"Vite\"]<\/span>,<\/div>\n        <div>&nbsp; \"backend\": <span class=\"value\">[\"Supabase\",\"PostgreSQL\"]<\/span>,<\/div>\n        <div>&nbsp; \"tools\": <span class=\"value\">[\"Git\",\"Vitest\",\"Vercel\"]<\/span>,<\/div>\n        <div>&nbsp; \"focus\": <span class=\"value\">\"SaaS Development\"<\/span><\/div>\n        <div>}<\/div>\n\n        <div style=\"height:15px\"><\/div>\n\n        <div>\n          <span class=\"prompt\">\u279c<\/span>\n          <span class=\"command\">~ <\/span>\n          <span id=\"jalil-typing\">npm run build<\/span>\n          <span class=\"cursor\"><\/span>\n        <\/div>\n\n        <div>\n          <span class=\"system-status\">SYSTEM ONLINE<\/span>\n        <\/div>\n      <\/div>\n    <\/div>\n\n  <\/div>\n<\/section>\n\n<!-- TECHNOLOGIES -->\n<div class=\"tech-strip\">\n  <div class=\"container tech-items\">\n    <span>\u269b React<\/span>\n    <span>TS TypeScript<\/span>\n    <span>JS JavaScript<\/span>\n    <span>\u25c6 Supabase<\/span>\n    <span>\u25c8 PostgreSQL<\/span>\n    <span>\u26a1 Vite<\/span>\n    <span>\u2301 Git<\/span>\n    <span>\u25b2 Vercel<\/span>\n  <\/div>\n<\/div>\n\n<!-- ABOUT -->\n<section class=\"section\" id=\"jalil-about\">\n  <div class=\"container reveal\">\n    <div class=\"section-label\">01. \/about<\/div>\n\n    <h2 data-t=\"aboutTitle\">\n      Des id\u00e9es transform\u00e9es en solutions.\n    <\/h2>\n\n    <p class=\"section-desc\" data-t=\"aboutText\">\n      Je suis Jalil BEN ABBES TAARJI, d\u00e9veloppeur Full Stack\n      sp\u00e9cialis\u00e9 dans les applications web et les plateformes SaaS.\n      Je travaille sur les interfaces, les bases de donn\u00e9es,\n      la s\u00e9curit\u00e9, les tests et le d\u00e9ploiement.\n    <\/p>\n  <\/div>\n<\/section>\n\n<!-- SKILLS -->\n<section class=\"section\" id=\"jalil-skills\">\n  <div class=\"container\">\n    <div class=\"section-label\">02. \/tech-stack<\/div>\n    <h2 data-t=\"skillsTitle\">Mes technologies.<\/h2>\n\n    <div class=\"cards\">\n\n      <article class=\"card reveal\">\n        <div class=\"card-icon\">&lt;\/&gt;<\/div>\n        <h3>Frontend<\/h3>\n        <p data-t=\"frontendText\">\n          Interfaces modernes, rapides et adapt\u00e9es \u00e0 tous les \u00e9crans.\n        <\/p>\n        <div class=\"tags\">\n          <span class=\"tag\">React<\/span>\n          <span class=\"tag\">TypeScript<\/span>\n          <span class=\"tag\">Tailwind CSS<\/span>\n          <span class=\"tag\">Vite<\/span>\n        <\/div>\n      <\/article>\n\n      <article class=\"card reveal\">\n        <div class=\"card-icon\">{ }<\/div>\n        <h3>Backend & Database<\/h3>\n        <p data-t=\"backendText\">\n          Authentification, bases de donn\u00e9es, s\u00e9curit\u00e9 et APIs.\n        <\/p>\n        <div class=\"tags\">\n          <span class=\"tag\">Supabase<\/span>\n          <span class=\"tag\">PostgreSQL<\/span>\n          <span class=\"tag\">RLS<\/span>\n          <span class=\"tag\">Edge Functions<\/span>\n        <\/div>\n      <\/article>\n\n      <article class=\"card reveal\">\n        <div class=\"card-icon\">git_<\/div>\n        <h3>DevOps & Testing<\/h3>\n        <p data-t=\"devopsText\">\n          Tests, gestion du code et d\u00e9ploiement en production.\n        <\/p>\n        <div class=\"tags\">\n          <span class=\"tag\">Git<\/span>\n          <span class=\"tag\">GitHub<\/span>\n          <span class=\"tag\">Vitest<\/span>\n          <span class=\"tag\">Vercel<\/span>\n        <\/div>\n      <\/article>\n\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- PROJECT -->\n<section class=\"section\" id=\"jalil-projects\">\n  <div class=\"container\">\n\n    <div class=\"section-label\">03. \/featured-project<\/div>\n    <h2 data-t=\"projectsTitle\">Mes r\u00e9alisations.<\/h2>\n\n    <p class=\"section-desc\" data-t=\"projectsIntro\">\n      Des solutions d\u00e9velopp\u00e9es pour r\u00e9pondre \u00e0 des besoins r\u00e9els.\n    <\/p>\n\n    <div class=\"project reveal\">\n\n      <div class=\"project-screen\">\n        <div class=\"screen-head\">\n          <span>\u25cf<\/span>\n          <span>EasyReview \/ SaaS Dashboard<\/span>\n        <\/div>\n\n        <p class=\"muted mono\"\n           style=\"font-size:12px;margin-top:20px\"\n           data-t=\"previewNote\">\n          Interface conceptuelle \u2014 donn\u00e9es illustratives\n        <\/p>\n\n        <div class=\"screen-stat\">\n          <div class=\"stat\">\n            <strong>NFC<\/strong>\n            <small>Customer Flow<\/small>\n          <\/div>\n          <div class=\"stat\">\n            <strong>AI<\/strong>\n            <small>Review Analysis<\/small>\n          <\/div>\n          <div class=\"stat\">\n            <strong>SaaS<\/strong>\n            <small>Multi-tenant<\/small>\n          <\/div>\n        <\/div>\n\n        <div class=\"bars\" aria-hidden=\"true\">\n          <div class=\"bar\" style=\"--h:55%\"><\/div>\n          <div class=\"bar\" style=\"--h:82%\"><\/div>\n          <div class=\"bar\" style=\"--h:68%\"><\/div>\n          <div class=\"bar\" style=\"--h:95%\"><\/div>\n          <div class=\"bar\" style=\"--h:73%\"><\/div>\n          <div class=\"bar\" style=\"--h:88%\"><\/div>\n          <div class=\"bar\" style=\"--h:64%\"><\/div>\n          <div class=\"bar\" style=\"--h:91%\"><\/div>\n        <\/div>\n      <\/div>\n\n      <div>\n        <div class=\"section-label\">PROJECT \/ 001<\/div>\n        <h3 class=\"project-title\">EasyReview<\/h3>\n\n        <p class=\"section-desc\" data-t=\"projectText\">\n          Plateforme SaaS destin\u00e9e aux restaurants, combinant\n          NFC, retours clients, avis Google, gestion\n          multi-\u00e9tablissements et analyse assist\u00e9e\n          par intelligence artificielle.\n        <\/p>\n\n        <div class=\"tags\">\n          <span class=\"tag\">React<\/span>\n          <span class=\"tag\">TypeScript<\/span>\n          <span class=\"tag\">Supabase<\/span>\n          <span class=\"tag\">PostgreSQL<\/span>\n        <\/div>\n\n        <div class=\"actions\">\n          <a class=\"btn\"\n             href=\"https:\/\/easyreview-nine.vercel.app\/\"\n             target=\"_blank\"\n             rel=\"noopener noreferrer\">\n            <span data-t=\"viewProject\">D\u00e9couvrir le projet<\/span> \u2197\n          <\/a>\n        <\/div>\n      <\/div>\n\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- SERVICES -->\n<section class=\"section\" id=\"jalil-services\">\n  <div class=\"container\">\n    <div class=\"section-label\">04. \/services<\/div>\n\n    <h2 data-t=\"servicesTitle\">\n      Ce que je peux r\u00e9aliser.\n    <\/h2>\n\n    <div class=\"cards\">\n\n      <article class=\"card reveal\">\n        <div class=\"card-icon\">01_<\/div>\n        <h3 data-t=\"s1\">D\u00e9veloppement web<\/h3>\n        <p data-t=\"d1\">\n          Applications modernes, responsives et performantes.\n        <\/p>\n      <\/article>\n\n      <article class=\"card reveal\">\n        <div class=\"card-icon\">02_<\/div>\n        <h3 data-t=\"s2\">D\u00e9veloppement SaaS<\/h3>\n        <p data-t=\"d2\">\n          Plateformes \u00e9volutives et tableaux de bord professionnels.\n        <\/p>\n      <\/article>\n\n      <article class=\"card reveal\">\n        <div class=\"card-icon\">03_<\/div>\n        <h3 data-t=\"s3\">Backend & APIs<\/h3>\n        <p data-t=\"d3\">\n          Bases de donn\u00e9es, s\u00e9curit\u00e9 et int\u00e9grations.\n        <\/p>\n      <\/article>\n\n      <article class=\"card reveal\">\n        <div class=\"card-icon\">04_<\/div>\n        <h3 data-t=\"s4\">Correction de bugs<\/h3>\n        <p data-t=\"d4\">\n          Diagnostic, corrections et am\u00e9lioration du code.\n        <\/p>\n      <\/article>\n\n      <article class=\"card reveal\">\n        <div class=\"card-icon\">05_<\/div>\n        <h3 data-t=\"s5\">D\u00e9ploiement<\/h3>\n        <p data-t=\"d5\">\n          Mise en production et configuration des applications.\n        <\/p>\n      <\/article>\n\n      <article class=\"card reveal\">\n        <div class=\"card-icon\">06_<\/div>\n        <h3 data-t=\"s6\">Maintenance<\/h3>\n        <p data-t=\"d6\">\n          Optimisation, \u00e9volutions et fiabilisation.\n        <\/p>\n      <\/article>\n\n    <\/div>\n  <\/div>\n<\/section>\n\n<!-- CONTACT -->\n<section class=\"section\" id=\"jalil-contact\">\n  <div class=\"container\">\n\n    <div class=\"contact-box reveal\">\n      <div class=\"section-label\">05. \/initialize-contact<\/div>\n\n      <h2 data-t=\"contactTitle\">\n        Construisons votre prochain projet.\n      <\/h2>\n\n      <p class=\"section-desc\" data-t=\"contactText\">\n        Vous avez une id\u00e9e, une application \u00e0 d\u00e9velopper\n        ou un projet existant \u00e0 am\u00e9liorer ?\n        Discutons de vos besoins.\n      <\/p>\n\n      <p class=\"green mono\" dir=\"ltr\">\n        \u279c ready_to_collaborate = true;\n      <\/p>\n\n      <div class=\"actions\">\n        <a class=\"btn btn-primary\"\n           href=\"https:\/\/easyreview-nine.vercel.app\/\"\n           target=\"_blank\"\n           rel=\"noopener noreferrer\">\n          <span data-t=\"contactAction\">D\u00e9couvrir mon travail<\/span> \u2197\n        <\/a>\n      <\/div>\n\n      <p class=\"muted\"\n         style=\"font-size:12px;margin-top:20px\"\n         data-t=\"contactNote\">\n        Lien de contact professionnel \u00e0 ajouter.\n      <\/p>\n    <\/div>\n\n  <\/div>\n<\/section>\n\n<\/main>\n\n<footer class=\"footer\">\n  \u00a9 2026 Jalil BEN ABBES TAARJI \u2014\n  Designed & Built with &lt;\/&gt;\n<\/footer>\n\n<script>\n(function(){\n\"use strict\";\n\nconst root=document.getElementById(\"jalil-portfolio\");\nif(!root||root.dataset.ready===\"1\")return;\nroot.dataset.ready=\"1\";\n\nconst translations={\nfr:{\nhome:\"Accueil\",about:\"\u00c0 propos\",skills:\"Comp\u00e9tences\",\nprojects:\"Projets\",services:\"Services\",contact:\"Contact\",\nhello:\"Salut, moi c'est\",job:\"D\u00e9veloppeur Full Stack\",\nheroText:\"Je transforme des id\u00e9es en applications web modernes, plateformes SaaS et solutions digitales fiables.\",\nexplore:\"Explorer mes projets\",contactMe:\"Me contacter\",\naboutTitle:\"Des id\u00e9es transform\u00e9es en solutions.\",\naboutText:\"Je suis Jalil BEN ABBES TAARJI, d\u00e9veloppeur Full Stack sp\u00e9cialis\u00e9 dans les applications web et les plateformes SaaS. Je travaille sur les interfaces, les bases de donn\u00e9es, la s\u00e9curit\u00e9, les tests et le d\u00e9ploiement.\",\nskillsTitle:\"Mes technologies.\",\nfrontendText:\"Interfaces modernes, rapides et adapt\u00e9es \u00e0 tous les \u00e9crans.\",\nbackendText:\"Authentification, bases de donn\u00e9es, s\u00e9curit\u00e9 et APIs.\",\ndevopsText:\"Tests, gestion du code et d\u00e9ploiement en production.\",\nprojectsTitle:\"Mes r\u00e9alisations.\",\nprojectsIntro:\"Des solutions d\u00e9velopp\u00e9es pour r\u00e9pondre \u00e0 des besoins r\u00e9els.\",\npreviewNote:\"Interface conceptuelle \u2014 donn\u00e9es illustratives\",\nprojectText:\"Plateforme SaaS destin\u00e9e aux restaurants, combinant NFC, retours clients, avis Google, gestion multi-\u00e9tablissements et analyse assist\u00e9e par intelligence artificielle.\",\nviewProject:\"D\u00e9couvrir le projet\",\nservicesTitle:\"Ce que je peux r\u00e9aliser.\",\ns1:\"D\u00e9veloppement web\",d1:\"Applications modernes, responsives et performantes.\",\ns2:\"D\u00e9veloppement SaaS\",d2:\"Plateformes \u00e9volutives et tableaux de bord professionnels.\",\ns3:\"Backend & APIs\",d3:\"Bases de donn\u00e9es, s\u00e9curit\u00e9 et int\u00e9grations.\",\ns4:\"Correction de bugs\",d4:\"Diagnostic, corrections et am\u00e9lioration du code.\",\ns5:\"D\u00e9ploiement\",d5:\"Mise en production et configuration des applications.\",\ns6:\"Maintenance\",d6:\"Optimisation, \u00e9volutions et fiabilisation.\",\ncontactTitle:\"Construisons votre prochain projet.\",\ncontactText:\"Vous avez une id\u00e9e, une application \u00e0 d\u00e9velopper ou un projet existant \u00e0 am\u00e9liorer ? Discutons de vos besoins.\",\ncontactAction:\"D\u00e9couvrir mon travail\",\ncontactNote:\"Lien de contact professionnel \u00e0 ajouter.\",\nopenMenu:\"Ouvrir le menu\",closeMenu:\"Fermer le menu\"\n},\nen:{\nhome:\"Home\",about:\"About\",skills:\"Skills\",\nprojects:\"Projects\",services:\"Services\",contact:\"Contact\",\nhello:\"Hi, I'm\",job:\"Full Stack Developer\",\nheroText:\"I turn ideas into modern web applications, scalable SaaS platforms and reliable digital solutions.\",\nexplore:\"Explore My Work\",contactMe:\"Let's Connect\",\naboutTitle:\"Turning ideas into solutions.\",\naboutText:\"I'm Jalil BEN ABBES TAARJI, a Full Stack Developer specializing in web applications and SaaS platforms. I work on interfaces, databases, security, testing and deployment.\",\nskillsTitle:\"My tech stack.\",\nfrontendText:\"Modern, fast and responsive user interfaces.\",\nbackendText:\"Authentication, databases, security and APIs.\",\ndevopsText:\"Testing, source control and production deployment.\",\nprojectsTitle:\"Featured work.\",\nprojectsIntro:\"Solutions built to address real-world needs.\",\npreviewNote:\"Conceptual interface \u2014 illustrative data\",\nprojectText:\"A restaurant SaaS platform combining NFC, customer feedback, Google Reviews, multi-location management and AI-assisted analysis.\",\nviewProject:\"Explore Project\",\nservicesTitle:\"What I can build.\",\ns1:\"Web Development\",d1:\"Modern, responsive and performant applications.\",\ns2:\"SaaS Development\",d2:\"Scalable platforms and professional dashboards.\",\ns3:\"Backend & APIs\",d3:\"Databases, security and integrations.\",\ns4:\"Bug Fixing\",d4:\"Debugging, fixes and code improvements.\",\ns5:\"Deployment\",d5:\"Production deployment and application configuration.\",\ns6:\"Maintenance\",d6:\"Optimization, enhancements and reliability.\",\ncontactTitle:\"Let's build your next project.\",\ncontactText:\"Have an idea, an application to develop or an existing product to improve? Let's discuss your needs.\",\ncontactAction:\"Explore my work\",\ncontactNote:\"Professional contact link to be added.\",\nopenMenu:\"Open menu\",closeMenu:\"Close menu\"\n},\nar:{\nhome:\"\u0627\u0644\u0631\u0626\u064a\u0633\u064a\u0629\",about:\"\u0646\u0628\u0630\u0629 \u0639\u0646\u064a\",skills:\"\u0627\u0644\u0645\u0647\u0627\u0631\u0627\u062a\",\nprojects:\"\u0627\u0644\u0645\u0634\u0627\u0631\u064a\u0639\",services:\"\u0627\u0644\u062e\u062f\u0645\u0627\u062a\",contact:\"\u0627\u062a\u0635\u0644 \u0628\u064a\",\nhello:\"\u0645\u0631\u062d\u0628\u0627\u064b\u060c \u0623\u0646\u0627\",job:\"\u0645\u0637\u0648\u0631 \u0648\u064a\u0628 \u0645\u062a\u0643\u0627\u0645\u0644\",\nheroText:\"\u0623\u062d\u0648\u0651\u0644 \u0627\u0644\u0623\u0641\u0643\u0627\u0631 \u0625\u0644\u0649 \u062a\u0637\u0628\u064a\u0642\u0627\u062a \u0648\u064a\u0628 \u062d\u062f\u064a\u062b\u0629 \u0648\u0645\u0646\u0635\u0627\u062a SaaS \u0642\u0627\u0628\u0644\u0629 \u0644\u0644\u062a\u0648\u0633\u0639 \u0648\u062d\u0644\u0648\u0644 \u0631\u0642\u0645\u064a\u0629 \u0645\u0648\u062b\u0648\u0642\u0629.\",\nexplore:\"\u0627\u0643\u062a\u0634\u0641 \u0645\u0634\u0627\u0631\u064a\u0639\u064a\",contactMe:\"\u062a\u0648\u0627\u0635\u0644 \u0645\u0639\u064a\",\naboutTitle:\"\u0623\u062d\u0648\u0651\u0644 \u0627\u0644\u0623\u0641\u0643\u0627\u0631 \u0625\u0644\u0649 \u062d\u0644\u0648\u0644 \u0631\u0642\u0645\u064a\u0629.\",\naboutText:\"\u0623\u0646\u0627 \u062c\u0644\u064a\u0644 \u0628\u0646 \u0639\u0628\u0627\u0633 \u0627\u0644\u062a\u0639\u0631\u062c\u064a\u060c \u0645\u0637\u0648\u0631 Full Stack \u0645\u062a\u062e\u0635\u0635 \u0641\u064a \u062a\u0637\u0628\u064a\u0642\u0627\u062a \u0627\u0644\u0648\u064a\u0628 \u0648\u0645\u0646\u0635\u0627\u062a SaaS. \u0623\u0639\u0645\u0644 \u0639\u0644\u0649 \u0627\u0644\u0648\u0627\u062c\u0647\u0627\u062a \u0648\u0642\u0648\u0627\u0639\u062f \u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a \u0648\u0627\u0644\u0623\u0645\u0627\u0646 \u0648\u0627\u0644\u0627\u062e\u062a\u0628\u0627\u0631\u0627\u062a \u0648\u0646\u0634\u0631 \u0627\u0644\u062a\u0637\u0628\u064a\u0642\u0627\u062a.\",\nskillsTitle:\"\u0627\u0644\u062a\u0642\u0646\u064a\u0627\u062a \u0627\u0644\u062a\u064a \u0623\u0633\u062a\u062e\u062f\u0645\u0647\u0627.\",\nfrontendText:\"\u0648\u0627\u062c\u0647\u0627\u062a \u062d\u062f\u064a\u062b\u0629 \u0648\u0633\u0631\u064a\u0639\u0629 \u0648\u0645\u062a\u0648\u0627\u0641\u0642\u0629 \u0645\u0639 \u0645\u062e\u062a\u0644\u0641 \u0627\u0644\u0634\u0627\u0634\u0627\u062a.\",\nbackendText:\"\u0627\u0644\u0645\u0635\u0627\u062f\u0642\u0629 \u0648\u0642\u0648\u0627\u0639\u062f \u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a \u0648\u0627\u0644\u0623\u0645\u0627\u0646 \u0648\u0648\u0627\u062c\u0647\u0627\u062a \u0627\u0644\u0628\u0631\u0645\u062c\u0629.\",\ndevopsText:\"\u0627\u0644\u0627\u062e\u062a\u0628\u0627\u0631\u0627\u062a \u0648\u0625\u062f\u0627\u0631\u0629 \u0627\u0644\u0634\u064a\u0641\u0631\u0629 \u0648\u0627\u0644\u0646\u0634\u0631 \u0641\u064a \u0628\u064a\u0626\u0629 \u0627\u0644\u0625\u0646\u062a\u0627\u062c.\",\nprojectsTitle:\"\u0623\u0628\u0631\u0632 \u0623\u0639\u0645\u0627\u0644\u064a.\",\nprojectsIntro:\"\u062d\u0644\u0648\u0644 \u0645\u0637\u0648\u0631\u0629 \u0644\u062a\u0644\u0628\u064a\u0629 \u0627\u062d\u062a\u064a\u0627\u062c\u0627\u062a \u062d\u0642\u064a\u0642\u064a\u0629.\",\npreviewNote:\"\u0648\u0627\u062c\u0647\u0629 \u062a\u0648\u0636\u064a\u062d\u064a\u0629 \u2014 \u0628\u064a\u0627\u0646\u0627\u062a \u0627\u0641\u062a\u0631\u0627\u0636\u064a\u0629\",\nprojectText:\"\u0645\u0646\u0635\u0629 SaaS \u0644\u0644\u0645\u0637\u0627\u0639\u0645 \u062a\u062c\u0645\u0639 \u0628\u064a\u0646 \u062a\u0642\u0646\u064a\u0629 NFC \u0648\u0622\u0631\u0627\u0621 \u0627\u0644\u0639\u0645\u0644\u0627\u0621 \u0648\u062a\u0642\u064a\u064a\u0645\u0627\u062a Google \u0648\u0625\u062f\u0627\u0631\u0629 \u0627\u0644\u0641\u0631\u0648\u0639 \u0627\u0644\u0645\u062a\u0639\u062f\u062f\u0629 \u0648\u0627\u0644\u062a\u062d\u0644\u064a\u0644 \u0627\u0644\u0645\u062f\u0639\u0648\u0645 \u0628\u0627\u0644\u0630\u0643\u0627\u0621 \u0627\u0644\u0627\u0635\u0637\u0646\u0627\u0639\u064a.\",\nviewProject:\"\u0627\u0643\u062a\u0634\u0641 \u0627\u0644\u0645\u0634\u0631\u0648\u0639\",\nservicesTitle:\"\u0627\u0644\u062e\u062f\u0645\u0627\u062a \u0627\u0644\u062a\u064a \u0623\u0642\u062f\u0645\u0647\u0627.\",\ns1:\"\u062a\u0637\u0648\u064a\u0631 \u062a\u0637\u0628\u064a\u0642\u0627\u062a \u0627\u0644\u0648\u064a\u0628\",d1:\"\u062a\u0637\u0628\u064a\u0642\u0627\u062a \u062d\u062f\u064a\u062b\u0629 \u0648\u0633\u0631\u064a\u0639\u0629 \u0648\u0645\u062a\u0648\u0627\u0641\u0642\u0629 \u0645\u0639 \u0627\u0644\u0623\u062c\u0647\u0632\u0629 \u0627\u0644\u0645\u062e\u062a\u0644\u0641\u0629.\",\ns2:\"\u062a\u0637\u0648\u064a\u0631 \u0645\u0646\u0635\u0627\u062a SaaS\",d2:\"\u0645\u0646\u0635\u0627\u062a \u0642\u0627\u0628\u0644\u0629 \u0644\u0644\u062a\u0648\u0633\u0639 \u0648\u0644\u0648\u062d\u0627\u062a \u062a\u062d\u0643\u0645 \u0627\u062d\u062a\u0631\u0627\u0641\u064a\u0629.\",\ns3:\"\u0627\u0644\u062e\u062f\u0645\u0627\u062a \u0627\u0644\u062e\u0644\u0641\u064a\u0629 \u0648\u0648\u0627\u062c\u0647\u0627\u062a API\",d3:\"\u0642\u0648\u0627\u0639\u062f \u0627\u0644\u0628\u064a\u0627\u0646\u0627\u062a \u0648\u0627\u0644\u0623\u0645\u0627\u0646 \u0648\u0627\u0644\u062a\u0643\u0627\u0645\u0644\u0627\u062a.\",\ns4:\"\u0625\u0635\u0644\u0627\u062d \u0627\u0644\u0623\u062e\u0637\u0627\u0621\",d4:\"\u062a\u0634\u062e\u064a\u0635 \u0627\u0644\u0645\u0634\u0643\u0644\u0627\u062a \u0648\u0625\u0635\u0644\u0627\u062d\u0647\u0627 \u0648\u062a\u062d\u0633\u064a\u0646 \u0627\u0644\u0634\u064a\u0641\u0631\u0629.\",\ns5:\"\u0646\u0634\u0631 \u0627\u0644\u062a\u0637\u0628\u064a\u0642\u0627\u062a\",d5:\"\u0625\u0639\u062f\u0627\u062f \u0627\u0644\u062a\u0637\u0628\u064a\u0642\u0627\u062a \u0648\u0625\u0637\u0644\u0627\u0642\u0647\u0627 \u0641\u064a \u0628\u064a\u0626\u0629 \u0627\u0644\u0625\u0646\u062a\u0627\u062c.\",\ns6:\"\u0627\u0644\u0635\u064a\u0627\u0646\u0629 \u0648\u0627\u0644\u062a\u0637\u0648\u064a\u0631\",d6:\"\u062a\u062d\u0633\u064a\u0646 \u0627\u0644\u0623\u062f\u0627\u0621 \u0648\u0625\u0636\u0627\u0641\u0629 \u0627\u0644\u0645\u064a\u0632\u0627\u062a \u0648\u0632\u064a\u0627\u062f\u0629 \u0627\u0644\u0627\u0639\u062a\u0645\u0627\u062f\u064a\u0629.\",\ncontactTitle:\"\u0644\u0646\u0637\u0648\u0651\u0631 \u0645\u0634\u0631\u0648\u0639\u0643 \u0627\u0644\u0642\u0627\u062f\u0645.\",\ncontactText:\"\u0647\u0644 \u0644\u062f\u064a\u0643 \u0641\u0643\u0631\u0629 \u0623\u0648 \u062a\u0637\u0628\u064a\u0642 \u062a\u0631\u063a\u0628 \u0641\u064a \u062a\u0637\u0648\u064a\u0631\u0647 \u0623\u0648 \u0645\u0634\u0631\u0648\u0639 \u0642\u0627\u0626\u0645 \u064a\u062d\u062a\u0627\u062c \u0625\u0644\u0649 \u062a\u062d\u0633\u064a\u0646\u061f \u0644\u0646\u062a\u062d\u062f\u062b \u0639\u0646 \u0627\u062d\u062a\u064a\u0627\u062c\u0627\u062a\u0643.\",\ncontactAction:\"\u0627\u0643\u062a\u0634\u0641 \u0623\u0639\u0645\u0627\u0644\u064a\",\ncontactNote:\"\u064a\u062c\u0628 \u0625\u0636\u0627\u0641\u0629 \u0631\u0627\u0628\u0637 \u0644\u0644\u062a\u0648\u0627\u0635\u0644 \u0627\u0644\u0645\u0647\u0646\u064a.\",\nopenMenu:\"\u0641\u062a\u062d \u0627\u0644\u0642\u0627\u0626\u0645\u0629\",closeMenu:\"\u0625\u063a\u0644\u0627\u0642 \u0627\u0644\u0642\u0627\u0626\u0645\u0629\"\n}\n};\n\nlet currentLanguage=\"fr\";\n\nconst menu=root.querySelector(\"#jalil-mobile-toggle\");\nconst navigation=root.querySelector(\"#jalil-mobile-navigation\");\n\nfunction closeMenu(){\n  navigation.classList.remove(\"is-open\");\n  menu.setAttribute(\"aria-expanded\",\"false\");\n  menu.setAttribute(\"aria-label\",translations[currentLanguage].openMenu);\n  menu.textContent=\"\u2630\";\n}\n\nfunction setLanguage(lang){\n  if(!translations[lang])lang=\"fr\";\n  currentLanguage=lang;\n  const t=translations[lang];\n\n  root.setAttribute(\"lang\",lang);\n  root.setAttribute(\"dir\",lang===\"ar\"?\"rtl\":\"ltr\");\n\n  root.querySelectorAll(\"[data-t]\").forEach(el=>{\n    const key=el.dataset.t;\n    if(t[key]!==undefined)el.textContent=t[key];\n  });\n\n  root.querySelectorAll(\"[data-lang]\").forEach(btn=>{\n    const active=btn.dataset.lang===lang;\n    btn.classList.toggle(\"active\",active);\n    btn.setAttribute(\"aria-pressed\",String(active));\n  });\n\n  closeMenu();\n\n  try{\n    localStorage.setItem(\"jalil-language\",lang);\n  }catch(e){}\n}\n\nmenu.addEventListener(\"click\",()=>{\n  const open=!navigation.classList.contains(\"is-open\");\n\n  navigation.classList.toggle(\"is-open\",open);\n  menu.setAttribute(\"aria-expanded\",String(open));\n  menu.setAttribute(\"aria-label\",\n    open?translations[currentLanguage].closeMenu:\n    translations[currentLanguage].openMenu\n  );\n  menu.textContent=open?\"\u00d7\":\"\u2630\";\n});\n\nnavigation.querySelectorAll(\"a\").forEach(a=>{\n  a.addEventListener(\"click\",closeMenu);\n});\n\nroot.addEventListener(\"keydown\",e=>{\n  if(e.key===\"Escape\")closeMenu();\n});\n\nwindow.addEventListener(\"resize\",()=>{\n  if(window.innerWidth>1023)closeMenu();\n});\n\nroot.querySelectorAll(\"[data-lang]\").forEach(btn=>{\n  btn.addEventListener(\"click\",()=>{\n    setLanguage(btn.dataset.lang);\n  });\n});\n\nlet initial=\"fr\";\ntry{\n  const saved=localStorage.getItem(\"jalil-language\");\n  if(translations[saved])initial=saved;\n}catch(e){}\nsetLanguage(initial);\n\nconst reduced=window.matchMedia(\n  \"(prefers-reduced-motion: reduce)\"\n).matches;\n\n\/* TERMINAL ANIMATION *\/\nconst typing=root.querySelector(\"#jalil-typing\");\nconst commands=[\n  \"npm run build\",\n  \"git status\",\n  \"npm run test\",\n  \"vercel --prod\"\n];\n\nlet word=0;\nlet char=0;\nlet deleting=false;\n\nfunction animateTyping(){\n  if(!typing||!typing.isConnected)return;\n\n  const current=commands[word];\n  typing.textContent=current.slice(0,char);\n  let delay=85;\n\n  if(!deleting){\n    if(char<current.length){\n      char++;\n    }else{\n      deleting=true;\n      delay=1500;\n    }\n  }else{\n    if(char>0){\n      char--;\n      delay=45;\n    }else{\n      deleting=false;\n      word=(word+1)%commands.length;\n      delay=350;\n    }\n  }\n\n  setTimeout(animateTyping,delay);\n}\n\nif(typing&&!reduced)animateTyping();\nelse if(typing)typing.textContent=commands[0];\n\n\/* REVEAL *\/\nconst revealElements=root.querySelectorAll(\".reveal\");\n\nif(!reduced&&\"IntersectionObserver\" in window){\n  root.classList.add(\"animations-ready\");\n\n  const observer=new IntersectionObserver(entries=>{\n    entries.forEach(entry=>{\n      if(entry.isIntersecting){\n        entry.target.classList.add(\"visible\");\n        observer.unobserve(entry.target);\n      }\n    });\n  },{threshold:.08});\n\n  revealElements.forEach(el=>observer.observe(el));\n}\n\n\/* CARD GLOW *\/\nif(!reduced){\n  root.querySelectorAll(\".card\").forEach(card=>{\n    card.addEventListener(\"pointermove\",e=>{\n      const r=card.getBoundingClientRect();\n      card.style.setProperty(\"--mx\",(e.clientX-r.left)+\"px\");\n      card.style.setProperty(\"--my\",(e.clientY-r.top)+\"px\");\n    });\n  });\n}\n\n\/* SMOOTH SCROLL *\/\nroot.querySelectorAll('a[href^=\"#jalil-\"]').forEach(link=>{\n  link.addEventListener(\"click\",e=>{\n    const target=root.querySelector(link.getAttribute(\"href\"));\n    if(target){\n      e.preventDefault();\n      target.scrollIntoView({\n        behavior:reduced?\"auto\":\"smooth\",\n        block:\"start\"\n      });\n    }\n  });\n});\n\n})();\n<\/script>\n<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>&lt;Jalil \/&gt;_ Accueil \u00c0 propos Comp\u00e9tences Projets Services Contact FR EN AR \u2630 \u279c portfolio.init() Salut, moi c&#8217;est Jalil. D\u00e9veloppeur Full Stack_ Je transforme des id\u00e9es en applications web modernes, plateformes SaaS et solutions digitales fiables. Explorer mes projets \u2197 Me contacter \u2192 \u25cf React \/ TypeScript \u25cf Supabase \/ PostgreSQL \u25cf SaaS Development jalil@portfolio: [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":152,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"_thinkrank_schema_form_data":"","_thinkrank_selected_schema_type":"","_thinkrank_additional_schemas":"","_thinkrank_canonical_url":"","_thinkrank_og_title":"","_thinkrank_og_description":"","_thinkrank_og_image":"","_thinkrank_twitter_title":"","_thinkrank_twitter_description":"","_thinkrank_twitter_image":"","_thinkrank_imported_from":"","_thinkrank_focus_keywords":[],"_thinkrank_focus_keyword":"","_thinkrank_robots_meta_enabled":0,"_thinkrank_robots_meta":"[]","_thinkrank_advanced_robots_meta":"[]","_thinkrank_primary_category":0,"footnotes":""},"class_list":["post-134","page","type-page","status-publish","has-post-thumbnail","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.7 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>JalilBT. - Easy Services<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/easyservices.store\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"JalilBT. - Easy Services\" \/>\n<meta property=\"og:description\" content=\"&lt;Jalil \/&gt;_ Accueil \u00c0 propos Comp\u00e9tences Projets Services Contact FR EN AR \u2630 \u279c portfolio.init() Salut, moi c&#8217;est Jalil. D\u00e9veloppeur Full Stack_ Je transforme des id\u00e9es en applications web modernes, plateformes SaaS et solutions digitales fiables. Explorer mes projets \u2197 Me contacter \u2192 \u25cf React \/ TypeScript \u25cf Supabase \/ PostgreSQL \u25cf SaaS Development jalil@portfolio: [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/easyservices.store\/\" \/>\n<meta property=\"og:site_name\" content=\"Easy Services\" \/>\n<meta property=\"article:modified_time\" content=\"2026-10-16T20:35:13+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/easyservices.store\/wp-content\/uploads\/2026\/10\/images.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"447\" \/>\n\t<meta property=\"og:image:height\" content=\"447\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/easyservices.store\\\/\",\"url\":\"https:\\\/\\\/easyservices.store\\\/\",\"name\":\"JalilBT. - Easy Services\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/easyservices.store\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/easyservices.store\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/easyservices.store\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/easyservices.store\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/images.jpg\",\"datePublished\":\"2026-10-16T19:01:49+00:00\",\"dateModified\":\"2026-10-16T20:35:13+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/easyservices.store\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/easyservices.store\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/easyservices.store\\\/#primaryimage\",\"url\":\"https:\\\/\\\/easyservices.store\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/images.jpg\",\"contentUrl\":\"https:\\\/\\\/easyservices.store\\\/wp-content\\\/uploads\\\/2026\\\/10\\\/images.jpg\",\"width\":447,\"height\":447},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/easyservices.store\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/easyservices.store\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"JalilBT.\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/easyservices.store\\\/#website\",\"url\":\"https:\\\/\\\/easyservices.store\\\/\",\"name\":\"Easy Services\",\"description\":\"Le digital qui commence dans votre commerce.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/easyservices.store\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"JalilBT. - Easy Services","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/easyservices.store\/","og_locale":"en_US","og_type":"article","og_title":"JalilBT. - Easy Services","og_description":"&lt;Jalil \/&gt;_ Accueil \u00c0 propos Comp\u00e9tences Projets Services Contact FR EN AR \u2630 \u279c portfolio.init() Salut, moi c&#8217;est Jalil. D\u00e9veloppeur Full Stack_ Je transforme des id\u00e9es en applications web modernes, plateformes SaaS et solutions digitales fiables. Explorer mes projets \u2197 Me contacter \u2192 \u25cf React \/ TypeScript \u25cf Supabase \/ PostgreSQL \u25cf SaaS Development jalil@portfolio: [&hellip;]","og_url":"https:\/\/easyservices.store\/","og_site_name":"Easy Services","article_modified_time":"2026-10-16T20:35:13+00:00","og_image":[{"width":447,"height":447,"url":"https:\/\/easyservices.store\/wp-content\/uploads\/2026\/10\/images.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/easyservices.store\/","url":"https:\/\/easyservices.store\/","name":"JalilBT. - Easy Services","isPartOf":{"@id":"https:\/\/easyservices.store\/#website"},"primaryImageOfPage":{"@id":"https:\/\/easyservices.store\/#primaryimage"},"image":{"@id":"https:\/\/easyservices.store\/#primaryimage"},"thumbnailUrl":"https:\/\/easyservices.store\/wp-content\/uploads\/2026\/10\/images.jpg","datePublished":"2026-10-16T19:01:49+00:00","dateModified":"2026-10-16T20:35:13+00:00","breadcrumb":{"@id":"https:\/\/easyservices.store\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/easyservices.store\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/easyservices.store\/#primaryimage","url":"https:\/\/easyservices.store\/wp-content\/uploads\/2026\/10\/images.jpg","contentUrl":"https:\/\/easyservices.store\/wp-content\/uploads\/2026\/10\/images.jpg","width":447,"height":447},{"@type":"BreadcrumbList","@id":"https:\/\/easyservices.store\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/easyservices.store\/"},{"@type":"ListItem","position":2,"name":"JalilBT."}]},{"@type":"WebSite","@id":"https:\/\/easyservices.store\/#website","url":"https:\/\/easyservices.store\/","name":"Easy Services","description":"Le digital qui commence dans votre commerce.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/easyservices.store\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/easyservices.store\/index.php\/wp-json\/wp\/v2\/pages\/134","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/easyservices.store\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/easyservices.store\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/easyservices.store\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/easyservices.store\/index.php\/wp-json\/wp\/v2\/comments?post=134"}],"version-history":[{"count":20,"href":"https:\/\/easyservices.store\/index.php\/wp-json\/wp\/v2\/pages\/134\/revisions"}],"predecessor-version":[{"id":160,"href":"https:\/\/easyservices.store\/index.php\/wp-json\/wp\/v2\/pages\/134\/revisions\/160"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/easyservices.store\/index.php\/wp-json\/wp\/v2\/media\/152"}],"wp:attachment":[{"href":"https:\/\/easyservices.store\/index.php\/wp-json\/wp\/v2\/media?parent=134"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}