-
JS로 HTML을 조작할 수 있다개발자 도구 > document로 HTML파일을 확인할 수 있다개발자 도구 > console.dir()로 특정 객체의 정보를 확인할 수 있다따라서 console.dir(document)로 해당 페이지의 정보를 확인할 수 있다
location.href = "파일 경로"로 페이지를 이동하는 경우이동 전 html, js파일과 이동 후 html, js파일의 연결이 끊기기 때문에데이터를 넘겨줄 수 없다이 떄, 데이터를 넘기는 방법은 두 가지가 있다첫 번째로, localStorage를 사용할 수 있다
이용 사이트: https://dbdiagram.io/hometable 생성:table의 참조 연결:PK(primary key: 기본키): 테이블 고유의 indexFK(foreign key: 외래키): 참조 관계인 테이블의 index, FK관계는 선으로 표시된다
출처: https://www.youtube.com/watch?v=d6suykcsNeY&t=1s프론트/백 서버 통신 연습을 위하여, Express와 CRA를 활용한 TodoList만들기모듈을 설치, 사용할 때,https://www.npmjs.com/에서
input type="file"의 기본 외형을 변경할 수 없기 때문에 input을 display: none으로 숨긴 뒤, 외부 태그로 연결해서 사용하는 방식을 주로 사용한다label의 for속성에 연결할 input의 id를 넣어주면 연결된다className을 통해 원하
useRef, useEffect, window.getComputedStyle()를 사용하여리액트에서도 원하는 DOM요소의 스타일 정보를 불러올 수 있다
파일명을 style.scss에서 style.module.scss로 바꿔준다js파일에서 scss파일을 import할 때, import '경로'를 import 변수명 from '경로'로 바꿔준다태그에서 className={변수명.클래스명}으로 클래스를 선언한다scss파일에
Link와 Navigate를 통해 페이지를 이동 할 때state 속성으로 데이터(props)를 전달할 수 있다Link는 중괄호를 두 번 사용하고,Navigate는 중괄호를 한 번 사용한다
출처: https://github.com/streamich/react-use
css로 애니메이션 적용하기참고할 사이트:https://m.blog.naver.com/sudoku1/220868694364https://webclub.tistory.com/621
string메서드인 replace('apple', 'banana'), replaceAll('apple', 'banana')로 string에서 특정 부분을 변경할 수 있다
리액트에서 서버 통신을 순서대로 실행시키는 방법리액트에서 서버 통신을 순서대로 실행하는 방법은 여러가지가 있습니다. 일반적으로 서버 통신을 순서대로 실행하기 위해서는 아래와 같은 방법을 사용할 수 있습니다.async/await 사용async/await 구문은 JavaS
<언어/툴>타입스크립트리덕스/MobXNext.jsnode.js/Express(보류)<면접/취업>이력서 작성/지원프론트 면접 질문 정리<배경 지식>알고리즘(프로그래머스 0단계로 시작)자료구조CS네트워크개발 도서 스터디(클린 아키텍쳐/리팩터링/TDD)<
AWS EC2 빌드 시 나타나는 에러로, 이미 노드가 설치되어 있더라도 아래의 명령어로 노드 설치를 실행시켜주면 빌드가 된다
소문자를 대문자로 변환하기소문자, 숫자, 공백문자를 제외한 모든 문자를 대문자로 변환하기소문자를 제외한 모든 문자 제거하기대문자와 소문자 뒤바꾸기
참고 사이트:https://kjhg478.tistory.com/21https://velog.io/@haleyjun/React로-typescript-프로젝트-생성-및-초기설정
포스트맨 API프론트 레포지토리피그마트렐로
부모 컴포넌트에서 interface 또는 <>로 state의 타입 정의하기자식 컴포넌트에서 Dispatch, SetStateAction import하기자식 컴포넌트에서 props로 전달받을 state 타입 정의하기자식 컴포넌트의 매개변수에 props와 타입 추가하
https://www.cssdesignawards.com/sites/pola-mothers-day/41268/https://ukiha-kagamidayashiki.com/denken-ukiha/
UI 성능을 증가시키기 위하여, React에서 제공하는 고차 컴포넌트(HOC)이다.랜더링 결과를 메모이징하여, 불필요한 리렌더링을 방지할 때 사용한다.React는 첫 렌더링 이후에 발생하는 리렌더 시, 이전의 렌더 결과와 비교하여 렌더 결과가 이전과 다를 때, DOM을
react의 prop중 하나로,부모(상위) 컴포넌트 내부에서 자식(하위) 컴포넌트 정보에 접근할 때 사용되는 prop이다.대표적으로 랜더링을 최적화 할 때 사용된다.부모 컴포넌트가 리랜더 될 때, 자식 컴포넌트도 같이 리랜더된다.이런 동작은 불필요한 리랜더를 발생시키기
PropTypes는 부모로부터 전달받은 prop의 데이터 type을 검사할 때 사용하며,TS를 사용하지 못하여 JS로 개발할 때 사용하는 것이 권장된다.PropTypes는 부모로부터 전달받은 prop의 데이터 type을 검사하여자식 컴포넌트에서 명시해 놓은 데이터 타입
useCallback은 useMemo와 더불어 성능 최적화애 사용되는 React Hook이다.useMemo 는 특정 결과값을 재사용 할 때 사용하는 반면, useCallback 은 특정 함수를 새로 만들지 않고 재사용하고 싶을때 사용한다.useCallback은 두 번째