ეს არის Photo/page.js
"use client";
import { useState, useEffect } from "react";
import Image from "next/image";
import Link from "next/link";
import './photos.css'

export default function Gallery() {
  const [images, setImages] = useState([]);

  useEffect(() => {
    const fetchImages = async () => {
      const res = await fetch("https://picsum.photos/v2/list?page=1&limit=9");
      const data = await res.json();
      console.log(data)
      setImages(data);
    };
    fetchImages();
  }, []);

  return (
    <>
      <div className="rows">
        {images.map((img) => (
          <div className="gallery" key={img.id}>
            <Link target="_blank" href={`https://picsum.photos/id/${img.id}/600/400`}>
              <Image
                src={`https://picsum.photos/id/${img.id}/300/150`}
                alt={img.author}
                width={300}
                height={150}
                className="rounded-lg object-cover"
                priority
              />
            </Link>
            <div className="desc">{img.author}</div>
          </div>
        ))}
      </div>
    </>
  );
}
    

    ეს არის next.config.js
/** @type {import('next').NextConfig} */
const nextConfig = {
  images: {
    domains: ['picsum.photos'],
  },
};

export default nextConfig;