본문 바로가기

IT40

윈도우에서 iOS 사파리 디버깅 해보기 안녕하세요 aloveu입니다. 오늘은 윈도우에서 아이폰 디버깅하는 방법을 찾아보고 직접 연결해 본 내용을 기록차 남겨둡니다. 아이폰 설정 Web Inspect 활성화설정 > Safari > 고급 > 웹속성 활성 iTunes 설치하기https://apple.co/ms iTunes - Windows에서 무료 다운로드 및 설치 | Microsoft StoreiTunes는 음악, 동영상, TV 프로그램 등을 즐길 수 있는 가장 간편한 방법이며 쉽게 구성할 수 있습니다. 동영상을 대여하거나 구입하고 좋아하는 TV 프로그램을 다운로드할 수도 있습니다. iTunes는apps.microsoft.com   iTunes 동기화아이폰을 PC와 연결 (드라이버 자동 설치됨)iTunes 실행동기화 Node.js가 설치 되어있지.. 2025. 4. 2.
Nuxt 개발 삽질기 안녕하세요! aloveu입니다.Nuxt를 개발하면서 삽질했던 기억을 더듬어 글을 남깁니다. 생각날 때마다 포스트를 업데이트할 예정이에요.API가 응답이 올 때까지 페이지 이동이 되지 않고 그대로 머물러 있을 때await useAsyncData를 사용하고 있어서 데이터를 받아올 때까지 페이지 이동이 되지 않음. > await를 제거하면 됨 서버에서 메모리릭 발생memory가 계속 풀 나서 서버가 하루에 한두 번씩 재부팅하는 현상 발견. 1. vue-recaptcha 모듈을 사용했을 때 vue-recaptcha/nuxt 에서 GC가 되지 않는 걸 발견2. isomorphic-dompurify가 서버에서 sanitize 하는 과정에서 메모리릭이 남.  > xss로 변경Nitro Fetch에서 AbortCont.. 2025. 4. 1.
[Angular] Same Url Reload 안녕하세요! aloveu입니다.오랜만에 블로그 글을 씁니다. 한동안 바쁘기도 했고 블로그에 흥미를 잠시 잃어 소홀했습니다. ㅠ 프로젝트를 진행하다가 정리할 게 있어서 잠깐 블로그에 들린 김에 끄적여봅니다. Angular에서 동일한 url로 이동할 때는 아무런 반응을 하지 않습니다. 메인에서 로고를 눌렀을 때 새로 API를 당겨 와야하는 니즈가 있어서 찾다 보니 여러 가지 방법이 있었습니다. 우선 첫번째는 다른 라우터를 이동했다가 다시 요청한 url로 돌아오는 방법이에요.this.router.navigateByUrl('/', {skipLocationChange: true}).then(() => this.router.navigate([this.router.url])); 단점은 루트(/)로 갔다가 다시 .. 2024. 10. 21.
3rd Party Cookie 차단?? 안녕하세요! aloveu입니다.오랜만에 블로그 글을 쓰네요. ㅎㅎ 최근에 개발을 하다가 콘솔창에 계속 뜨는 바로 이 메시지가 거슬려 검색을 해봤습니다.그랬더니 이런 이슈가 있었는데 이제야 제가 알았어요 ㅠ https://developers.google.com/privacy-sandbox/3pcd/prepare/prepare-for-phaseout?hl=ko 서드 파티 쿠키의 단계적 지원 중단에 대비하기  |  Privacy Sandbox  |  Google for Developers서드 파티 쿠키 지원 중단 일정에 대해 자세히 알아보고 사이트 기능을 유지하기 위해 취해야 할 조치를 알아보세요.developers.google.com기술 관련 정보들을 빨리 파악해야 하는데 항상 반성합니다. 내용인즉슨 크롬에.. 2024. 6. 11.
[CSS] Cascade Layers 정리 안녕하세요! aloveu입니다.오늘은 CSS의 새로운 스펙인 'Cascade Layers'에 대해 소개해 드리겠습니다. 사실 나온 지는 꽤 됐어요. 한동안 CSS에 관심을 덜 두고 JS쪽 개발만 하다 보니 이런 게 나와 있는 줄 몰랐었죠.여하튼 이 기능은 CSS의 스타일 우선순위를 보다 효과적으로 관리할 수 있게 해 주므로, 대규모 프로젝트나 프레임워크, 라이브러리 개발 시 매우 유용합니다.근데 요즘 프로젝트에서는 scss 많이 쓰는터라 거기서는 style.scss 파일에서 쉽게 우선순위별로 임포트 해서 쓸 수 있어서 이건 잘 쓰지 않을 것 같지만 모르고 안 쓰는 것과 알고도 안 쓰는 것은 다르겠죠?! 최근에 Angular PrimeNG 라는 UI라이브러리를 업데이트했다가 뭔가 스타일이 제 예상대로 작동.. 2024. 5. 13.
[JS] 반복문들의 성능 체크 안녕하세요! aloveu입니다.얼마 전 Map, Set의 성능 체크를 하고서 뭔가 신선한 충격을 받았어요.보지 않으셨다면?? https://aloveu.tistory.com/86 읽어보고 오시는 걸 추천드립니다. ㅎㅎ 오래된 개발자의 고정관념에서 나온 그런 충격이었는데 사실 이쪽 IT업계는 변화가 정말 엄청나니 언제든 바뀔 수 있는 결과였죠.그래서 생각난김에 javascript에서 쓰이는 Array 메서드들의 성능을 다시 한번 체크해 보는 시간을 가져봤습니다.오늘 테스트할 메서드는 이것도 얼마전에 포스팅을 했던 실무에서 꼭 필요한 Array 메서드라는 포스팅을 참고할 거예요.https://aloveu.tistory.com/64 [JS] 실무에서 꼭 필요한 Array 메서드안녕하세요! aloveu입니다. .. 2024. 5. 9.
[JS] Map(), Set()의 이상한 성능테스트 안녕하세요! aloveu입니다. 프로젝트를 진행하다 보면 성능문제가 항상 따라옵니다. 대용량의 데이터를 핸들링한다던지, 다른 작업들이 많다던지 하다 보면 어느새 버벅거리는 화면을 보게 됩니다. 프로젝트의 성능을 높이는 방법중에는 많은 방법이 있지만 오늘은 대용량의 데이터를 Object가 아닌 다른 방법으로 처리하는 법을 알아보도록 하겠습니다.우리가 코딩테스트를 하면서 알고리즘 문제를 풀 때 자주 보이는 Map, Set입니다. MapMap()은 자바스크립트의 Key-Value 페어로 이루어져 있습니다. 이 Key를 가지고 Value를 get, set 할 수 있고 Key 값들은 중복이 될 수 없습니다. 키값으로는 모두 사용이 가능합니다. Map에서는 키값으로 객체나 함수도 가능합니다.그리고 키의 순서가 있습.. 2024. 5. 7.
[CSS] 버튼을 누를 때 폭죽 터지는 animation을 넣어보기 안녕하세요! aloveu입니다.오늘은 버튼을 누를 때 폭죽 터지는 효과를 줘보려고 합니다.어디서 본 거 같죠?! ㅋㅋㅋㅋ 네 유튜브에서 좋아요를 눌렀을 때 보이는 그겁니다.따봉은 이미지 구하기 귀찮으니 폭죽만요 ㅋㅋㅋㅋ일단 하나씩 해봅시다. 1. 폭죽 부분 만들기점이 동그랗게 퍼지면서 터지는 효과를 보니 왠지 css에 border 에서 dash나 dotted를 쓰면 될 거 같죠?! 결과" data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 오?! 벌써 뭔가 보여요. 그러면 이 원을 커지면서 서서히 사라지게 만들어야합니다. 2. Animation 적용 animation burst를 추가해서 초기에는 투명한 상태에서 시작하고 2초 동안 burst 애니메이션을 실행하게 합니다. 결과" d.. 2024. 4. 29.
윈도우 PC에서 자녀 보호 설정하기 - Family Safety 안녕하세요! aloveu입니다. 다들 자녀 컴퓨터관리는 어떻게 하시나요?!제 아들은 중학생이 되는 해 연말정도에 데스크톱을 하나 장만해 줬습니다.그러면서 컴퓨터에 자녀 보호 기능을 세팅해야 했어요.여기서는 윈도우에 세팅하는 과정을 포스팅합니다. 맥은 패스할게요.혹시나 자녀 컴퓨터에 세팅을 해야 하는 일이 있으신 분은 따라 해 주시면 됩니다. 아이들은 싫어하겠지만요...개요마이크로소프트에서 제공하는 Microsoft Family Safety라는 앱을 사용할 예정입니다.여기서는 컴퓨터 사용가능 시간, 하루 이용시간, 웹 검색 필터로 허용된 웹사이트만 접근할 수 있게 세팅할 수도 있고 프로그램 설치 관리도 가능합니다.윈도우는 깔려 있을 거니깐 부모와 자녀 둘의 마이크로소프트 계정이 필요합니다. 저는 windo.. 2024. 4. 25.
반응형