2021년 8월 27일 - 수익형앱 Mbti 테스트 만들기 개괄(2)

※ 본 내용은 개인 기록용입니다.

※ 조코딩 님의 강의를 토대로 작성되었습니다.

 

 

3. MBTI TEST 제작

• html 코드 작성 - UTF-8/LF로 작성 
• Bootstrap 이용해 간단한 버튼 배치
• Java Script 이용해 버튼을 누르면 문제가 나오는 동적인 처리 - 페이지 넘기기
• 게이지 바 생성, 각 버튼 사이 간격 조절
• 문제 + 답에 대한 값 저장
• 문제 선택지에 따라 점수 배부
• 각 문제에 해당하는 내용 객체로 저장
• 문제 클릭시 다음 페이지로 이동

 

 

☆ JS의 객체

var jsObject = {key : value}

jsObject[key] → value

 

var q = {

1: {"title" : "문제 1번", "type" : "EI", "A":"E", "B":"I"},

2: {"title" : "문제 2번", "type" : "SN", "A":"S", "B":"N"}

}

 

 

Q1. q[1]["title"]

→ 문제 1번

 

Q2. q[2]["type"]

→ SN

 

Q3. 문제 2번의 A 대답을 가져오려면?

→ q[2]["A"]