Cómo crear un contexto en una aplicación Next.js con React

Cómo crear un contexto en una aplicación Next.js con React

Tiempo de lectura: 3 minutos En este tutorial, aprenderás cómo crear un contexto de tema que abarque toda tu aplicación Next.js utilizando React. Este contexto de tema te permitirá cambiar dinámicamente entre diferentes temas en tu aplicación, como temas claro y oscuro. Paso 1: Configuración inicial Asegúrate de tener instalado Node.js en tu sistema. Luego, puedes crear un nuevo proyecto … Leer más

Arquitectura de carpetas de un proyecto React con Next.js

Arquitectura de carpetas de un proyecto React con Next.js

Tiempo de lectura: 2 minutos Hoy os voy a compartir una estructura de carpetas que podéis utilizar para organizar vuestro proyecto React con Next.js. Cuando trabajas con React y Next.js, es común organizar tu proyecto en varias carpetas para mantener una estructura limpia y fácil de entender. Aquí hay una estructura de carpetas típica que se puede utilizar: Estas son … Leer más

Docker compose para desplegar React con Next.js en producción con Nginx + Next.js

Docker compose para desplegar React con Next.js en producción con Nginx + Next.js

Tiempo de lectura: < 1 minuto Hoy os voy a compartir una configuración Docker Compose muy necesaria y que os permitirá en pocos minutos desplegar una web completamente funcional usando Nginx y React con Next.js Lo primero que tenéis que hacer es crear el archivo docker-compose.yml Ahora vamos a crear un Dockerfile: Ahora creamos las carpetas config/nginx y añadimos el fichero … Leer más

Docker compose para React con Next.js en modo desarrollo

Docker compose para React con Next.js en modo desarrollo

Tiempo de lectura: < 1 minuto Hoy os traigo un Docker Compose preparado para poder ejecutar vuestra aplicación React con Next.js en modo desarrollo. Lo primero que tenéis que hacer es crear este archivo docker-compose.yml Ahora creáis este archivo Dockerfile Finalmente teneis que tener estos archivos dentro de vuestro proyecto, quedando asi la estructura de carpetas: Para ejecutarlo debes poner:

Crear build con React y Next.js

Crear build con React y Next.js

Tiempo de lectura: < 1 minuto Hoy vamos a aprender cómo podemos crear un build (con la carpeta) con React Next.js. Lo primero que tenemos que hacer es ir al archivo next.config.mjs que tiene por defecto: Lo cambiaremos por: Y ahora cuando invoquemos el comando de generar build: Nos generará la carpeta /build con el contenido de la web.

Crear anuncio Admob Interstitial en Android

Crear anuncio Admob Interstitial en Android

Tiempo de lectura: 2 minutos Hoy vamos a aprender cómo podemos implementar un anuncio Interstitial en Android con Java. Primero implementaremos en nuestro build.gradle: Después tenemos que inicializar los anuncios en nuestro MainActivity: Y añadimos en el manifest (debajo de </application>) Y también dentro de <application> </application> Cambia TU_ID_APLICACION_ADMOB por el id de tu APP de Admob. Ahora vamos a … Leer más

Crear anuncio Admob rewarded recompensado en Android

Crear anuncio Admob rewarded recompensado en Android

Tiempo de lectura: 2 minutos Hoy vamos a aprender cómo podemos añadir un anuncio Admob recompensado en Android con Java. Primero implementaremos en nuestro build.gradle: Después tenemos que inicializar los anuncios en nuestro MainActivity: Y añadimos en el manifest (debajo de </application>) Y también dentro de <application> </application> Cambia TU_ID_APLICACION_ADMOB por el id de tu APP de Admob. Ahora vamos … Leer más

Crear anuncio de carga de aplicación con Admob en Android

Crear anuncio de carga de aplicación con Admob en Android

Tiempo de lectura: 3 minutos Hoy vamos a aprender a crear un anuncio de carga de aplicación con Admob en Android. Primero implementaremos en nuestro build.gradle: Después tenemos que inicializar los anuncios en nuestro MainActivity: Y añadimos en el manifest (debajo de </application>) Y también dentro de <application> </application> Cambia TU_ID_APLICACION_ADMOB por el id de tu APP de Admob. Ahora … Leer más

Como desplegar React con Next.js en un servidor NGINX

Como desplegar React con Next.js en un servidor NGINX

Tiempo de lectura: 2 minutos Para desplegar la web que hemos creado con React y Next.js vamos a seguir estos pasos: Asegúrate de reemplazar tu-domino.com con tu dominio real y /ruta/a/tu/aplicacion/build con la ruta real de la carpeta build de tu aplicación Next.js. Es importante tener en cuenta que Nginx solo se encargará de servir los archivos estáticos generados por … Leer más

Crear un proyecto con React y Next.js

Crear un proyecto con React y Next.js

Tiempo de lectura: 2 minutos Hoy vamos a aprender cómo crear un proyecto React con Next.js y ejecutarlo. Lo primero que vamos a hacer es crear un nuevo proyecto con este comando: Ahora preguntará sobre la configuración. Yo he elegido y recomiendo esta: Usar TypeScript ya que nos va a permitir utilizar tipado en JavaScript, nos solucionará y agilizará el … Leer más