React15 React) 상수데이터 과제를 하기전에.. 아직 배우지 않은 상수데이터에 대해 나오길래 한번 정리를 해보았다. 전에 댓글 구현할때 애먹었던..Javascript의 map을 여기서도 또 쓰게되었는데.. 제발 이쯤되면 익숙해지자..나자신.. 😂 상수데이터란? UI 구성에는 필요하지만 동적으로 변하지 않아서 백엔드로부터 API 등을 통해서 데이터를 가져올 필요가 없는 변하지 않는 정적 데이터를 말한다. 그래서 상수데이터로 UI를 만들때는 백엔드에 요청하지 않고 컴포넌트에서 만들 수 있다. 왜 어떻게 상수데이터를 쓸까? : UI를 보다 효율적으로 확장성 있게 구성할 수 있으며, 특히 반복되는 UI구조는 상수데이터와 map 메서드를 이용하여 간결하게 표현이 가능하고, 그래서 유지보수가 용이하기 때문에 이용한다고 한다. 이러한 상수데이터.. 2023. 1. 29. React) Instagram 간단하게 한 클론코딩 (댓글추가 구현) 인스타 그램 클론코딩 중 내가 아주 애먹었던 😂 댓글구현 과정.. 드디어.. 이해가좀 되어 이렇게 정리하면서 업로드 해본다 👀👊 내가 한 방법은 1. 댓글을에 입력하면 comment 라는 state(초기값=[])에 받아와서 commentList라는 state에 추가하고, 2. 그 배열 형태롤 추가한 commentList에 map함수를 돌려서 배열안에 있는 데이터를 하나씩 가져온 후 3. 배열에서 가지고온 데이터를 라는 컴포넌트에 props로 넘겨주었고, 4. 댓글이 꾸려지도록 가져온 {props.data.commentItem} 로 구현해 보았다. 말로 풀어봤지만.. 뭐라는거지..? 라도 할 수 있으니 코드도 한번 넣어보았다...ㅠ //Main.js function MainFeed() { const [co.. 2023. 1. 28. React) Use State (예제 2개 포함) State? : 컴포넌트가 가질 수 있는 상태 useState? : 우리 컴포넌트의 상태를 간편하게 생성하고, 업데이트 시킬 수 있게 해 주는 도구를 제공해 준다. const [state, setState] = useState(초기값); // state 생성과 함께 가져야할 초기값을 useSate 함수의 인자로 넣어주면 //state와 setState라는 두가지 요소를 배열 형태로 return 해 준다. - state(변수) : 현재 상태 값 - setState(함수) : state를 변경시켜주고 싶을 때 더보기 예시) const [time, setTime] = useState(5); // 컴포넌트 안에는 time 이라는 state 가 생성되고, 초기값은 5시 를 갖게됨 // 이때, 시간을 변경하고 싶으.. 2023. 1. 24. 이전 1 2 3 다음