One more thinking

한글 이름으로 된 파일을 다운로드 할 때 파일 이름이 깨질 때 그 원인와 해결 방법 파일 이름이 깨지는 이유 한글 이름의 파일이 다운로드 할 때 깨지는 이유는 한글 문자열의 유니코드 정규화 방식의 차이 때문입니다. ex) 한글.txt ☞ ᄒ+ᅡ+ᆫ+ᄀ+ᅳ+ᆯ.txt 유니코드 정규화 방식 운영체제에 따라 문자열을 정규화하는 방식에 차이가 있습니다. 보통 유니코드 정규화 방식에는 두 가지가 있습니다. NFC (Normalization Form Canonical Composition): 이 형식은 문자열을 정규화하고, 가능한 한 단일 코드 포인트로 표현되도록 합니다. 대부분의 경우에서 이 형식을 사용하는 것이 좋습니다. NFD (Normalization Form Canonical Decomposition): ..

기술이 된 상상/TIL 2023. 11. 11. 06:21

전화 걸기 기능 웹페이지에서 전화 앱을 연결하는 기능입니다. PC의 경우는 전화를 사용할 수 있는 앱이 호출 됩니다. MAC에서는 FaceTime이 열리네요. 모바일에서는 전화번호가 입력된 전화 화면으로 바로 연결됩니다. HTML a 요소 사용 To create a link to a telephone number, use tel: inside the href attribute: +47 333 78 901 Javascript window.location.href 사용 To create a link to a telephone number, use tel: inside the href attribute: +47 333 78 901 W3Schools online HTML editor The W3Schools o..

기술이 된 상상/TIL 2023. 11. 9. 17:27

v-deep 사용 시 발생 에러(경고) @vue/compiler-sfc] ::v-deep usage as a combinator has been deprecated. Use :deep() instead. 실행 환경 Vue.js 2.6.11 Node.js 16.20.0 사용 사례 v-html 을 사용하게 html 텍스트를 넣고 html 텍스트 내에 위치한 element에 추가적인 style을 입히고 싶을 때 사용하는 v-deep 요소 Deep Test Page 위의 코드를 실행하면 빌드를 하거나 서버 실행 창에 아래와 같은 경고 메시지가 발생합니다. @vue/compiler-sfc] ::v-deep usage as a combinator has been deprecated. Use :deep() inste..

기술이 된 상상/Error Case Study 2023. 11. 8. 04:44

Vue.js를 이용 중인데 json 데이터에 있는 텍스트를 그대로 불러와서 사용하고 있습니다. 텍스트에 줄바꿈이나 간격 등의 포맷을 적용하고 싶어요. 실행 환경 Vue.js version 3.3.4 Node.js version 16.20.0 MacOS Vertura 프로젝트 구성(Optional) Vue.js 프로젝트 설치 기본적으로 Vue.js 문서를 통해 구성된 프로젝트 구조를 예시로 듭니다. Vue.js 프로젝트가 이미 구성되었다면 skip 해도 무관하며 프로젝트를 구성하여 학습하고 싶다면 아래 링크의 Vue.js 프로젝트를 구성하는 방법을 참고하여 구성하세요. Quick Start | Vue.js VueConf Toronto - Join the premier Vue.js conference | 9..

기술이 된 상상 2023. 10. 27. 08:07

NPM으로 설정된 환경을 Yarn 패키지 매니저로 변경하는 방법입니다. 1. 구성 환경 MacOS Ventura 13 npx로 설정된 React 기본 환경 Node.js 16.20.0 NPM 8.19.4 React 18.2 1.1 프로젝트 유사 환경 구성 프로젝트와 비슷한 환경을 위해 라이브러리 하나를 추가했습니다. npm install react-bootstrap bootstrap 2. yarn 설치 npm을 사용하여 yarn을 설치합니다. npm install --global yarn // yarn 설치 확인 yarn --version ※ yarn 1버전을 방식을 적용한 이유는 yarn 2버전에 호환되는 라이브러리가 없는 경우를 겪어서 yarn 1버전으로 진행하였습니다. 3. 프로젝트에 yarn 적용..

기술이 된 상상 2023. 10. 1. 10:06

position 속성에 대한 지식은 absolute에서 멈춰져 있던 상황. absolute의 기준점이 상위의 relative를 통해 정해지고 아니면 root 요소라는 것. fixed는 그냥 absolute로 해결이 안되면 사용하는게 전부. sticky 사용해보고 잘되면 사용 안되면 될 때까지 삽질. 이번에도 sticky를 사용하며 결국 기술부채를 해결하기로 했다. 그래서 absolute, fixed, sticky는 어떻게 다른가 static default 값 normal page flow를 따른다. left, right, top, bottom, z-index 은 영향을 주지 못한다. static 끼리는 나중 선언된 요소가 위로 올라온다.(z-index 가 적용되지 않기 때문에) static 의 z-ind..

기술이 된 상상 2023. 3. 2. 01:18

DAU(Daily Active User) 일간 이용자 수(순수 방문자 수: Unique Visitor) 반복적 사용이 중요한 앱(게임, 메신저 등)에서 주로 주목 서버 부하, 트래픽 예측에 사용되는 지표 시간별 수치를 통해 분석에 활용하는 사례 증가 이용자의 패턴 분석, 단기 이벤트 호응, 서비스 개선에 사용 해당 지표 자체를 홍보 목적으로 사용 서비스의 성공 지수로 사용 WAU(Weekly Active User) 주간 이용자 수 매일매일 접속할 필요가 없는 앱들이 주목 장기적 사이클 분석에 사용 MAU(Monthly Active User) 월간 이용자 수 장기적 관점에서 큰 수치를 표현하는데 사용하는 지표 장기적 사이클 분석에 사용 MCU(Maximum Current User) 순간 동시 접속자 보통 ..

기술이 된 상상 2021. 10. 6. 11:03

본 글은 작성자의 허가를 받아 번역하여 게시한 글입니다. 처음 번역하는 것이라 어색한 부분 많이 있을 것 같습니다. 번역에 대한 피드백은 댓글로 남겨주시면 감사하겠습니다. 원문 : Meta Tags for SEO: A Simple Guide for Beginner 메타 태그란? 메타 태그는 검색 결과에서 웹페이지를 어떻게 보여줄지와 같은 중요 정보를 검색 엔진에 알려주는 코드 조각(snippet)입니다. 메타 태그는 또한 웹페이지 방문객들에게 어떤 방식으로 보여줄지 여러 웹 브라우저에 전달합니다. 모든 웹페이지는 메타 태그를 정의하지만 이 내용은 HTML 코드 안에서만 볼수 있습니다. 이 가이드를 통해 SEO의 가장 중요한 6가지 메타 태그를 어떻게 사용하고, 사용해서는 안되는지 배울 수 있습니다. Me..

기술이 된 상상 2021. 8. 14. 01:25