Skip to content

Commit

Permalink
🎨 Ajout d'un editorconfig
Browse files Browse the repository at this point in the history
  • Loading branch information
ROLLAND Jean-Sébastien committed Aug 9, 2019
1 parent f375cde commit cf3f25a
Show file tree
Hide file tree
Showing 2 changed files with 82 additions and 62 deletions.
20 changes: 20 additions & 0 deletions .editorconfig
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
# EditorConfig helps developers define and maintain consistent
# coding styles between different editors and IDEs
# editorconfig.org

root = true

[*]

# Change these settings to your own preference
indent_style = space
indent_size = 2

# We recommend you to keep these unchanged
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true

[*.md]
trim_trailing_whitespace = false
124 changes: 62 additions & 62 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,62 +1,62 @@
# Quelques outils pour devs web

# Git
### **TODO:** Commandes à connaitre
- [Commandes git (fr)](https://www.hostinger.fr/tutoriels/commandes-git/)
- [Basic Git commands (en)](https://confluence.atlassian.com/bitbucketserver/basic-git-commands-776639767.html)
- [Merge or rebase](https://medium.com/datadriveninvestor/git-rebase-vs-merge-cc5199edd77c)

### Gitmoji
On a tous cette tendance à vouloir un code propre, alors quand on tombe sur un warning ESLint ou que l'on
remarque un fichier dans /src alors qu'il devrait être dans /src/utils... On corrige et on continue notre feature
comme ci de rien n'était.

Dans un contexte de review de code, il devient alors compliqué pour nos pairs d'y comprendre quoique ce soit.
[Gitmoji](https://gitmoji.carloscuesta.me) va nous aider à catégoriser nos commits, tout en ajoutant de la lisibilité
grâce aux icônes.

Si un temps d'adaption vous est nécessaire pour vous habituer à cet outils, ce n'est pas qu'il est mal fait ou
qu'il ne correspond pas à votre besoin. C'est juste que vous ne suiviez pas les bonnes pratiques jusqu'à présent. ;)

# Style
### Block Element Modifier
BEM est une méthodologie pour votre CSS. Même s'il va facilité la lisibilité de votre code par vos pairs, il va surtout vous éviter des effets de bord plutôt désagréable à corriger !

Vous savez, ce lien hypertexte qui se comporte bizarrement quand il est dans une liste. N'aurait-il pas la même tête que celui de votre menu ? Etrange...
Je vous propose d'approfondir la chose grâce à [un article chez Alsacréations (fr)](https://www.alsacreations.com/article/lire/1641-Bonnes-pratiques-en-CSS--BEM-et-OOCSS.html) et un [guideline un peu plus complet (en)](https://cssguidelin.es).
Suite à ces lectures, vous aurez tout le loisir de ~~vous entretuer~~ discuter avec vos collègues de l'utilisation de SASS dans votre prochain projet. ;)

### Name that color
Bien nommer les choses est primordial dans notre métier. C'est le cas également pour le style.
Marre de vous casser la tête pour trouver le nom qui correspond à ce bleu un peu moins bleu que celui d'à côté ?
[Name that color](http://chir.ag/projects/name-that-color) est fait pour vous !

# JavaScript
### **TODO:** GraphQL
[Comment mock mon serveur GraphQL (fr)](https://dev.to/yvonnickfrin/mock-your-graphql-server-realistically-with-faker-js-25oo)

### **TODO:** Animations
- [Anime](https://www.sitepoint.com/get-started-anime-js)
- [React Sprint](https://blog.logrocket.com/animations-with-react-spring)
- [React-Native Lottie](https://github.com/react-native-community/lottie-react-native)

# Editeur de texte
### **TODO:** VIM
- [developpez.com](https://linux.developpez.com/formation_debian/vim.html)
- [commandes](https://coagul.org/drupal/publication/commandes-et-options-vi-vim)

### **TODO:** Virtual Studio Code
- Quelques extensions : DotENV, EditorCondif, ESLINT, Live Share

# Misc
### Markdown
Le markdown est très pratique pour écrire des docs rapidement. Vous connaissez tous de part les `README.md`, plus complets les un que les autres, que vous avez pu lire ou écrire.

Voila de quoi vous aider avec ce [petit guide syntaxique](https://guides.github.com/features/mastering-markdown/#syntax).

### **TODO:** Oh My ZSH
- [Doc officielle](https://github.com/robbyrussell/oh-my-zsh/wiki)

### **TODO:** Installer Cygwin avec Cmder
- [Doc officielle de Cmder](https://github.com/cmderdev/cmder/wiki/Integrating-Cygwin)
- [Cmder Cygwin ZSH](https://gist.github.com/dfontana/3e27ec5ea3a6f935b7322b580d3df318)
# Quelques outils pour devs web

# Git
### **TODO:** Commandes à connaitre
- [Commandes git (fr)](https://www.hostinger.fr/tutoriels/commandes-git/)
- [Basic Git commands (en)](https://confluence.atlassian.com/bitbucketserver/basic-git-commands-776639767.html)
- [Merge or rebase](https://medium.com/datadriveninvestor/git-rebase-vs-merge-cc5199edd77c)

### Gitmoji
On a tous cette tendance à vouloir un code propre, alors quand on tombe sur un warning ESLint ou que l'on
remarque un fichier dans /src alors qu'il devrait être dans /src/utils... On corrige et on continue notre feature
comme ci de rien n'était.

Dans un contexte de review de code, il devient alors compliqué pour nos pairs d'y comprendre quoique ce soit.
[Gitmoji](https://gitmoji.carloscuesta.me) va nous aider à catégoriser nos commits, tout en ajoutant de la lisibilité
grâce aux icônes.

Si un temps d'adaption vous est nécessaire pour vous habituer à cet outils, ce n'est pas qu'il est mal fait ou
qu'il ne correspond pas à votre besoin. C'est juste que vous ne suiviez pas les bonnes pratiques jusqu'à présent. ;)

# Style
### Block Element Modifier
BEM est une méthodologie pour votre CSS. Même s'il va facilité la lisibilité de votre code par vos pairs, il va surtout vous éviter des effets de bord plutôt désagréable à corriger !

Vous savez, ce lien hypertexte qui se comporte bizarrement quand il est dans une liste. N'aurait-il pas la même tête que celui de votre menu ? Etrange...
Je vous propose d'approfondir la chose grâce à [un article chez Alsacréations (fr)](https://www.alsacreations.com/article/lire/1641-Bonnes-pratiques-en-CSS--BEM-et-OOCSS.html) et un [guideline un peu plus complet (en)](https://cssguidelin.es).
Suite à ces lectures, vous aurez tout le loisir de ~~vous entretuer~~ discuter avec vos collègues de l'utilisation de SASS dans votre prochain projet. ;)

### Name that color
Bien nommer les choses est primordial dans notre métier. C'est le cas également pour le style.
Marre de vous casser la tête pour trouver le nom qui correspond à ce bleu un peu moins bleu que celui d'à côté ?
[Name that color](http://chir.ag/projects/name-that-color) est fait pour vous !

# JavaScript
### **TODO:** GraphQL
[Comment mock mon serveur GraphQL (fr)](https://dev.to/yvonnickfrin/mock-your-graphql-server-realistically-with-faker-js-25oo)

### **TODO:** Animations
- [Anime](https://www.sitepoint.com/get-started-anime-js)
- [React Sprint](https://blog.logrocket.com/animations-with-react-spring)
- [React-Native Lottie](https://github.com/react-native-community/lottie-react-native)

# Editeur de texte
### **TODO:** VIM
- [developpez.com](https://linux.developpez.com/formation_debian/vim.html)
- [commandes](https://coagul.org/drupal/publication/commandes-et-options-vi-vim)

### **TODO:** Virtual Studio Code
- Quelques extensions : DotENV, EditorCondif, ESLINT, Live Share

# Misc
### Markdown
Le markdown est très pratique pour écrire des docs rapidement. Vous connaissez tous de part les `README.md`, plus complets les un que les autres, que vous avez pu lire ou écrire.

Voila de quoi vous aider avec ce [petit guide syntaxique](https://guides.github.com/features/mastering-markdown/#syntax).

### **TODO:** Oh My ZSH
- [Doc officielle](https://github.com/robbyrussell/oh-my-zsh/wiki)

### **TODO:** Installer Cygwin avec Cmder
- [Doc officielle de Cmder](https://github.com/cmderdev/cmder/wiki/Integrating-Cygwin)
- [Cmder Cygwin ZSH](https://gist.github.com/dfontana/3e27ec5ea3a6f935b7322b580d3df318)

0 comments on commit cf3f25a

Please sign in to comment.