Partage ton code 📢

Pour te faire aider ✅
Pour montrer tes talents cachés 🚀
Pour apprendre des choses aux autres ❤️

3 manière de faire :

1️⃣ Une image
2️⃣ Code dans le cloud
3️⃣ Markdown

#RT ❤️

🧵 #thread #share #code
1. Avec une image

Comme je le fais souvent sur Twitter dû à la limite de caractères, je partage mon code avec des captures de code

Pour en générer :

* carbon.now.sh
* ray.so (le plus bg)
* codeimg.io
✅ Avantages :
* belle capture de code
* facilement lisible
* partage et sauvegarde facile

❌ Désavantages
* on ne peut pas copier-coller
* impossible de tester

💡 mon avis
* très cool pour donner de l'info sur les réseaux
* pas bien pour demander de l'aide sur discord ou slack
2. Stockage dans le cloud

Un site web qui va contenir ton code que tu vas pouvoir partager via une URL !

Outils pour le faire

* gist.github.com
* codesandbox.io
* codepen.io
* pastebin.com
* more and more : alternativeto.net/software/githu…
✅ Avantages :
* facile pour copier-coller
* élégant
* sauvegarder dans le cloud
* les sandbox sont pratiques pour tester et debugger

❌ Désavantages
* besoin d'internet

💡 mon avis
* cool pour partager des snippets ou des démos
* cool pour demander de l'aide
3. Markdown

Sur les serveurs Discord, sur Github et même sur Slack il y a moyen de partager son code avec Markdown !

Voici quelques exemples pour chaque site !
✅ Avantages :
* parfait pour solliciter de l'aide
* aussi stocker dans le cloud
* possible de copier-coller sans ouvrir de site web

❌ Désavantages
* impossible de directement tester
* limite de caractères

💡 mon avis
* très pratique pour demander de l'aide !
Petit thread léger !

Pour préparer le terrain du gros de Mercredi !

Follow @melvynxdev

Dernier Thread :

• • •

Missing some Tweet in this thread? You can try to force a refresh
 

Keep Current with Melvyn • Développeur

Melvyn • Développeur Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @melvynxdev

Jun 13
Comment centrer une div en CSS 🏋️

Je vois encore et toujours passer ce meme 🤯

Rejoins l'élite en connaissant tous les moyens de centrer une div 📢

Voici les 3 solutions :

- Flexbox 🏋️
- Grid 🔱
- Hack (expliqué) 💥

#RT ❤️

🧵 #thread #css #web
1. Grid

Je le présente en premier car il tient littéralement en deux lignes de code !

Plus aucune excuse !

Le "place-content" est un shorthand pour définir "align-content" et "justify-content" simultanément
2. Flex

Un peu comme grid mais sans le shorthand, donc il faut 3 lignes !

Je ne vais pas en expliquer plus 👍
Read 8 tweets
Jun 12
Tu utilises toujours Flex 😑

Certaines fois tu DOIS utiliser Grid ✅ !

Je te présente le :

➡️ "World famous Grid CSS Snippet"

Regarde l'effet parfais que ça donne avec la vidéo 🤩

#RT ❤️

🧵 #thread #css #grid #flex
Quand l'utiliser ?

Comme tu peux le voir dans la vidéo, c'est quand tu as une liste d'élément et que tu veux plusieurs items par liste en fonction de la taille d'écran !

Tu trouveras surement d'autres use-case !

Voici le "World famous Grid CSS Snippet" : Image
Mon but, c'est que tu le comprennes, donc je vais décomposer chaque partie ✅

Déjà voici une petite CodeSandBox pour que tu puisses tester : codesandbox.io/s/the-ultimate…
Read 11 tweets
Jun 11
Tu perds du temps ⚠️

Ton IDE est ton outil principal 🗝️

Comme le couteau d'un cuisinier, il faut l'entretenir !

Je te partage les meilleures extensions et paramètre pour être plus efficace sur VSCode 🔷

Stonks 📈

#RT ❤️

🧵 #Thread #vscode #ide Image
1. Les extensions essentielles

1.1 ESLint
✅ Essentiel, obligatoire, permet d'éviter de faire des bêtises et rend VSCode intelligent
📐 Il permet d'ajouter des règles pour ton projet et de constamment checker que tu les respectes

marketplace.visualstudio.com/items?itemName…
1.2 Prettier
✅ Essentiel aussi, c'est un énorme gain de temps de ne pas avoir à formater son code
🧙 Pour que tous les collaborateurs du projet formatent pareil
🧠 Libère de la place à ton cerveau en laissant prettier se charger du formatage

marketplace.visualstudio.com/items?itemName…
Read 12 tweets
Jun 10
Travailler c'est bien 💪

Mais, le montrer c'est encore mieux 💃

ça te motive, ça motive les autres, ça te rend fière et te détermine à continuer

Voici 5 sites qui te permettront de partager ton travail rapidement ❤️

#RT ❤️

🧵 #thread #deploy #devops #share Image
1. Vercel - vercel.com

C'est le premier car c'est une follie !

✅ Deploy automagiquement React, Angular et Vue
✅ Très facile d'ajouter un nom de domaine custom
✅ Interface canon
✅ Gratuit avec infinité de projet
✅ Puissance de Next
❌ Que frontend
❌ Pas libre
2. Heroku - dashboard.heroku.com

✅ Deploy automatiquement Front et Backend (React, Rails, Django...)
✅ Liberté du serveur, CLI bash
✅ DB disponibe
❌ Interface moins sexy
❌ Très rapidement payant (les limites sont vite atteintes)
Read 7 tweets
Jun 9
React ⚛️ - useRef, la face cachée du hooks 🔒 !

Tu le connais déjà surement 🤔
Tu as l'habitude de l'utiliser pour récupérer la référence d'un élément du DOM en JavaScript 🚀

Mais, en vrai, il a bien plus d'utilité !

#RT ❤️

🧵 #thread #react #js #web Image
Déjà c'est quoi useRef 🤔 ?

C'est une valeur sauvegardée dans un objet, dans ton composant qui persiste lorsque le composant se rerender
Quand elle est update, le composant ne se rerender pas

Son nom vient du fait que la valeur est sauvegardée dans un objet : { current: ... }
Son usage basique est pour récupérer la référence d'un élément HTML primitif, par exemple, une div :

Cet usage permet notamment :
* changer les propriétés d'une div
* récupérer la valeur d'un input
* gérer le canvas Image
Read 12 tweets
Jun 8
Je vois beaucoup de personnes se demande : « c’est quand le moment pour chercher un emploi ? » 🤔
C’est déjà le moment d’en chercher un ✅

Arrêter de remettre à plus tard 😬 !

Passe à l’action aujourd’hui 💪

Après ce Thread tu seras motivé comme jamais 😤

#rt ❤️

🧵#thread Image
Déjà, il faut savoir que la technique c’est bien. Excellent. Mais, c'est 50% du travail de développeur, le mindset c’est l’autre partie !

Tu as bien lu. Pas besoin d’être une machine de guerre en dev si tu as le bon mindset 😶

C’est pour ça que je vais en parler sur ce compte👍 Image
Tu te demandes peut-être : « c’est quand que je suis prêt pour travailler en entreprise ? »
Ma réponse est que si tu te poses cette question, c’est que le bon moment c’est maintenant, sur le champ 🏃 !

Mais, des personnes me diront « j’ai peur », « je n'ai pas confiance en moi »
Read 14 tweets

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Don't want to be a Premium member but still want to support us?

Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal

Or Donate anonymously using crypto!

Ethereum

0xfe58350B80634f60Fa6Dc149a72b4DFbc17D341E copy

Bitcoin

3ATGMxNzCUFzxpMCHL5sWSt4DVtS8UqXpi copy

Thank you for your support!

Follow Us on Twitter!

:(