728x90

프로그래밍/React 6

[리액트] create-react-app github페이지 배포

https://create-react-app.dev/docs/deployment#github-pages Deployment | Create React App npm run build creates a build directory with a production build of your app. Set up your favorite HTTP server so that a visitor to your site is served index.html, and requests to static paths like /static/js/main..js are served with the contents of the /st create-react-app.dev 아래 내용은 위 create reate app의 내용을 번..

[React] Ref와 DOM

https://reactjs.org/docs/refs-and-the-dom.html Refs and the DOM – React A JavaScript library for building user interfaces reactjs.org Ref는 돔의 노드나 혹은 렌더 메소드안에서 생성된 리액트 요소에 접근하는 방법을 제공한다. 전형적인 리액트의 데이터 흐름에서는 오직 props만이 부모와 자식요소간 상호작용하는 방법이다. 이 방식에서는 자식요소를 수정은, 새로운 props와 함께 재렌더링하는 방식으로 이뤄진다. 하지만, 어떤 경우는 어쩔 수 없이 전형적인 데이터흐름과 다르게 자식을 수정해야한다. 재렌더링할 자식요소는 리액트 요소의 한 인스턴수가 될 수도 있고 또는 DOM요소가 될수도 있다. 이 두 경..

[React] 폴더 구조 Folder Structure

https://create-react-app.dev/docs/folder-structure Folder Structure | Create React App After creation, your project should look like this: create-react-app.dev 초기 폴더 및 파일 yarn, npx, npm등을 통해 Create react-app을 설치하면, 아래와 같이 폴더 및 파일이 생성된다. my-app/ README.md node_modules/ package.json public/ index.html favicon.ico src/ App.css App.js App.test.js index.css index.js logo.svg 이 상태에서 프로젝트를 빌드하면 아래와 같은 ..

[React] Create React App

https://create-react-app.dev/docs/getting-started/ Getting Started | Create React App Create React App is an officially supported way to create single-page React create-react-app.dev Create React App이란 스프링 프레임워크 초기 설정할 때 편리하게 사용했던 springinitializr.io와 비슷하다고 생각했다. Create React App은 페이스북사에서 리액트를 사용하는 많은 개발자들이 편리하게 사용하는 기능들을 한 번에 설치할 수 있게 해놓은 툴 사용법 npx create-react-app my-app // or npm init react-a..

[React] 리액트의 개념

리액트란?? Model View Controller모델에서 View를 담당하는 UI라이브러리이다. 프레임워크와 라이브러리의 차이? 프레임워크는 웹어플리케이션을 제어하는 모든 흐름을 프레임워크가 담당한다, 그러나 라이브러리는 어떤 기능을 하는 컴포넌트들의 모임으로 제어의 흐름은 개발자가 담당한다. 앵귤러는 프레임워크이고, 리액트는 라이브러리이다. 더보기 자바를 개발했던 경험으로 프레임워크와 import를 통해 불렀던 library를 비교를 해보자면, 우리는 프레임워크를 사용하기 위해서 굳이 무엇을 하지 않는다. 프레임워크를 설정하고 프로젝트를 생성하면 프레임워크 구동에 필요한 설정, 소스들이 자동 생성되고 우리는 프레임워크 규칙에 맞춰 코드를 생성한다. 프레임워크는 스캔을 통해 스스로 빈을 찾아 등록하고,..

728x90