니콜라스 선생님 강의중 바닐라 JS로 크롬앱 만들기에서 배운 지식들을 주로 활용하여 뭔가를 한번 만들어 보고 싶었는데, 마침 친구중에 음악하는 친구가 코드마다 음성이 나왔으면 좋겠다는 부탁으로 클론해본 Random Chord란 사이트를 나름제가 원하는 대로 클론코딩해보았어요~ 나름 강의에서 배운 Local Storage를 활용하면 할 수도있겠다라는 생각이 문득 들어서요! 바닐라 JS로 크롬앱 만들기 강의 들으셨던 분들이라면 분명 할수있을거같아요.

한번 도전해보세요 :)

원래 사이트:https://random-chord.com/

기능 추가해서 클론한 완성본:https://jacoong.github.io/random-chord/

기능

1. 시작시 노출되는 코드는 Notes와 Chords를 랜덤 합친값이고 해당 코드를 기본 브라우저 tot api를 사용하여 읽어주기 기능 구현

2. 설정에서 코드 추가시 첫번째 입력란은 노출되는 텍스트이고 > 두번째 입력란은 브라우저가 불러줬으면 하는 소리를 입력하는 란

3. 추가 코드와 설정에서 ON/Off 한 코드정보들은 로컬스토리지에 저장하여 브라우저를 종료하여도 값이 저장됨

4. 밑에 헤드폰 버튼을 ON/OFF시 코드를 읽어주고 A from / B from를 추가적으로 불러줄지 말지 정할수있음

느낀점

확실히 선생님의 친절한 설명으로 적지만 그래도 제가 머리속에 생각하였던 부분을 브라우져로 구현할수있었다는거에 자신감을 얻었고 이제막 리액트를 수강하였는데 리액트를 통해 다시 만들어보고

다른 강의들도 추가적으로 듣고싶다는 생각을 했습니다!! 감사합니다 ㅜㅜ