<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>GnousEU</title>
<link rel="stylesheet" href="assets/bootstrap.min.css" />
<link rel="stylesheet" href="assets/css/main.css" />
<meta
name="description"
content="GnousEU est une communauté francophone de passionnés du libre. Elle fournit entre autre des services gratuits libres d'accès."
/>
<!-- Open Graph / Facebook -->
<meta property="og:type" content="website" />
<meta property="og:url" content="https://gnous.eu/ " />
<meta property="og:site_name" content="GnousEU" />
<meta
property="og:description"
content="GnousEU est une communauté francophone de passionnés du libre. Elle fournit entre autre des services gratuits libres d'accès."
/>
<meta property="og:image" content="https://gnous.eu/assets/gnous.png" />
<!-- Twitter -->
<meta property="twitter:card" content="summary_large_image" />
<meta property="twitter:url" content="/" />
<meta
property="twitter:description"
content="GnousEU est une communauté francophone de passionnés du libre. Elle fournit entre autre des services gratuits libres d'accès."
/>
<meta property="twitter:image" content="/assets/gnous.png" />
<meta name="title" content="Gnous.eu - Bienvenue" />
<meta property="og:title" content="Gnous.eu - Bienvenue" />
<meta property="twitter:title" content="Gnous.eu - Bienvenue" />
<link
rel="shortcut icon"
href="https://gnous.eu/favicon.ico"
type="image/x-icon"
/>
<link
href="https://cdn.jsdelivr.net/npm/bulma@1.0.2/css/bulma.min.css"
rel="stylesheet"
/>
<link href="assets/css/colors.css" rel="stylesheet" />
</head>
<body class="">
<!-- Hero -->
<div class="hero is-halfheight is-gnous noise">
<div class="hero-head">
<nav
class="navbar pt-2 pb-2"
role="navigation"
aria-label="main navigation"
>
<div class="navbar-brand">
<a class="navbar-item" href="https://gnous.eu"> GnousEU </a>
<a
role="button"
class="navbar-burger"
aria-label="menu"
aria-expanded="false"
data-target="navbar"
>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navbar" class="navbar-menu has-text-centered">
<div class="navbar-start">
<a class="navbar-item" href="/"> Accueil </a>
<a class="navbar-item" href="https://wiki.gnous.eu/"> Wiki </a>
<a class="navbar-item" href="https://discord.gnous.eu/">
Discord
</a>
<a
class="navbar-item"
href="https://status.enpls.org/status/gnous"
>
État des services
</a>
</div>
</div>
</nav>
</div>
<div class="hero-body half-size p-0">
<div class="container is-fluid mt-0">
<div class="columns is-vcentered">
<div class="column is-6">
<div class="content">
<h1
class="title kanit-bold is-size-1 gnous-shadow gnous-shadow-animated"
style="font-size: 8vh !important"
>
GnousEU
</h1>
<h2 class="subtitle">
Communauté francophone du logiciel libre depuis 2017
</h2>
<div class="buttons">
<a href="#services" class="button is-gnous">
<strong>Nos services</strong>
</a>
<a
href="https://discord.gnous.eu"
class="button is-gnous-inverted"
>
Discord
</a>
</div>
</div>
</div>
<div class="column is-6">
<img src="/assets/gnous.png" alt="GnousEU" class="gnous-logo" />
</div>
</div>
</div>
</div>
</div>
<!-- La communauté -->
<div class="container is-fluid pt-5 has-background-main">
<div class="content three-quarter-size p-5">
<h1 class="title is-size-3 has-text-centered mt-5">La communauté</h1>
<p>
Créé autour de la plateforme propriétaire Discord dans le but de
soutenirs d'autres utilisateurs d'Ubuntu, GnousEU a été fondé dans un
but d'entraide sur le logiciel libre.<br />
Depuis, elle s'est diversifiée en proposant plusieurs services
autohébergés et de l'entraide pour les O.S. basés sur GNU/Linux, BSD
mais aussi la programmation et l'hébergement système. Elle propose
plusieurs logiciels libres, déscentralisés où non, afin de combatre la
centralisation du net.<br />
GnousEU ne cesse de grandir et est ouvert aux nouveaux membres sur
l'ensemble des services. Un système de recensement des membres et
d'interconnexion des plateformes est toujours à l'étude pour permettre
une meilleure continuité au sein de la communauté.<br />
Pour le moment, la majorité de la communauté est présente sur Discord,
mais une passerelle via IRC est présente pour les fervants défenseurs
du logiciel libre.
</p>
</div>
</div>
<!-- Les services -->
<div class="container is-fluid pt-5 has-background-main" id="services">
<div class="content three-quarter-size p-5">
<h1 class="title is-size-3 has-text-centered mt-5">Les services</h1>
<!-- Recherche -->
<div class="columns">
<div
class="column is-4-desktop is-one-third-widescreen is-one-quarter-fullhd"
>
<nav class="panel is-gnous noise">
<p class="panel-heading is-gnous">Recherche</p>
<div class="panel-block">
<p class="control">
<input
class="input input-gnous"
type="text"
placeholder="Mastodon"
name="search"
/>
</p>
</div>
<a class="panel-block panel-filter" id="filter_communication">
Communication
</a>
<a class="panel-block panel-filter" id="filter_dev">
Développement
</a>
<a class="panel-block panel-filter" id="filter_hosting">
Hébergement
</a>
<div class="panel-block">
<button
class="button is-link is-fullwidth is-gnous-inverted"
id="reset_filters"
>
Retirer les filtres
</button>
</div>
</nav>
</div>
<!-- Services -->
<div
class="column is-8-desktop is-two-third-widescreen is-three-quarters-fullhd"
>
<div class="columns is-multiline">
<!-- Mastodon -->
<div
class="column is-full-tablet is-one-third-fullhd"
id="mastodon"
>
<div
class="card is-gnous noise"
style="background-color: #563acc"
>
<div class="card-image">
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-3">GnousToot</p>
</div>
</div>
<div class="content">
Mastodon est un réseau social décentralisé, libre et
open-source conçu comme alternative à Twitter. Celui-ci
est descentralisé via le protocole ActivityPub.
<br />
</div>
<footer class="card-footer">
<a
href="https://toot.gnous.eu"
class="card-footer-item button is-gnous-inverted"
>Rejoindre</a
>
</footer>
</div>
</div>
</div>
</div>
<!-- Fin Mastodon -->
<!-- GnousGit -->
<div
class="column is-full-tablet is-one-third-fullhd"
id="forgejo"
>
<div
class="card is-gnous noise"
style="background-color: rgb(127 29 29)"
>
<div class="card-image">
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-3">GnousGit</p>
</div>
</div>
<div class="content">
Basé sur Forgejo, GnousGit est un service d'hébergement
de code source basé sur Git. Il permet de gérer des
projets de développement de logiciels.
<br />
</div>
<footer class="card-footer">
<a
href="https://git.gnous.eu"
class="card-footer-item button is-gnous is-gnous-inverted"
>Rejoindre</a
>
</footer>
</div>
</div>
</div>
</div>
<!-- Fin GnousGit -->
<!-- GnousCI -->
<div
class="column is-full-tablet is-one-third-fullhd"
id="woodpecker"
>
<div
class="card is-gnous noise"
style="background-color: rgb(76, 175, 80)"
>
<div class="card-image">
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-3">GnousFabrik</p>
</div>
</div>
<div class="content">
Via Woodpecker, intégré avec GnousGit, GnousCI est un
outil d'intégration continue. Il permet de tester et de
déployer automatiquement les modifications de code.
<br />
</div>
<footer class="card-footer">
<a
href="https://cicd.gnous.eu"
class="card-footer-item button is-gnous-inverted"
>Rejoindre</a
>
</footer>
</div>
</div>
</div>
</div>
<!-- Fin GnousCI -->
<!-- GnousPaste -->
<div
class="column is-full-tablet is-one-third-fullhd"
id="hastebin"
>
<div
class="card is-gnous noise"
style="background-color: #00222b"
>
<div class="card-image">
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-3">GnousPaste</p>
</div>
</div>
<div class="content">
Partagez du texte anonymement et de manière sécurisée.
GnousPaste est un service de partage de texte en ligne.
<br />
</div>
<footer class="card-footer">
<a
href="https://haste.gnous.eu"
class="card-footer-item button is-gnous-inverted"
>Rejoindre</a
>
</footer>
</div>
</div>
</div>
</div>
<!-- Fin GnousPaste -->
<!-- GnouSearch -->
<div class="column is-full-tablet is-one-third-fullhd" id="searx">
<div
class="card is-gnous noise"
style="background-color: rgb(89, 120, 17)"
>
<div class="card-image">
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-3">GnouSearch</p>
</div>
</div>
<div class="content">
Un agrégateur de moteur de recherche afin de protéger sa
vie privée. Avec cette instance Searx, vous pouvez
rechercher sur plusieurs moteurs de recherche sans être
tracé.
<br />
</div>
<footer class="card-footer">
<a
href="https://searx.gnous.eu"
class="card-footer-item button is-gnous-inverted"
>Rejoindre</a
>
</footer>
</div>
</div>
</div>
</div>
<!-- Fin GnouSearch -->
<!-- GnousRSS -->
<div
class="column is-full-tablet is-one-third-fullhd"
id="freshrss"
>
<div
class="card is-gnous noise"
style="background-color: rgb(15, 62, 193)"
>
<div class="card-image">
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-3">GnousRSS</p>
</div>
</div>
<div class="content">
Un agrégateur de flux RSS pour suivre l'actualité de vos
sites préférés. Avec cette instance FreshRSS, vous
pouvez suivre vos flux RSS sans être tracé.
<br />
</div>
<footer class="card-footer">
<a
href="https://rss.gnous.eu"
class="card-footer-item button is-gnous-inverted"
>Rejoindre</a
>
</footer>
</div>
</div>
</div>
</div>
<!-- Fin GnousRSS -->
<!-- wallabag -->
<div
class="column is-full-tablet is-one-third-fullhd"
id="wallabag"
>
<div
class="card is-gnous noise"
style="background-color: #3f6184"
>
<div class="card-image">
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-3">GnousBag</p>
</div>
</div>
<div class="content">
Un service de sauvegarde de vos articles pour les lire
plus tard. Avec cette instance Wallabag, vous pouvez
sauvegarder vos articles sans être tracé.
<br />
</div>
<footer class="card-footer">
<a
href="https://bag.gnous.eu"
class="card-footer-item button is-gnous-inverted"
>Rejoindre</a
>
</footer>
</div>
</div>
</div>
</div>
<!-- Fin wallabag -->
<!-- irc -->
<div class="column is-full-tablet is-one-third-fullhd" id="irc">
<div
class="card is-gnous noise"
style="background-color: #793f84"
>
<div class="card-image">
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-3">GnousIRC</p>
</div>
</div>
<div class="content">
Serveur IRC avec une passerelle vers Discord. Vous
pouvez discuter avec les membres de la communauté via le
protocole historique qui est IRC.
<br />
</div>
<footer class="card-footer">
<a
href="irc://irc.gnous.eu:6667"
class="card-footer-item button is-gnous-inverted"
>Rejoindre</a
>
</footer>
</div>
</div>
</div>
</div>
<!-- Fin irc -->
<!-- pass -->
<div
class="column is-full-tablet is-one-third-fullhd"
id="bitwarden"
>
<div
class="card is-gnous noise"
style="background-color: #3f6184"
>
<div class="card-image">
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-3">GnousPass</p>
</div>
</div>
<div class="content">
Avec cette instance Bitwarden, vous pouvez stocker vos
mots de passe de manière sécurisée. Vous pouvez aussi
partager des mots de passe avec d'autres membres de la
communauté.
<br />
</div>
<footer class="card-footer">
<a
href="https://pass.gnous.eu"
class="card-footer-item button is-gnous-inverted"
>Rejoindre</a
>
</footer>
</div>
</div>
</div>
</div>
<!-- Fin pass -->
<div
id="no_results"
style="display: none"
class="column is-12 has-text-centered"
>
<p>Aucun résultat <code>:-(</code></p>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Les partenaires -->
<div class="container is-fluid pt-5 has-background-main">
<div class="content three-quarter-size p-5">
<h1 class="title is-size-3 has-text-centered mt-5">Les partenaires</h1>
<p>
Nous remercions les autres projets qui hébergent gracieusement les
services de GnousEU
</p>
<ul>
<li>
<a href="https://www.hivane.net">Hivane</a> : Hivane est une
aventure non lucrative faite avec amour. Ils nous supportent en
hébergeant une partie de nos services à Lyon.
</li>
<li>
<a href="https://milkywan.fr">MilkyWan</a> : MilkyWan nous supporte
en hébergeant une partie de notre infrastructure grâce à leur réseau
indépendant d'échelle nationale.
</li>
<li>
<a href="https://virtua.cloud">VirtuaCloud</a> : VirtuaCloud est une
entreprise d'hébergement de machines virtuelles. Ils nous
soutiennent par une VM à Paris.
</li>
</ul>
</div>
</div>
<!-- Footer -->
<footer class="footer has-background-main">
<div class="content has-text-centered">
<p>
©left <strong>GnousEU</strong> - Ce site est dans le domaine
public - Fait avec <span class="has-text-danger">❤</span> à Rennes.
</p>
</div>
</footer>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function () {
var burger = document.querySelector(".navbar-burger");
var menu = document.querySelector(".navbar-menu");
burger.addEventListener("click", function () {
burger.classList.toggle("is-active");
menu.classList.toggle("is-active");
});
});
</script>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", () => {
const services = [
{
id: "mastodon",
catches: ["mastodon", "toot", "gnoustoot", "twitter"],
filters: ["communication"],
},
{
id: "forgejo",
catches: [
"forgejo",
"git",
"gnousgit",
"github",
"gitlab",
"bitbucket",
"gitea",
"gogs",
],
filters: ["dev"],
},
{
id: "woodpecker",
catches: [
"woodpecker",
"ci",
"gnousfabrik",
"jenkins",
"travis",
"gitlab-ci",
"github-actions",
"actions",
"circleci",
"drone",
"teamcity",
],
filters: ["dev"],
},
{
id: "hastebin",
catches: ["hastebin", "paste", "gnouspaste", "pastebin"],
filters: ["hosting"],
},
{
id: "searx",
catches: [
"searx",
"search",
"gnousearch",
"google",
"bing",
"yahoo",
"duckduckgo",
"qwant",
"ecosia",
"yandex",
"baidu",
"startpage",
],
filters: [],
},
{
id: "freshrss",
catches: [
"freshrss",
"rss",
"gnousrss",
"feedly",
"inoreader",
"theoldreader",
"feedbin",
"bazqux",
"newsblur",
"feedwrangler",
"feedhq",
"miniflux",
"ttrss",
"tinytinyrss",
],
filters: ["hosting"],
},
{
id: "wallabag",
catches: [
"wallabag",
"bag",
"gnousbag",
"pocket",
"instapaper",
"readability",
],
filters: ["hosting"],
},
{
id: "irc",
catches: [
"irc",
"chat",
"gnousirc",
"discord",
"slack",
"mattermost",
"rocketchat",
],
filters: ["communication"],
},
{
id: "bitwarden",
catches: [
"bitwarden",
"pass",
"gnouspass",
"password",
"keepass",
"lastpass",
"dashlane",
"1password",
"roboform",
"enpass",
"vaultwarden",
"onepassword",
],
filters: ["hosting"],
},
];
const search = document.querySelector("input[name=search]");
const filters = document.querySelectorAll(".panel-filter");
const resetFilters = document.querySelector("#reset_filters");
const noResultsMessage = document.querySelector("#no_results"); // Add this line
const updateDisplay = (predicate) => {
let hasVisibleItems = false;
services.forEach(({ id }) => {
const element = document.querySelector(`#${id}`);
const isVisible = predicate(id);
element.style.display = isVisible ? "block" : "none";
if (isVisible) hasVisibleItems = true;
});
// Show or hide the "No results" message
noResultsMessage.style.display = hasVisibleItems ? "none" : "block";
};
search.addEventListener("input", () => {
const value = search.value.toLowerCase();
updateDisplay((id) =>
services
.find((s) => s.id === id)
.catches.some((catchWord) => catchWord.startsWith(value))
);
});
filters.forEach((filter) => {
filter.addEventListener("click", () => {
const filterName = filter.id.replace("filter_", "");
updateDisplay((id) =>
services.find((s) => s.id === id).filters.includes(filterName)
);
});
});
resetFilters.addEventListener("click", () => {
search.value = "";
updateDisplay(() => true);
});
});
</script>
</body>
</html>