[CSS] GoormIDE - 동물상 테스트 Codepen 템플릿 오류

문제상황

유튜버 '조코딩' 님의 강의를 토대로 "동물상 테스트" 프로젝트를 만들어보았다.
GoormIDE로 진행하였고, '이미지 업로드'하는 HTML-CSS-JavaScript 템플릿이 필요하여 Codepen 사이트 에서 특정 템플릿을 선택 후 HTML, CSS, JavaScript 에 맞게 프로젝트 내 코드에 붙여넣었다. 

템플릿이 Codepen 사이트 내에서는 이미지가 업로드, 제거가 되는 모습을 확인할 수 있었지만, 프로젝트 내 코드에 붙여넣은 후 Vscode에서 내보낸 미리보기 페이지에서는 이미지 업로드에도 아무 반응 없는 것을 확인할 수 있었다.

해결과정

 Alt + Shift + P (정렬 단축키) 로 HTML 포맷팅 정렬을 하였지만 <script...> </script>의 형식이

<script
...
...
></script>처럼 적용되는 것을 보고 직접 들여쓰기를 하여 코드를 재 작성하였다. - 형식 오류

그 결과 이미지 업로드가 미리보기 페이지에서도 가능해졌고, 오류가 해결되었다.

---

 Alt + Shift + P (정렬 단축키) 기능은 편리하지만 무작정 믿기엔 무리가있었고, 코드를 직접 보고 고칠 수 있는 능력이 필요함을 느낄 수 있었다.

---

참고 : '조코딩' 유튜브 - https://youtu.be/OI3fZJHQF8