본문 바로가기

면접준비

 (22)
HTML 의 inline 요소와 block 요소의 차이점을 설명해주세요. 예시도 들어주세요 블럭요소(block element)와 인라인요소(inline element)란? - 블럭요소 : 하나의 태그가 브라우저에서 좌우공간을 다 차지하면서 독립적인 덩어리 공간을 가지는 요소들입니다. - 인라인요소 : 하나의 태그가 브라우저에서 실제로 코딩된 그 영역만 차지하여 좌우로 다른 태그가 나란히 위치할 수 있는 요소들입니다. 행 안의 일부분이라고 보시면 됩니다. 텍스트레벨요소라고도 합니다. 블럭요소(block element)와 인라인요소(inline element)의 종류 - 블럭요소 : ,,~,,,,,,,,,,등 - 인라인요소 : ,, ,,,,, 인라인(Inline) 요소: 인라인 요소는 문장이나 단락의 일부분을 나타냅니다. 인라인 요소는 콘텐츠 흐름을 방해하지 않고 가로 방향으로 배치됩니다. 너비와..
Redux 상태관리의 주요 개념들과 연결 관계를 설명해주세요. 다른 상태관리 도구와 비교 설명 해주세요 Redux란? javascrpit의 상태관리 라이브러리 Redux의 주요 개념으로는 Action, Dispatch, Reducer, Store가 있으며, Action → Dispatch → Reducer → Store 순서로 데이터가 단방향으로 흐르게 됩니다. Action은 말 그대로 어떤 액션을 취할 것인지 정의해 놓은 객체입니다. 해당 Action 객체가 어떤 동작을 하는지 명시해주는 type 속성을 가집니다. Dispatch는 Reducer로 Action을 전달해주는 함수입니다. Dispatch의 전달인자로 Action 객체가 전달되며. Action 객체를 전달받은 Dispatch 함수는 Reducer를 호출합니다. Reducer는 Dispatch에게서 전달받은 Action 객체의 type 값에 따..
Semantic HTML의 필요성을 예시를 들어 설명해주세요. Semantic HTML은 웹 콘텐츠의 구조와 의미를 명확하게 표현하기 위해 사용하는 것으로, 웹 콘텐츠의 구조와 의미를 명확하게 표현하기 위해 사용하는 HTML 코드입니다. 의미론적 요소를 사용하여 웹 페이지의 구조화를 개선하고 가독성 및 웹 접근성을 높이는 것이 주 목적입니다. 웹 접근성 향상: 시각 장애인이 스크린 리더를 사용하여 웹사이트 정보를 이해할 수 있도록 돕습니다. 예를 들어, 예시 웹사이트 홈 소개 서비스 문의하기 서비스 소개 여기에서 서비스에 대한 소개를 확인할 수 있습니다. 저작권 ⓒ 예시 웹사이트. 질문: 와 의 용도와 차이점은 무엇인가요? 답변: 는 웹페이지 상단에 위치하며, 웹사이트의 로고, 제목, 메뉴 등 주요 정보를 담고 있습니다. 는 웹페이지 하단에 위치하며, 저작권 정보,..
<li>요소는 왜 <ul>요소의 자식 요소여야만 하나요? 의미론적 구조: HTML에서는 의미론적(semantic) 구조를 사용하여 웹 문서의 내용을 조직화합니다. (unordered list) 요소는 목록을 나타내며, (list item) 요소는 개별 목록 항목을 나타냅니다. 이 구조를 따르므로써 웹 브라우저와 검색 엔진, 스크린 리더 등의 다양한 도구가 웹 문서의 내용을 제대로 이해하고 처리할 수 있습니다. 기본 스타일 처리: 웹 브라우저는 과 요소의 기본 스타일을 처리합니다. 이를 통해 사용자들은 눈에 띄게 구분되는 목록과 항목의 스타일을 볼 수 있습니다. 요소가 아래에 있지 않으면 기본 스타일 처리가 제대로 되지 않습니다. 코드의 일관성: 요소를 이나 (ordered list) 요소의 자식 요소로 사용함으로써 HTML 코드의 일관성과 가독성을 유지할 수 ..
응집도 결합도 응집도는 하나의 모듈이나 클래스 내에서 관련 요소들이 얼마나 밀하게 연관되어 있는지를 나타냅니다. 높은 응집도를 갖는 모듈이나 클래스는 한 가지 목적이나 기능을 갖고, 관련된 작업과 데이터를 포함합니다. 응집도가 높을수록 코드 유지보수와 확장성이 좋아집니다. 결합도는 서로 다른 모듈이나 클래스 간에 얼마나 많이 의존하고 있는지를 나타냅니다. 낮은 결합도를 갖는 소프트웨어는 각 모듈이나 클래스가 독립적으로 존재하고, 가능한 한 서로에게 영향을 미치지 않습니다. 결합도가 낮을수록 개발이 쉬워지고, 유지보수와 변경에 수월해집니다. 결론적으로, 좋은 소프트웨어 설계는 높은 응집도와 낮은 결합도를 추구합니다. 이렇게 하면 쉽게 유지보수할 수 있으며, 확장성과 유연성이 향상됩니다.
React의 state와 props에 대해서 설명 props와 state는 리액트에서 다루는 데이터의 개념입니다. 쉽게 말하자면, props는 받은 데이터 이거나 생성된 데이터, 즉 데이터의 기원이 자기 자신이 아닌 것이고, state는 자기자신의 컴포넌트에서 만들어낸 데이터 입니다. 어떤 컴포넌트 기준에서 얘기하는지에 따라서 같은 데이터를 얘기하고 있을지라도 state가 될 수 있고 props가 될 수 있습니다. State: 컴포넌트 내에서 관리되는 상태 값을 의미하며, 변경되면 컴포넌트가 재렌더링됩니다. 주로 동적인 데이터를 처리할 때 사용합니다. Props: 부모 컴포넌트로부터 자식 컴포넌트로 데이터를 전달하는 데 사용되는 매개변수입니다. 자식 컴포넌트는 부모로부터 전달받은 props를 변경할 수 없으며 변경이 필요한 경우 부모에게 요청해야 합니다..
순수함수란 무엇인가요? 불변성과 사이드 이펙트와 연결하여 설명 순수함수 입력에 대한 출력이 항상 동일하다: 같은 인자를 전달할 경우, 항상 동일한 결과 값을 반환합니다. 사이드 이펙트가 없다: 함수가 받은 인자 외부에 존재하는 데이터를 변경하지 않고, 함수를 실행하는 동안 발생한 변경이 전역적인 상태에 영향을 주지 않습니다. 불변성 (Immutability) 불변성은 데이터가 한 번 생성되면 수정할 수 없는 특성을 말합니다. React에서 불변성을 유지하는 것은 중요한 이유는 상태 변경을 감지하고 최적화된 렌더링을 위해 반영할 때 도움이 됩니다. 불변성을 유지하면 얕은 비교를 통해 쉽게 데이터 변경을 감지할 수 있기 때문입니다. 불변성을 지키기 위해 주로 spread 연산자, Object.assign, 배열의 concat, 배열의 slice, 문자열의 slice 등..
Cookie의 MaxAge, Expires 옵션이 무엇인지, 설정하지 않으면 어떻게 되는지 설명해주세요. Max-Age와 Expires 옵션은 웹 쿠키에서 쿠키의 생명 주기를 제어하는 데 사용되는 속성입니다. Max-Age: 쿠키의 최대 나이를 정의하며, 이 기간이 지나면 클라이언트(브라우저)에서 쿠키가 삭제됩니다. Max-Age는 초 단위로 설정하며, 예를 들어, Max-Age=3600은 쿠키가 생성된 시점부터 1시간 뒤에 만료되도록 설정합니다. Expires: 쿠키의 만료 날짜를 정의합니다. 이 속성에 설정된 날짜와 시간이 지나면 쿠키가 삭제됩니다. Expires는 특정 날짜와 시간을 사용하여 설정합니다 (예: Expires=Thu, 01 Jan 2030 00:00:10 GMT). Max-Age와 Expires 옵션을 모두 설정하지 않으면 쿠키는 세션 쿠키로 간주되고, 사용자가 브라우저를 닫을 때 자동으..

티스토리툴바