مشكلة الصور في تطبيق باستخدام next.js

السلام عليكم ,

لقد قمت بمراجة الكود الخاص بك و وجدت الخطأ في التالي :
 

//في ملف الprojects 
export const projects = [
  {
    title: "Notes App",
    description:
      "this app can helping you to seve your notes or and save it on browser local storage .",
    image: "/images/noteapp.PNG",
    // لاحظ استعمال PNG 
    // و هو ليس بالأمر الصحيح 
    // يجب استعمال .png
    
    tags: ["HTML", "CSS", "JavaSctipt", "React"],
    source: "https://github.com/ahmedzehry55/notesApp",
    visit: "https://ahmedzehry55.github.io/notesApp/",
    id: 0,
  },
  {
    title: "Baba abdo restaurant menu",
    description: "this design is about restaurant menu ",
    image: "/babaabdoRest.PNG",
    tags: ["HTML", "CSS", "JavaSctipt", "React"],
    source: "https://github.com/ahmedzehry55/babaAbdo",
    visit: "https://ahmedzehry55.github.io/babaAbdo/",
    id: 1,
  },

الخطأ كان في استعمال .PNG و ليس .png 
حيث يجب مراعاة الدقة أن تكون بنفس صيغة الملفات الموجودة ف الpublic بالضبط

مثال على ذلك مقتبس من الاستضافة الخاصة بك :
هذة صورة لمشروع من المشاريع مستعملا PNG
 

https://az-portpholio.vercel.app/_next/image?url=%2Fnoteapp.PNG&w=640&q=75
لاحظ أنها لن تعمل 


مثال على نفس الصورة باستعمال .png 
https://az-portpholio.vercel.app/_next/image?url=%2Fnoteapp.png&w=640&q=75

لاحظ انها تعمل جيدا

بتاريخ 6 ساعة قال Ahmed Elmrsawy:

السلام عليكم ,

لقد قمت بمراجة الكود الخاص بك و وجدت الخطأ في التالي :
 

//في ملف الprojects 
export const projects = [
  {
    title: "Notes App",
    description:
      "this app can helping you to seve your notes or and save it on browser local storage .",
    image: "/images/noteapp.PNG",
    // لاحظ استعمال PNG 
    // و هو ليس بالأمر الصحيح 
    // يجب استعمال .png
    
    tags: ["HTML", "CSS", "JavaSctipt", "React"],
    source: "https://github.com/ahmedzehry55/notesApp",
    visit: "https://ahmedzehry55.github.io/notesApp/",
    id: 0,
  },
  {
    title: "Baba abdo restaurant menu",
    description: "this design is about restaurant menu ",
    image: "/babaabdoRest.PNG",
    tags: ["HTML", "CSS", "JavaSctipt", "React"],
    source: "https://github.com/ahmedzehry55/babaAbdo",
    visit: "https://ahmedzehry55.github.io/babaAbdo/",
    id: 1,
  },

 

الخطأ كان في استعمال .PNG و ليس .png 
حيث يجب مراعاة الدقة أن تكون بنفس صيغة الملفات الموجودة ف الpublic بالضبط

مثال على ذلك مقتبس من الاستضافة الخاصة بك :
هذة صورة لمشروع من المشاريع مستعملا PNG
 

https://az-portpholio.vercel.app/_next/image?url=%2Fnoteapp.PNG&w=640&q=75
لاحظ أنها لن تعمل 


مثال على نفس الصورة باستعمال .png 
https://az-portpholio.vercel.app/_next/image?url=%2Fnoteapp.png&w=640&q=75

لاحظ انها تعمل جيدا

شكرا لك على مساعدتك  

بتاريخ 8 ساعة قال Ahmed Zehry:

شكرا لك على مساعدتك  

العفو