Skip to content

Latest commit

 

History

History
60 lines (37 loc) · 4.01 KB

editor-setup.md

File metadata and controls

60 lines (37 loc) · 4.01 KB
Raw
title
Editor Setup

Un editor correttamente configurato permette una più facile lettura del codice ed una scrittura più veloce. Può anche aiutare nell'individuazione di bugs durante la battitura! Se è la prima volta che configuri un editor o vuoi ritoccare la tua configurazione attuale, abbiamo alcune raccomandazioni.

  • Quali sono gli editor più comuni
  • Come formattare automaticamente il codice

Il tuo editor {/your-editor/}

VS Code è uno degli editor più popolari al momento. Ha un grande marketplace di estensioni e si integra molto bene con servizi popolari come GitHub. Molte delle funzioni elencate di seguito possono essere aggiunte a VS Code come estensioni, rendendolo altamente configurabile!

Altri editor di testo popolari in uso nella comunità React sono:

  • WebStorm che è un ambiente integrato di sviluppo progettato specificatamente per JavaScript.
  • Sublime Text offre supporto JSX e TypeScript, evidenziazione della sintassi e autocompletamento.
  • Vim è un editor di testo altamente configurabile progettato per rendere la modifica di ogni tipo di testo molto efficiente. É incluso nella maggioranza delle distribuzioni UNIX e Apple OS X lanciando il comando "vi".

Funzioni degli editor di testo raccomandate {/recommended-text-editor-features/}

Alcuni editor hanno queste funzioni già incluse, altri potrebbero richiedere l'installazione di una estensione. Verifica cosa è supportato dal tuo editor preferito per sicurezza!

Linting {/linting/}

I code linters individuano problemi nel codice man mano che lo si scrive, permettendo di fixarli sul nascere. ESLint è un linter per JavaScript open source molto popolare.

Formattazione {/formatting/}

L'ultima cosa che vuoi avere quando condividi il tuo codice con un altro collaboratore è una discussione riguardo tabs contro spazi! Fortunatamente, Prettier ripulirà il tuo codice riformattandolo conformemente ad una configurazione presettata. Esegui Prettier, e tutti i tuoi tabs verranno convertiti in spazi e la tua indentazione, virgolette, ecc verranno cambiate a seconda della configurazione. Nel setup ideale, ogni volta che salvi un file, Prettier applicherà queste modifiche per conto tuo automaticamente.

Puoi installare l'estensione Prettier in VSCode seguendo questi passi:

  1. Lancia VS Code
  2. Usa Quick Open (premendo Ctrl/Cmd+P)
  3. Incolla ext install esbenp.prettier-vscode
  4. Premi Invio

Formattazione automatica al salvataggio del file {/formatting-on-save/}

Idealmente, dovresti riformattare il tuo codice ad ogni salvataggio. VS Code ha un settaggio apposito!

  1. In VS Code, premi CTRL/CMD + SHIFT + P.
  2. Scrivi "settings"
  3. Premi Invio
  4. Nella barra di ricerca, scrivi "format on save"
  5. Accertati che l'opzione "format on save" sia selezionata!

Se il tuo preset ESLint ha regole di formattazione, potrebbero andare in conflitto con Prettier. Ti raccomandiamo di disabilitare tutte le regole di formattazione nel tuo preset ESLint usando eslint-config-prettier facendo si che ESLint venga usato solo per identificare errori. Se vuoi fare in modo che la formattazione sia forzata prima che una pull request sia "merged", usa prettier --check nella tua pipeline di continuous integration.