세리프 따라잡기

🗣️ cors에 대해 알기 전에, sop에 대해SOP(same origin policy)란, 다른 출처의 리소스를 사용하는 것에 제한하는 보안 방식을 말한다. 출처(origin)가 뭐야?URL의 protocol, host, port를 통해 같은 출처(same origin)인지, 다른 출처(cross origin)인지를 판단할 수 있다.→ protocol, host, port가 다 같아야지 같은 출처, 하나라도 다르다면 다른 출처가 된다. - 故인터넷 익스플로러는?>> 포트로 출처를 판단하지 않아서, 포트가 달라도 같은 출처라고 했답니다~  짤막 문제:  http://localhost와 동일 출처인 url로 옳은 것은? (복수 정답)1. https://localhost2. http://localhost:..

웹 브라우저가 하는 일🗣️ html, css, js를 통해 웹을 그려줌웹 브라우저의 구조user interface: 주소 표시줄, 이전/다음/새로고침 버튼 등 웹 페이지를 제외하고 사용자와 상호작용 하는 사용자 인터페이스.rendering engine: html, css를 파싱하여 요청한 웹 페이지를 표시하는 렌더링 엔진browser engine: 유저 인터페이스와 렌더링 엔진을 연결하는 브라우저 엔진networking: 각종 네트워크 요청을 수행하는 네트워킹 파트ui backend: 체크박스나 버튼과 같은 기본적인 위젯을 그려주는 ui 백엔드 파트data persistence: localstorage나 cookie와 같이 보조 기억장치에 데이터를 저장하는 파트javascript interpreter:..

normalize.css / reset.css 이게 뭐임? 브라우저마다 기본적으로 제공하는 element의 style을 통일시키기 위해 사용하는 css를 말하는데, 대표적으로 normalize, reset 이 두 가지가 있다. 국내에서는 대부분 reset.css를 사용하며, 대표적으로 Naver와 Daum이 사용 해외에서는 효율성을 중시하기 때문에, 반대로 normalize.css를 더 사용한다고 함 그래서 둘은 왜 사용? 브라우저에서 가장 먼저 적용되는 스타일은 user-agent stylesheet, 즉 해당 브라우저에서 제공하는 기본 스타일. 그렇기 때문에 브라우저마다 속성들이 다 다름 (똑같은 태그여도 chrome, safari, edge 등 다 기본 스타일이 다름) 근데 다 다르면 만지기가 힘들..

이미지는 굉장히 무거움 즉, 이미지 크기 및 로딩을 개선하면 말 그대로 웹 성능이 높아짐 - lighthouse로 로딩 성능 및 렌더링 성능을 체크해 볼 수 있음 [다만 네트워크 등의 다른 문제로 점수가 다르게 나올 때가 있다~] webp는 생소한 사람들이 많을 것 같은데, 사진처럼 구글이 출시한 jpg보다 압축률이 더 좋은 이미지 파일 형식 그럼 webp를 쓰는 게 제일 좋겠네? 싶지만~ 문제는 webp를 모든 브라우저에서 지원해주지 않는다. 즉, webp가 생소한 이유는 모든 브라우저에서 지원해주지 않는 파일 형식을 웹 사이트를 구축할 때 덜 고려하기 때문 [당연하다] 그래서, 이미지를 필요한 만큼만 쓰는 게 중요한데 실제로 많이 쓰이는 유용한 3가지로 함축하면 sprite, cdn, lazy-loa..

크롬 작업 표시줄에서의 오류 및 해결 방법! 오류: 선택한 항목이 없습니다. 항목이 이동되었거나 이름이 바뀌었거나 제거된 것 같습니다. 목록에서 이 항목을 제거할까요? 해결 방법: C:\Program Files\Google 폴더에서 chrome 폴더를 복사해서 C:\Program Files (x86)\Google 안에 붙여넣기해보세요! # 참고 사이트

# 탄력적 주소 해제법 (elastic ip) [AWS] Elastic IP(EIP)연결 및 취소 AWS에서 Elastic IP를 설정하는 방법에 대해 알아보자.우선 AWS의 EC2 인스턴의 화면이다.여기서 오른쪽 아래 쯤에 보면 IPv4 퍼블릭 IP 18.217.132.135라고 적혀있는 게 있는데 저게 public IP이다.하지만, 인 velog.io # 인스턴스 삭제법 [AWS] EC2 인스턴스 삭제 111 velog.io

수업 예제 코드 모음 1. - 웹이란: http(HyperText Transfer Protocol)를 이용하는 것 팀 버너스 리 - 최초 웹 개발자 - W3C world wide web consortium 창설 - html 표준을 비롯한 웹 표준안을 제작, 제안하는 일을 하는 국제적인 웹 표준화 단체 발표 연도 1991.10 1995.11 1997.01 1997.12 2014.10 버전 html1 html2 html3 html4 html5 NCSA에서 1993년 모자이크(mosaic)라는 GUI 웹 브라우저 최초 발표 2. - 웹(web): 요청과 응답 과정 - URL: 웹에서 어떤 대상을 구분하는 주소 웹 표준 기술 - html5, css3, javascript CSS(cascading style sh..

html 기초 웹(web)이란? 웹(web) 과 인터넷(internet)은 같은 선상의 개념일까? 아니다. 인터넷은 웹을 포괄하는 큰 원이다. 웹이 인터넷 위에서 동작한다는 것이다. 1960년도 인터넷 발명(도입), 컴퓨터와 컴퓨터를 연결하는 가장 거대한 네트워크로 성장하게 됌 1990년도 웹 발명, 팀 버너스리경: WS(Web server) & WB(Web Browser) 이 두 개가 통신할 때 사용할 프로토콜 http라는 통신 규약 정의, 어떤 정보를 표현할 수 있는 프로그래밍 언어(HTML)를 발명. - public domain: 저작권 행사X server client 을 갑(고객) WS(iis, apache..) WB, WC 운영체제 운영체제 HW(하드웨어) HW : 클라이언트가 요청하면, 서버가..

네이버 searchadvisor.naver.com/ 를 통해 접속 후 아래 표시한 '웹마스터 도구' 클릭 들어가면 아래와 같은 화면이 뜬다. 체크한 곳에 자신이 등록하고 싶은 사이트 주소를 넣는다. 이때 반드시 https로 넣어야 한다!!! 주소를 입력하면 아래와 같이 소유확인 페이지가 나오는데, 여기서 우리는 HTML 태그(회색 박스에 각자의 코드가 있습니다)를 이용하여 인증할 것이기에 체크된 곳을 클릭해준다. 그리고 여기서 소유확인을 바로 누르는 게 아니고, 태그를 복사해서 각자의 티스토리 블로그로 간다. 메뉴를 통해 꾸미기 - 스킨 편집으로 들어간다. 체크한 html 편집을 클릭! 그리고 설명에 써있는 것과 같이 태그 안에 넣어준다. 편한 구분을 위해 meta 태그 밑에다 넣어주자! 그리고 적용 버..

2021.01.14 기준 방법 START! 학생 인증 방법 www.jetbrains.com/ 먼저 사이트에 접속하여 Learning Tools란의 체크 표시한 항목(Discover more)을 누른다. 체크한 곳(Apply now)을 눌러 인증을 하러 가보자. 자신의 학생 메일(id@exam.ac.kr)을 입력하고 제출(APPLY FOR FREE PRODUCTS) 클릭! 제출이 완료되면 자신의 학생 메일로 아래와 같은 인증 이메일이 발송된다. 체크된 곳(follow this link)을 통하면 아래와 같은 화면이 뜬다. 스크롤(or 키보드 End 버튼)한 후 체크 버튼(I Accpet)을 눌러주면 아래와 같은 화면이 뜨는데, 이건 회원가입이 되지 않았기 때문이니(또는 로그인 되어있지 않음) 회원가입을 해..