본문 바로가기

JavaScript7

[REACT][TYPESCRIPT] 방치형 고양이키우기 만들기 #1 프로젝트생성과 기본틀 제작 보호되어 있는 글 입니다. 2023. 10. 5.
Chrome Javascript MediaDevices.getUserMedia() http Permission error 보안문제로 인하여 MDN에서 MediaDevices Function은 https 에서만 접근을 허용해줌. 이에 개발환경 등에서 작업시 http접근 허용이 가능하도록 세팅이 필요함. 1. chrome://flags/ 2. Search unsafely-treat-insecure-origin-as-secure 3. Enter the domain you want to allow access to in the input field and select "Enabled". - 하단 사진의 Input 영역에 도메인주소를 입력 후 Enabled 선택 4. Reboot the web after clicking "relaunch" - relaunch 클릭 후 웹 재부팅 2023. 9. 22.
[javascript] local image File path 로컬 이미지 미리보기 / fakepath 로컬 img 이미지파일을 input 태그 type="file" 를 이용하여 업로드시킬 때 fakePath 로 나와 url로 활용하기가 어려웠었습니다. 이때 input 태그의 onChange 함수에서 간단한 코드 추가로 쉽게 처리가 가능합니다. 아래 예제를 통해 확인해주세요. { ... const [imageUrl, setImageUrl] = useState(); const loadImg = (event) => { let value = URL.createObjectURL(event.target.files[0]); setImageUrl(value); } ... return ( ... 이미지를 선택하세요: loadImg(e)}/> ... ) 2023. 2. 20.
[JavaScript] rest & delete 연산자 / 불변성을 유지하며 Object에서 내부 key 삭제하기 https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/delete delete 연산자 - JavaScript | MDN delete 연산자는 객체의 속성을 제거합니다. 제거한 객체의 참조를 어디에서도 사용하지 않는다면 나중에 자원을 회수합니다. developer.mozilla.org 개발을 하다보면 parameter로 사용된 객체에서 더이상 사용되지않거나, 삭제하고 다른 용도로 사용하고 싶어 특정 key값만 삭제하려는 경우가 있다. 이때 해당 Key를 삭제하며 불변성을 유지하며 사용하는 법에 대하여 작성하였습니다. // (delete) 아래는 gaetaeng이라는 객체가 존재하고 어차피 없는 money 라는 key를 삭제하는 코.. 2023. 2. 8.
[javascript] 클로저를 활용한 static 변수 만들기 자바스크립트에서는 C, JAVA와 같은 static 정적 변수가 존재하지않아 필요한 경우 사용에 조금 불편함이 있습니다. 그래서 static 변수를 구현하여 유사하게 사용이 가능합니다. (전역변수는 간단하게 static처럼 사용이 가능하지만 어떤 언어든 전역변수는 좋지않다라는 생각을 하고있어 따로 설명하지 않았습니다.) 아래 코드를 참조하여 사용하시면 됩니다. let getStaticValue = ((value) => { let i = value; return function() { return ++i; } })(0); console.log(getStaticValue()) //output : 1 console.log(getStaticValue()) //output : 2 console.log(getSta.. 2023. 1. 27.
[개탱][javascript] 꼬맨틀 매크로 만들기 (문제시 말씀해 주시면 수정 또는 삭제하겠습니다!) (게임을 재미없게 만드는 방법이니 공부 또는 재미 목적으로 읽어주시면 감사합니다!) Q. 꼬맨틀은 무엇인가요? A.꼬맨틀은 오늘의 단어를 맞히는 게임입니다. 정답 단어를 추측하면, 추측한 단어가 정답 단어와 얼마나 유사한지 유사도 점수로 알려줍니다. 가장 유사한 단어의 유사도와 가까운 단어를 추측하면서, 정답 단어를 맞혀보세요. (자세한 건 하단 꼬맨틀 링크) https://semantle-ko.newsjel.ly/ 꼬맨틀 - 단어 유사도 추측 게임 - 뉴스젤리 : 데이터 시각화 전문 기업 하루에 한 번, 오늘의 단어를 맞혀보세요. 단어를 입력하면 정답 단어와의 유사도를 보여줍니다. semantle-ko.newsjel.ly:443 꼬맨틀 문제를 풀어오던.. 2023. 1. 25.