본문 바로가기

자바스크립트 63

[Web worker] 웹워커 간단 사용기 들어가며 이번 글은 web worker(이하 웹 워커)에서 postMessage에 대한 에러를 확인하고 이를 수정하는 방법론? 에 대한 글입니다. 이 글에선 웹 워커의 간단한 동작,worker와의 통신, react에서 사용할 때 주의해야 할 점을 다룹니다. Web worker란 web.dev 문서를 잡고하면 웹 워커는 웹 애플리케이션에서 백그라운드 스크립트를 생성하기 위한 API입니다. 이 말보다는 저는 웹 워커는 자바스크립트에 없는 동시성을 주는 브라우저의 기능이다라고 설명합니다. 자바스크립트의 한계 웹 워커는 자바스크립트의 언어 자체가 가진 문제점으로 인해 만들어졌습니다. 자바스크립트는 단일 스레드 환경으로 여러 가지 스크립트를 동시에 실행할 수 없습니다. 그래서 비동기 코드를 작성하거나 setTim.. 2023. 9. 4.
[유튜브] url로 영상의 정보를 가져오는 기능 만들기 들어가며 이번 글에서는 유튜브 링크를 기반으로 해당 영상의 meta 정보를 가져와 활용하는 예제를 살펴보겠습니다. 최근 업무에서 유튜브 링크로 실제 데이터를 가져오기 전에 브라우저 단에서 10분짜리 영상인지를 판별하는 로직이 필요했습니다. 서버에서 10분 이상인 영상의 경우 처리할 수 없다는 에러코드가 나옵니다. 하지만 모든 업로드 프로세스가 마무리되고 난후에 날아오는 에러코드이기에 UX적으로 불편했습니다. 그래서 이번에는 유튜브 링크로 바로 meta를 가져와 유저에게 알려주는 기능을 개발하게 되었습니다. 유튜브 링크로 바로 meta를 가져와 유저에게 알려주는 기능 본문에 들어가기 전에 완성된 기능을 보고 가겠습니다. 기능 구현 일단 해당 기능을 구현하기 전에 라이브러리가 있나 살펴보았습니다. 여러 가지.. 2023. 7. 25.
[UX/UI] 유저 행동 데이터를 티끌모아태산으로 (hotjar, google analytics) 들어가며 바야흐로 빅데이터의 시대에 살고 있는 우리들은 유저님들의 행동 하나하나에 의미를 담아 판단하고 또 개발해야합니다. 그런데 쉬우면서도 어려운 것이 바로 리뷰를 받는 것입니다. 배달앱에서는 서비스를 줘 가면서 리뷰전쟁을 하고 있는데, 우리는 서비스 음식을 주는대신 우리의 서비스(프로덕트)가 가치있음을 내세우고 리뷰를 받기를 원합니다. 그러니 더더욱 힘들고 안해줍니다. 오늘 소개해드린 hotjar는 이러한 어려움을 조금 쉽게 해결하고자 하는 툴이며, 간단하지만 강력하고 직관적은 기능을 제공하고 있습니다. 우리에게 익숙하게 알려진 유저 행동 추적 도구는 Google Analytics(이하 GA)입니다. 홈페이지 head에 코드만 넣어두면 알아서 정보를 뽑아다가 깔끔하게 시각화를 해줍니다. 이와 비슷하.. 2022. 7. 12.
[백준] 2109번 순회강연- 자바스크립트 [ 문제 설명 ] 2109번: 순회강연 한 저명한 학자에게 n(0 ≤ n ≤ 10,000)개의 대학에서 강연 요청을 해 왔다. 각 대학에서는 d(1 ≤ d ≤ 10,000)일 안에 와서 강연을 해 주면 p(1 ≤ p ≤ 10,000)만큼의 강연료를 지불하겠다고 알려왔다. www.acmicpc.net [ 아이디어 ] 일단 가장 비싼 강의 순으로 정렬 DeadLine(d)일 안에서만 하면 Price(p)를 주지만 빨리 한다고 돈 많이 주는 건 아니므로, 늦게 할 수 있으면 최대한 늦게 강의를 한다.-> 즉 데드라인 기준일부터 계산하여 하루씩 차감( 그 사이에 다른일이 들어온다면 먼저 하기 위함) [ 코드 ] // input 파싱 let input = require("fs").readFileSync("/dev.. 2022. 5. 16.