Arcane (5) - 개발2

2022. 12. 7. 17:13·프로젝트/개인 프로젝트 - Arcane
반응형

2-5. 라이엇 DDragon (Data Dragon)

본 프로젝트를 진행하면서 라이엇에게서 받아와야할것은 API뿐만 아니라 DDragon이라는 데이터 뭉치들을 받아와야만했다. DDragon은 라이엇이 아이템 정보나 챔피언 정보, 룬 정보 등등을 json파일로 정리해서 모아놓은 데이터 뭉치이다. 

 

우선 라이엇 개발자 페이지에서 상단의 DOCS를 눌러서 League of Legends문서로 들어가준다. 들어가서는 본인이 원하는 데이터 뭉치를 골라서 사용하면 된다. 사용하는 방법 또한 어렵지 않다.

 

아이템 데이터를 예로 설명을 하자면 우선 아이템 정보가 담겨있는 json 링크를 찾아준다.

ddragon 아이템 json

위에서 "Items"가 아이템 정보들이 담겨있는 json 파일이고 아래의 "Items Assets"은 말그대로 아이템 assets 사진이다(인게임속 템창 사진이라 생각하면댐).

 

http://ddragon.leagueoflegends.com/cdn/12.23.1/data/en_US/item.json

 

위 링크를 뜯어서 설명하면 cdn/ 여기까지는 공통이라 무시해도되고 그 뒤부터 설명하자면 12.23.1 = 버젼, en_US = 지역, item.json = 파일명 (data는 그냥 데이터란 의미라 그대로 쓰면댐)이다. 여기서 변경가능한건 버전과 지역이다. 만일 본인이 과거의 버전과 다른 지역의 아이템 정보를 원한다면 저 두 값만 바꿔주면 가능하다.

(해당 포스팅은 당시 최신 버전 기준임, 한국 기준으로 바꾸고 싶으면 "ko_KR"로 바꿔주면댐)

 

저 json파일을 누르면 아래 사진처럼 웹상에서 json 파일을 띄어줄것이다. 저는 웹브라우저로 크롬을 사용해서 크롬 기준으로 말씀드리자면 json파일이 읽기 힘들게 뜨시는 분은 크롬 확장자중 "JSON viewer"를 다운 받으시면 json 파일이 아래 사진처럼 읽기 좋게 표시됩니다.

item.json

위 사진을 보시면 현재 json 파일이 item 타입이란것과 그 외 정보들이 쭉 나열되있다. 필요없는 정보 칸은 접어두고 우리가 사용한 아이템정보를 보자면 아래 사진처럼 key값이 data인 곳에 하나의 객체로 들어있다. 

 

item.json data

data 안에는 각 아이템들이 각자의 번호를 가지고 나열되어 있으며 각 아이템은 각자의 기본 스텟 정보, 문서 정보, 이름, 이미지 파일명 등등을 가지고 있다. 위 사진을 예로 설명하자면 가장 첫번째 아이템은 1001번 아이템이고 해당 아이템명(name)은 "Boots" 즉 기본 신발(흔히 똥신)이다. 기본 신발의 설명(description)으론 태그들 사이에 껴있는 문장을 보면 "Move Speed"라는 설명이 들어있고 아래 사진엔 좀 짤렸지면 gold에는 300골드가 적혀있다. 또 image에 있는 .png 명을 아까의 assets링크의 끝에다 달아주면 아래 사진처럼 이미지 json이 웹 브라우저에 뜰것이다.

 

기본 신발 이미지

우리는 이 ddragon을 가지고 우리 프로젝트에서 불러와서 챔피언들의 사진이나 아이템 사진, 챔피언 설명, 이름 등등 롤과 관련된 다양한 정보들을 문서로 받아와서 프로젝트에 적용시켰다. 아마 모든 전적 검색 사이트들도 가장 처음은 여기서 데이터를 받아왔을 것이다.

 

참고로 API는 axios를 활용해서 불러왔지만 ddragon은 json파일 자체이기에 axios를 사용하지 않고 js에 있는 fetch만을 가지고도 불러올 수 있다. (물론 api도 fetch로 가능하겠지만 axios가 훨씬 편한걸~)

 

서버도 구축했고 프론트도 뼈대 작성했고 라이엇에서 데이터들도 받아들여왔으니 사실상 프로젝트를 위한 준비는 다 마친셈이다. 이제 프론트와 서버를 연결하면서 생기는 오류들을 고치고 기존에 기획했던 디자인데로 구현만 하면 됬었다. 하지만 그게 말처럼 쉽지는 않았고 처음하는거다 보니까 실수도 엄청 많고 오류도 무진장 많이 떴다...ㅎㅎ;;;

그래도 우여곡절 끝에 연결하고 개발을 진행하다보면 어느새 마무리 단계에 접어들고 이젠 배포만 하면됬었다.

처음에 생각한 배포는 그냥 이미 다 만들어진 코드 덩어리들을 어디에 업로드만 하면 되는거라 생각해서 되게 별거 없을거라 생각했다 ㅋ. (하지만 늘 인생은 뜻대로 되지 않는 법이란다...- 짱구 극장판 핸더랜드 中 - ) 

반응형

'프로젝트 > 개인 프로젝트 - Arcane' 카테고리의 다른 글

Arcane (6) - 배포1(서버 배포 AWS EC2)  (0) 2022.12.13
Arcane (4) - 개발  (2) 2022.12.06
Arcane (3) - 역할 분담 및 개발 시작  (0) 2022.12.04
Arcane (2) - 개발 도구 선택 및 디자인 초안 구성  (0) 2022.12.01
Arcane (1) - 아이디어 선정 & 개발 플랫폼 선정  (0) 2022.12.01
'프로젝트/개인 프로젝트 - Arcane' 카테고리의 다른 글
  • Arcane (6) - 배포1(서버 배포 AWS EC2)
  • Arcane (4) - 개발
  • Arcane (3) - 역할 분담 및 개발 시작
  • Arcane (2) - 개발 도구 선택 및 디자인 초안 구성
깨부
깨부
성공한 개발자가 되기 위해 깨지고 부서지며 성장하는 나의 모습을 기록해두는 곳
  • 깨부
    깨지고 부서지며 배우는 개발일지
    깨부
  • 전체
    오늘
    어제
    • 깨부 모음 (21)
      • 일상 (3)
        • SSAFY 13기 (2)
      • 취준로그 (0)
        • 2025년 하반기 (0)
        • 2026년 상반기 (0)
      • CS공부 (8)
        • 네트워크 (2)
        • 클라우드 (6)
      • 알고리즘 (0)
      • 프레임워크 (1)
        • Spring Boot (1)
      • 프로젝트 (7)
        • 개인 프로젝트 - Arcane (7)
        • 개인 프로젝트 - 별글 (0)
      • Git & Github (2)
      • Web-Developer (0)
  • 블로그 메뉴

    • 링크

    • 공지사항

    • 인기 글

    • 태그

      13기
      EIP
      서브넷
      깃
      깃허브
      퍼블릭
      git
      github
      React
      Riot
      Bastion
      SSAFY
      EC2
      AWS Session Manager
      NAT
      OSI 7계층
      취준
      프라이빗
      싸피
      AWS
      node.js
      프로젝트
      취업
      네트워크
      VPC
      Arcane
      IP
      개발자
      실무능력
      프로젝트관리
    • 최근 댓글

    • 최근 글

    • hELLO· Designed By정상우.v4.10.6
    깨부
    Arcane (5) - 개발2
    상단으로

    티스토리툴바