일단 시작하고 보자

프론트엔드 개발자 공고를 찾다보면 React, ReactNative, Flutter를 볼 수 있다. HTML, CSS, JS를 공부하면 프론트엔드 개발자로 일 할 수 있지 않을까? 라고 생각 할 수 있지만 그렇다면 저 3개는 도대체 무엇일까? 자세한 React에 대한 설명은 다른 글에서 더 자세히 다루는 것으로 하고 3가지에 대해 간단한 비교를 통해 알아보도록 하자! React? 💡 페이스북에서 만든 프론트엔드 JavaScript 라이브러리입니다. React-Native? 💡 React의 방식으로 네이티브 앱을 개발할 수 있는 페이스북의 오픈 소스 프레임워크입니다. 우선 react와 react native 둘의 공통점은 둘다 js 언어기반 이기에 문법이 같다. 그리고 react를 사용하던 유저라면 rea..

툴체인이란? 💡 툴체인(toolchain)은 주로 다른 컴퓨터 또는 시스템의 소프트웨어 제품을 만드는 데 사용되는 컴퓨터 프로그램 개발 도구들의 집합이다. 일반적으로 여기에 포함된 개발 도구들은 연쇄적으로 사용된다. 즉 어느 한 개발 도구의 출력은 다른 개발 도구의 입력이 된다. React 팀의 추천 방법 React를 배우고 있거나 아니면 새로운 싱글 페이지 앱을 만들고 싶다면 Create React App. 서버 렌더링 Node.js 웹사이트를 만들고 있다면 Next.js을 시도해보세요.. 고정적인 콘텐츠 지향적 웹사이트를 만들고 있다면 Gatsby를 시도해보세요.. 컴포넌트 라이브러리 혹은 이미 있는 코드 베이스에 통합을 한다면 더 유연한 툴체인. (숙련자에게 추천) CRA는 webpack, babe..

리액트 공식 홈페이지에 따르면 리액트는 자바스크립트 라이브러리다. 컴포넌트 리액트의 경우 컴포넌트 단위로 뷰들을 관리하는데 이를 통해 상태를 관리하고 불필요한 리렌더링을 최소화 할 수 있다. 컴포넌트, 뷰 이런 용어들에 대해서는 따로 정리를 하도록 하고, 쉽게 말해, 재사용성이 뛰어나고 유지보수, 추후 관리가 수월 하다는 점이 장점이다. 가상돔(Virtual DOM) 예전에 자바스크립트 공부를 하며 DOM에 대해 살짝 알아봤는데, 가상돔이라니 머리가 아프지만 왜 가상돔이 장점인가에 대해 알아보겠다. 리액트의 경우 render → 가상돔에 결과물을 저장 → 원래 돔과 가상돔의 결과를 비교 → 달라진 점을 최종 돔에 저장 이라는 프로세스를 거친다. 이는 매번 변화되지 않은 부분까지 렌더링을 하지 않고 달라진..