[React] 25.04 기준 신규버전 카카오페이 연동하기
2025. 6. 13. 22:20
개발/Javascript
새로 하는 프로젝트에 카카오페이가 들어가게 됐다. 기존에 했던거 복붙 하려했는데, 문서 읽어보니 카카오 디벨로퍼스에서 카카오페이 디벨로퍼스로 빠지면서 결제 API연동 방식 신규버전이 생긴것 같았다. 계정생성 카카오페이 | 개발자센터새로운 기회와 가치를 함께 만들어봐요developers.kakaopay.com카카오페이 개발자센터 계정이 없어서 일단 계정부터 만들어줬다. 사전등록애플리케이션 등록아이콘 이미지와 앱 이름을 넣어서 등록한다. Secret key(dev)발급새로 만들어진 애플리케이션을 선택한 후 하단에 Secret key(dev) 발급 버튼을 누른다. 플랫폼등록애플리케이션 - 플랫폼에 들어가서 Web부분에 테스트할 주소를 입력한다.나는 localhost:3300으로 입력했다. ..
[Javscript/Rechart] x축 스크롤링 추가
2025. 5. 3. 16:57
개발/Javascript
const CustomTick = (props) => { const { x, y, payload } = props const dateParts = payload.value.split('-') // ["2024", "12", "15"] return ( {dateParts[0]}년 {dateParts[1]}월 {dateParts[2]}일 )}const StatUsageStatus = ({ value }) => { ...코드생략 // x축 간격 조정 (4rem) const chartWidth = Math.max(chartData?.length * 64, 800) >= document?.querySelec..
[VSCode] 갑자기 svg파일이 코드가 아닌 미리보기로 보일 때
2025. 4. 19. 18:04
개발/Install, setting, etc
평소랑 다를거 없었는데... 왜..갑자기...갑자기 svg가 코드가 아닌 미리보기로 뜨게됐다. 원래 미리보기로 보다가 일회성으로 코드만 보려는 분들은VSCode검색창 열어서 Text Editor모드로 하면 해당 파일을 코드로 볼 수있다. 하지만 나는 모든 svg파일을 코드로 보는걸 원하기때문에 설정을 수정해줬다. VSCode 설정 (Ctrl + , 또는 Cmd + ,) 열기우측상단 JSON으로 열기 아래 코드 추가"workbench.editorAssociations": { "*.svg": "default"}
[CSS/SCSS] SCSS에서 CSS 변수 중복 적용 문제 해결하기
2025. 3. 26. 08:05
개발/HTML, CSS
문제React 프로젝트에서 SCSS를 사용할 때, common.scss 파일에 CSS 변수도 선언하고 여러 파일에서 불러오는 구조를 만들었다.하지만, 개발자 도구에서 확인해보니 같은 스타일이 여러 번 중복 로드되는 문제가 발생!!!! 이로 인해 CSS 변수가 페이지마다 중복 선언되는 문제가 발생했다.// 기존의 common.scss:root { --btn-green-border: none; --btn-yellow-border: none; /* (이런 변수들이 반복됨...) */}[data-theme=light]{...}...그외 scss 공통함수들이 있었다 그로인해 아래처럼 똑같은 변수선언이 여러개가 생겨서 스크롤이 엄청 쌓이게 되어버린..원인: SCSS @use의 동작 방식 SCSS..
[OTT JUMP] 크롬익스텐션 테스트 등록하기 (wavve 오프닝 건너뛰기, 다음회차 자동재생)
2025. 3. 2. 11:12
개발/Inafolio
애니보는데 넷플릭스는 저 '끝내지 않는 Netflix'가 있어서 자동으로 넘어가지는데, 웨이브는 안되는게 귀찮아서 만들었다.티빙으로는 애니를 잘 안봐서.. 나중에 티빙도 쓰게된다면 티빙버전도 만들어야겠다. { // 사용자가 특정 웹페이지를 열 때 사용할 JavaScript 또는 CSS 파일을 지정 "content_scripts": [ { "matches": ["*://www.wavve.com/*"], // 확장 프로그램을 실행할 웹사이트 "js": ["content.js"] // 실행할 js파일 } ], // 확장 프로그램의 설명란에 표시되는 설명 "description": "Wavve에서 오프닝 건너뛰기랑 다음회차를 자동으로 재생해주는 크롬 확장 프로그램이에요!"..