Configuración de Visual Studio Code para React Native

La extension de Bracket Pair Colorizer no hace falta instalar porque VisualStudioCode ya la tiene nativa. Solo hay que ir a settings y poner:

"editor.bracketPairColorization.enabled" : true,

Luis Fernando Pedroza Taborda

Excelente aporte, muchas gracias.

Alfredo Lopez

en que parte activas eso? 😅

Jesus Eduardo Murrieta Rosas

Yo tengo las siguientes extensiones: Prettier (Al guardar te ordena tu código) eslint (me marca sintaxis de error) Editorconfig (llevo mi configuración a cualquier editor) Polacode (captura pedazos de código de una manera hermosa para compartir) Gitlens (un pequeño hover de quien escribió esa linea de código) Indent rainbow (visualmente ves las identaciones) Live server (te levanta una pequeño servidor) SVG (puedes ver y editar SVGs)

Luis Fernando Pedroza Taborda

Muchas gracias, muy util esa informacion.

José Fabián Beltrán Meza

Gracias por compartir.

Luis Fernando Chacha Montenegro

Luego de instalar la extensión ES7 React/Redux/GraphQL/React-Native snippets a mi no me funciona: r n f aparece otro código.

Julian Quiceno

Hola, me pasó lo mismo. He visto que ahora no es rnf sino rnc (react-native-component)

Luis Fernando Chacha Montenegro

Por eso creo que es muy importante que especifiquen técnicamente las versiones exactas con las que fueron desarrollados los cursos y las fechas así uno ya tiene una idea de que no van a funcionar las cosas grabadas en un video hace mucho tiempo

Julián Duque

A quien no le funcione formatear al guardar con Prettier: https://stackoverflow.com/questions/52586965/why-does-prettier-not-format-code-in-vs-code/64273353#64273353

Gerardo Andrés Cabrera Medina

La extension de Prettier Code formatter no me funciona, ya active lo de save.

Lucas Durán

En configuración, en editar settings.json, agrega esta linea: "editor.defaultFormatter": "esbenp.prettier-vscode"

Jesus Velasco

@Lucas Durán Capo!! estaba igual que @Gerardo Andrés Cabrera Medina y me a funcionado, ahora una cosa menos de que preocuparme (me refiero a la estética del código xd)

Jairo Saul Salas Quiñones Pro-Dev | Sci-Tech

Para quienes tengan el autoguardado activado pueden presionar las teclas: " shift + alt + f " Y se aplicará el formateo del documento

O le dan click derecho y aparecerá las opciones donde por el medio aparece: format document y format document with... (para escoger si prettier u otro)

Leonel Fabricio Guerrero Peredo

Justo esta parte se lo saltó el profesor, error ahí Platzi jaja, al tiro

Kenet Andrés Chungandro Montenegro

Samuel Miranda Martínez

Que detalle que en u curso avanzado (para mi) se le dedique el tiempo a esto 💚💚💚

Hector Emanuel Barboza

Hace un año

En 2024, La extension de Prettier Code comunmente ya viene activa en VSC sino hay que verificar en settings. En relación a ES7 React/Redux/GraphQL/React-Native Snippets hay que leer la documentacion de extension que aparece porque se actualiza a mi me funciono con rnc, en vez de rnf.

Jhonntan Andres Castaño Rojas

soy el unico con problemas que rnf no le aparece ?

Hector Emanuel Barboza

Hace un año

Tiene que ser rnc, lee la documentación que te aparece en Visual Studio Code de ES7 React/Redux/GraphQL/React-Native snippets porque se actualiza

Jorge Isaac Villa Lopez

hola profesor, el bracket pair colorizer dice que esta en desuso, lo instalare igual si me permite.

Téllez Natalia

Como se utiliza y se instala Android estudio? También se utiliza para react native?

Sergio Brandon De Lucio Chavero

https://reactnative.dev/docs/environment-setup

Puedes usarlo, pero yo recomiendo usar Expo, ya que nos permite visualizar de manera mas facil, rapida y con menos cantidad de recursos nuestra aplicacion.

Juan Omar Palma álvarez

en el 2023 la extensión Bracket Pair Colorizer viene incluida en vscode

Luis Fernando Chacha Montenegro

Hola Team Platzi. La extensión indicada: Bracket Pair Colorizer está Deprecated. !

Gregson Murcia Castro

Eso de formatear cada vez que guardas me ha cambiado la vida.

Luis Fernando Pedroza Taborda

La verdad es muy util que haga eso. pienso lo mismo.

José Galvis

Hace un año•editado

Usé rnf y rnc, por separado, y en ambos casos obtuve el resultado esperado. Bien ahí con la extensión para React/React Native. Para ello la extensión del archivo para la prueba debe ser .jsx

Ricardo Kid Solsona

Hace 2 años

Estas extensiones en si no son para React , son para programar de modo cómodo con cualquier lenguaje

Israel Calderón

Hace 2 años

Aprecio mucho las recomendaciones pero lo sentí como un poco "no necesario". Quizá sería buena una leyenda como:

Si ya conoces tu ambiente de desarrollo saltate esto

El contenido real del curso comienza en la clase x

etc

Andrés Del Salto

Definir idioma español en vscode "Configure Display Language". Presione "Ctrl+Mayús+P" para que aparezca la instancia de "Paleta de comandos" y empiece a escribir "display" para filtrar y mostrar el comando "Configure Display Language

Enrique Rojas Reyes