[React🌀] React로 2048 게임 만들기 ! 🎮 / 1️⃣ - 기본 세팅 및 소개 / Clone Coding

2048 게임

한 때 친구들 폰에 하나씩은 꼭 깔려있던 게임인 2048 입니다.

컴퓨터 버전도 있더군요! 

참 특별할 거 없는데 뭔가 모르게 재밌습니다 ㅎㅎ 

게임 하나를 만들어보고 싶어서 고민하다가 직접 만드는건 재미가 너무없을 것 같아서 (창의력 부족 😥) 

2048 클론 코딩을 도전했습니다!

 

https://play2048.co/

2048

 

---

차별화

 클론 코딩의 장점은 내가 원하는 부분을 바꿀 수 있다는 점입니다.

그래서 어떤 점을 특별하게 하면 좋을까 생각을 해봤습니다!

 

•  여러가지 테마 선택 기능

2048 게임이 단순한 게임이다보니까 질려서 오래하지는 못하겠더라구요.

그래서 새로운 느낌을 줄 수 있는 테마 선택 기능을 만들어서 시각적으로 즐거움을 주기로 했습니다! 

 

•  4*4 뿐만이 아닌 여러 모드 선택 기능 

 기존의 2048 게임의 게임판은 항상 4 * 4 의 정사각형이었죠?

게임판을 바꿔보고 싶었습니다. 삼각형이나 육각형은 어떨까? 모양을 바꾸면 어떻게될까?

이런 생각들을 하다가 '아니면 게임판의 네모 숫자를 바꿔보면 어떨까?' 하는 생각이 들더군요.

모양 자체를 바꾸는 것 보다 좀 더 구현은 쉽지만 기존 버전과는 또 다른 느낌일 것 같아서 결정!

 

 

 

---

React 앱 생성

사용 언어및 프레임워크 :

•  React
• Typescript
• Ant design
• style-components 
• 기타 firebase (optional) 등등 모듈들

 

React app을 생성해줍니다! 저는 따로 만들고 있는 제 포트폴리오 사이트 일부 기능으로 추가했기에,

React app은 각자 용도에 맞게 생성해주세요 😊

만약 react를 생성할 줄 모르신다면 여기를 참조!

Ant design 을 써본적이 없으시다면 여기를 참조해주세요.

다른건 스스로 독학 ㅎㅎ 타입스크립트는 자바스크립트와 크게 다르지 않으니 그냥 보셔도 됩니다!

 

완성된 모습.

 

* 조만간 호스팅할 제 포트폴리오용 웹에 포함시켜서 넣을 예정입니다ㅎㅎ 

 

 

2부에서 계속됩니다!

 

 

 

 

* 다음 게임의 원 저작권은 2048 (https://play2048.co/) 에 있습니다