React

SPA (Single Page Application)페이지가 한개인 애플리케이션React의 html 파일 갯수는 index.html 1개이다.즉, React는 SPA이다.이전에 만든 작업들을 생각해본다면 login.html main.html 등 여러개의 html 페이지

ass(SCSS)에 대해 얘기하기에 앞서, CSS에 대한 이야기를 짧게 해보자. 🤔CSS는 복잡한 언어는 아니지만 작업이 커지고 코드가 많아질수록 불편함이 생기게 된다.예를들어 선택자(Selector)의 과용과 연산 기능의 한계, 구문(Statement)의 부재 ..

리액트 컴포넌트에서 다루는 데이터는 두개로 나뉜다. 바로 props 와 state 이다. 미리 요약하여 설명하면 props 는 부모 컴포넌트가 자식 컴포넌트에게 주는 값 이다. 자식 컴포넌트에서는 props 를 받아오기만하고, 받아온 props 를 직접 수정 할 수 는

리액트를 이용하여 웹페이지를 구현하는데 빠르게 아이콘을 사용하고 싶을때 react-icons를 사용할 수 있다.Font Awesome 만 사용하다가 처음 사용해본다.1.우선 해당 라이브러리를 설치해야한다.2.그리고 설치 후에 사이트 좌측을 보면 아이콘을 검색할 수 있는

지정되어있는 주소로 이동하는건 react-router-dom에 있는 ROUTER와 LINK로 구현한다. 매번 파라미터가 바뀌는 페이지로 이동하려면 동적 라우팅을 구현해야한다.라우트 경로 끝에 매번 바뀌는 id값을 저장한다.navigate 함수의 첫번째 인자에 이동하고

hook에서 useState로 state변수를 생성: 해당 state가 true가 되거나 값이 채워지면 요소가 보이게 하기, 여기서는 boolean을 사용하였다조건이 만족되면, setState를 이용해 state를 변경component를 return할 때, 해당 sta

reduce를 덧셈 함수로 알고 계신 분들이 많은데, 대부분의 사이트에서 reduce 사용 예시를 덧셈으로 들고 있기 때문.하지만 reduce에 대해 잘 못 알고 있었다!!...reduce 메서드는 다음과 같이 사용힌다. 이전값이 아니라 누적값이라는 것에 주의 해야한다

Material-UI는 높은 수준의 UI를 빠르고 효율적으로 개발할 수 있는 UI 도구입니다. Material-UI 구글의 Material Design UI 가이드라인을 바탕으로 하며 UI개발에 필요한 수많은 컴포넌트와 디자인 템플릿을 제공합니다. Material-U