728x90 반응형 분류 전체보기146 가로 스크롤(overflow-x-auto)이 생기지 않는다면? 가로로 긴 테이블이나 콘텐츠를 표시할 때, over-x-auto를 사용하면 스크롤이 자동으로 생기도록 할 수 있습니다.그런데 막상 overflow-x-auto를 적용해도 가로 스크롤이 생기지 않는 경우가 있습니다!이 문제는 보통 부모 요소의 overflow 설정 구조와 관련이 있습니다. 가로 스크롤이 생기지 않을 때는 아래와 같은 사항을 먼저 의심해보는게 좋습니다.1. 스크롤을 적용한 요소보다 자식 요소가 충분히 넓은가?2. 스크롤 요소의 부모가 스크롤을 막고 있는가?3. 너비 제한(max-w..., w-full 등)이 걸려 있지 않은가? 저의 경우에는 1번과 3번 케이스로 인해 스크롤을 발생시킬 요소에 overflow-x-auto 속성을 적용했음에도 불구하고 스크롤이 생기지 않는 이슈가 발생했었습니다.. 2025. 6. 9. 실행 컨텍스트란? 종류와 그 내부까지 실행 컨텍스트실행 컨텍스트는 실행할 코드에 제공할 환경 정보들을 모아놓은 객체입니다. 여기서 환경은 this, 변수, 객체, 함수 등 코드의 실행에 필요한 기반들입니다. 코드를 실행할 때 필요한 환경 정보들을 모아 컨텍스트를 구성하고, 이를 콜 스택에 쌓아올렸다가, 가장 위에 쌓여있는 컨텍스트와 관련 있는 코드들을 실행하는 식으로 전체 코드의 환경과 순서를 보장합니다. 실행 컨텍스트 종류1. 전역 실행 컨텍스트처음으로 자바스크립트 코드가 실행될 때 생성됩니다.브라우저의 window, Node.js의 global 객체가 있습니다. 2. 함수 실행 컨텍스트함수가 호출될 때마다 생성됩니다.각각의 함수 호출은 모두 각자의 실행 컨텍스트를 생성하고 가집니다. 3. eval 실행 컨텍스트strict mode(엄.. 2025. 5. 28. FE 디자인 패턴_(1) 목차 디자인 패턴이란?소프트웨어를 개발하는 과정의 반복되는 일반적인 문제들에 대해 기준이 되는 해결책 제공반복되는 문제 상황들을 최적화된 방법으로 해결하도록 돕는 컨셉 Singleton 패턴앱 전체에서 공유 및 사용되는 단일 인스턴스즉, 싱글톤 패턴은 인스턴스를 1번만 만들 수 있어야 한다. 클래스로 예시를 작성해보면 변수를 생성하여 생성자에서 변수가 생성된 인스턴스를 가리키도록 하면 된다. let instancelet counter = 0class Counter { constructor() { if (instance) { throw new Error('You can only create one instance!') } instance = this } getInstance.. 2024. 8. 4. i18n을 사용하여 다국어 처리 하기 다국어 처리를 위해 먼저 파일을 생성했다.src/lib/i18nsvelte를 사용하고 있기 때문에 svelte-18n 공식문서를 채택했다. 각각의 json 파일에는 언어를 작성해두었다. // en-US.json{ "common": { "cancel": "Cancel", "close": "Close", "delete": "Delete" }, } // ko-KR.json { "common": { "cancel": "취소", "close": "닫기", "delete": "삭제하기" }, } 그리고 index.ts 파일에는 공식 깃헙에 나와있는 그대로를 작성해줬다. locale 변수는 현재 선택된 언어의 코드이다. store에 사용하고 있는 언어를 저장하는 방식으로 사.. 2024. 6. 26. HLS(HTTP 라이브 스트리밍)와 m3u8 HLSHTTP Live Streaming은 가장 널리 사용되는 비디오 스트리밍 프로토콜입니다. HLS는 비디오 파일을 다운로드할 수 있는 HTTP 파일 조각으로 나누고 HTTP 프로토콜을 이용하여 전송합니다. Apple이 자사 제품에 사용하기 위해 개발했지만, 현재는 다양한 장치에서 사용되고 있습니다. HLS는 스트리밍을 통해 미디어 파일을 한 번에 모두 보내지 않고 지속적으로 조금씩 사용자 장치에 보냅니다. 따라서 사용자의 장치가 모든 파일을 다운로드하지 않고 비디오 또는 오디오를 재생할 수 있습니다. 장점모든 인터넷 장치가 HTTP를 지원하기 때문에 간단하게 실행 가능재생에 지장을 주지 않고 네트워크 상태에 따라 비디오 품질 조절 가능 (다양한 품질로 스트리밍 세그먼트를 여러개 복사하기 때문에 가능).. 2024. 6. 23. 이전 1 2 3 4 ··· 30 다음 728x90 반응형
