728x90 반응형 타입스크립트로 함께하는 웹 풀 사이클 개발4 [TIL] 11/8 React.ts 살펴보기 1. 리액트 프로젝트 생성: CRA vs ViteCRA 는 초기설정과 구성을 자동화해서 개발자가 빠르게 리액트 앱을 생성할 수 있도록 도와준다. 웹팩과 바벨을 사용해서 개발 서버를 실행하고 HMR(Hot Mode Reloading)을 제공해준다. 웹팩을 통해 빌드시 코드를 컴파일하고 압축하는 역할도 해준다. (가장 대중적으로 많이 쓰임)+ 환경변수: process.env.KEY Vite 는 빠른 속도와 효율로 최근에 많이 주목 받고 있다. 웹팩 대신 롤업을 사용해서 빌드하는데, 웹팩에 비해 속도가 크게 개선된 버전이다. 또 HMR 에서 굉장히 빠른 속도를 자랑한다. CRA 는 HMR 을 할 때 소스 전체를 빌드하지만 Vite 는 모듈 단위로 빌드해서 브라우저에 제공하기 때문에 CRA 보다 속도가 빠르다... 2024. 11. 8. [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. [TIL] 11/4 프론트엔드 심화1 - 모르는거 정리 리액트 리덕스 정리본 상태의 일관성을 유지하고 디버깅이 쉬움불변성(Immutability): 리덕스는 상태를 직접 " data-og-host="everydayc0ding.tistory.com" data-og-source-url="https://everydayc0ding.tistory.com/entry/React-Redux-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0-feat-TypeScript" data-og-url="https://everydayc0ding.tistory.com/entry/React-Redux-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0-feat-TypeScript" data-og-image="https://scrap.kakaocdn.net/d.. 2024. 11. 4. [TIL] 8/13 깃과 깃허브, 깃 명령어, CLI vs GUI 1. 깃 기본 이론 깃은 분산식 버전관리 시스템 근데 깃이 뭐지?-> 포토샵을 하려고 포토샵 프로그램을 설치하는 것처럼 깃도 그냥 버전관리를 위해 로컬(내 컴퓨터)에 설치해서 사용하는 시스템-> 프로젝트를 복사해서 관리할 필요없이, 깃에게 기억해둘 버전을 기억하게 시키면 됨-> 깃허브랑 소통해서 자신이 기억하고 있는 버전들을 깃허브에게 줄 수 있음 그럼 깃허브는 뭐지?-> 깃이 기억하고 있는 버전들을 깃에게 받아서 가지고 있음-> 깃들이 한 군데 허브처럼 모일 수 있도록 공간을 제공하는 시스템-> 로컬(내 컴퓨터)이 아니라 원격으로 중앙에서 프로젝트를 백업/버전관리/협업을 가능하게 해주는 시스템-> 로컬과 별도로 버전관리를 함(별도로? 내가 이 버전을 가지고 있으라고 별도로 명령해야 함. 자동으로 버전관.. 2024. 8. 13. 이전 1 다음 728x90 반응형
