https://github.com/abrahamgalue/image-gallery

Galería de Imágenes hecha con Next.js, Typescript, TailwindCSS, Zod y Plaiceholder.
https://github.com/abrahamgalue/image-gallery

nextjs plaiceholder tailwindcss typescript zod

Last synced: about 1 month ago
JSON representation

Galería de Imágenes hecha con Next.js, Typescript, TailwindCSS, Zod y Plaiceholder.

• Host: GitHub
• URL: https://github.com/abrahamgalue/image-gallery
• Owner: abrahamgalue
• Created: 2023-09-20T20:02:32.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-08-17T00:33:07.000Z (4 months ago)
• Last Synced: 2024-08-17T01:48:09.106Z (4 months ago)
• Topics: nextjs, plaiceholder, tailwindcss, typescript, zod
• Language: TypeScript
• Homepage: https://image-gallery-abraham.vercel.app/
• Size: 1.6 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


  

#  🔺 Next.js - Image Gallery




### Galería de imágenes.

> 🧩 Aquí puedes ver su [**Live Demo.**](https://image-gallery-abraham.vercel.app/)

![vista-previa](public/preview/01-page-preview.jpg)

## 🚀 Descripción

Este proyecto permite buscar dentro de una galería de imágenes.

Y renderiza las imágenes a traves de la **API** de **Pexels**.

## 🎭 Tecnologías

El proyecto utiliza las siguientes tecnologías:

- **Zod** para validar con TypeScript.

- **Envalid** para acceder a variables de entorno en Node.js.

- **TailwindCSS** para crear una [**Masonry grid layout**](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_grid_layout/Masonry_layout), al mostrar las imágenes de búsquedas con solo **CSS** **sin utilizar JavaScript.**