웹 기초 연습: 버튼 동작과 JSON 확인

1. 버튼을 누르기 전 결과 예상하기

가상 상품을 담은 횟수를 표시합니다. 실제 주문이나 결제는 발생하지 않습니다. 처음 횟수는 0이며, 기본 설정에서는 한 번 누를 때 1씩 늘어납니다.

담은 횟수

0

두 번 눌러 2가 되는지 확인한 뒤 0으로 되돌립니다. 이번에는 2씩 늘리기로 바꾸고 두 번 눌러 4가 되는지 확인하세요. 설정만 바꿨을 때는 현재 횟수가 변하지 않습니다.

버튼이 반응하지 않으면 페이지를 새로고침한 뒤 다시 시작합니다. 새로고침하면 횟수와 설정도 처음으로 돌아갑니다. 반복해서 반응이 없으면 브라우저 이름과 누른 버튼, 예상한 횟수를 메모해 도움을 요청하세요.

let count = 0;
const step = 1;
// 버튼을 누를 때 실행할 계산
count = count + step;
// 계산한 count를 화면에 표시

자바스크립트 설명으로 돌아가기

2. JSON의 형식과 내용 따로 확인하기

다음은 가상 상품의 원자료입니다. JSON은 프로그램이 읽을 수 있도록 정보를 적는 텍스트 형식입니다.

JSON 검사를 누르면 이곳에 결과가 나타납니다.

먼저 예제를 그대로 검사합니다. 다음에는 3000을 3500으로 바꾸고 다시 검사하세요. 문법은 맞아도 위 원자료의 가격과 달라집니다. 검사 통과가 내용까지 맞다는 뜻은 아닙니다.

오류도 확인하려면 마지막 상품 객체 뒤에 쉼표를 넣어 보세요. 오류가 나면 쉼표를 지우고 다시 검사합니다. 어디를 바꿨는지 모르겠다면 예제 다시 넣기로 돌아갑니다.

수정한 JSON과 확인한 이유를 평소 쓰는 메모장에 복사해 남기면 됩니다. 이 페이지를 새로고침하거나 닫으면 수정 내용은 저장되지 않습니다.

JSON 설명으로 돌아가기