env-vars-validator is a TypeScript library that enables you to validate your environment variables easily. It's available on GitHub and on NPM.

Installation

You can install env-vars-validator with NPM using the following command:

npm install env-vars-validator
pnpm install env-vars-validator
yarn install env-vars-validator

Usage

Using env-vars-validator is simple. First, import the validateEnv function from the library:

const { validateEnv } = require("env-vars-validator");

Then, you can use it to validate your environment variables from an AJV schema:

validateEnv(
  {
    NODE_ENV: { type: 'string' },
    PORT: { type: 'integer' },
  },
  {
    requiredProperties: ['NODE_ENV'],
  },
);

This example validates that NODE_ENV is a string and that PORT is an integer. Additionally, it requires that NODE_ENV is present in the environment variables.

API

env-vars-validator provides several additional functions that can help you work with environment variables:

• currentEnv(): Returns the current NODE_ENV without spaces and in lowercase format.

• isProductionEnv(): Returns true if the current NODE_ENV is equal to production.

• isPreProductionEnv(): Returns true if the current NODE_ENV is equal to production.

• isStagingEnv(): Returns true if the current NODE_ENV is equal to staging.

• isDevelopmentEnv(): Returns true if the current NODE_ENV is equal to development.

• isTestEnv(): Returns true if the current NODE_ENV is equal to test.

• isDeployedEnv(): Returns true if the current NODE_ENV is not equal to development or test.

Conclusion

env-vars-validator is a simple and powerful library that makes it easy to validate your environment variables. With its intuitive API and TypeScript support, it's a great choice for any project that needs to work with environment variables. Try it out today!

As a developer, you need to have a portfolio to show many things :

• What can you do ?
• What do you like ?
• Which projects did you realize ?
• How to contact you ?

To answer these questions, a simple website can be enough. But, to make the difference, you can optimize your website with several ways !

⚙️ Use a well known framework

In my case, I love React.

So I'm using a well known React framework called Next.js (maintained by Vercel). I'm using it for many reasons, but the main reason is how it manages rendering and do optimizations. I can strongly advise you to check their documentation on SSR / SSG / ISR / CSR.

To handle design, I'm using TailwindCSS especially for his simplicity and optimizations from PostCSS.

⚡ Focus on speed

A portfolio need to be consulted everywhere, on a train, on a subway, at home, at office, etc.

As Google recommends, your website need to be around 500 KB. It's very small but to give you an example, a page with 1.49 MB need 7 seconds on a fast 3G network to download and consult.

So you need to use as much as possible to use SVG or WebP and compress it if it is possible. On Next.js, you can generate WebP on the fly with next/image.

You can use a CDN to make your website faster across the world. Personally, I use Vercel who have this feature.

🖥️ Focus on SEO

SEO or Search Engine Optimization is a complicated term to signify a simple thing. How can you optimize your website to be sure that your website will be displayed on Google / Bing / etc.

It doesn't exist a secret formula because everything is opaque, but there are some common things to do :

• Generate Meta tags to help robot indexation (next-seo)
• Respect h1, h2, h3 order
• Have a domain with your first name and last name and keep it as long as possible
• All your IMG tags need to have an alt attribute

You can use several tools who will help you to optimize your websites :

• Meta tags : https://metatags.io/
• SEO : https://web.dev

💬 Translate your websites

In my case, I'm a French developer. So I need to translate my website in French but in English too.

Why ?

• To be seen by French recruiter for local jobs
• To be seen by International recruiter for local or full-remote jobs

Stupid things, but very important to maximize your chances for your next opportunity !

🤖 Make your website automated

I have always heard that developer are lazy people. I can confirm, it is true !

Why did you need to develop a new website (and lose time) every time you create a new project, you publish a new article, you have been hired to a new company ?

I'm a strong fan of Notion. I'm using it for my personal projects and professionally.

I have recently seen that is it possible to use Notion as a CMS (Content Management System).

So for each dynamic part, a Notion page have been created and with Next.js, I refresh and redeploy my website every 10 minutes to refresh changes with ISR.

For me, dynamic part are :

• Experiences
• Diplomas
• Projects
• Tools
• News (For this, I'm using Hashnode API)

In automation, I have pushed the limit further with resume generation. On my website, you can download my Resume in PDF, who will be generated from Notion data.

📃 Bonus : Open source your website

As a developer, open source is very important because every library we used is developed by community and can be freely edited or used.

To make development less shady, I can encourage you to make your code freely accessible to share your knowledge with everyone.

Maybe some developers will see some issue with your code or will see some language issue and can summit a merge request. 😊

🥳 A working example

I have recently updated my website to enter 2023 year !

You can consult it on https://qlaffont.com and the entire code can be consulted it on Github.

You can duplicate my Notion pages if you want too !

Have fun and let's code ! 🧑‍💻

I wrote this article because I struggle a lot to do a simple thing in Node.JS and I want to share it with you 🙂.

On a personal scrapping projects, I'm caching images to render it on a PDF. To do this, I save scrapped images on a dedicated server 📁.

But my problem is on my Electron App, If I'm on macOS, I can't save my temp image on App Installation folder. Fs access is forbidden ❌.

So with node-fetch, I try to simulate File API with some libraries, send Stream, Buffer, etc. None of these solutions have been working.

Except this one ✅ :

import FormData from 'form-data';
import fetch from 'node-fetch';

// Download original Image
const res = await fetch(imageUrl);

// Convert response to buffer
const arrayBuffer = await res.arrayBuffer();
const buffer = Buffer.from(
  arrayBuffer,
  undefined,
  arrayBuffer.byteLength,
);

const formData = new FormData();

formData.append('file', buffer, {
  contentType: 'text/plain',
  name: 'file',
  filename: 'test.png',
});

try {
  //Send it to new server
  await fetch(
    `https://my-server.com/image`,
    {
      method: 'POST',
      body: formData,
      headers: formData.getHeaders(),
    },
  );
} catch (error) {
  console.log(error);
}

I hope this solution will help you too. Because I have lost nearly 4 hours with this problem 😅

As a developer and as a community owner, I have created many Discord servers to handle every product support 🫂 or to create gaming communities 🎮.

I wanted to create some restricted role to have exclusive content or to have a priority support, but no service exist to handle this. This service need to allow me to assign role if user subscribe to one of my products 💳.

To solve that, I created OnlyDfans. It’s a simple service where you can connect your Stripe account or your Chargebee credentials in a couple of minutes.

This service is FREE during beta and the subscription will be $40 by server by month.

Let’s see how it works !

I. Go to the app

You need to go to https://app.onlydfans.io and you need to connect to Discord.

II. Create a new server

In this page, you will see all your servers, but you will see, too, all your subscriptions in each server.

Now you can press on plus button and select one of your servers. Only servers where you are owner are listed !

III. Configure your server

You need to click on “Manage server” and click after that to “ Setup server”.

You need to :

• Invite Discord bot to your server
• Select your payment provider
• Create webhook configuration in your payment provider panel (Products, Customer Portal, etc.)
• Enter keys and other requirements for your payment provider

IV. Create your product

With OnlyDfans, you can provide subscription with many use case

• Free (without restriction)
• Password Restricted
• Time Restricted
• Quantity Restricted

So now, you can create your product :

V. Share your link

Now you can go to your product detail to get the checkout link. And share it to your future customers.

Conclusion

It takes us only 5 minutes to set up everything. If you need help, we can help you to set up everything in our Discord server : https://discord.gg/cY58pMA2Hb. Now it’s time to make money 🤑.

Plusieurs personnes m’ont demandées une suite de mon article “**Pourquoi j’ai mis ma tour de jeu de 1500 € au placard ?**”. Cette article où j’expliquais pourquoi j’ai vendu mon PC pour prendre un Shadow. Depuis la situation a changée, parlons en !

Cette article fait partie d’une série d’article :

• Pourquoi j’ai mis ma tour de jeu de 1500 € au placard ?
• VR (Oculus Quest) + Shadow ? Est ce possible ?
• Shadow ou PC ? Finalement PC ?

1. Constat avec la COVID

(Attention, je parle de la période du 14 Janvier 2020 au 20 juin 2020)

Pour information à l’époque où j’avais écris le premier article j’étais encore sur Paris, je possédais un modeste 30 m2 et j’étais en vadrouille entre Marseille, Poitiers, Montpellier, New York, etc. Depuis je suis redescendu dans le sud de la France pour me remettre au vert (juste avant la COVID, ouf !) et je bouge plus.

Premier constat, c’essssttt llleeennnttt alors que je suis fibré et que j’ai une bonne connexion. Après vérification, les serveurs Shadow ont été plus soutenu qu’avant et leurs infrastructures n’ont pas permis de ternir la charge.

Deuxième constat, des mesures draconiennes illustrant un souci de fond. Depuis les soucis de lenteurs, Shadow a pris des mesures pour pouvoir réduire la charge serveur mais qui cependant ont eu certains effets :

• Mise en pause automatique si aucune activité de souris est détecté au bout de 15 minutes : Super, j’utilise la VR notamment pour jouer à Half-Life Alyx, je suis obligé de m’arrêter toutes les 15 minutes pour faire bouger la souris du Shadow …

• Des latences de plus en plus présente …

• Une file d’attente 0-o : J’ai du attendre plusieurs minutes pour accéder à mon PC et comme dès fois je fais autres choses, je reviens mon Shadow est éteint et je dois ré-attendre pour y accéder de nouveau…

2. Shadow, l’entreprise victime de son succès

Depuis le début des annonces de Shadow Ultra, j’avais pré-commandé l’évolution de mon Shadow. Cependant je n’avais toujours rien reçu et chaque jour je regardais quand ces produits seraient de nouveau en stock.

De plus, avec la COVID, les délais d’attente se sont rallongés.

J’en avais pour plus d’1 an d’attente et tout ça en tournant sur des cartes graphiques où il y avait 1 à 2 générations de retard, un vieux processeur, etc…

Super …

3. Un goût de déjà vu

Depuis je suis retourné au source, à la bonne vielle tour. J’ai mis des sous de côté et je me suis remonté une tour sur **Top Achat**.

Elle a beau prendre la poussière, prendre de l’espace et faire un peu de bruit mais au moins je peux y accéder quand je veux, j’ai une bonne connexion et si je veux y accéder en remote j’utilise le logiciel **Parsec **qui fait largement le taff !

Conclusion

Pour conclure, je pense que Shadow est une boite tech innovante et que leurs produits sont cool mais ils n’ont pas assez de stabilité, et de financement pour vraiment proposer une solution béton.

Je conseille Shadow si vous êtes passioné de tech et que vous voulez tester et voir ce qu’on fait maintenant en virtualisation mais je le conseille pas en utilisation quotidienne.

Voilà, n’hésitez pas à me faire un retour sur l’article et à me suivre sur Twitter ^^.

I have created a service who is called OnlyDfans to make this configuration for you ! More information to https://onlydfans.io

As a developer, I have coded many bot with Discord.js.

I have created a bot recently, “Discord Protector”. It’s a Global Ban Management bot with many extra features (https://discord-protector.qlaffont.com).

I want to enable extra features with subscription quickly and in a simple way. Solution: Stripe

Let’s start !

If you are interested and you want to have a solution like this, I can do it ! Contact me at contact@qlaffont.com

Todo-list

To enable extra features, I need to achieve this todo-list :

1 — 💳 Redirect user to Stripe to pay subscription

2 — 👨‍💻 Create a customer platform to manage subscriptions

3 — 🖥 Receive Stripe webhook to enable extra features

I. 💳 Stripe Checkout

For people who don’t know, Stripe is a payments infrastructure. It’s a famous platform and many website use it (Deliveroo, Banking, Asos, etc.).

One of the most famous product is Stripe Checkout. This product create for you a checkout page with everything (Branding, Product details, etc.).

Stripe Checkout

This product will reduce for me a lot of coding time.

After reading Stripe Checkout Documentation, I know that I need to create a Stripe Customer and generate a Stripe URL when user want to pay his subscription. (In this case, when user type in channel !banp pay)

const stripeUser = await stripe.customers.create();

//Save stripe customer id in db -> stripeUser.id

const session = await stripe.checkout.sessions.create(
{
      payment_method_types: ["card"],
      line_items: [
        {
          price: PRODUCT_PRICEID,
          quantity: 1,
        },
      ],
      customer: stripeUser.id,
      mode: "subscription",
      success_url: "MY_SUCCESS_URL",
      cancel_url: "MY_CANCEL_URL"
});

// Url to send to user in private message
url = `/payment-page?CHECKOUT_SESSION_ID=${session.id}`;

And I have created a webpage to redirect user to checkout page :

<html>
  <head>
    <script src="https://js.stripe.com/v3/"></script>
  </head>
  <body>
    <script>
      var stripe = Stripe('MY_STRIPE_KEY');

      var urlParams = new URLSearchParams(window.location.search);

      stripe.redirectToCheckout({
      sessionId: urlParams.get('CHECKOUT_SESSION_ID')
      });
    </script>
  </body>
</html>

Step 1 - Done ✅

II. 👨‍💻 Stripe Billing Customer Portal

Recently, I have seen on ProductHunt a post for Stripe Billing Customer Portal.

Stripe Billing Customer Portal

It’s a new product released by Stripe Team who create a Stripe-hosted page for customers to manage subscriptions (Change Plan, Cancel Plan) and to manage invoices.

Perfect, now I know that this step is simple like step 1.

After reading Stripe Billing Customer Portal, I know that I just need to communicate a stripe url to user.

const session = await stripe.billingPortal.sessions.create({
   customer: server.stripeCustomerId,
   return_url: "MY_RETURN_URL",
});

//Send url to user in private message -> session.url

Step 2 - Done ✅

III. 🖥 Stripe Webhook Integration

To handle Stripe Webhook, I need to create an HTTP Route to receive events. To do that, I use Fastify but you can use what you want to make an HTTP Server.

f.post("/webhook", async (request: FastifyRequest, reply: FastifyReply) => {
    const event = request.body;
    switch (event.type) {
      case "checkout.session.completed":

        //Save Customer ID and save the fact that now he can use Stripe Billing Customer Portal

        break;
      case "customer.subscription.updated":

        // Check product id and save subscription date end (event.data.object.current_period_end)

        break;
      case "customer.subscription.deleted":

        // Check product id and save subscription date end (event.data.object.current_period_end)

      default:
        // Unexpected event type
        return reply.status(400).send();
    }

    reply.send({ received: true });
  });

Step 3 - Done ✅

(Step 4 - Test with Stripe testing cards to check if everything work.)

Conclusion

It tooks me less than 1 day to integrate payment in my Discord.js bot.

Stripe documentation is simple and integration is very fast ⚡️. Now you know how to integrate Stripe in Discord.js bot without any website to create.

If you have any question, you can contact me on Twitter @qlaffont 😎

• Pourquoi j’ai mis ma tour de jeu de 1500 € au placard ?
• VR (Oculus Quest) + Shadow ? Est ce possible ?
• Shadow ou PC ? Finalement PC ?

Depuis la sortie de l’Oculus Quest, j’étais très impatient de pouvoir tester ce petit bijou de tech qui permet de faire de la réalité virtuelle sans fil. De plus, j’ai pu le tester quasiment à sa sortie (grâce à Romain Cochet, 👋 Smiirl).

Le feeling du casque était immédiat:

• Pouvoir jouer à de la VR ! 👀

• Sans fil à connecter à un PC et du coup avoir une sensation de liberté ! 🖥

• La possibilité de pouvoir définir une zone de jeu très facilement et dans plusieurs endroit différents ! 🏘

• Un prix relativement honnête pour ce qui est embarqué dans le casque ! 💸

Cependant je n’ai pas sauté sur l’occasion pour acheter le casque. Trop chère pour le moment, et trop de projet à côté.

Un confinement plus tard, je me décide à l’acheter pour re-tester le casque et voir si il est possible de le connecter à Shadow.

I. Le communiqué officiel de Shadow 📄

Depuis que je suis chez Shadow, je lis chaque Shadow News pour savoir si il est possible de se connecter à Shadow via l’Oculus Quest. J’ai pu remarquer, que Shadow lance le **Shadow VR Exploration Program **notamment dédié pour l’Oculus Quest.

La désillusion fut rude car j’ai pu réalisé que sur Reddit + autres sources, que ce programme est réservé uniquement aux clients US 🇺🇸 car l’équipe de dev en charge du projet est basé là bas. 😭

II. Discussion sur le discord Shadow 🗣

Malgré cette échec, je me met à communiquer sur le Discord officiel Francophone de Shadow 🇫🇷 afin de poser la question. Un des admins me réponds qu’il faut que j’aille sur le Discord officiel Américain de Shadow 🇺🇸 car il y a un canal de discussion dédié qui permet de parler de ce sujet.

Comment vous dire, je fonce 🏃‍♂️ !

Je remarque notamment dans le channel #experiment-vr des messages épinglés. Plein de message qui parle de la fameuse bêta en cours de test. Mais je remarque un lien vers Reddit sur une procédure à réaliser le temps que Shadow publie officiellement la fonctionnalité. Je clique, et là, Bingo !

Je vois une procédure un peu longue mais clair ! Je vais vous faire une traduction dans le prochain chapitre avec mes commentaires.

III. Procédure Shadow sur Oculus Quest 👨‍💻

Pour rappel, vous pouvez retrouver la procédure sur ce lien.

Matériel Requis :

• Oculus Quest

• Une Connexion Wifi en 5Ghz stable + une bonne connexion internet !

• Ordinateur Windows

• Une Session Shadow

• Un câble USB C <-> USB (le câble de votre téléphone suffit)

Procédure :

• Acheter sur l’Oculus Store l’application “Virtual Desktop” et installé là sur votre Oculus Quest.

• Suivez la procédure pour installer SideQuest sur votre ordinateur et déverrouiller votre casque. Procédure Side Quest

• Installer les dernières mise à jour Windows + Nvidia sur votre Shadow.

• Installer le logiciel Oculus Desktop sur votre Shadow (Ne faites pas l’étape où le logiciel vous demande de connecter votre casque).

• Redémarrer votre session Shadow pour être sur que tous les logiciels sont bien installé.

• Installer le logiciel Virtual Desktop Streamer App

• Lancer le logiciel Virtual Desktop Streamer App. Il faut saisir votre pseudo Oculus dans le logiciel puis avoir la même configuration que présenté dans la photo ci-dessous

Configuration Virtual Desktop Streamer App

• Installer Steam + SteamVR sur votre session Shadow

• Installer des jeux VR sur steam pour tester comme The Lab

• La configuration est terminé ! En réalité, il reste quelques étapes à faire, mais vous allez voir.

IV. Lancer des jeux Steam VR sur Shadow 🎮

• Démarrer votre session Shadow sur votre ordinateur (prenez soin de régler la bande passante alloué à 5 Mb/s pour réduire l’impact sur votre connexion internet.

• Lancer le logiciel Virtual Desktop Streamer App sur votre session Shadow.

• Sur votre Oculus Quest, allez dans “Bibliothèque”, dans “Sources inconnues”, et lancer l’application “Quest App Launcher”.

• Vous allez retrouver l’application Virtual Desktop et lancez là.

• Ensuite allez dans Settings et régler tous les paramètres en low si vous avez l’offre Basic ou l’offre de base de Shadow (Je suis en waiting list pour la Ultra, je vous donnerai la configuration à faire avec la nouvelle config).

• Enfin vous allez retrouver la liste des jeux VR installé dans la section Games.

• Et lancé le jeu que vous souhaitez utiliser ^^ !

V. Retour d’expérience 👍

Personnellement, même si la procédure est longue, je trouve que c’est vraiment cool de jouer à de la VR sans avoir un fil. De plus, je retrouve notamment tout le catalogue Steam sur mon Oculus Quest et notamment LE jeu VR du moment Half-Life: Alyx.

Par contre j’ai pu remarquer quelques bugs:

• Quelques rare freeze mais surement dû à ma connexion wifi

• Quand on tourne la tête un peu rapidement on peux apercevoir quelques contour noir sur les extrémités.

Malgré ces bugs, l’expérience globale est plutôt très bonne ! Et j’ai hâte de tester la fonctionnalité de Shadow quand elle sortira pour expérimenter la nouvelle procédure qui devrait être plus rapide !

Si vous avez des questions, ou des suggestions n’hésitez pas à m’envoyer un message sur Twitter à @qlaffont ou vous pouvez répondre en commentaire :).

• Pourquoi j’ai mis ma tour de jeu de 1500 € au placard ?
• VR (Oculus Quest) + Shadow ? Est ce possible ?
• Shadow ou PC ? Finalement PC ?

Bonjour à tous, pour ceux qui me connaissent vous savez que je joue depuis longtemps et que j’ai fondé des communautés de jeux (Family of Gaming, The Spirit Brothers, Fortnite France, Rainbow 6 FR, FiveM France). Le jeu vidéo c’est une passion et je stream aussi de temps sur twitch (https://twitch.tv/mirardes un petit peu de pub ne fait pas de mal).

J’ai longtemps monté des PCs perso(ou pour des amis) pour jouer à des jeux gourmands en graphisme. Mais depuis près d’un an, j’ai vendu ma tour et j’utilise un service nommée Shadow. Je vais donc vous donner en détails mon utilisation et pourquoi aujourd’hui je ne regrette pas d’avoir changé.

Update: J’ai quitté Shadow et je me suis acheté un PC Fixe car le délai d’attente pour upgrade ses composants est trop long… Au final, j’utilise le service Rainway qui fait la même chose avec un PC Fixe.

I. Pour quelle utilisation ?

Je suis ce qu’on appelle un casual gamer, c’est à dire un joueur qui joue de temps en temps. Cependant étant un grand fan de FPS et de jeu de tir, je suis assez exigant sur l’input lag et la fréquence de rafraichissement (du coup 144Ghz obligatoire).

Mais je veux aussi avoir une console de jeu que je peux connecter à la télé du salon afin de pouvoir jouer sur un plus grand écran quand j’ai des amis à la maison.

Donc il me faut une solution mobile mais aussi une solution qui tiens la charge de graphique poussé avec un bon temps de rafraichissement.

II. Configuration avec ma tour

Concernant la configuration avec ma tour de jeu, je faisais du stream dessus et je recordais mon jeu dessus. Configuration simple (1 PC qui fait tout) mais cependant j’étais obligé de baisser les graphiques et le nombre de FPS (du coup de 144 fps à 60 fps) afin que le stream et l’expérience de jeu sois fluide. Pas cool :/

Ensuite concernant l’expérience sur mon salon, j’utilisais un Steam Link. Tout l’équipement fonctionnait niquel mais aujourd’hui Valve a décidé de ne plus supporter ce produit génialissime qui permettait de streamer le contenu de mon PC à l’autre bout de la pièce (sans avoir besoin d’internet). Pas cool n°2 :/

III. Configuration avec mon Shadow

Concernant l’expérience de jeu, j’utilise un vieux pc portable de jeu qui me permet de stream et qui va capturer l’expérience de jeu sur l’application Windows Shadow. Ce qui permet de séparer la puissance exigé pour le stream, de la puissance pour faire tourner les jeux.

Concernant l’expérience de jeu salon, j’utilise mon Macbook Pro qui fait tourner l’application Shadow, connecté à des manettes Xbox One en bluetooth (j’ai connecté 4 manettes, plus d’infos ici).

IV. Comparaison

On va énumérer ici des points positifs que j’ai pu noter pour chaque solution. C’est un avis strictement personnel, donc je ne donne que mon avis et l’expérience que j’ai pu en avoir. (+ = point positif | — = point négatif)

PC :

• • Mes données sont stockées en local.
• • Toujours fonctionnel même quand il y a pas d’internet.
• • Je connais mon PCs et je sais quoi faire évoluer dessus.
• • La poussière (Faire la poussière tous les 3 mois…)
• • La température (Radiateur en plein été…)
• • L’entretien (Changer les pièces, pas de redondance)
• • La place occupée par la tour.

Shadow :

• • On fait évoluer mes composants automatiquement sans surplus.
• • Le côté mobile.
• • La simplicité d’utilisation.
• • Des lags (ça m’arrivent de temps en temps de lag sans raison apparente :/)
• • L’espace Disque faible ! (extension à 3€/mois 1 To obligatoire)
• • La connexion fibré O B L I G A T O I R E.

• - Sans Internet, Pas de PC ( Pas de PC, ben … Pas de PC)

V. Conclusion

Du coup pour conclure, aujourd’hui ça fait 1 an et demi que je suis sur Shadow et il est hors de question que je reswitch sur mon ancien pc. J’ai des besoins de mobilité de plus en plus fréquent (#HearthStoneEnPauseDej) et le fait de ne pas m’occuper de l’entretien me fait une charge mentale en moins.

Attention, Shadow n’est pas pour tout le monde ! Si vous êtes un joueur pro ou un hardcore gamer, je ne vous le conseille pas. Je peux même vous dire que pour avoir organiser la GA2018/OES2018/GA2019, je n’ai vu aucune personne jouer un tournoi avec un Shadow. Je vous conseille de tester un mois et de voir si ça correspond à votre utilisation :).

Voilà, hésitez pas à me faire un retour sur l’article et me suivre sur Twitter ^^.

PS: Voici mon code partenaire Shadow ;) : *QUEULU3J (10 € cadeau le premier mois)*

Example : Number of my bad jokes in the last month ! (Yes, I do so much time …) But how to do this ?

PS: You can contact me if you want my help or my services ;) https://qlaffont.com

What I need ?

Actually, I have make this experimentation with :

• A Smiirl Custom Counter of course ! (5 Digits : Buy Here / 7 Digits : Buy Here)

• The Internet Button by Particle.io (Buy Here)

• A server to run a Node.JS Application and a MongoDB Server

• Wifi for sure !

I. Server Application with Node.JS

We need to setup an endpoint who will expose 3 things :

• /counter/{counterID} : Return JSON with number to display

• /counter/increase/{counterID} : Increment our Number

• /counter/set/{counterID}/{number} : Set number to display on our counter

{param} -> Express Route Param

And the code of course :

package.json && do npm install

{

 "name": "smiirl-button-test",

 "version": "1.0.0",

 "description": "Smiirl Boutton Test",

 "main": "index.js",

 "author": "Quentin Laffont",

 "license": "ISC",

 "dependencies": {

  "body-parser": "^1.18.3",

  "express": "^4.16.3",

  "mongoose": "^5.2.1"

 }

}

index.js (Node.JS File to run)

"use strict";

//Import Dependencies
const express = require("express");
const bodyParser = require("body-parser");
const mongoose = require("mongoose");

//MODEL
const Schema = mongoose.Schema;

const CounterSchema = Schema({
    id_Counter: {
        type: String,
        required: true
    },
    nb: {
        type: Number,
        default: 1
    }
});

const Counter = mongoose.model("Counter", CounterSchema);

//MONGO
mongoose.connect(
    "mongodb://127.0.0.1:27017/smiirl-test-button",
    { useNewUrlParser: true }
);

const app = express();

//Accept JSON & Url Encoded
app.use(
    bodyParser.urlencoded({
        extended: true
    })
);

app.use(
    bodyParser.json({
        limit: "50mb"
    })
);

//EXPRESS : Express Configuration
app.all("*", (req, res, next) => {
    res.header(
        "Access-Control-Allow-Methods",
        "GET, PUT, DELETE, POST, OPTIONS"
    );
    res.header(
        "Access-Control-Allow-Headers",
        "Origin, X-Requested-With, Content-Type, Accept"
    );
    res.header("Access-Control-Allow-Origin", "*");
    next();
});

// //GET
app.get("/counter/:id", (req, res) => {
    Counter.findOne({ id_Counter: req.params.id }, (err, result) => {
        if (result) {
            res.json({
                number: parseInt(result.nb)
            });
        } else {
            res.json({
                number: 0
            });
        }
    });
});

//SET
app.get("/counter/set/:id/:number", (req, res) => {
    Counter.findOne({ id_Counter: req.params.id }, (err, result) => {
        if (result) {
            result.nb = parseInt(req.params.number);

result.save(err => {
                res.json({ message: "OK" });
            });
        } else {
            let newCounter = new Counter({
                id_Counter: req.params.id,
                nb: parseInt(req.params.number)
            });

newCounter.save(err => {
                res.json({ message: "OK" });
            });
        }
    });
});

//INCREASE
app.get("/counter/increase/:id", (req, res) => {
    Counter.findOne({ id_Counter: req.params.id }, (err, result) => {
        if (result) {
            result.nb = parseInt(result.nb) + 1;

result.save(err => {
                res.json({ message: "OK" });
            });
        } else {
            let newCounter = new Counter({
                id_Counter: req.params.id,
                nb: parseInt(1)
            });

newCounter.save(err => {
                res.json({ message: "OK" });
            });
        }
    });
});

//EXPRESS : Start Server
app.disable("x-powered-by");
app.listen(parseInt(process.env.PORT) || 8000);

After that, you can do a node index.js. This command will expose your app to this port : 8000. (You can change it with an environment variable named PORT).

II. Configure the Button

To do that, you need to go to build.particle.io (Here, I will suppose you have already link your button to a wifi network).

After that you need to add 2 libraries :

Librairies needed !

After that you can add on your code this :

// This #include statement was automatically added by the Particle IDE.
#include <InternetButton.h>

// This #include statement was automatically added by the Particle IDE.
#include <HttpClient.h>

InternetButton b = InternetButton();

HttpClient http;

// Headers currently need to be set at init, useful for API keys etc.
http_header_t headers[] = {
    { "Accept" , "*/*"},
    { NULL, NULL } // NOTE: Always terminate headers will NULL
};

http_request_t request;
http_response_t response;

int rdm(int maxVal);

int rdm(int maxRand)
{
    return rand() % maxRand + 1;
}

void setup() {
    // INIT INTERNET BUTTON
    b.begin();

    //YOU NEED TO CHANGE THIS VALUE TO YOUR SERVER IP
    request.hostname = "myserver.com";

    request.port = 8000;


}

void loop(){
    //WHITE COLOR && DECREASE BRIGHTNESS
    b.allLedsOn(255,255,255);
    b.setBrightness(50);

    //INCREASE
    if(b.buttonOn(1) || b.buttonOn(2) || b.buttonOn(3) || b.buttonOn(4)){
        int color_r = rdm(255);
        int color_g = rdm(255);
        int color_b = rdm(255);

        b.allLedsOff();
        b.ledOn(11,color_r, color_g, color_b);
        b.ledOn(1,color_r, color_g, color_b);
        delay(1000);


        request.path = "/counter/increase/mycustomcounter";
        http.get(request, response, headers);

        b.allLedsOff();
    }
}

Now you can save your code and click on flash (This step will put this code on your button).

Flash Button on build.particle.io

Now we just need to setup our counter !

Our button after flash step !

3. Setup counter

(Here, I will suppose you have already link your counter to a wifi network).

First you need to go to **https://my.smiirl.com. **Enter your credentials and go to your counter page. After that you can enter, your display url from your node.js application. Exemple : http://myserver.com/counter/mycustomcounter

Now it’s your time !

You can click on the button, and your button is increase ! 😍

Smiirl Custom Counter Increase ❤️ when I press button

PS: If you want to reset your number, you can do a http://myserver.com/counter/set/mycustomcounter/1 (You can’t do 0, because Smiirl Counter doesn’t support it.(But you can do 1000000 for 5D or 100000000 for 7D, this will display zero in each flap !))

Un contexte compliqué

Aujourd’hui sur la plateforme officielle de FiveM il est impossible de parler en français. Ce qui est met déjà dans une ambiance certainement mauvaise pour commencer. Si vous avez le malheur de parler en français, vous serez automatiquement banni pendant quelques jours ou définitivement.

De ce fait de nombreuses communautés annexes comme FiveM-France (Oui je fais ma pub ;)) se sont créées dans le but de donner la parole aux développeurs francophone souhaitant développer FiveM et mettre en place leurs serveurs.

Une mentalité laissant à désirer côté francophone …

FiveM est un moteur GTA 5 permettant de mettre en place et créer un serveur multijoueur. De ce fait, le nombre de personne non majeur et très souvent jeune (~14 ans) est tout à fait normal. Je contextualise dès à présent pour que vous puissiez comprendre la suite.

Avez le boom de l’open source, de nombreux développeurs ont commencé à partager leurs scripts (Lua/C) pour pouvoir développer l’ensemble des fonctionnalités que permettait FiveM. Des projets comme N3MTV étaient des projets très attendu par les non-développeurs car il permettait de mettre en place un serveur RP en 5min sans connaissances requises en développement.

Cependant suite à du harcèlement et d’injures envers l’auteur du projet, le projet a été retiré. Certains diront “C’est internet, des personnes stupides, il y en a partout !” et d’autres “C’est la faute du développeur car son projet était rempli de bugs !”. Dans les deux cas, ces remarques ont fait retirer un gros projet communautaire qui a inspiré de nombreux développeurs auparavant !

Enfin la plupart des personnes qui souhaitent monter un serveur, ne sont pas des développeurs et ne parlent pas anglais. Vous rajoutez donc un défi technique et linguistique à cette communauté assez jeune.

Mais aussi hors francophone …

Lors de la création de serveur FiveM, 90 % des développeurs utilisaient un script nommé “*EssentialMode”. Ce script développé par *Kanersps permettait d’avoir une base de développement plutôt pratique.

Auparavant, on pouvait utiliser librement sa ressource sans aucun problème licence. Bref le script essentiel à tout serveur.

Cependant un jour, Kanersps a décidé de poursuivre toutes les personnes qui partagées sont script pour qu’il n’y est plus que lui qui puisse partager son script “EssentialMode”. On ne connaît pas les raisons de ce retrait, mais cela a tué de nombreux projets qui souhaitait partager leurs serveurs avec tous les développeurs (et contenant toutes les ressources). Dommage !

Un moteur GTA5 bancal :/

FiveM est aujourd’hui le moteur principal des serveurs GTA5. Le moteur historique nommé CitMP est le plus aboutit cependant il souffre de nombreux bugs, latences, crashs. De ce fait l’équipe a retravaillé son moteur afin de fournir un moteur plus stable nommé FX Server et a rendu son utilisation obligatoire récemment.

Le problème de ce tout nouveau moteur, c’est que la plupart des ressources ne fonctionnait plus avec le nouveau moteur. De ce fait lors du grand changement, plus de la moitié des serveurs ont fermés car les ressources ne sont plus compatibles et des développeurs comme moi qui ont passés plus de 2 mois à développer un serveur se retrouve aujourd’hui à tout refaire.

Donc des serveurs ont fermés et des développeurs ont abandonnés leurs projets sur FiveM.

Des projets persistent mais plus la même attente !

Personnellement j’ai raccroché avec FiveM. Trop de changement, peu de considération et une mentalité négative. Mon dernier projet fut la création d’un pseudo Git pour FiveM nommé fvm-installer. Utilisé par certains développeurs, c’est un outil que FiveM avait besoin d’utiliser. Mais ça sera mon dernier projet.

Enfin pour d’autres développeurs, des projets persistent comme FT, ESX, etc. Mais il faut se rendre à l’évidence que de plus en plus de joueurs abandonnent la plateforme et les serveurs FiveM ferment chacun à leurs tours. Une plateforme ambitieuse mais qui aujourd’hui disparaît à petit feu…