728x90 반응형 분류 전체보기169 [TIL] 11/7 프론트엔드 심화4 - React Beautiful Dnd, firebase 로그인 구현, 배포하기 1. React Beautiful Dnd 2. 로그인 구현하기 2.1. firebase 연결하기 파이어베이스 설치npm i firebase /src/firebase.ts 에 붙여 넣어주기 (사실 더 자세한 건 파이어베이스 홈페이지에서 웹 만들면서 직접 참고하기)// Import the functions you need from the SDKs you needimport { initializeApp } from "firebase/app";// TODO: Add SDKs for Firebase products that you want to use// https://firebase.google.com/docs/web/setup#available-libraries// Your web app's Firebase.. 2024. 11. 7. [React] Redux 사용하기 (feat. TypeScript) 1. redux 1.1. 리덕스란?단일 저장소(store): 리덕스는 하나의 중앙 저장소를 통해 애플리케이션의 상태를 관리 -> 상태의 일관성을 유지하고 디버깅이 쉬움불변성(Immutability): 리덕스는 상태를 직접 변경하는 것을 금지하고, 상태가 갱신될 때는 새로운 객체를 반환 -> 직접 상태를 변경하는 것이 아니기 때문에 예측 가능성을 높이고 상태 관리의 안정성을 제공액션(Actions) & 리듀서(Reducers): 상태를 변경할 때는 액션 객체를 디스패치하고, 리듀서는 이 액션에 따라 새로운 상태를 반환 -> 이를 통해 상태 변경 로직이 예측 가능하고 테스트하기 쉬움 - 리액트에서는 이미 state 랑 props 로 상태 관리 잘하고 있는데 (feat. 리덕스를 쓰는 이유)? 리액트에서 데이.. 2024. 11. 7. [TIL] 11/6 프론트엔드 심화3 - 모르는 것 정리 보호되어 있는 글 입니다. 2024. 11. 6. [TIL] 11/5 프론트엔드 심화2 - 몰랐던 부분 정리 1. useState 상태 변경 함수의 타입 정의 isFormOpen, setIsFormOpen 을 props 를 이용해 다른 컴포넌트로 보내어 사용해야 하는 상황에서는 props 의 타입을 정해줘야 한다. const [isFormOpen, setIsFormOpen] = useState(false);import React, { FC } from 'react'import { FiPlusCircle } from 'react-icons/fi'type TFormProps = { isFormOpen: boolean, setIsFormOpen: React.Dispatch>}const SideForm: FC = ({isFormOpen, setIsFormOpen}) => { return ( /.. 2024. 11. 5. 이전 1 ··· 3 4 5 6 7 8 9 ··· 43 다음 728x90 반응형