react-study

자바스크립트만드로 큰 APP들을 만들수 있는 시대가 왔습니다. 어플리케이션중 프론트엔드 사이드에서 돌아가는 애플리케이션을 관리하려면 자바스크립트만으로는 부족해 프레임워크가 많이 나왔습니다. 하지만 이런 프레임 워크들은 다양한 아키텍쳐를 사용하지만 라이브러리인 리엑트는

jsx는 자바스크립트의 확장문법이며 xml과 비슷한 형태입니다. 이러한 형태는 브라우저에서 실행되기전 코드가 바벨을 사용하여 일반 자바스크립트 코드로 변환하여 사용합니다.여기서 간단한 규칙을 지켜야됩니다.컴포넌트에 여러 요소가 있더라도 반드시 부모요소 한개로 감싸져야됩

컴포넌트에는 크게 두가지로 나뉩니다. 1\. 클래스형 컴포넌트 2.함수형 컴포넌트역할은 두 컴포넌트와 같지만 약간의 차이점이 있습니다.클래스형 컴포넌트 장점은 state 기능및 라이프 사이클의 기능을 사용할수 있다는 것과 임의 메서드를 정의할수 있다는 것입니다.하지만

useref나 map함수를 일단 패스하고 lifecycle method에 대해 정리해 보겠습니다. 일단 라이프 사이클을 알기위해서는 렌더링에 대하여 알아야됩니다. 돔이 생성되고 웹브라우저상에 나타나는 것을 마운트라고 합니다.마운트가 되면 초기 렌더링을 합니다. 그러고

component에는 두가지 종류가 있습니다. 클래스형 컴포넌트와 함수형 컴포넌트. 원래는 lifecycle을 이용할수 있다는 장점때문에 클래스형 component가 자주 이용되었지만 hooks가 개발된 이후부터는 함수형 component가 자주 이용되고 잇습니다. 리

리액트의 이벤트 시스템은 일반 javascript의 이벤트핸들링과 비슷합니다. 다만 차이점은 html이 읽어져서 Dom구조가 완성되어있는 일반 자바스크립트와는 달리 virtual Dom으로써 return을 읽어야만 Dom에 접근이 가능하므로 return이 된 이후에 또

일단용어를 명확히 해야될거 같아서 용어 정리부터 하고 가야될거같습니다.(일반)변수(var, const, let) : 불변성에 구애받지 않는 변수로써 언제든 바뀔수 있고 component마다 rerendering 될때마다 초기화가됩니다. 변수는 언제든 변경이 될수있고

Dom 선택자로 Dom에 이름을 달아주는 것이라고 보면됩니다. Dom자체에 변수를 입력하여 나중에 css를 변경하고 싶거나 자바스크립트 이벤트를 달아주는등을 할수 있습니다.특정 tag에 focus 등의 이벤트 적용하기,스크롤 박스 조작하기canvas 요소에 그림그리기

일단 라이프 사이클에 관련되서 설명을 해볼까합니다. 저는 리액트에서 라이프사이클이라는 단어를 처음 들었었고 영어다 보니 우리나라에서 잘 쓰이지 않는 단어라고 생각됩니다. 직역하면 생애주기라고 해석되며 어떤 물품, 생명이 만들어졌을때부터 없어질 때까지의 과정을 의미합

1. 훅스란? React 16.8버전부터 새로 추가된 class를 작성할 필요없이 상태값과 여러 React의 기능들을 사용하기 위해서 만든 api입니다. 1.1 훅스를 만들게 된 동기 class형은 컴포넌트에서 State와 관련된 로직을 재사용하기 어렵습니다.(s

요새는 코딩은 컴포넌트 구성되는 추세라고 현업자에게 들어본적이 있습니다.(youtude daqko님 말씀)그래서 컴포넌트별로 styling을 하는게 맞는건지 아니면 styling은 모아서 따로하는게 맞는건지 잘 모르겠지만 .. 이 장에서는 css styling부터 co