Pour tout problème contactez-nous par mail : support@froggit.fr | La FAQ :grey_question: | Rejoignez-nous sur le Chat :speech_balloon:

Skip to content
Snippets Groups Projects
Commit b7febe52 authored by Celeste Robert's avatar Celeste Robert
Browse files

feat: individual mentorship page

parent 53405af8
No related branches found
No related tags found
1 merge request!38Resolve "Refonte de la landing page /mentor"
Pipeline #62387 failed
Stage: build
Stage: 🧪 test
Stage: 📝 publish
Stage: 🧽 clean
Hide whitespace changes
Inline Side-by-side
package-lock.json
+ 30
− 3
View file @ b7febe52
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
"name": "compagnons-devops-fr", "name": "compagnons-devops-fr",
"version": "0.0.0", "version": "0.0.0",
"dependencies": { "dependencies": {
"@calcom/embed-react": "^1.5.2",
"@docusaurus/core": "^3.7", "@docusaurus/core": "^3.7",
"@docusaurus/plugin-content-blog": "^3.7.0", "@docusaurus/plugin-content-blog": "^3.7.0",
"@docusaurus/preset-classic": "^3.7", "@docusaurus/preset-classic": "^3.7",
...@@ -1939,6 +1940,32 @@ ...@@ -1939,6 +1940,32 @@
"node": ">=6.9.0" "node": ">=6.9.0"
} }
}, },
"node_modules/@calcom/embed-core": {
"version": "1.5.2",
"resolved": "https://registry.npmjs.org/@calcom/embed-core/-/embed-core-1.5.2.tgz",
"integrity": "sha512-y1mpVDfcaVdLJ/CN17c7N2SyJAMiM3u9NYvL5mWFDBe4aa5HLTDc5g/DBbO2oCq859W3bxs11voC/E3KkJH3Iw=="
},
"node_modules/@calcom/embed-react": {
"version": "1.5.2",
"resolved": "https://registry.npmjs.org/@calcom/embed-react/-/embed-react-1.5.2.tgz",
"integrity": "sha512-DgY3RySiXOrbIVX1LiV/ucKilG+TkvqhP4/0nLlKPLOlk642cSO30xSu4nOmVgR60FLqMyp7Vlg/Xd6J5ijETg==",
"dependencies": {
"@calcom/embed-core": "1.5.2",
"@calcom/embed-snippet": "1.3.2"
},
"peerDependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0"
}
},
"node_modules/@calcom/embed-snippet": {
"version": "1.3.2",
"resolved": "https://registry.npmjs.org/@calcom/embed-snippet/-/embed-snippet-1.3.2.tgz",
"integrity": "sha512-EmW/ZjaQD0HjLI8yFNA5Mtb8zCOQQnj9RhChujuMijUK8EVyE1KtU9t3xIxm1hBMNHr4R1qMaBo2QYaZqQhzsw==",
"dependencies": {
"@calcom/embed-core": "1.5.2"
}
},
"node_modules/@colors/colors": { "node_modules/@colors/colors": {
"version": "1.5.0", "version": "1.5.0",
"resolved": "https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz", "resolved": "https://registry.npmjs.org/@colors/colors/-/colors-1.5.0.tgz",
...@@ -18928,9 +18955,9 @@ ...@@ -18928,9 +18955,9 @@
} }
}, },
"node_modules/typescript": { "node_modules/typescript": {
"version": "5.7.3", "version": "5.8.3",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-5.7.3.tgz", "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.8.3.tgz",
"integrity": "sha512-84MVSjMEHP+FQRPy3pX9sTVV/INIex71s9TL2Gm5FG/WG1SqXeKyZ0k7/blY/4FdOzI12CBy1vGc4og/eus0fw==", "integrity": "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ==",
"license": "Apache-2.0", "license": "Apache-2.0",
"peer": true, "peer": true,
"bin": { "bin": {
......
package.json
+ 1
− 0
View file @ b7febe52
...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
"lint": "eslint '**/*.js'" "lint": "eslint '**/*.js'"
}, },
"dependencies": { "dependencies": {
"@calcom/embed-react": "^1.5.2",
"@docusaurus/core": "^3.7", "@docusaurus/core": "^3.7",
"@docusaurus/plugin-content-blog": "^3.7.0", "@docusaurus/plugin-content-blog": "^3.7.0",
"@docusaurus/preset-classic": "^3.7", "@docusaurus/preset-classic": "^3.7",
......
src/components/HomepageList/index.js
+ 3
− 21
View file @ b7febe52
...@@ -3,20 +3,7 @@ import styles from './styles.module.css'; ...@@ -3,20 +3,7 @@ import styles from './styles.module.css';
import checkmark from '@site/static/img/components/HomepageList/checked.png' import checkmark from '@site/static/img/components/HomepageList/checked.png'
const FeatureList = [
{
title: <>La <b>passion</b> de l’<i>infrastructure as code</i>.</>,
},
{
title: <>La conviction que les <b>logiciels libres</b> et open-source sont émancipateurs </>,
},
{
title: <> L’envie de <b>partager</b> des méthodes, bonnes pratiques ou retours d’expériences.</>,
},
{
title: <>L’<b>amélioration continue</b> fait de nous des experts en devenir.</>,
},
];
function Feature({title}) { function Feature({title}) {
return ( return (
...@@ -27,17 +14,12 @@ function Feature({title}) { ...@@ -27,17 +14,12 @@ function Feature({title}) {
); );
} }
export default function HomepageList() { export default function HomepageList(list) {
return ( return (
<div className={styles.listContainer + ' container'}>
<p>Chez Lydra nous nous sentons seuls entre deux Meetups ou deux conférences. <br/> Nous n’avons pas trouvé de lieu où échanger et avoir des débats en français sur le sujet qui nous passionne. </p>
<p> Nous avons donc décidé de créer et d’animer une communauté qui partage nos valeurs : </p>
<ul className="col"> <ul className="col">
{FeatureList.map((props, idx) => ( {list.list.map((props, idx) => (
<Feature key={idx} {...props} /> <Feature key={idx} {...props} />
))} ))}
</ul> </ul>
</div>
); );
} }
src/components/Ical.jsx 0 → 100644
+ 15
− 0
View file @ b7febe52
import Cal, { getCalApi } from "@calcom/embed-react";
import { useEffect } from "react";
export default function Ical() {
useEffect(()=>{
(async function () {
const cal = await getCalApi({"namespace":"mentor"});
cal("ui", {"cssVarsPerTheme":{"light":{"cal-brand":"#E8AC00"},"dark":{"cal-brand":"#E8AC00"}},"hideEventTypeDetails":false,"layout":"month_view"});
})();
}, [])
return <Cal namespace="mentor"
calLink="cchaudier/mentor"
style={{width:"100%",height:"100%",overflow:"scroll"}}
config={{"layout":"month_view","theme":"auto"}}
/>;
};
src/pages/index.js
+ 20
− 1
View file @ b7febe52
...@@ -17,6 +17,21 @@ export default function Home() { ...@@ -17,6 +17,21 @@ export default function Home() {
document.getElementById("join").appendChild(script); document.getElementById("join").appendChild(script);
}, []); }, []);
const list = [
{
title: <>La <b>passion</b> de l’<i>infrastructure as code</i>.</>,
},
{
title: <>La conviction que les <b>logiciels libres</b> et open-source sont émancipateurs </>,
},
{
title: <> L’envie de <b>partager</b> des méthodes, bonnes pratiques ou retours d’expériences.</>,
},
{
title: <>L’<b>amélioration continue</b> fait de nous des experts en devenir.</>,
},
];
const FeatureList = [ const FeatureList = [
{ {
title: 'Tu te sens seul avec l’envie d’échanger sur les méthodes DevOps...', title: 'Tu te sens seul avec l’envie d’échanger sur les méthodes DevOps...',
...@@ -52,7 +67,11 @@ export default function Home() { ...@@ -52,7 +67,11 @@ export default function Home() {
<section className="text--center margin-vert--xl"> <section className="text--center margin-vert--xl">
<Heading as='h2' className='text--center'>C&apos;est quoi les Compagnons du DevOps ?</Heading> <Heading as='h2' className='text--center'>C&apos;est quoi les Compagnons du DevOps ?</Heading>
<YoutubeEmbed embedId="pg3M3LeaP-k?start=30" /> <YoutubeEmbed embedId="pg3M3LeaP-k?start=30" />
<HomepageList/> <div className='container text--left'>
<p>Chez Lydra nous nous sentons seuls entre deux Meetups ou deux conférences. <br/> Nous n’avons pas trouvé de lieu où échanger et avoir des débats en français sur le sujet qui nous passionne. </p>
<p> Nous avons donc décidé de créer et d’animer une communauté qui partage nos valeurs : </p>
<HomepageList list={list}/>
</div>
</section> </section>
<section> <section>
<TestimoniesCarousel /> <TestimoniesCarousel />
......
src/pages/mentor.js → src/pages/mentor.jsx
+ 0
− 0
View file @ b7febe52
File moved
src/pages/mentorat-individuel.jsx 0 → 100644
+ 242
− 0
View file @ b7febe52
import React from 'react';
import Layout from '@theme/Layout';
import Heading from '@theme/Heading'
import Link from '@docusaurus/Link'
import HomepageList from '@site/src/components/HomepageList';
import Ical from '@site/src/components/Ical';
export default function Mentor() {
const list = [
{
title: '3 à 4 fois plus de vitesse',
},
{
title: 'Moins de stress, plus de sérénité',
},
{
title: 'Des choix techniques assumés',
},
{
title: 'Un vrai recul sur ta posture',
},
{
title: 'De la motivation, du cadre, de la clarté',
},
]
return (
<Layout
title="Mentorat"
description="Apprends plus vite grâce à un mentor DevOps">
<main>
<section className='heroShadow'>
<div className='heroBanner'>
<Heading as='h1' className='hero__title text--center margin-bottom--none'> Tu veux progresser en DevOps… mais tu galère ?</Heading> <p className="hero__subtitle">Tu es dev, ops, en reconversion ou CTO débordé.</p>
<img src={require('@site/static/img/components/HomepageWelcome/target.png').default} style={{width: '115px'}} alt="Mentorat DevOps" />
<div className='container'>
<p className='text--center margin-top--md' style={{fontSize: '1.2rem'}}> Et tu le sens bien : t’as pas de vision clair sur ce que tu dois faire. <br /> T’as pas la méthode. <br />Et surtout… <strong>t’as pas le temps de te planter.</strong></p>
<Link to="#rdv" className="button button--primary"> Je veux un mentorat individuel</Link>
</div>
</div>
</section>
<section className="margin-vert--xl">
<div className="container ">
<Heading as='h2' style={{fontSize: '2rem'}}>🚨 Tu vis ça ?</Heading>
<ul>
<li>Tu gères une infra trop grosse pour tes épaules</li>
<li>Tu avances dans le flou, seul, sans recul</li>
<li>Tu doutes de tes choix techniques</li>
<li>Tu passes tes soirées à chercher des solutions</li>
<li>Tu sens que tu pourrais aller plus vite… mais tu tournes en rond</li>
</ul>
<p>💥 Tu n’as pas besoin d’une formation de plus. Tu as besoin d’un mentor.</p>
</div>
<div className="container">
<Heading as='h2'>🧭 Un mentor, c’est un raccourci</Heading>
<p className='margin-bottom--sm'>Pas un gourou. Pas un coach bullshit. Juste quelqu’un qui a déjà traversé ce que tu vis, et qui t’aide à :</p>
<ul>
<li>Te poser les bonnes questions</li>
<li>Gagner du temps</li>
<li>Monter en compétence</li>
<li>Trouver ton propre chemin DevOps</li>
</ul>
<Heading as='h2' className='margin-bottom--none'> 👋 Moi, c’est Christophe Chaudier</Heading>
<ul>
<li>Je travail dans la tech depuis 25 ans</li>
<li>Je suis Artisan DevOps et CTO de notre petite ESN</li>
<li>Créateur du forum des Compagnons du DevOps (+1700 membres)</li>
<li>Animateur du podcast Radio DevOps</li>
<li>+4 ans de vidéos sur YouTube pour vulgariser et transmettre le cloud et le DevOps</li>
</ul>
<p> 👋 Je suis là pour t’accompagner, te challenger et te faire progresser sérieusement (et sans te lâcher).</p>
</div>
</section>
<section className="margin-vert--xl">
<div className="container">
<Heading as='h2' style={{fontSize: '2rem'}}>💬 Ce que disent mes mentorés</Heading>
<div className="row">
<div className="col">
<div className="card">
<div className="card__header">
<Heading as='h2'>🎥 Vidéo - Témoignage de Mathieu</Heading>
</div>
<div className="card__body text--left">
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/9pWNcISwF3E?si=IKTkdgtYD8kGYkYJ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
<blockquote className='margin-top--md'>
“On a perdu notre DevOps. J’ai repris l’infra, seul. Grâce au mentorat, on a gagné 3 à 4 fois plus de temps que si j’avais fait ça dans mon coin. Christophe m’a recentré, m’a guidé. On a avancé à une vitesse folle.”
</blockquote>
</div>
</div>
</div>
<div className="col">
<div className="card">
<div className="card__header">
<Heading as='h2'>🎥 Vidéo - Témoignage de Christian (INRAE)</Heading>
</div>
<div className="card__body text--left">
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/vtSIBjGe9Zk?si=SMRukjZQD-OIYlSp" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe> <blockquote className='margin-top--md'>
"On était 5 admins, chacun bossait différemment. Grâce au mentorat, on a aligné nos pratiques. Même les plus expérimentés ont appris. On a évité des erreurs. Et <i> on a gagné en clarté, en cohésion, en efficacité.</i>"
</blockquote>
<blockquote>
"Christophe ne te donne pas des réponses toutes faites. Il te fait réfléchir. Il t’aide à décider. Et <i> il t’accompagne jusqu’au bout.</i>
Tout est structuré. Les replays, les ressources, les plans d’action… c’est carré."
</blockquote>
</div>
</div>
</div>
</div>
</div>
</section>
<section className="margin-vert--xl">
<div className="container">
<Heading style={{fontSize: '2rem'}} as='h2'>🎯 Le mentorat DevOps individuel</Heading>
<p>
C’est un accompagnement humain, personnalisé et technique, pour te faire grandir dans ta pratique DevOps.
</p>
<p>
Chaque mois, tu as :
</p>
<ul>
<li>Une séance en visio (1h)</li>
<li>Pair programming, code review, questions libres</li>
<li>Un plan d’action sur-mesure</li>
</ul>
<p>
Un espace privé avec :
</p>
<ul>
<li>Replay vidéo</li>
<li>Leur transcriptions IA</li>
<li>Notes et ressources du mentor</li>
</ul>
<p>
🎁 Bonus : accès à toutes mes formations e-learning sur le DevOps gratuitement.
</p>
</div>
<div className="container">
<Heading as='h3'>💥 Ce que tu vas gagner</Heading>
<HomepageList list={list}/>
</div>
</section>
<section className="margin-vert--xl">
<div className="container">
<Heading as='h2' style={{fontSize: '2rem'}}>🛠️ Les formules individuelles</Heading>
<table>
<thead>
<tr>
<th>Formule</th>
<th>Fréquence des séances</th>
<th>Prix HT</th>
</tr>
</thead>
<tbody>
<tr>
<td>Légère</td>
<td>1h par mois</td>
<td>250 €</td>
</tr>
<tr>
<td>Sprint</td>
<td>1h toutes les 2 semaines</td>
<td>450 €</td>
</tr>
<tr>
<td>Intense</td>
<td>1h toutes les semaines</td>
<td>800 €</td>
</tr>
</tbody>
</table>
<ul style={{listStyleType: 'none', paddingLeft: '0'}}>
<li>✔️ Finançable OPCO (contact-moi pour que l'on parle des conditions)</li>
<li>✔️ Sans engagement long</li>
<li>✔️ Abonnement mensuel modifiable ou résiliable à tout moment avant le 15 du mois</li>
<li>✔️ Mentorat 100% à distance</li>
</ul>
</div>
<div className="container margin-vert--lg">
<div className="row">
<div className="col">
<Heading as='h3'>✅ C’est pour toi si…</Heading>
<p>
Tu veux progresser sans bullshit
</p>
<p>
Tu veux faire les choses bien
</p>
<p>
Tu as un projet DevOps concret (pro/perso)
</p>
<p>
Tu veux un vrai regard extérieur
</p>
</div>
<div className="col">
<Heading as='h3'>❌ Ce n’est pas pour toi si…</Heading>
<p>
Tu veux juste consommer des tutos
</p>
<p>
Tu ne veux pas t’impliquer
</p>
<p>
Tu refuses d’être challengé
</p>
<p>
Tu cherche juste des formations techniques
</p>
</div>
</div>
</div>
<div className="container" id="rdv">
<Heading as='h3'>🔥 Tu veux passer un cap ?</Heading>
<p>
📍 Réserve ta session découverte dès maintenant :
</p>
<Ical/>
<div className="margin-vert--lg text--center">
📎 Ou télécharge le programme complet ici : <br />
<Link to="https://bref.lydra.fr/mentordevops" className="button button--primary margin-vert--md">👉 Télécharger le PDF pour ton manager</Link>
<p>
Le meilleur moment pour se faire accompagner, c’était hier.
<b> Le deuxième meilleur moment, c’est maintenant. </b>
</p>
</div>
</div>
</section>
</main>
</Layout>
);
}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment

Froggit est fièrement fabriqué avec amour par Lydra avec des Logiciels Libres et hébergé en France chez Scaleway | Status du service