내 이미지를 페이지의 기본 디스플레이에 표시하려면 어떻게 해야 합니까?

Question

제가 하고 싶은 일은 NASA API를 사용하여 사진 몇 장을 받는 것입니다. 이 사진은 내 페이지의 썸네일과 메인 디스플레이에 표시됩니다.

코드가 썸네일에서 이미지를 가져와서 페이지에 표시하지 못하는 이유를 방금 알아냈습니다. HTML5 이상의 템플릿 웹사이트도 사용합니다. 나는 코드에 익숙하지 않습니다. 어떤 도움이라도 대단히 감사하겠습니다.

그래서 사이트가 작동하는 방식은 이미지 src 및 태그 href 값을 사용하여 썸네일과 기본 디스플레이에 표시하는 것입니다. NASA API 정보를 얻기 위해 가져오기 요청을 사용하고 있습니다. 그런 다음 data.map 메서드를 사용하여 HTML 코드를 덮어쓰고 나만의 HTML을 삽입합니다.

제 생각에는 get 요청에서 이전 HTML을 HTML로 덮어쓰면 제대로 작동할 것이라는 생각입니다. 그러나 그것은 진실이 아니다.

전체 사이트를 실시간으로 볼 수 있는 리플릿 링크도 첨부되어 있습니다: https://replit.com/@jamesYamez/nasa-api#nasa-api-site/index.html

제 생각에 가장 큰 실수는

잡히지 않은 유형 오류: newSlide가 정의되지 않았습니다

으으으으

Answer 1

이 코드를 시도해 볼 수 있지만 CSS/스타일은 이미지 크기를 완전히 조정해야 합니다

으아악

편집: 모달을 사용하여 같은 페이지에서 이미지 열기

으아악