Commit comme un(e) "Hipster" avec Gitmoji !

"TMP"
"Fix some bugs"
"I changed that shit"

Cela vous rappelle de mauvais souvenirs ? C'est pour ça que les conventions sur les messages de commit sont importantes. En avez vous déjà utilisées une ? Avez-vous essayé les Emojis ? Ils sont par nature super expressifs et très lisibles.

Dans cette présentation je vais vous expliquer pourquoi ils sont utiles et comment vous pouvez les utiliser dans votre quotidien de dév pour commiter comme un(e) "Hipster" 😎 !

Transcript

1. 😎
   A journey to commit like a hipster
   

   View Slide

2. 🖖 Hello!
   @spontoreau
   Sylvain Pontoreau
   How it’s going
   🌹
   ⚔
   😐
   How it started
   -<@
   O=|====>
   o_o
   Emo(ticons/jis), I’m in that business since 1998 ©
   And I like to do funny things with them 😬
   🎪 Co-organizer
   📕 Book writer
   Microsoft
   󰳕 Work with
   

   View Slide

3. 🤔 what is the problem?
   

   View Slide

4. 💬 Commit messages…
   (The guy who left the company)
   Friday afternoon:
   (You, trying to understand what is going on…)
   Monday morning, outage on prod:
   

   View Slide

5. 😞 But it’s not that easy!
   (Maybe you everyday) (The guy who’s joining your team)
   

   View Slide

6. 📘 Convention to the rescue
   The conventional commits specification
   

   View Slide

7. 📚 Conventional Commits
   A set of rules for creating explicit commit history
   • How it works:
   Format
   types(context): message
   Breaking changes
   !
   • Types can be extended easily (impr, chore, refactor, perf, docs, …)
   • Automation made simple (changelog, semantic versioning, …)
   Types
   fix / feat
   

   View Slide

8. 💩 Is Conventional Commits bad?
   

   View Slide

9. 👀 Predictability of the human eye
   Do you know F-Pattern?
   • In text-heavy content, most humans scan information by making an “F”
   • F-Pattern is bad for user
   • Optimize horizontal movement of the eye is a key point
   • This is why Conventional Commits specification is not that great
   

   View Slide

10. ❓ Why consider emojis instead?
    (No need to explain what it stands for)
    First, the are super expressive!
    🎉 ✅ 📱 🚧 💩 🐛 🗑
    

    View Slide

11. 🎉 Tada!
    ✅ Test are ok!
    🚧 We are working on it!
    🗑 Let’s drop that!
    🐛 It’s not working
    👁 Why consider emojis instead?
    Where is the bug?
    👀 Your eyes directly look here
    Secondly, they optimize reading!
    😉 Optimized scan
    

    View Slide

12. gitm😎ji
    

    View Slide

13. A convention based on emojis!
    📒Gitmoji
    https://gitmoji.carloscuesta.me/
    

    View Slide

14. 😜 Gitmoji
    The basic ones!
    🐛
    :bug:
    Fix a bug.
    ✨
    :sparkles:
    Introduce new feature.
    

    View Slide

15. 😍Gitmoji
    Refacto / Improvement
    ♻
    :recycle:
    Refactor code.
    ⚡
    :zap:
    Improve preformance.
    🚚
    :truck:
    Move or rename
    resources
    🏗
    :building_construct
    ion:
    Make architectural
    changes.
    🎨
    :art:
    Improve structure /
    format of the code.
    

    View Slide

16. 😆 Gitmoji
    Package management
    ➖
    :heavy_minus_sign:
    Remove a dependency.
    ➕
    :heavy_plus_sign:
    Add a dependency.
    ⬆
    :arrow_up:
    Upgrade dependencies
    ⬇
    :arror_down:
    Downgrade
    dependencies.
    📌
    :pushpin:
    Pin dependencies to
    specific versions.
    

    View Slide

17. 🤡
    :clown_face:
    Mock things.
    🧪
    :test_tube:
    Add a failing test.
    😳 Gitmoji
    Testing
    ✅
    :white_check_mark:
    Add, update, or pass
    tests.
    

    View Slide

18. 😂 Gitmoji
    Other useful emojis
    🚨
    :rotating_light:
    FIx compiler / linter
    warnings.
    👷
    :construction_work
    er:
    Add or update CI build
    system.
    🙈
    :see_no_evil:
    Add or update a
    .gitignore file.
    💥
    :boom:
    Introduce breaking
    changes.
    🔧
    :wrench:
    Add or update
    configuration files.
    

    View Slide

19. 󰠁 for developers 󰞵
    

    View Slide

20. 💻 Gitmoji CLI
    There is a CLI for that 🤩
    https://github.com/carloscuesta/gitmoji-cli
    

    View Slide

21. 🖥 Gitmoji plugins/extensions
    For people who don’t like terminals 😅
    https://gitmoji.dev/related-tools
    And more:
    - atom
    - sublim
    - macOS app
    - …
    Browser extensions IntelliJ VS Code
    

    View Slide

22. 📝 Changelog
    No more excuses 😊
    https://github.com/frinyvonnick/gitmoji-changelog
    

    View Slide

23. 🔖Semantic versioning
    Major
    messages.contains(💥)
    Minor
    !messages.contains(💥)
    &&
    messages.contains(✨)
    Not a big deal 🦸
    Patch
    !messages.contains(💥)
    &&
    !messages.contains(✨)
    

    View Slide

24. 🥳 conclusion
    

    View Slide

25. 💪 Conclusion
    🐛FIX EMAIL VALIDATION
    FIX EMAIL VALIDATION
    FIX
    SHOW ME THE
    REAL COMMIT MESSAGE
    I SAID THE
    REAL COMMIT MESSAGE
    PERFECTION
    

    View Slide

26. Questions❓
    Feel free to ask! 󰢨󰢧
    

    View Slide

27. 🙏 Thanks! 󰢛
    https://speakerdeck.com/spontoreau
    

    View Slide