본문 바로가기

웹 게임1

[React🌀] React로 2048 게임 만들기 ! 🎮 / 2️⃣ - 화면 레이아웃 잡기 화면 구성 우선, 게임을 구현하기 앞서, 2048 게임 화면엘 들어갈 요소들 레이아웃들을 정해줍시다. 저는 Ant Design 의 그리드 시스템과 Styled Component를 이용하여 스타일링을 했습니다! 이 부분에 대해서는 따로 설명하지 않을테니 잘 모르시는 분들은 스타일 컴퍼넌트 공식문서 나 제 Antd 포스팅 을 보시고 오는걸 권장합니다! 최종 화면은 다음과 같을 것이고, 저는 스타일링에는 재주가 없다보니, 스타일은 본인 취향에 맞게 꾸미시는거를 추천드립니다 ㅎㅎㅎ😜 시작합니다! 레이아웃 나누기 Ant Design 에서는 기본적으로 Row 와 Col 을 지원해서 Grid 시스템을 쉽게 쓸수 있게 해줍니다. 저는 다음과 같이 레이아웃을 나눠보았습니다. 게임에 관한 요소들이 들어있는 Game2048.. 2020. 8. 29.