diff --git a/README.md b/README.md
index 0ba4deafbca7089dbc0d9befc6f655b261561be3..802ca1d2442ff2284340dcc3d044bcd4f96979e2 100644
--- a/README.md
+++ b/README.md
@@ -3,16 +3,20 @@
 Dashboard of the service which is used by system administrators
 
 ## Fase I
-Costruire tutti gli elementi della dashboard utlizzando una libreria css. L'idea è di scrivere il meno css possibile nella fase iniziale in modo tale da avere una versione funzionante del sito in breve tempo. 
+
+Costruire tutti gli elementi della dashboard utlizzando una libreria css. L'idea è di scrivere il meno css possibile nella fase iniziale in modo tale da avere una versione funzionante del sito in breve tempo.
+
 - Tailwind css
 - Bulma
 
-
 # Used dependencies
+
 ## Typescript
+
 Anche se renderà un po' complesso lo sviluppo all'inizio, l'idea è utilizzare typescript perché funziona meglio di JS e abbiamo le competenze per comprenderlo.
 
 ## Useful resources
+
 [react calendar app](https://codesandbox.io/s/kkyvoj97pv?from-embed=&file=/src/index.js)
 [codesandbox, utile per vedere altri progetti creati con framework)(https://codesandbox.io/)
 [awesome css list](https://github.com/awesome-css-group/awesome-css)
diff --git a/package.json b/package.json
index 2651d684e9fb20cb24f9ff2be813d344589d660e..d431a073137353d155ccf144ef1d8e62d407bd8f 100644
--- a/package.json
+++ b/package.json
@@ -20,7 +20,8 @@
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
-    "eject": "react-scripts eject"
+    "eject": "react-scripts eject",
+    "format": "prettier --write ."
   },
   "eslintConfig": {
     "extends": [
@@ -39,5 +40,8 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
+  },
+  "devDependencies": {
+    "prettier": "2.2.1"
   }
 }
diff --git a/src/App.test.tsx b/src/App.test.tsx
index 2a68616d9846ed7d3bfb9f28ca1eb4d51b2c2f84..d76787ed69b4ef6bbc3762ba9867f85041dc1040 100644
--- a/src/App.test.tsx
+++ b/src/App.test.tsx
@@ -1,8 +1,8 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import App from './App';
+import React from "react";
+import { render, screen } from "@testing-library/react";
+import App from "./App";
 
-test('renders learn react link', () => {
+test("renders learn react link", () => {
   render(<App />);
   const linkElement = screen.getByText(/learn react/i);
   expect(linkElement).toBeInTheDocument();
diff --git a/src/App.tsx b/src/App.tsx
index a53698aab3c66049c61980112dd0109dd2cd0845..9cc63d91a674d75a5a825e1dad40da53a2943a8a 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,6 +1,6 @@
-import React from 'react';
-import logo from './logo.svg';
-import './App.css';
+import React from "react";
+import logo from "./logo.svg";
+import "./App.css";
 
 function App() {
   return (
diff --git a/src/index.css b/src/index.css
index ec2585e8c0bb8188184ed1e0703c4c8f2a8419b0..4a1df4db71cdb32ede8a8f6cf33da4539cbf0920 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,13 +1,13 @@
 body {
   margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
+    "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
     sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
 
 code {
-  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+  font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
     monospace;
 }
diff --git a/src/index.tsx b/src/index.tsx
index ef2edf8ea3fc42258464231e29140c8723458c1e..ad9cbbbf8f3cf52c00c6cffe408ffce752a0c77a 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,14 +1,14 @@
-import React from 'react';
-import ReactDOM from 'react-dom';
-import './index.css';
-import App from './App';
-import reportWebVitals from './reportWebVitals';
+import React from "react";
+import ReactDOM from "react-dom";
+import "./index.css";
+import App from "./App";
+import reportWebVitals from "./reportWebVitals";
 
 ReactDOM.render(
   <React.StrictMode>
     <App />
   </React.StrictMode>,
-  document.getElementById('root')
+  document.getElementById("root")
 );
 
 // If you want to start measuring performance in your app, pass a function
diff --git a/src/reportWebVitals.ts b/src/reportWebVitals.ts
index 49a2a16e0fbc7636ee16bf907257a5282b856493..5fa3583b7500be19f1ed614222d46fdacbcb8d3b 100644
--- a/src/reportWebVitals.ts
+++ b/src/reportWebVitals.ts
@@ -1,8 +1,8 @@
-import { ReportHandler } from 'web-vitals';
+import { ReportHandler } from "web-vitals";
 
 const reportWebVitals = (onPerfEntry?: ReportHandler) => {
   if (onPerfEntry && onPerfEntry instanceof Function) {
-    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
+    import("web-vitals").then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
       getCLS(onPerfEntry);
       getFID(onPerfEntry);
       getFCP(onPerfEntry);
diff --git a/src/setupTests.ts b/src/setupTests.ts
index 8f2609b7b3e0e3897ab3bcaad13caf6876e48699..1dd407a63ef3dfe125f2044471689923a3c507a9 100644
--- a/src/setupTests.ts
+++ b/src/setupTests.ts
@@ -2,4 +2,4 @@
 // allows you to do things like:
 // expect(element).toHaveTextContent(/react/i)
 // learn more: https://github.com/testing-library/jest-dom
-import '@testing-library/jest-dom';
+import "@testing-library/jest-dom";
diff --git a/tsconfig.json b/tsconfig.json
index a273b0cfc0e965c35524e3cd0d3574cbe1ad2d0d..9d379a3c4af84ae50928aaef7dd3a3d9cadeacde 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -1,11 +1,7 @@
 {
   "compilerOptions": {
     "target": "es5",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
+    "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
     "esModuleInterop": true,
@@ -20,7 +16,5 @@
     "noEmit": true,
     "jsx": "react-jsx"
   },
-  "include": [
-    "src"
-  ]
+  "include": ["src"]
 }