logotipo de React

Presentaremos cómo añadir un logo en la aplicación React.

Añadir un logo en React

Hoy en día, cada sitio web tiene su logo y imágenes.

Cuando creamos una aplicación React, primero queremos cambiar el logotipo, y a algunas personas les resulta difícil mostrar la imagen en una aplicación React. Discutiremos cómo mostrar su logotipo en una aplicación React con un código simple.

En primer lugar, guardaremos nuestro logo en la carpeta src. Una vez hayamos guardado nuestro logo, ahora lo importaremos dentro del archivo que queramos mostrarlo.

Utilice el siguiente código para importar el logo.

# react 
import logo from './logo.svg';

Una vez que hayamos importado nuestro logo dentro de la página donde queremos mostrarlo, crearemos una vista para él.

# react
<img src={logo} className="App-logo" alt="logo">

En el código proporcionado, podemos ver que en el atributo src, estamos llamando a una variable {logo}. Esta variable generará la URL del logotipo que importamos.

Escribiremos el código CSS para cambiar el tamaño del logotipo según nuestras necesidades.

# react
.App-logo{
    width: 150px;
}

Veamos nuestro logotipo.

Producción:

Ahora hemos aprendido cómo mostrar fácilmente nuestras imágenes o logotipos en la aplicación React.