> For the complete documentation index, see [llms.txt](https://manu-artero-anguita.gitbook.io/buenas-practicas-con-react/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://manu-artero-anguita.gitbook.io/buenas-practicas-con-react/sesion-5/ejemplo-desde-0.md).

# Ejemplo: desde 0

*Que no se nos olvide*

* testing
* linter
* jsConfig (y después tsConfig)
* CI (GitHub Actions)
* Storybook

{% embed url="<https://www.typescriptlang.org/tsconfig>" %}

```json
	"ts-component": {
		"scope": "typescriptreact",
		"prefix": "\\new",
		"body": [
			"import './${TM_FILENAME_BASE}.scss';",
			"",
			"interface Props {",
			"\tfoo?: string;",
			"}",
			"",
			"function ${TM_FILENAME_BASE/(.*)/${1:/pascalcase}/}({ foo }: Props): JSX.Element {",
			"\treturn <div className='${TM_FILENAME_BASE}'>{foo}</div>;",
			"}",
			"",
			"export default ${TM_FILENAME_BASE/(.*)/${1:/pascalcase}/};"
		]
	},
	
```

{% embed url="<https://github.com/manuartero/rgb-final-example>" %}