- 전체보기(110)
- leet(24)
- boj(23)
- level2(20)
- 프로그래머스(17)
- 구현(10)
- 투포인터(7)
- 완전탐색(6)
- DFS(6)
- DP(5)
- hash(5)
- JavaScript(5)
- BFS(5)
- CSS(4)
- 문자열(4)
- 백트래킹(4)
- async(3)
- stack(3)
- await(3)
- 정렬(3)
- interval(3)
- 재귀(2)
- React(2)
- useEffect(2)
- 이진수(2)
- 그리디(2)
- 가운데 정렬(2)
- Knapsack(2)
- State(2)
- hackernews(2)
- 이분탐색(2)
- 타입스크립트(2)
- S3(1)
- 해시(1)
- 배열규칙(1)
- anagram(1)
- 플로이드-와샬(1)
- 4sum(1)
- 토너먼트(1)
- subset(1)
- Sliding Window(1)
- react hook form(1)
- 행렬(1)
- text(1)
- 가로축(1)
- Recoil(1)
- matrix(1)
- binary tree(1)
- 조합(1)
- js(1)
- branch(1)
- useParams(1)
- Deque(1)
- unordered_map(1)
- ReactRouter(1)
- palindrome(1)
- Nginx(1)
- Node(1)
- find(1)
- 세팅(1)
- circular(1)
- Props(1)
- tree(1)
- react-query(1)
- local storage(1)
- axios(1)
- Outlet(1)
- lowerbound(1)
- class 컴포넌트(1)
- reduce(1)
- 피보나치수(1)
- ReactCreateElement(1)
- type(1)
- 간선방문(1)
- template(1)
- display:flex(1)
- C(1)
- GCD(1)
- LCM(1)
- 단축키(1)
- 스택(1)
- array(1)
- spread operator(1)
- Fetch(1)
- 대소문자변환(1)
- align-item:center(1)
- substr(1)
- JSX(1)
- babel(1)
- to(1)
- Map(1)
- 그래프(1)
- 라우터(1)
- alphabet(1)
- 2차원벡터(1)
- function 컴포넌트(1)
- componentDidMount(1)
- grid(1)
- event handling(1)
- Lv1(1)
- contextAPI(1)
- 비트마스크(1)
- git(1)
- socketio(1)
- typescript(1)
- nested Routes(1)
- 후위표기식(1)
- position(1)
- hooks(1)
- 세로방향(1)
- programmers(1)
- palindrom(1)
- link(1)
- greedy(1)
- header(1)
- O(log n)(1)
- 시뮬레이션(1)
- next_permutation(1)
- merge(1)
- rebase(1)
- useMatch(1)
- linked list(1)
- 배포(1)
배포 [REACT]
AWS S3버킷 만들기파일 업로드(build파일 전부, static 폴더 추가)속성 -> 정적 웹 사이트 호스팅 편집 활성화 -> 인덱스 문서 index.html로 지정 권한 -> 퍼블릭 엑세스 차단 편집 -> 차단 해제 -> 버킷 정책 편집
Hooks [REACT]
UseMemo, UseCallback, Component communication, useRef, Hooks https://stackblitz.com/edit/react-ts-vypbqa?file=ComponentComm.tsx
Context API [REACT]
컨텍스트 생성데이터 Set 하는 방법1.컨텍스트를 생성2.컨텍스트.프로바이더 사용3.value를 사용데이터 Get 하는 방법1 (Consumer)1.컨텍스트를 가져온다2.컨텍스트.컨슈머를 사용한다3.value를 사용한다.데이터 Get 하는 방법2 (Functional)
HackerNews TS(6) - api class,상속
class Api + extends 사용 function newsDetail()에서 적용
HackerNews JS(5) - 댓글,대댓글,상태
댓글, 대댓글 구조대댓글 재귀구조읽음 상태 저장\-읽어온 전체 데이터를 feeds 배열에 read상태와 함께 저장\-feedDetail 페이지 방문 시 id와 비교 -> read= true로 변경하여 방문표시반영
HackerNews JS(3)
1.라우터 기능 추가2.메인페이지, 상세페이지 주소 설정3.페이지네이션1.라우터2.메인페이지, 상세페이지3.페이지네이션
넷플릭스 클로닝(1) - 헤더, 라우터
전체 구조1.Nav (scroll)animation<Nav variants={navVariants} animate={navAnimation} initial={"top"}>2.메뉴 선택시 빨간 동그라미3.검색 아이콘 클릭시 라우터
Todo(recoil) 1
react-hook-form 적용 handleSubmit -첫번째 인자(필수): 데이터가 유효할 때 호출되는 함수 -두번째 인자(필수X): 데이터가 유효하지 않을 때 호출되는 함수 input 유효성 검사 - formState으로 에러메세지 출력 setError
framer-motion
object 사용부모요소 initial과 animate 자식요소에 그대로 적용됨staggerChildren으로 자식 요소 개별 등장 타이밍 조정 가능드래그 가능 범위 제한 = dragConstraints,useRefdragSnapToOrigindragElasticdr
useEffect async await 방식
useEffect(() => { (async () => { const infoData = await ( await fetch(https://api.coinpaprika.com/v1/coins/${coinId}) ).json(); const priceData = await ( await fe...
SocketIO(1)
app.jssocket.emit("이름", "메세지(object)", callback함수)세번째 인자 함수를 서버가 backend에서 호출하지만 실행은 front-end에서 실행됨server.js
HackerNews JS(2)
app.js a.href = #${newsFeed[i].id} window.addEventListener('hashchange')으로 const container = document.getElementById('root')선언 후 container.appendChild
Git 사용법1
1\. branch bugFix -> git checkout bugFix2\. Mergegit branch bugFix -> git checkout bugFix -> git commit -> git checkout main ->git commit -> git merge
[LeetCode] 102. Binary Tree Level Order Traversal - c++
큐를 사용한 BFS풀이 + 트리 노드예외처리) root가 nullptr로 들어오는 경우 {}반환
[HackerRank] - Beautiful Binary String - c++
0100101010에서 겹치는 경우 제외한 010갯수 세는 방법