[HTML, CSS, Javascript] 롤 심리테스트 만들기

https://lolpersonalitytest.netlify.app/

롤 심리테스트

 

한창 mbti 심리테스트가 유행했을 때 나도 한번 만들어봐야지 하는 마음이 있었다.

 

어플도 다 만들고 시간이 남아 내가 자주하는 게임으로 심리 테스트를 만들어보았다.

 

서버는 netlify, 광고는 카카오 애드핏, 공유하기는 Add this를 사용했다.

 

기본 로직은 mbti 스타일이 아니라 질문마다 하나의 점수로 적립해서 결과를 뽑아내는 간단한 방식을 사용했다.

 

 

질문은 16가지로 프로그래스바와 이미지, 버튼 3개로 구성되어있다.

버튼을 클릭 시 버튼마다 0점, 1점, 2점씩 점수가 쌓이게 된다.

 

 

7가지의 결과는 로고와 이미지, 결과, 설명, 공유하기로 구성했고,

공유하기로 자신이 나온 결과를 보내는 기능도 구현했다.

 

 

 

 

mbit 테스트, mbti, 심리테스트, 심리테스트 만들기, 성격 유형 테스트, 롤 심리테스트, 협곡에서 알아보는 나의 심리는?