콘요맘떼 개발일지

1. Semantic VS Non-Sematic : Content에 의미 부여하는가? (1) Semantic Tag (시멘틱 태그) - 자신이 무엇을 표현하는지 브라우저와 개발자에게 명확하게 설명해준다. - 개발자의 측면 : 웹 페이지의 구조를 보다 쉽게 파악할 수 있다. - 검색엔진의 측면 : 검색엔진은 봇을 통해 웹페이지들을 크롤링한다. 이 봇들은 시멘틱 태그에 담긴 요소들을 중요한 텍스트로 바라보기 때문에 검색어와 시멘틱 태그 컨텐츠가 잘 매칭되는 페이지를 우선으로 보여준다. 따라서 시멘틱 태그를 활용하면 검색엔진 최적화(SEO)를 달성할 수 있다. - 시멘틱 태그의 예시 : , , , , , , , , , ... ※ 태그와 태그의 차이점 section은 chapter, header, footer ..

HTML (Hyper Text Markup Language) 웹페이지가 어떻게 구조화되었는지 브라우저가 알 수 있게 해주는 마크업 언어이다. 웹 컨텐츠에 부가적 기능을 부여하는 CSS 혹은 Javascript와 달리 HTML은 웹 컨텐츠의 의미와 구조를 부여한다. 따라서 HTML 없이는 웹 페이지를 구성할 수 없다. → 한 마디로 웹 컨텐츠가 화면에 표시되는 형식을 정의하는 언어 ※ 마크업 언어 일반적 텍스트와 구별하기 위해 일반적 텍스트에 주석·태그 등을 붙인 것 HTML Element (HTML 요소) - HTML Element는 태그들과 그 사이의 Content로 구성되어 있다. - 태크는 여는 태그(Opening Tag, Start Tag)와 닫는 태그(Closing Tag, End Tag)가 있..

면접관련 포스트들은 구글링한 다른 블로그들의 내용들과 교내 강의를 수강하면서 학습했던 내용을 합쳐서 정리하였습니다. 프론트엔드 면접과 관련된 공부 내용들은 해당 포스트에 지속적으로 추가될 예정입니다. 1. 브라우저 렌더링에 대해 설명하기 - 렌더링은 html, css, javascript 등 개발자가 작성한 문서를 브라우저에서 그래픽 형태로 출력하는 것을 말한다. - 구체적인 브라우저 렌더링 과정은 다음과 같다. 1) 브라우저 주소창에 사이트 주소를 입력한다. 2) 네임서버(DNS : Domain Name Server)가 입력된 도메인 주소에 해당하는 IP 주소를 연결시켜준다. 3) 서버로부터 수신된 html파일과 css파일을 파싱하면서 각각 DOM 트리와 CSSOM 트리를 형성해준다. (정확히는 htm..

컴퓨터구조 (Computer Architecture) 3. 캐시 메모리 - 속도가 빠른 장치와 느린 장치 사이 병목 현상을 줄이기 위한 메모리 ex) CPU-메인메모리 사이 병목현상 (CPU 클럭 속도 상승으로 인해 둘 간의 속도 차이 커짐) ex) 웹브라우저에서 캐시 파일은 HDD-웹페이지 사이 병목현상 완화 - CPU가 메인메모리에 저장된 데이터 읽어올 때 자주 사용되는 데이터를 캐시 메모리에 저장하여 사용하면 속도 향상됨 - 속도는 빠르지만 용량 작고 비쌈 - 일반적으로 캐시 메모리는 2~3개 사용 (L1, L2, L3 캐시라고 부르며 왼쪽일수록 용량이 작고 빠르다. 이전 캐시에서 못 찾으면 다음 캐시에 접근하는 방식) - 캐시메모리는 CPU 내부(L1), CPU-RAM 사이(L2), 메인보드(L3..

컴퓨터구조 (Computer Architecture) 1. 컴퓨터의 구성 컴퓨터는 크게 하드웨어 + 소프트웨어로 구성된다. • 하드웨어 (Hardware) - 컴퓨터를 구성하는 물리적 기계장치 - CPU, 기억장치, 입출력장치로 구성 • 소프트웨어 (Software) - 하드웨어 동작을 지시, 제어하는 명령어 집합 - 크게 시스템 소프트웨어와 응용 소프트웨어로 나뉨 하드웨어 : 하드웨어는 CPU, 기억장치, 입출력 장치로 구성되며 시스템 버스가 물리적으로 이들을 연결해준다. (1) CPU (중앙처리장치, Central Processing Unit) - 컴퓨터의 두뇌에 해당 - 입력받은 명령어를 해석, 실행한 후 그 결과를 출력 - 일반적으로 PC에서 CPU를 마이크로 프로세서라고 부름 (따라서 거의 같은..