[Rookies 개발 2기] React MUI 정리
0. 개요과정명 : 지능형 애플리케이션 개발자 양성과정 MUI는 React에서 사용할 수 있는 UI 탬플릿으로, 컴포넌트를 사용하듯이 불러와 세팅하면 바로 사용 가능하다.https://mui.com/ MUI: The React component library you always wantedMUI provides a simple, customizable, and accessible library of React components. Follow your own design system, or start with Material Design.mui.com 이번에는 create-react-app이 아닌 vite를 사용해 개발해 볼것이다. create-react-app은 이전부터 많이 사용했지만, 업데이트 및..
[Rookies 개발 2기] React Hook 정리
0. 개요과정명 : 지능형 애플리케이션 개발자 양성과정 리액트 16부터 추가된 기능으로, 함수형 컴포넌트에 훅이 추가되어 리액트 개발 방식이 바뀌게 되었다. 기존의 객체형 컴포넌트의 기능을 비슷하게 처리한다. 리엑트에서 기본적으로 제공하는 훅과 개발자가 정의해서 사용하는 훅이 있다. 1. 대표적인 HookuseState : 상태변수를 지정하여 화면갱신에 영향을 준다useRef : 화면을 갱신시키지 않는 변수를 선언한다useEffect : 컴포넌트의 생애주기 메소드를 대체한다. 화면이 갱신될 때 주로 사용한다useMemo : 상태변수 메모이제이션, 메모리에 저장하여 사용할 때마다 메모리에서 참조한다useCallback : 함수 메모이제이션useContext : 여러 컴포넌트가 접근하여 사용하는 데이터를 ..
[Rookies 개발 2기] React 정리
0. 개요과정명 : 지능형 애플리케이션 개발자 양성과정 저번에는 CDN방식으로, 단순히 코드만 불러와 작동해보았다. 이번에는 npm방식으로 React 개발환경을 구축해서 React서버도 열어보면서 진행한다. 당연하지만 node.js는 깔려있어야 한다. 설치한 뒤 터미널에서 npm -v를 입력하여 버전이 잘 뜨는지 확인하자 또한 vscode같은 IDE도 같이 준비해주면 좋다 1. 설치 본인은 MacOS에서 하고있어 MacOS기준으로 작성할 것이다. React의 명령어는 CLI(Command Line Interface)구조로 이루어져 있어 명령어를 직접 입력해야한다.sudo npm install create-react-app npm을 통해서 create-react-app을 설치해준다. sudo는 관리자..
[Rookies 개발 2기] React 정리 - CDN방식
0. 개요과정명 : 지능형 애플리케이션 개발자 양성과정 React는 meta에서 개발한 Javascript / Typescript기반 웹 프레임워크 라이브러리이다. 전세계적으로 인기가 많은 라이브러리이고 전자정부 프레임워크로도 있을 정도로 많이 사용한다.https://github.com/eGovFramework/egovframe-template-simple-react GitHub - eGovFramework/egovframe-template-simple-reactContribute to eGovFramework/egovframe-template-simple-react development by creating an account on GitHub.github.comhttps://trends.stack..