일본 여행 기념 히라가나/가타카나 연습 페이지

https://dongkam5.github.io/HIRA_KATA_PRAC/

INDEX

여기서 하시면 됩니당

 

 

 

 

 

 

 

 

 

 

https://github.com/dongkam5/HIRA_KATA_PRAC <-- 코드링크
https://dongkam.tistory.com/357 <-- 이전 버전(only 히라가나)  블로그 링크

개요

• 일본 여행 기념으로 히라가나/가타카나를 연습해 볼 수 있는 간단한 웹앱 제작

사용 기술

• HTML5, CSS, JAVASCRIPT

구현 기능

1. index.html에 접속을 하면 환영문구를 띄우고, 연습하고 싶은 타입 (히라가나,가타카나)을 선택하도록 한다.
2. 해당 문자 타입 문서에(히라가나 or 가타카나)접속을 하면, 랜덤으로 (히라가나 or 가타카나) 문자가 나오고, 랜덤으로 생성된 보기 (발음)이 나온다. 해당 문자에 맞는 음을 선택
3. 정답이면 "정답입니다" 문자 출력 후, 3초 뒤에 다른 문자를 랜덤으로 출력
4. 오답이면 "틀렸습니다. 다시 선택해주세요!" 라는 문자 출력
5. "GO TO HOME" 링크를 누르면, 홈으로 돌아간다.

소감 / 발전 방향

• 짧은 시간에 재미로 만든 페이지라 퀄리티가 떨어진다. index 페이지를 만들고, 연습하고 싶은 문자 종류(히라가나/가타카나)를 고를 수 있게 하고, 히라가나 연습 기능도 추가한 버전을 만들어 봐야겠다. --> 이 부분은 업데이트를 했다.
• 부트스트랩을 이용해서 좀 더 깔끔하고, 멋진 레이아웃을 구성해봐야겠다. --> 구성해봐야겠다!
• 일본여행을 같이 간 친구에게 사용을 해보라고 했더니, 생각보다 만족해줘서 뿌듯했다. 서비스는 사용자의 니즈를 파악하는 것이 중요한 것 같다. --> 다시 써보라고 해야겠다.