Community

개발자 99% 커뮤니티에서 수다 떨어요!

← Go back

키보드 키 입력 테스트 프로그램

#side_projects
2년 전
7,867
5

처음으로 직접 Webpack5 빌드를 통해 만든 웹, 데스크탑 애플리케이션입니다.

Webpack5와 React 기반으로 다져진 애플리케이션이며,

스타일은 SCSS로 작성 적용 하였습니다.

Electron 빌드로 데스크탑 애플리케이션으로도 사용 가능하도록 빌드된 파일을 응용 프로그램으로 빌드하여 데스크탑에서 설치로도 사용이 가능하도록 하였습니다.

배포 버전은 아래에서 확인 가능합니다. v 2.1.0

데스크탑 앱 설치 : https://github.com/jiwooproity/keyboard-checker/releases

: https://fluffy-meringue-43bd0f.netlify.app/

기능

다크모드 : 2.1.0 추가

메모장 키 입력 테스트 ( 키보드를 통해 직접 메모장에 글을 작성하여 테스트 가능 )

키 입력 상태 확인 ( 키보드 UI 상태 표기 )

키 입력 시간 스캔 ( 누른 상태에서 입력이 풀리는 지 확인 가능 )

5 comments
euskate07 2년 전
멋지네요!
max99 2년 전
오오....! 반응속도까지 볼 수 있는 게 너무 좋네요 ㅎㅎ 새 키보드 사면 테스트해보기 좋은 것 같아요! 어떤 방식으로 구현하신 건지도 넘나 궁금하네요 👀
jiwooproity 2년 전
@max99 소중한 답글 감사합니다!
간단하게 keydown, keyup 이벤트를 사용해 처리하고,
각 이벤트마다 performance 메서드를 활용하여 입력 시간을 계산하였습니다!
더 나은 기능으로 찾아뵐 수 있도록 하겠습니당!
borakim 2년 전
와 이거 키보드 입력 시간이 나오니까 너무 재밌네요!! 메모장에 들어갈때는 속도 입력이 따로 안뜨는군요..! 풀배열이 아닌데 저도 모르게 키패드 막 누르고 있었네요 ㅎㅎㅎ ui도 깔끔해서 좋았습니다!! 너무 잘 만드셨어요 ~!!!
jiwooproity 2년 전
@borakim 소중한 답글 감사합니다 !!
나중에 풀배열도 입력할 수 있도록 업데이트 예정이라 나중에도 필요하시면 이용 부탁드려요!!
메모장 관련해서는 키 입력 이벤트 중에 다소 문제가 발생하여 일단 표기는 안되도록 해 둔 상태입니다.
가능하면 메모장 입력 시에도 반응속도를 확인할 수 있도록 조금 더 개선해서 찾아 뵐 수 있도록 할게요! 감사합니다 !!