state4 TodoList 추가 기능 구현 export default function Input({ setTodos }) { const [title, setTitle] = useState(""); const [contents, setContents] = useState(""); const handleSubmitChange = (event) => { event.preventDefault(); const newTodo = { title: title, contents: contents, isDone: false, id: uuidv4(), }; setTodos((prev) => { return [...prev, newTodo]; }); }; const handleTitleChange = (event) => { setTitle(event.target.va.. 2022. 12. 14. Redux Redux 상태를 중앙에서 관리하는것을 통해서 데이터가 우리가 예측하지 않은 대로 변형되는 가능성을 낮춰주는거 리액트나 리덕스는 개발의 복잡성을 낮춰주는 기술 비유: 리액트는 소문과 같고 리덕스는 미디어 같은느낌 소문은 필요없는 소문을 모든 사람이 다 들음 소문은 전판 되기 위해서는 집집마다 연결되어있어야함 리덕스 언론사 모든정보를 가지고 있어 리덕스 언론사에 전해주고 리덕스는 전체 컴포넌트에 방송한다 . 전체에게 하고싶은말이 있으면 리덕스 스토어에 전달하면 된다 필요한 컴포넌트들 에게만 정보를 전도할수있다. 소문 사이 리덕스 언론사를 세워준다 우리 복잡성을 낮춰준다 props가 리덕스 이용하지 않고 연결돼 있으면, 전자회로가 연결돼있는데 스위치가 하나라도 끊기면 맨 마지막 회로에서 전기를 못받는 거랑 .. 2022. 12. 9. 리액트 -Component 간단하게 사용자 정의 태그를 만드는 것! 규칙 -대문자로 함수를 만든다 -propps를 통해 외부로 부터 전달 받을 수 있다. propps는 component에게 속성을 전달한다. -component는 꼭 하나의 태그를 반환 해야함 -class 를 받을 때 className를 사용 -자바스크립트 파일을 작성할 때 {} 중괄호를 사용해야 한다. -state 컴포넌트에서 동적인 값을 state라고 부른다// 상태 관리 라이플사이크에 따라서 이 화면이 값이 변화되었을때 변화된 값을 화면에 리랜더링 시켜 주기 위한 조건들이 있는데 그 조건중 하나가 state 변경 되었을때 usestate는 state를 만들어주기 위해서 리액트에서 제공하는 기능/ 기능이라 안부르고 hook 이라고 부름 원시 .. 2022. 12. 9. react React 데이터를 State(내부상태) Props(외부로 부터 전달받은 상태) 나타내는 render가 있다. 상태가 변경될때마다 re-render 된다 실제로 변경된 부분만 화면에 업데이트 된다. Componnent(컴포넌트) 컴포넌트는 JavaScript의 함수와 유사, react 요소들을 받아 반환 받는다 function App() { const name = "teawook"; const list = ["우유", "딸기", "바나나"]; return ( {`hello ${name}`} {list.map(function (item) { return {item}; })} ); } export default App; 함수 컴포넌트 JSX JSX는 페이스북에서 스펙을 정의한 XML과 비슷한 자바스크립ㅌ 확.. 2022. 12. 7. 이전 1 다음
