3-4) 이미지 사이즈 최적화 과정에서 img 태그 작동 안되는 문제

안녕하세요, 키키님이미지 에러에 대해서 질문을 주셨는데요제가 확인해보니, picture, source 태그에서의 이미지 폴백은 type 값을 기준으로 처리됩니다.즉, type 값을 기준으로 먼저 어떤 이미지(source)를 렌더링할 지 판단하고 해당 이미지를 표시합니다.따라서 type="image/webp"라면 이미지 주소에 에러가 있든 없든 srcset의 이미지를 렌더링 합니다.이때 이미지에 에러가 발생하면 그냥 엑박을 보여주고 (사진) 태그의 onerror(onError) 이벤트가 발생하는 식입니다.제 강의에서는 srcset 에 "s"를 붙여주는 것 뿐만 아니라 type 또한 이상한 값으로 바꿔줬기 때문에 지원하지 않는 이미지 타입으로 판단하여 (사진) 태그의 이미지를 보여준 것입니다.(즉, source 태그의 폴백은 srcset 값의 에러 유무와는 무관합니다.)결론적으로 직접 해보실 때, type값을 이상한 값으로 변경해서 테스트 해보시길 바랍니다.강의에서 설명이 부족한 부분으로 혼란을 드려 죄송합니다. ㅠ답변이 도움되셨길 바라며, 강의에 관심을 가져주셔서 감사합니다. :)

Material--icons_4.0.0.woff2

안녕하세요, lab ajung 님.말씀하신 Material--icons_4.0.0.woff2의 출처가 어디일까요?찾아봤지만, Material icons 에서 저런 형태로 제공하는건 못찾겠네요.(https://github.com/google/material-design-icons/tree/master/font)우선 아이콘을 쓸 때 폰트로는 거의 사용해보지 않아서 잘은 모르겠지만,공식 가이드에서 어떻게 최적화를 할 수 있는지를 찾아보시면 좋을 것 같습니다.깃허브 이슈라던가 찾아보시면 있지 않을까 생각됩니다.제가 만약 최적화를 한다면,필요한 아이콘만 추출(subset)하여 사용가능하다면 폰트형태가 아닌 svg형태로 아예 필요한 것만 사용하는 형태로 변경preload 적용 이 정도 고려해볼 수 있지 않을까 생각됩니다.그럼 도움이 되셨길 바라며, 강의에 관심을 가져주셔서 감사합니다! :)

이미지 CDN 만드는 방법

안녕하세요, 선대범님. 이 강의에서는 이미지 CDN을 만드는 벙벚에 대해서는 따로 다루지 않습니다 ㅠ다른 강의를 찾아보시거나 블로그 글을 찾아보시면 도움이 되실 것 같습니다.

코드 실행 시 에러 관련 질문드립니다!!

안녕하세요, 지원님.다음과 동일한 이슈로 보입니다.https://www.inflearn.com/questions/735601/node-version%EC%9C%BC%EB%A1%9C-%EC%9D%B8%ED%95%9C-%EC%98%A4%EB%A5%98

npm run serve가 동작하지 않아요

안녕하세요, Stella님다음 에러 메시지릉 봤을 때, 이미 5000번 포트가 사용 중이라 문제가 되는거 같습니다.Error: listen EADDRINUSE: address already in use :::5000해결 방법으로는,5000번에서 돌고있는 서버를 종료하기 (검색을 해보시면 특정 포트로 돌고있는 서비스의 PID를 알아내서 강제로 종료하는 명령어가 있습니다.)아니면, server.js 코드 중에 port라는 값을 5000이 아니라 5001 또는 그 외 중복되지 않는 숫자로 변경하기위 방법으로 해결되지 않는다면 다시 알려주시기 바랍니다.그럼 답변이 도움되셨길 바라며, 강의에 관심을 가져주셔서 감사합니다. :)