Compare commits

..

35 commits

Author SHA1 Message Date
a39f5edbb0 package : version 1.0.0 -> 2.0.0 2024-06-13 10:26:37 +02:00
abbbd81e28 portfolio : suppression option frameborder dépréciée 2024-06-13 10:25:42 +02:00
7eb917ad47 package-lock : mise à jour dépendances 2024-06-13 10:22:50 +02:00
8de1966903 portfolio : interligne 1.8 -> 1.5 2024-06-11 14:13:30 +02:00
778d7e4780 portfolio : liens réglés 2024-06-04 11:55:48 +02:00
09ba113258 Merge branch 'dev' into skill-issue 2024-06-04 11:30:35 +02:00
44867b7a02 portfolio : ajout carrière musicale 2024-06-04 10:37:38 +02:00
e18b665c2f portfolio : encapsulation du dernier paragraphe dans des balises <p> 2024-06-04 10:24:43 +02:00
f021e1ba78 layouts : modification de la police de caractères 2024-06-04 10:24:26 +02:00
cc2450e4f2 package-lock : mise à jour 2024-06-04 10:14:13 +02:00
f1363b929a portfolio : ajout catégorie my skills 2024-05-29 16:18:15 +02:00
9f2c84f8dc portfolio : meileures lignes pour les transitions 2024-05-29 15:55:36 +02:00
29726495dc portfolio : j'avais oublié un <p> 2024-05-28 18:41:47 +02:00
fa059251f2 package-lock : mise à jour 2024-05-28 18:03:01 +02:00
d82d5ef3b0 pages/portfolio : description qemush 2024-05-23 15:50:40 +02:00
8e6724c7d2 pages/portfolio : balises <p> plus lisibles 2024-05-23 11:56:33 +02:00
42989b1b17 pages/portfolio : meilleure présentation 2024-05-23 11:52:29 +02:00
1c841dc27e pages/portfolio : style pour les légendes 2024-05-23 11:41:17 +02:00
8b4dcffff4 pages/portfolio : style pour le code 2024-05-23 11:40:10 +02:00
502e5274a7 pages/portfolio : style pour les liens 2024-05-23 11:39:20 +02:00
7289773b0c pages/portfolio : espacement des lignes ++ 2024-05-23 11:19:51 +02:00
013a872c88 pages/portfolio : suppression style lien 2024-05-23 11:19:38 +02:00
0c813aeb7f pages/portfolio : box shadow pour les images 2024-05-23 11:18:52 +02:00
eeb58c0111 layouts/Page : justifier texte 2024-05-23 11:18:36 +02:00
223639ad30 package-lock : mise à jour packages 2024-05-23 10:10:31 +02:00
1ceb0bd38c pages : meilleure manière d'ignorer un fichier 2024-05-23 10:09:27 +02:00
ff99147753 portfolio : traduction anglais 2024-05-22 21:15:39 +02:00
3c588ceee9 pages : sauvegarde de la version française du portfolio 2024-05-16 15:19:14 +02:00
23d8c14327 layouts/Page : gestion du titre 2024-05-16 14:54:44 +02:00
42c685dfc4 Header : ajout lien portfolio 2024-05-16 14:54:23 +02:00
a8b5044ad3 Ajout : page portfolio 2024-05-16 14:53:48 +02:00
9c7177d4ce Ajout : photo tera-io 2024-05-16 14:53:13 +02:00
666e177701 src : modularisation avec un layout 2024-05-16 13:31:28 +02:00
60f490f2c5 package-lock : mise à jour dépendances 2024-05-16 13:16:14 +02:00
d25ed5970d package : -> 1.0.0 2024-05-16 13:15:02 +02:00
8 changed files with 1815 additions and 674 deletions

2136
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -1,7 +1,7 @@
{
"name": "ahurac-homepage",
"type": "module",
"version": "0.1.0",
"version": "2.0.0",
"scripts": {
"dev": "astro dev",
"start": "astro dev",

BIN
src/assets/tera-io.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 MiB

View file

@ -7,6 +7,7 @@ import NavButton from '../components/NavButton.astro'
<span>Ahurac</span>
<div class="navButtons">
<NavButton link="/">Home</NavButton>
<NavButton link="/portfolio">Portfolio</NavButton>
<NavButton link="mailto:ahurac@mailbox.org">Contact (mail)</NavButton>
</div>
</div>

64
src/layouts/Page.astro Normal file
View file

@ -0,0 +1,64 @@
---
import Header from '../components/Header.astro';
const { title } = Astro.props;
---
<html lang="en">
<head>
<meta charset="utf-8" />
<!-- <link rel="icon" type="image/svg+xml" href="/favicon.svg" /> -->
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>Ahurac | { title }</title>
</head>
<body>
<Header />
<main><slot /></main>
</body>
</html>
<style>
@font-face {
font-family: 'Cantarell';
src: url('/fonts/cantarell.otf') format('opentype');
font-weight: normal;
font-style: normal;
font-display: swap;
}
body {
/* Background */
background: linear-gradient(90deg, #08001a 0%, #000d1a 100%);
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
background-color: black;
/* Text */
color: white;
font-family: 'Cantarell', sans-serif;
/* Flex */
display: flex;
align-items: center;
margin: 0;
flex-direction: column;
font-size: 110%;
}
main {
width: 40%;
text-align: justify;
}
@media screen and (max-width: 1200px) {
main {
width: 60%;
}
}
@media screen and (max-width: 800px) {
main {
width: 95%;
}
}
</style>

View file

@ -0,0 +1,44 @@
---
import Page from '../layouts/Page.astro';
import { Image } from 'astro:assets';
import teraioImg from '../assets/tera-io.jpg';
---
<Page title="Portfolio">
<h1>Qui suis-je ?</h1>
<p>J'étudie actuellement en 3<sup>ème</sup> année de BUT Informatique à l'IUT2 de Grenoble, dans le parcours "Déploiement d'applications communicantes et sécurisées" dont le contenu se rapporte à l'administration système et à la sécurité informatique. Fasciné par la capacité d'un système d'exploitation à proposer une interface à l'utilisateur depuis mon plus jeune âge, je me prends de passion pour l'écosystème Linux en 2022, dont je fais une utilisation intensive depuis. Cette passion m'a poussé à mener un combat en faveur du logiciel libre.</p>
<h1>Mes projets</h1>
<h2>Engagement pour le logiciel et l'Internet libre</h2>
<p>Depuis 2023, je mets en ligne des services à base de logiciels libres sur le web grâce à mon serveur personnel, <code>tera-io</code>. Ces services me permettent de ne pas avoir recours à des équivalents dispensés par des entreprises irrespectueuses de la vie privée des utilisateur•ices, ainsi que de parfaire mes connaissances et ma pratique de l'administration système et du déploiement de services.</p>
<Image
alt="tera-io, mon serveur personnel"
src={ teraioImg }
width={ 200 }
/>
<figcaption>Photo de <code>tera-io</code>, mon serveur personnel</figcaption>
<p>
- **[Forgejo](https://forgejo.org/)**, une forge de code source
- **[Matrix](https://matrix.org/)** via le logiciel **[Conduit](https://conduit.rs/)**, une messagerie instantannée chiffrée et fédérée
- **[Bitwarden](https://bitwarden.com/)** via le logiciel **[Vaultwarden](https://github.com/dani-garcia/vaultwarden)**, un gestionnaire de mot de passe centralisé
</p>
</Page>
<style>
img {
display: block;
margin-left: auto;
margin-right: auto;
}
figcaption {
text-align: center;
font-style: italic;
}
</style>

View file

@ -1,91 +1,39 @@
---
import Header from '../components/Header.astro';
import Page from '../layouts/Page.astro';
import Card from '../components/Card.astro';
---
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="viewport" content="width=device-width" />
<meta name="generator" content={Astro.generator} />
<title>Ahurac</title>
</head>
<body>
<Header />
<main>
<p>Home of a FOSS extremist and music nerd.</p>
<h1>My services</h1>
<div id="cards">
<Card
<Page title="Home">
<p>Home of a FOSS extremist and music nerd.</p>
<h1>My services</h1>
<div id="cards">
<Card
id="forgejo"
name="Forgejo"
link="https://git.ahur.ac/"
>A straight-to-the-point source code forge</Card>
<Card
>A straight-to-the-point source code forge</Card>
<Card
id="send"
name="Send"
link="https://send.ahur.ac/"
>Encrypt and send files privately</Card>
<Card
>Encrypt and send files privately</Card>
<Card
id="matrix"
name="Matrix"
link="https://chat.ahur.ac/"
>The messenger that doesn't spy on you</Card>
<Card
>The messenger that doesn't spy on you</Card>
<Card
id="vaultwarden"
name="Vaultwarden"
link="https://vw.ahur.ac/"
>A (Rust) based password manager</Card>
</div>
</main>
</body>
</html>
>A (Rust) based password manager</Card>
</div>
<style>
#cards {
display: flex;
flex-direction: column;
}
@font-face {
font-family: 'Cantarell';
src: url('/fonts/cantarell.otf') format('otf');
font-weight: normal;
font-style: normal;
font-display: swap;
}
body {
/* Background */
background: linear-gradient(90deg, #08001a 0%, #000d1a 100%);
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
background-color: black;
/* Text */
color: white;
font-family: 'Cantarell', sans-serif;
/* Flex */
display: flex;
align-items: center;
margin: 0;
flex-direction: column;
}
main {
width: 40%;
}
@media screen and (max-width: 1200px) {
main {
width: 60%;
}
}
@media screen and (max-width: 800px) {
main {
width: 95%;
}
}
</style>

134
src/pages/portfolio.astro Normal file
View file

@ -0,0 +1,134 @@
---
import Page from '../layouts/Page.astro';
import { Image } from 'astro:assets';
import teraioImg from '../assets/tera-io.jpg';
---
<Page title="Portfolio">
<h1>Who am I?</h1>
<p>
My name is <b>Hippolyte Chauvin</b> and I'm born in <b>2004</b>. I study the <b>computer science bachelor</b> (BUT Informatique) at the <b>technological university institute of Grenoble</b> (IUT2 Grenoble), where I follow the course named "Communicating and secure application deployment" which is about system administration and IT security. I gained passion for the <b>Linux</b> ecosystem in 2022, which I use daily since back then.
</p>
<p>
I was introduced to the world of computers in my young age, when I could spend hours on the family's computer messing around with the operating system and trying to explore every feature it had built in. This experience slowly led me to want to learn how to seriously use a computer, and later to study the field of cybersecurity.
</p>
<p>
I am also fascinated by music: I play drums, I DJ, and I produce electronic music under the name <b>Ahurac</b>.
</p>
<h1>My skills</h1>
<p>
This list showcases the technologies and fields I'm the more confident with.
</p>
<!--
- c
- rust
- python
- web
- linux
- bash, posix shell
- docker
- kubernetes
- qemu
- git
- arch linux
- debian, ubuntu
- rpm based
- alpine linux
- x509
- systemd
- source code forges
- command line tools
-->
<h1>My projects</h1>
<h2>Commitment to software and Internet freedom</h2>
<p>
Since 2023, I host free software based services on the web thanks to my personnal server, <code>tera-io</code>. These services allow me to escape from ones provided by privacy disrespecting big corporates, and at the same time enhance my system administration and service deployment knowledge.
</p>
<Image
alt="tera-io, my personnal server"
src={ teraioImg }
width={ 200 }
/>
<figcaption>Photo of <code>tera-io</code>, my personnal server</figcaption>
<p>You can find links to services I host on <a href="/">this website's homepage</a>.</p>
<h2><code>qemush</code></h2>
<p>
<code>qemush</code> is a wrapper for the <b>QEMU</b> software. This emulator has a lot of features, and running QEMU machines can sometimes require a lot of command line arguments. <code>qemush</code> aims to provide an unified interface and a basic abstract layer to this software.
</p>
<p>
<code>qemush</code> is written in a very portable way (in POSIX shell). It works with a system of launchers : a laucher is an user-written subscript called by the main program, that invokes a QEMU process in the end.
</p>
<p>
You can find <code>qemush</code>'s source code in <a href="https://git.ahur.ac/ahurac/qemush">its repo</a> on my self-hosted instance of the source code forge <b>Forgejo</b>.
</p>
<h2>Music career</h2>
<p>
I have released a bunch of electronic music songs since 2019. Despite being a proprietary platform, you can find my work on <b><a href="https://youtube.com/c/Ahurac">YouTube</a></b>. I create everything on my personnal computer, using as much as free software as I can.
</p>
<p>Here is my latest song to this date:</p>
<p><iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/B3LzQjL3UQQ?si=VS2v08yuCNN4VezK" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe></p>
</Page>
<style>
img, iframe {
display: block;
margin-left: auto;
margin-right: auto;
box-shadow: 0 0 50px #ff1aff80;
}
figcaption {
text-align: center;
font-style: italic;
margin-top: 5px;
}
p {
line-height: 1.5;
}
a {
position: relative;
text-decoration: none;
color: #ff66ff;
padding: 2px;
transition: all 0.3s ease;
box-shadow: inset 0 -3px 0 #ff66ff;
}
a:hover {
color: white;
box-shadow: inset 0 -24px 0 #ff66ff;
}
code {
padding: 2px;
border: 1px solid #ffffff80;
border-radius: 5px;
background-color: #00000080;
}
iframe {
border: 0;
}
</style>