profile
개발 반 기획 반 광고 반 마케팅 반
post-thumbnail

[생활팁] 크롬 잘쓰기

크롬 기능 중에 그룹화 라는게 있다.그룹 하고픈 탭을 쉬프트 누른채 클릭해 선택해주고, 오른쪽 누르면 아래 화면이 뜬다.요런식으로 그룹 지정이 가능하다.나는 요런식으로1\. 배울 기술2\. 현재 진행 플젝 관련 크롬3\. 볼것, 흥미 진진한것4.그날 그날 읽을것등 취향

2022년 7월 27일
·
0개의 댓글
·
post-thumbnail

window.location.href 사용시 React내 re-mount로 인한 무한 루프 트러블

로그인 후 localstorage에 access_token 기록후, 브라우저 종료 후 앱에 접속시 app내 state에 user정보가 없을시 재 로그인(여기선 kakao로그인) 함수 call을 한다. 이때 로그인 함수 호출 하면 내부에 location.href 로 페이

2022년 7월 25일
·
0개의 댓글
·
post-thumbnail

CORS 에러

React에서 백엔드로 요청중에 CORS 에러가 났다. Access to fetch at '서버 url' from orgin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control

2022년 7월 22일
·
0개의 댓글
·
post-thumbnail

카카오 로그인 구현_web_우리나라에서 가장 쉽게 알려주기_(React, restAPI 방식)

현재 프로젝트 하면서 소셜 로그인 kakao를 web에 연결해야 할 필요가 있어, 또한 좀 삽질을 해서 기록하고자 적는다. client는 React로 구현했고 과거엔 passport라는 라이브러리 사용해서 구현했는데, 이번엔 라이브러리 사용 없이 구현해보고자 한다. (

2022년 7월 19일
·
0개의 댓글
·
post-thumbnail

formik & yup 같이 사용할때, yup의 validation시 다른 value 값 참조하기

fomik과 yup validaion으로 사용하는건 많은 블로그에 잘 나와있다.여기 https://velog.io/@roh160308/%EB%A6%AC%EC%95%A1%ED%8A%B8React-Formik-Yup에도 기본적으로 잘 나와있다.다만, yup에서 이

2022년 7월 9일
·
0개의 댓글
·
post-thumbnail

1.js에서 "for in" vs "for of" 차이점 & 2.객체 배열에서 key, value 추출 방법

위에 데이터가 있다. 크롬에 일단 찍은 이유는 data 배열의 key value가 에디터로 찍으면 사라져서 그런데, 위 사진 보면 아래 빨간 박스에 배열 데이터 key(=index) 0,1,2,3, value {...} 형태로 나와있다. 그래서 위 데이터를 참곻패서 f

2022년 6월 26일
·
0개의 댓글
·
post-thumbnail

[트러블슛팅]axios-mock-adapter 라이브러리 (react에서) 사용할 때 주의점

api 주소엔 문제가 없고 document 대로 했다고 했는데 계속 404 error가 뜨는것이다. stackOverFlow랑 git issue 다 찾아봤는데 정확한 해결법이 없었고, 이부분을 import 해서 사용하는 구조라 import 할때 마다 instance를

2022년 6월 22일
·
0개의 댓글
·
post-thumbnail

tsx파일의 화살표 함수에서 제네릭 사용시 에러: ... 'T' has no corresponding closing tag.

tsx 파일 내 arrow fucntion 사용시, ts 문법의 generic 설정시 아래 에러가 발생한다. 다이아몬드 연산자가 JSX파일이라는 착각을 컴파일러 한테 주기 땜에. jsx로 인식해버려서다. <T,>(param : T) => x 처럼 T 옆에 trai

2022년 6월 21일
·
0개의 댓글
·
post-thumbnail

box-sizing : border-box 패딩 마진 땜에 지정된 크기 넘어갈때.

box-sizing 속성은 CSS 테두리 영역 크기를 결정함.타입 content-box : CSS의 width, height값은 content box에만 적용된다. 따라서 border,padding, margin은 따로 계산되므로, 지정된 크기보다 더 커질수 있다(이게

2022년 6월 11일
·
0개의 댓글
·
post-thumbnail

React 수정/추가 페이지 같이 쓰기

리액트에서 추가와 수정 페이지를 같이 쓰는 방법은 간단히 말해, 추가 form 컴포넌트를 만들고 (예) ㄱ. <CreateContact>)추가하기 버튼 onClick시 ㄱ. 컴포넌트를 리턴해준다수정하기 버튼 onClick시 ㄱ. 컴포넌트를 리턴해주는데, 선택된 유

2022년 6월 8일
·
0개의 댓글
·
post-thumbnail

[ts][x: string]: any 의미, 활용법

ts 하다보면 이렇게 정의된걸 볼 수있다.\[x: string]:any 의 의미는string으로 된 어떠한 문자열도 키가 될 수 있고, value로도 어떠한 value가 올수 있다는 뜻왜 쓰냐면은..이런식으로 중간 매개 컴포넌트로 활용될때 부모에게 상속받아 자식 컴포넌

2022년 5월 26일
·
0개의 댓글
·
post-thumbnail

padding vs margin

(원래 질문은 When writing CSS, is there a particular rule or guideline that should be used in deciding when to use margin and when to use padding?이다.. 그런데

2022년 5월 23일
·
0개의 댓글
·
post-thumbnail

rechart x축 안보일때

react rechart 사용시 x축 안보일떄요렇게..해결법https://github.com/recharts/recharts/issues/1330!\[](https://velog.velcdn.com/images/adguy/post/95ba2abf-a4

2022년 5월 17일
·
0개의 댓글
·
post-thumbnail

[타입스크립트] 객체 배열 정의하는법 & 유의점

매번 헷갈려서 정리해둔다.데이터가 \[{},{},{}...] 로 된 객체 배열이라 가정하자.const crmData = 내부에 이렇게 생긴 데이터가 있다.<WebTrafficGraph data = {} /> webTraffic.. 이란 컴포넌트의 property

2022년 5월 17일
·
0개의 댓글
·

reactnative flex vs react flex 차이

reactNative 하다가 react로 돌아와서 css에서 flex:1을 주는데 왜 안먹지??이상하다 하고 몇시간동안 삽질 했다 ..react는 display:flex를 해주고 flex:1 처럼 속성을 해줘야한다.reactNative 는 달리 display:flex

2022년 5월 1일
·
0개의 댓글
·
post-thumbnail

자료구조 트라이(Trie)

트라이는 자료구조의 탐색트리의 일종으로 문자열 탐색을 아주 빠르게 해주는 자료구조이다.트리의 루트부터 자식들을 따라가며 생성한 문자열로 이루어 지며, 하나의 단어가 되면 끝을 표시하는 변수 end mark를 저장하여 단어의 끝을 구분할 수 있다.장점 : 단순 리스트 저

2022년 4월 17일
·
0개의 댓글
·
post-thumbnail

HTML&React Tip 모음

input type file 속성 꾸미기<label 태그에 htmlFor 속성 사용하면 id와 그룹을 만들 수 있다. 위 코드는 id="file" 이란 그룹을 label tag와 형성하고, input tag style에 display:none으로 안보이게 하면

2022년 4월 3일
·
0개의 댓글
·
post-thumbnail

[알고리즘]DFS Leetcode_236. Lowest Common Ancestor of a Binary Tree

Given a binary tree, find the lowest common ancestor (LCA) of two given nodes in the tree.According to the definition of LCA on Wikipedia: “The lowest

2022년 3월 25일
·
0개의 댓글
·
post-thumbnail

[DFS]leetcode 1110. Delete Nodes And Return Forest

leetcode 1110번 문제 :이진 트리에서 노드 삭제 후 배열에 넣어 return 하기

2022년 3월 21일
·
0개의 댓글
·

BS : Binary Search 구현하기

binary search, 이진 탐색을 js로 구현해보겠다. 이진탐색은 정렬된 배열을 search하는 알고리즘이다.이진탐색은 간단히 설명하자면, 3 pointer 즉, leftIndex, midIndex, rightIndex 3가지 포인터를 가지고 구현을 한다.1\.

2022년 3월 20일
·
0개의 댓글
·