- 문제 설명 두 정수 left와 right가 매개변수로 주어집니다. left부터 right까지의 모든 수들 중에서, 약수의 개수가 짝수인 수는 더하고, 약수의 개수가 홀수인 수는 뺀 수를 return 하도록 solution 함수를 완성해주세요. 개인적으로 왜 1점 밖에 안 주지?하고 생각했던 문제였다. 생각보다 문제 푸는 방식이 복잡했다 ㅠㅠㅠ(이리저리 꼬여 있었던...) 도저히 어떻게 더 쉽게 풀 수 있을지 생각이 나지 않았다. 나는 조건에 맞게 각각 배열에 담아주는 방식을 사용하였다. 먼저, for문을 돌려 left부터 right까지의 숫자들을 arr 변수에 배열로 담아주었다. 그 다음은, for문 내에 중접for문을 하나 더 생성하여 i 를 j로 나눈 나머지가 0일때(약수) 변수 divis에 i를..

5-3. 페이지 의도적으로 가리기 1. 페이지를 왜 가려야 하는가? 버킷리스트 앱을 새로고침해보면 redux에 넣어둔 데이터 때문에 자꾸만 가짜 데이터 1개가 먼저 보임. 파이어스토어의 데이터만 제대로 보여주고 싶을 때 어떻게 하면 좋을까? => 파이어스토어에서 데이터를 가져올 때까지 페이지를 가려버리면 됨. 이 외에도 수정이나 추가하기 버튼을 눌렀을 대 여러 번 API를 호출하는 현상을 방지하기 위해 페이지를 가리기도 함. (네트워크 속도가 느린 곳에서 사이트를 이용시 하나의 글을 작성하고 그게 등록되어 화면에 보이기까지 시간이 꽤 오래 걸릴 수 있음. 사람들은 그걸 보고 글이 올라가지 않았다고 생각을 하고 글을 여러 번 등록하게 됨.) - 파이어스토어 데이터를 가져오기까지 보이는 화면. 리덕스에 넣어..

5-2. 머테리얼 UI 사용하기 - 부트스트랩처럼 이미 다 만들어진 ui를 가져다 쓰기. 머테리얼 ui는 우리가 styled-components를 쓰던 것처럼 사용할 수 있어요. 공식 문서( https://material-ui.com/ )에서 어떻게 생겼는 지 보고 사용 해봅시다! - 머테리얼 UI 설치하기. yarn add @material-ui/core @material-ui/icons 이런식으로 속성 설정을 통하여 컴포넌트의 스타일을 커스텀할 수 있음. ex) variants를 text로 하냐, contained로 하냐, outlined으로 하냐에 따라 버튼의 생김새가 달라짐. Text Contained Outlined ex) color를 secondary, success, error 등 무엇으로 ..

다시 만들 거니까 어떻게 생겼는지만 스크린샷... 찰칵 부정하지 않습니다... 개인적인 팬심으로 만들었슴... ///^-^///a - Start page - Quiz page - Score page - Message page - Ranking page useEffect와 useRef를 사용하여 해당하는 곳으로 scroll을 올리려고 했지만 useEffect를 이용했을 때 useRef의 값이 바로 들어오지 않아 scroll 실패... 아직 고칠 방법을 제대로 알지 못해 내부 overflow : scroll로 바꿔버렸다 ^-^(진짜 미치겠다...

아래 기획서를 보고, 퀴즈 시작하기 화면을 만들어보세요! 아래에 라는 자식 컴포넌트를 만들어서 해봅시다! → 숙제할 때는 꼭꼭 클래스형 컴포넌트를 쓸 필요 없어요! (해설 코드는 함수형 컴포넌트로 나갑니다.)우리가 배운 내용으로 위 페이지를 만들어봅시다. 이미지도 넣어보고, 내 친구가 이름을 넣을 텍스트 입력 인풋과 시작하기 버튼을 만들어요. [나는 {} 에 대해서...]부분에 {}는 state에 넣고 prop로 넘겨서 해보세요! - 기획서(레이아웃) 보기 - 내 과제물 다 하고나서 생각해보니까 난 prop으로 넘기지 않았다 ㅋ ㅋ ㅋ ㅋ ㅋ ㅋ... App.js에서 useState를 만들어두고 prop하는게 인상적이지만 그냥 Start component에서 모든걸 해결했다...:) 근데 과제 리뷰를 보..

2-1. 라이프 사이클 공부 후 업데이트 2-2. Ref Ref는 render 메서드에서 생성된 DOM 노드나 React 엘리먼트에 접근하는 방법을 제공함. - 주로 Ref를 사용할 때 포커스, 텍스트 선택영역, 혹은 미디어의 재생을 관리할 때. 애니메이션을 직접적으로 실행시킬 때. 서드 파티 DOM 라이브러리를 React와 같이 사용할 때. - Ref 생성하기 Ref는 React.createRef()를 통해 생성되고 ref 어트리뷰트를 통해 React 엘리먼트에 부착됨. 보통, 컴포넌트의 인스턴스가 생성될 때 Ref를 프로퍼티로서 추가하고, 그럼으로서 컴포넌트의 인스턴스의 어느 곳에서도 Ref에 접근할 수 있게 함. class MyComponent extends React.Component { cons..