전체 글 (215) 썸네일형 리스트형 Recoil https://recoiljs.org/ko/docs/introduction/core-concepts 리액트 조건문 https://velog.io/@zero_mountain/React-%EB%A6%AC%EC%95%A1%ED%8A%B8-%EC%A1%B0%EA%B1%B4%EB%AC%B8 ss https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/toLocaleString React Js Master #8 지금 작성하는 atom이라던가 모든 것 분리 할 것 임. 1. src > components 폴더 생성 > toDoList.tsx 파일 이동 2. const toDoState = atom({ key:"toDo", default: [ ] //빈 배열 }) 3. function ToDoList(){ const value = useRecoilValue(toDoList); // 위 아래 각각 atom에 기존 값을 가져오고, 변경하는 함수로 사용 하였는데 const modFn = useSetRecoilState(toDoList) // } function ToDoList(){ const [value, modFn]= useRecoilState(toDoList);// const[x, setX] =useState()처럼.. React Js Master #7 React-hook-form ,register,watch, ,handleSubmit, formState react-hook-form react에서 form 만들기 편한 방법 . 사용하기 쉬운 유효성 검사를 통해 성능이 뛰어나고 유연하며 확장 가능한 form. 이 것을 사용하지 않으면 많은 input form에 대해 일일이 useState() 사용 해야 함. 1.npm i react-hook-form 2. import {useForm } from "react-hook-form"; 3.const { register } = useForm(); useForm의 register을 사용하면 onChange와 관련된 핸들러를 작성할 필요 없다. function ToDoList() { const { register } = useForm(); console.log(register("toDo")); return ( Add .. React Js Master #6 state management Recoil Recoil: React JS에서 사용 할 수 있는 state management library recoil 없이 theme 만들기 1.우선 index .tsx에 있는 themeprovider --> app.tsx로 이동, import app.tsx import { theme } from "./theme"; import { ThemeProvider } from "styled-components"; function App() { return ( ); } Question: why should we move the to App.tsx to use "state"? Can't we use it on index.tsx? Yes we can, but I want to send the dark mode prop als.. React Js Master #5 Chart,React-ApexCharts,react-helmet,BrowserRouter deploy 할 때 어떤 화폐의 chart를 가져올 것인가가 문제인데 1.useparams()를 이용해 가져올 수 있지만 상위의 컴포넌트인 coin에서 useparams를 가져와서 사용하고 있기 때문에 두번 적지말고 props로 넘겨주기 https://github.com/UHyun-K/react-master/commit/ca3ba659333e6e53e000c082846b669c9eb0c422 chart fetch api, react-query · UHyun-K/react-master@ca3ba65 This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository. github.com dat.. React Js Master #4 useMatch, useQuery, QueryClientprovider Nested Router, Nested Route는 route 안에 있는 또 다른 route이다. price, chart 컴포넌트 각각 생성 v6 사용하시는 분들 nested routes 작성 방법이 달라진 것 같습니다. https://ui.dev/react-router-nested-routes/ 여기서 알기 쉽게 차근차근 설명해주네요 v6에서 nested routes를 구현하는 방법은 두 가지가 있습니다. 첫 번째는 부모 route의 path 마지막에 /*를 적어 명시적으로 이 route의 내부에서 nested route가 render 될 수 있음을 표시하고 자식 route를 부모 route의 element 내부에 작성하는 방법입니다. 이 방법이 이 영상에서 니코가 하는 방법과 유사합니다. 실제 코딩은.. 이전 1 ··· 7 8 9 10 11 12 13 ··· 27 다음