Está en la página 1de 2

II Crear Componentes

CADA COMPONENTE ES UNA PARTE O ELEMENTO DE UNA


PAGINA WEB

PRIMERO EN SRC CREAMOS UNA NUEVA CARPETA LLAMADA

components

DENTRO DE ESTA CARPETA CREAMOS LOS COMPONENTES


QUE CREAMOS NECESARIOS CON LA EXTENSION JSX

COMO POR EJEMPLO

Parrafo.jsx

ABRE EL ARCHIVO Y ESCRICE

rafce

ESTO CREARA TODA LA ESTRUCTURA DEL COMPONENTE


COMO ESTA

import React from 'react'

const Parrafo = () => {


return (
<div>

</div>
)
}

export default Parrafo

ESTA ESTRUCTURA IMPORTA REACT

CREA UNA FUNCION DE FLECHA QUE RETORNA TODO LO


QUE SE ENCUENTRE DENTRO DEL DIV

LUEGO ABRE EL

App.js

E IMPORTA EL COMPONENTE CREADO

import Parrafo from './components/parrafo';

LUEGO LO AGREGAMOS DENTRO DEL DIV

<Parrafo />

QUEDANDO FINALMENTE ASI

import React from 'react';


import Parrafo from './components/Parrafo';

function App() {
return (
<div>
<h1>Hola!</h1>
<Parrafo />
</div>
);
}

export default App;

CON ESTO QUEDA FUNCIONANDO EL NUEVO COMPONENTE


Y CARGANDOSE EN EL APP.JS

También podría gustarte