본문 바로가기

분류 전체보기282

[Cursor]현재 작업 중인 파일 위치에 포커스 주는 법 📍Cursor (VS Code)에서 현재 작업 파일(탭)을 왼쪽 사이드 바(파일리스트)에서 선택 상태로 설정하는 법[IntelliJ] 현재 작업 중인 파일 위치에 포커스 주는 법(webstorm, phpstorm 등)지난 인텔리제이 세팅에 이어 이번엔 다른 팀원분이 "현재 작업 파일을 왼쪽에서 선택되어 보이게 하고 싶은데 안된다"는 문의가 있어서 찾아봤습니다.IDE는 초기에 세팅하면 그상태로 쭉 쓰게 되니, 새로운 IDE를 설치하고 사용할 때 기존의 세팅값과 다른 경우가 꽤 있는 듯합니다. Cursor도 결국 VScode 기반이라 세팅도 VScode처럼 해주면 되는데요. 1. VS Code 상단 메뉴 → Preferences → VS Code Settings(단축키: ⌘, 또는 Ctrl+,) 2.. 2025. 7. 12.
[Webstorm] px을 rem으로 바꾸는 플러그인 px2rem : px을 rem으로 바꾸는 플러그인 1. px2rem 설치 2. root 폰트 사이즈 지정 3. px단위 입력한 소스에서 단축키 option(⌥) + d 치면 자동으로 변환됨 px2rem - IntelliJ IDEs Plugin | Marketplacethis is a tool of converting px to rem/vw/vh in a css/less file by a few settings. there are three ways to convert: short-cut key, code intention, code completion. you...plugins.jetbrains.com 이 플러그인은 그로스로그의 한 프로젝트를 하면서 갓예승님이 알려주신 플러그인인데 실제 업.. 2025. 7. 12.
URL에 물음표가 왜 붙어요? <form>의 기본 1. 문제 : 동료에게 "이 url에 물음표가 왜 붙어요?"라는 질문을 받았다# 예시http://localhost:3000/login? 해당 결과에 따로 router.push('?')나 query string 처리를 두지 않았기 때문에 ?가 붙는 이유를 알 수 없었다. 예시 { handleLogin() }}> LOGIN const handleLogin = async () => { const data: any = await fetchLogin({ userId, email }); if (data?.status === 200) { localStorage.setItem("accessToken", data?.data?.accessToken); window.location.reload(); //.. 2025. 6. 28.
2025 상반기 회고 1. 이제 회사이야기는 쓰기 쉽지 않네요.그럼에도 작은 조직일수록 사고에 유연한 장점이 있는 거니까 개인적인 이야기를 조금 풀어보겠습니다.상반기엔 소속이 변경되었습니다. 초기 개발에 참여했던 프로젝트가 예상보다(제 예상이요) 빨리 커지면서 나의 한계와 매일 싸우는 중입니다.과거의 나와도 싸우면서요. 2. 올 상반기에 제일 잘했다는 생각이 "팀원들과 점심 먹기"입니다.함께한 지 꽤 오래됐지만 어쩌다 보니 밥은 따로 먹게 되었는데 프로젝트까지 따로 하는 기간엔 점점 대화에 간극이 생기는 기분이었거든요. 최근 다시 점심을 같이 먹기 시작하면서 이젠 조금 더 편하게 대화를 합니다. 요즘은 헛소리도 종종 하고 전우애가 생기는 느낌입니다.남초직장 한 떨기 억새풀. 3. 커머스 솔루션에 대한 관심.서비스기술지원센.. 2025. 6. 22.
구글 캘린더 귀여운거 발견함 - Calendar event illustrations 구글 캘린더에 일정을 기록 중 눈에 들어온 기능이 하나 있는데요."요가", "러닝", "운동", "회의" 등 특정 키워드를 일정에 입력하면 자동으로 일러스트가 표시가 된다는 것입니다. 이 기능의 공식 명칭은 없고 정식 문서에도 거의 언급된 적이 없고, Google 내부에서는 illustrations for events 또는 smart illustrations라는 표현이 사용된 적 있다고합니다.(ChatGPT가 알려줌) 이미지는 구글 측 자동화 알고리즘에 따라 동작하며, 사용자가 수동으로 설정할 수 없으며 공식적으로 리스팅된 된 건 없다고 하네요.(구글 캘린더 커뮤니티) [운동] [일상] [이벤트] "생일"과 "파티"를 같이 쓰면? 순서에 상관없이 "생일"이 먼저 https:/.. 2025. 6. 18.
String Matching Algorithm 스트링 알고리즘.01 Stiring : 문자가 연속적으로 나열된 문자열 알파벳 alphabet ∑ : 스트링에 사용되는 문자들의 집합 스트링 매칭 : 텍스트에서 패턴이 나타나는 위치를 찾는 것텍스트 T : 긴 스트링, 길이n패턴 P : 짧은 스트링, 길이 mn≥m브루트-포스 스트링 매칭 알고리즘 (Brute-force algorithm 또는 Naïve algorithm)텍스트의 각 위치에서부터 패턴의 길이만큼 문자를 비교하며 매치를 찾는 방법시간 복잡도 : O(nm)T : a a b a a b a a aP : a a b a a 위치012345678TaabaabaaaPaabaa 위치012345678TaabaabaaaP aabaa 위치012345678TaabaabaaaP aabaa 위치012345678Taaba.. 2025. 6. 3.
[3] HTML의 렌더링에 대해 궁금했던 것들 - Render Tree Render Tree DOM과 CSSOM 결합 → Render Tree 생성 → Layout (Reflow) → Paint 1. Render Tree는 "화면에 보일 요소만" 포함한다.Render Tree 생성할 때 display: none 요소는 왜 제외될까? (display: none과 visibility: hidden의 차이)DOM에는 문서에 있는 모든 노드가 들어 있지만, 화면에 표시될 필요 없는 요소까지 그릴 필요는 없다.1) display: none = "아예 화면에 렌더링하지 마!" 그러므로 Render Tree 만들 때 아예 제외된다. 완전히 숨겨지는 것이기에 존재하지도 않는다. 2) visibility: hidden = 존재는 하되 "보이지 않게"만 해줘그래서 Render Tree에.. 2025. 5. 25.
QR 마스크 만들기 (SVG) 만만하게 봤다가 큰코다친 경험.QR 마스크 페이지 만들기이런 페이지 제작 요청을 받았다.처음엔 간단한 구조에 "최소 기능 구현 20~30분" (+구동확인 및 디테일 보정 시간 30분)으로 예상하고 시작했다가4시간 넘게 싸움🫠[구현 조건]1. 전체 영역에 검은 마스크(블러처리)가 있다.2. 가운데 구멍이 뚫려있다. 3. 구멍 내부는 선명하게 보인다. [실패한 접근법]1. 가운데 정사각형 만든다.2. 정사각형 내부 : 선명함 유지 3. 정사각형 외뷰 : 불투명 + 흐린 효과를 주고 CSS 신봉자는 2, 3을 생각할 땐 "CSS에 그런 속성이 있겠지~"하고 안일하게 생각함.그러나 결과는 다음과 같았다.2. 정사각형 내부 : 흐림 (선명해야함🤯)3. 정사각형 외부 : 선명 (흐려야함🤯) 이유 : CSS .. 2025. 5. 10.

티스토리툴바