react

useEffect를 사용할 때마다, 의존성 배열을 왜 써야 하는지에 대한 궁금증이 들지 않았는가? 의존성 배열이란 무엇인지 또한 짚어보아야 할 필요성이 있었다.

github에서 new repository 생성 생성된 repository에서 'Code'를 누른 뒤 HTTPS 주소 복사 git clone 원격저장소주소 cd 프로젝트명git r

React에서는 페이지 간의 이동을 Route로 지원하고 있다.그 중에서 react-route-dom이라는 라이브러리를 제공하고 있고, 이를 많이들 install해서 사용하고 있다.

[1] firebase 접속 후 프로젝트 추가 : 프로젝트 추가 : 프로젝트 이름입력 : '계속' 누르기 <img src = "https://velog.velcdn.com/images/oksk6681/post/483d6fee-

입력 값을 다양하게 갖고 있을 때, 중간의 값을 수정하고 싶은 경우가 있다. 그럴 떄에는 spread 연산자 방식을 사용하여 값을 변경할 수 있는데, 관련해서 알아보자.위의 코드를 예시로 보자.입력 값이 바뀌었을 때 데이터를 수정하는 핸들러로, 많은 경우에 쓰이는 예시

위의 사진처럼 데이터를 작성하고 '등록'을 하는 경우에 firebase와 연동하여 데이터를 추가하고 싶었다.그래서 관련된 firebase API를 생성해봤다.'db'의 경우 import를 통해서 가져왔다.db.collection을 통해서 추가하려고 하는 컬렉션을 찾는다

백엔드에서 서버를 만들고, DB를 추가해주는 방식으로 데이터에 대한 CRUD를 할 수 있지만, 백엔드가 없는 경우에 json파일을 통해 목업데이터를 사용하는 방식을 사용할 수 있었다.

오늘은 그래프/차트를 React에서 그리는 법을 배워보도록 하겠어요.1 recharts 패키지 다운받기2 Chart.js 파일 생성하기전체 코드코드 파악하기LineChart : 선 그래프width, height : 그래프의 넓이 및 높이data : 그래프에 나타낼 데이

오늘 구현해보고자 하는 axios의 CRUD 기능은 총 3가지이다.

여러 프로젝트를 하다 보면, 폰트를 적용해야 하는 경우가 많다.디자이너 : "폰트 적용해주세요."개발자 : "엇,, 어떻게 하는지 알아볼게요"이런 상황을 겪고 구글에 검색을 하는 당신을 위해 준비했다.아주 깔끔하게 적용하는 과정을 보여드려요.1) src 폴더 안에 fo

우리는 보통 색상을 적용할 때 위의 사진처럼 색상 코드를 바로 작성할 때가 많다.그러나 동일한 색상을 여러 컴포넌트에 계속 적용하게 되는 구조로 코드를 짠 뒤에,,디자이너 : "저희 색상 코드 바꿀게요. A에서 B로 바꿀건데 참고해주세요." 라고 한다면,,?모든 색상

onChange와 onInput 속성은 JS에서는 기능이 다르지만, React는 동일하다.

개발을 하다가 콘솔을 찍어보니 Warning이 뜨는 부분이 발견된 순간이 있었다.코드는 위와 같았고, 'isActive'라는 사용자 정의 속성을 추가했다.그 결과 'React doest not reconize the 'isActive' prop ona DOM eleme

위의 글을 통해서 JSON-server를 통해서 RESTFUL API에 대해 사용법을 배워봤다.위와 같은 명령어를 통해서 하나의 JSON 파일을 개방할 수 있었다.하지만, 여러 개의

public/manifest.json 파일은 Progressive Web App(PWA)을 설정하는 데 중요한 역할을 합니다. 이 파일은 웹 애플리케이션이 모바일 앱처럼 동작할 수 있도록 해주며, 주로 웹앱이 설치되고 실행될 때의 외형과 동작 방식을 정의합니다.Prog

React에서 Notification을 구현해보자1) denied : 사용자는 알림 표시를 거부한다.2) granted : 사용자는 알림 표시를 수락한다.3) default : 사용자 선택을 알 수 없으므로, 브라우저는 값이 거부된 것처럼 작동한다.: HTTPS로 배포