본문 바로가기
반응형

react3

React + Vite .env 환경변수로 개발 환경(profile)나누기 우선 Vite는 아래의 설명처럼 빌드도구입니다.Vite(프랑스어로 "빠르다(Quick)"를 의미하며, 발음은 "veet"와 비슷한 /vit/ 입니다.)는빠르고 간결한 모던 웹 프로젝트 개발 경험에 초점을 맞춰 탄생한 빌드 도구!참고 : https://ko.vite.dev/guide/env-and-modeReact에서 Vite를 사용하고 있다면 환경변수에 접근하기 위해서는import.meta.env객체를 이용해서 접근합니다.예를 들어 소스에서의 사용은 아래와 같이 사용합니다.이제 dev, prod환경별 변수를 사용하기 위해서. env파일을 생성하고 환경별로 가져다가 사용해 보겠습니다..env는 공통적으로 사용할 내용.env.development는 dev환경에서 사용할 내용.env.production은 pr.. 2024. 12. 18.
10) ENS Project - CSS Framework 사용해보기 OverviewReact로 개발 시 디자인을 무에서 유를 창조하기에는 힘들다.이런 힘듬을 보완하기 위해 CSS Framework인 MUI를 사용하여 Ui 구성요소를 살펴보고 사용해보기로 한다.Example아래의 예제를 셋팅해서 띄워보고 컴포넌트들을 살펴보자.https://github.com/marmelab/material-ui-react-admin?tab=readme-ov-filehttps://marmelab.com/react-admin/Features.htmlhttps://marmelab.com/react-admin/CreateReactAdmin.htmlCreateReactAdminCSS Framework를 통해 우선적으로 개발 진행여러가지 Framework가 있지만 우선 아래의 Framework를 사.. 2024. 11. 4.
9) ENS Project - 프론트엔드 후딱 학습하기(React Deep Dive!!) 2024.10.15 - [Front/React.js] - 8) ENS Project - 프론트엔드 후딱 학습하기(리액트 컴포넌트, JSX, 속성, 상태)저번시간에 이어서 오늘은 더욱 더 깊은 심화과정 입니다! 저장을 잘하면서 포스팅 해보도록 하겠습니다:)Point!!- JSX를 꼭 사용하지 않아도 되는 이유- 컴포넌트 트리를 설계하는 방법 + 프로젝트를 더 효율적으로 구성하는 방법- State 사용의 상급 개념과 특정 상급 개념을 살펴봅니다.     ㄴ 저번시간엔 useState()를 사용했습니다.- 자주 사용되는 중요 패턴과 Best Practices를 살펴봅니다.JSX를 꼭 사용하지 않아도 되는 이유?React Code는 Build Process를 통해서 변경 됩니다. 결과적으로 배포가능한 파일로 말.. 2024. 10. 31.
반응형