React.js

🐶 리액트(React)를 이용해 이모지 빙고게임 만들기 🐶 노마드 코더 슬랙을 둘러보던 중, 빙고 게임을 과제로 만드시던 분이 빙고 검증에 대한 구현을 질문하셨다. 처음에는 Codesandbox에 돌아가는 코드를 만들어서 보여드리면 어떨까 생각하다가, "내 사이드 프로젝트로 좋을 것 같은데?"라는 생각에 바로 당일 빙고게임 사이드 프로젝트 작업을 시작했다. 컴포턴트(Component)화 시작하기에 앞서 생각났던 프로젝트가 바로 리액트 공식 문서에서 제공하는 튜토리얼인 틱택토 게임이었다. Board와 Squrare로 컴포넌트화 되어있던게 빙고에 적용하기 딱이였고, 똑같이 Board와 Square라는 컴포넌트를 만들어서 진행했다. 함수구현 빙고에서 구현해야할 함수는 다음과 같다. 1. 특정 칸 클릭시 해당 ..

🤔 리액트란? 리액트(React, React.js 또는 ReactJS)는 선언적, 효율적으로 유연하게 유저 인터페이스를 만들기 위한 자바스크립트 라이브러리의 하나로, 페이스북과 개별 개발자 및 기업들 공동체에 의해 유지보수되며 지금도 계속 업데이트 중인 프로젝트이다. 리액트의 개념은 다음과 같은 함수로 표현 가능하다. f(data) = View 페이지에 동적인 상호작용을 넣고 싶을 때 우리는 자바스크립트를 이용하게 된다. 하지만 웹 개발 시 DOM 관리 및 상태값 관리 작업은 프로젝트가 커질 수록 논리가 복잡해질 수록 귀찮고 머리 아파진다. 이러한 것들을 최소화하고 오직 기능 개발과 사용자 인터페이스(UI) 를 구현하는 것에 집중하기 위해 React 같은 라이브러리가 탄생되었다. 리액트의 특징 리액트는 ..