<목차>
- CORS 오류가 나는 이유
- favicon
- babel과 같은 트랜스파일러의 역할
10. CORS 오류가 나는 이유
- Cross-Origin Resource Sharing
- 웹페이지가 다른 도메인의 리소스에 접근하려 할 때 발생
- 웹페이지가 다른 인터넷 주소의 정보를 가져오려 할 때 발생하는 문제
- 보안을 위해 정보를 제한한다.
- "동일 출처 정책"
- 다른 주소의 정보를 안전하게 가져올 수 있도록 서버 설정이 필요하다.
- 서버에서 허용을 해준다면 문제 해결
Q. CORS 오류가 나는 이유에 대해 알고 계신가요?
=> CORS란 Cross-Origin Resource Sharing의 줄임말입니다. 웹페이지가 다른 인터넷 주소의 정보를 가져오려 할 때 발생하는 문제입니다. 일반적인 브라우저는 a 웹페이지가 b 웹페이지의 정보를 가져오려하면 보안을 위해 정보를 제한합니다. 이는 동일 출처 정책이라고 불립니다. 이러한 오류는 다른 주소의 정보를 안전하게 가져올 수 있도록 서버 설정이 필요합니다. b웹페이지 서버에서 허용을 해준다면 문제가 해결됩니다.
11. favicon
- Favorites Icon의 줄임말
- 웹사이트를 대표하는 작은 아이콘
- 보통 웹 브라우저의 탭, 주소창, 북마크 리스트 등에 표시 되어 웹사이트 식별에 도움
- 사용자 경험 향상
- .ico 형식 외에도 현재는 ,png, .gif, .svg 형식도 사용된다.
- 보통 16x16, 32x32, 48x,48 픽셀의 크기로 만들어진다.
Q. favicon이 무엇인지 알고 계신가요?
=> favicon(파비콘) 이란 Favorites Icon의 줄임말입니다. 웹브라우저의 탭을 보시면 간단하게 파비콘을 발견할 수 있습니다. 파비콘은 웹사이트를 대표하는 작은 아이콘으로 보통 웹 브라우저의 탭, 주소창, 북마크리스트 등에 표시되어 웹사이트 식별에 도움을 줍니다. 이러한 도움은 사용자 경험 향상에 도움이 됩니다. 이전에는 작은 픽셀, 예를 들어 16x16등 으로 이루어진 .ico형식이 사용되었지만 최근에는 다양한 크기와 다양한 형식으로도 사용되고 있습니다.
12. babel과 같은 트랜스파일러의 역할
- 트랜스 파일러 : 한 프로그래밍 언어로 작성된 코드를 다른 언어로 변환하는 도구
- babel 같은 트랜스 파일러 : 최신 자바스크립트(es6이상) 코드를 오래된 자바스크립트 버전 으로 변환하는데 사용
- 새로운 언어 기능을 사용하지만 구형 브라우저에서도 코드가 실행될 수 있다.
- ex) es6 화살표 함수 -> es5의 일반 함수로 변경
- 트랜스파일러를 사용하면 최신 프로그래밍 언어의 기능을 활용할 수 있다.
- 코드를 최신 프로그래밍 언어의 기능을 통해 더 효율적으로 만들거나 간소화 할 수 있다.
- 성능개선, 로딩시간 단축
- 디버깅 과정 간소화
- 다양한 환경에서 호환성 유지
Q. babel과 같은 트랜스파일러의 역할을 설명해주세요.
=> 트랜스파일러는 한 프로그래밍 언어로 작성된 코드를 다른 언어로 변환하는 도구입니다. bable(바벨)과 같은 트랜스파일러는 최신 자바스크립트 코드를 오래된 자바스크립트 버전으로 변환하는데 사용됩니다. 개발자가 새로운 언어 기능을 사용하면서도 다양한 환경에서 호환성을 유지할 수 있도록 도와줍니다. 예를들어 es6의 화살표 함수를 사용했을 때 트랜스파일러를 통해 es5의 일반 함수로 변환 가능합니다. 트랜스 파일러를 사용하면 최신 프로그래밍 언어의 기능을 통해 코드를 더 효율적으로 만들거나 간소화 할 수 있으며 이는 성능개선과 로딩시간 단축으로 연결 될 수 있습니다.
