ChatGPT로 천자문 게임 만들기(2)

기억력 게임 카피해서 소스 수정

 

See the Pen chunjamun-game by imissrose (@imissrose) on CodePen.

 

chunjamun.json

[
    {"num": "1",
     "initialSound": "ㅊㅈㅎㅎ ㅇㅈㅎㅎ",
     "soundAndMeaningText": "천지현황 우주홍황 天地玄黃 宇宙洪荒",
     "meaningText": "하늘은 검고 땅은 누렇고, 우주는 넓고 거칠다."
    },
    {"num": "2",
     "initialSound": "ㅇㅇㅇㅊ ㅈㅅㅇㅈ",
     "soundAndMeaningText": "일월영측 진수열장 日月盈昃 辰宿列張",
     "meaningText": "해와 달은 차고 기울며, 별과 별자리는 열을 이루어 펼쳐져 있다."
    }
]

 

chunjamun1.json

[
    {
      "hanja": "天",
      "meaning": "하늘",
      "pronunciation": "천"
    },
    {
      "hanja": "地",
      "meaning": "땅",
      "pronunciation": "지"
    },
    {
      "hanja": "玄",
      "meaning": "검을",
      "pronunciation": "현"
    },
    {
      "hanja": "黃",
      "meaning": "누를",
      "pronunciation": "황"
    },
    {
      "hanja": "宇",
      "meaning": "집",
      "pronunciation": "우"
    },
    {
      "hanja": "宙",
      "meaning": "집",
      "pronunciation": "주"
    },
    {
      "hanja": "洪",
      "meaning": "넓을",
      "pronunciation": "홍"
    },
    {
      "hanja": "荒",
      "meaning": "넓을",
      "pronunciation": "황"
    }
  ]

 

chunjamun2.json

[
    {
      "hanja": "日",
      "meaning": "날",
      "pronunciation": "일"
    },
    {
      "hanja": "月",
      "meaning": "달",
      "pronunciation": "월"
    },
    {
      "hanja": "盈",
      "meaning": "찰",
      "pronunciation": "영"
    },
    {
      "hanja": "昃",
      "meaning": "기울",
      "pronunciation": "측"
    },
    {
        "hanja": "辰",
        "meaning": "별",
        "pronunciation": "진"
      },
      {
        "hanja": "宿",
        "meaning": "잘",
        "pronunciation": "숙"
      },
      {
        "hanja": "列",
        "meaning": "벌일",
        "pronunciation": "열"
      },
      {
        "hanja": "張",
        "meaning": "베풀",
        "pronunciation": "장"
      }
  ]

 

 

웹서버 설치

Visual Studio Code에서 상단 메뉴 Terminal -> New Terminal

npm install -g http-server

 

 

웹서버 실행

http-server

 

 

브라우저에서 실행

url : http://localhost:8080/index.html?fileName=chunjamun&num=1