React

객체의 배열을 가지는 경우 하나의 값만 변경하고자 할 때배열 원소 찾기배열의 복사본 만들기복사본 수정하기복사본을 상태 set하기객체 배열 중 고치고 싶은 객체의 index를 구한다이때 자바스크립트 findIndex 메소드 사용하면 된다객체 배열 중 id가 2인 객체의

Pagination 컴포넌트 구현페이지 네이션 사용할 컴포넌트페이지 하나에 최대 5개의 post가 보여지도록 limit 상태 설정한다해당 페이지의 보여지는 첫번째 게시글 인덱스를 저장할 offset 변수 생성한다

백엔드와 통신하고 난 response를 console로 찍었을 때다음과 같은 경우 PromiseResult안에 있는 data 접근하기 위해 별도의 방법이 필요하다!이렇게 함수를 하나 생성해주고 그 함수를 실행만 해주면 해당 promiseResult에 있는 진짜 원하는

일단 해당 배열의 값으로 버튼 배열을 생성한다.해당 버튼들 중 클릭한 버튼 값을 저장하기 위해 state를 생성한다.버튼 클릭시 핸들러를 처리해당 클릭했을 때 디자인의 차이를 준다.이 경우는 버튼을 여러 개 클릭을 할 수 있고 이미 클릭되어있는 상태에서 또 클릭하면 클

=> true이면 수정=> false이면 생성생성하는 수정하는 함수 query 문을 생성한다.버튼 클릭했을 때 클릭핸들러 함수를 작성한다.

자바 스크립트access token을 로컬스토리지에 저장하는 경우

UI폴더에 Button.js 생성UI폴더에 Button.module.css 생성styled component를 사용해 재사용 가능한 Button 작성하기다른 컴포넌트

웹사이트 url의 클립보드 복사하는 기능을 추가할 것이다.웹사이트 배포한 앞 base url을 변수에 저장한다.useLocation() 훅은 React Router에서 제공하는 훅 중 하나로, 현재 경로와 관련된 정보를 담고 있는 객체를 반환한다.pathname: 현재

통신을 통해 받은 모든 정보들 중 입력 받은 값에 단어가 포함된 리스트들을 연관 검색어에 뜰 수 있도록 하는 검색 기능을 구현할 것이다.검색창에 입력받을 값과 입력 받은 값이 포함된 데이터 리스트 값들을 상태로 각각 생성해준다.한 글자씩 입력할 때 마다 실행되는 함수

pages \- login index.tsxsections \- login KakaoButton.tsxGoogleButton.tsxindex.ts폴더에서 index.ts를 생성해준다.pages/login/index.tsx번거롭게 사용하는 버튼을 경로를 따로 따로 설

게시글이 한 줄에 3개씩 3열이 있도록 게시글이 나열될 수 있도록 구현할 것이다mui Grid 활용mui Pagination 활용Grid containerspacing: 그리드 아이템 사이의 간격을 설정=> 가장 작은 화면 크기(xs)에서는 아이템 사이의 간격을 2로

JavaScript SDKREST API방법은 총 2가지인데 REST API를 활용하여 구현해볼 것이다!애플리케이션 등록카카오에 인가코드 발급 요청백엔드에게 인가코드를 보냄백엔드로 부터 받은 데이터들 처리카카오 로그인하기에 앞서서 애플리케이션을 등록해야한다애플리케이션을

Clean Code 가 실무에서 무엇인지, 그리고 실제 작성된 코드를 클린코드로 리팩토링 하는 과정 및 상황을 살펴보자