안녕하세요 상훈입니다. Javascript 에서 window.location 을 이용하여 개발/테스트/운영을 구분하기 위해서 쓸 수 있는 간단한 스크립트를 소개합니다. 물론 제약사항이 존재합니다. 예를 들어 devURL, tstURL, URL 이런식으로 접두 주소를 가지고 있어야합니다. 바로 보시죠 window.location 이용하기 //개발모드 확인하기 window.location.hostname.startsWith('dev') //테스트모드 확인하기 window.location.hostname.startsWith('tst') 이런식으로 사용할 수 있네요. return 되는 결과는 boolean 입니다 ( true / false ) window.location.hostname.startsWith() ..

FrontEnd/JavaScript 2023. 12. 20. 18:48

안녕하세요 상훈입니다. ChatGPT OpenAI 의 API 를 사용하려고 하는데, 위와같은 에러가 발생하였습니다. 이와 같은 경우, 기준치 사용량을 초과했다는 뜻입니다. 제 경우에는 반대로 billing 설정을 안해서 이렇게 되었더군요.. ㅎㅎ 그래서 Free Trial 에서 Upgrade 해주었습니다. 이상입니다. ChatGPT가 활성화가 되면서 블로그의 값어치가 뚝 떨어졌다는 것이 느껴졌습니다. 기존에 10개의 글을 검색했을 때는 여러 블로그를 살펴보았지만, 지금은 저로서도 ChatGPT 를 사용하고 블로그를 들어가지 않게 되네요. 또한 Bing 의 AI 도 웹 서칭엔진 등을 이용하여 웹 스크래핑하기에 무척 뛰어나더군요. 그래서 있던 광고들을 모두 내렸습니다. 수익성이 거의 전무하다보니 그냥 내려버..

FrontEnd/JavaScript 2023. 3. 22. 11:03

안녕하세요 상훈입니다! 구글 애드센스가 끊긴지도.... 어언 2주가 되어가네요! 하하 빌어먹게도 멋진 녀석 같으니라고^^7 도움이 되셨다면 광고 한번 클릭해주세요. 블로그 운영에 큰 힘이 됩니다. 감사합니다. 자바스크립트로 데이터를 받아왔는데, 숫자만 출력하고 싶습니다. 어떻게 해야할까요? let str = "안녕하세요1239입니다."; str = replaceAll(/[^0-9]/g, ""); 로 간단하게 처리가 가능합니다. 사용 방법은 아래와 같습니다. str.replaceAll(없애고싶은내용, 바꿀내용); 사용 예시를 작성해보겠습니다! 숫자의 데이터가 필요한 상황인데, 애석하게도 숫자만 온게 아니라 문자가 포함된 문자열로 출력되었다는 가정입니다. function changeLetter (str, s..

FrontEnd/JavaScript 2022. 9. 24. 00:10

도움이 되셨다면 광고 한번 클릭해주세요. 블로그 운영에 큰 힘이 됩니다. 감사합니다. 안녕하세요 상훈입니다. json 객체(object) 형태의 문자열을 json 객체화 하려면 간단하게 JSON.parse(str); 하면된다. 추가적으로 배열(Array) 또한 가능하다. (몰랐다) ■ 배경설명 현재 프로젝트가 Web → Native(React Native) → Web 이기 때문에 내 입맛대로 데이터의 형식을 설정할 수 없기 때문에, 배열로 변환하는 방법 또한 알게되었다. ■ 결론 일단 결과부터 말하자면, 방법은 다음과 같다. // 배열 형태의 문자열 // (JSON객체형태가 곧바로 string으로 변환되어나온 형태) let arryStr = "[\"안녕하세요.\",\"안녕히가세요.\"]"; // 문자열 ..

FrontEnd/JavaScript 2022. 8. 24. 20:09

안녕하세요 상훈입니다. js를 다루는 개발자라면, console.log, 혹은 debugger를 자주 사용하게 되실텐데요, console.log 에 대한 미세한 먼지팁을 드리고자합니다. 바로, 색상을 입히는 것인데요, 방법은 아주 간단합니다! 1. 텍스트 내용의 시작에 %c 를 붙여주고 작성한다. 2. 색상을 정의해준다. (스타일) console.log("%c안녕하세요?","color:red;"); 이렇게 결과가 출력되었습니다. 어때요 눈에 잘띄죠? 추가적으로 배경도 줄 수 있습니다! console.log("%c안녕하세요?","background-color:red; color:white;"); 이상입니다. 생각보다 눈에 잘띄어서 좋습니다. 저는 blue를 자주 사용합니다. 도움이 되셨다면 광고 한번 클릭..

FrontEnd/JavaScript 2022. 7. 12. 13:16

안녕하세요 상훈입니다. node.js 를 이용한 백엔드 개발 중 .js 파일을 require 말고 import 시키고 싶었는데 안되었던 경험이 있으실 수 있습니다. 그때에는 package.json 혹은 eslintrc.json 파일의 parserOptions 항목을 살펴보셔야합니다. ecmaVersion은 2016이상으로 맞춰주시길 바랍니다. 제 eslintrc.json 입니다. "parserOptions": { "sourceType": "module", "ecmaFeatures": { "jsx": true }, "ecmaVersion": "latest" }, sourceType: module 을 추가해주시거나, 변경해주시거나 package.json에서 type: 'module' 을 추가해주세요. 이제 ..

FrontEnd/JavaScript 2022. 3. 15. 14:08

안녕하세요 상훈입니다. 1. .eslintrc.json 2. .prettierrc 파일에 대해서 간단한 설정 몇 가지를 작성해보려고 합니다. 1. .eslintrc.json 일단 사용환경이 React.js 라서 ecmaFeatures 와 같은 경우 jsx 문법을 사용하고 있습니다. commonjs를 적용해 eslint를 설치하였습니다. - 사용하지 않은 변수에 대한 알림 및 에러 처리 하단에 보시면 no-unused-vars: "warn" 이라는 항목이 있는데, 해당 항목을 error, warn, off 로 설정이 가능합니다. 2. .prettierrc 1) singleQuote: 싱글 쿼터로할지 더블 쿼터로 할지 설정입니다. Vue.js 에서는 싱글을 추천하고, React.js 에서는 더블을 권장하고 ..

FrontEnd/JavaScript 2022. 3. 14. 18:02

안녕하세요 상훈입니다. Javascript에서 데이터의 한글 유무를 정규표현식으로 확인하고 싶을 때 사용하시면 될 것 같습니다. 저는 split을 이용해 한글을 기점으로 자르는 함수를 생성하기도 하였습니다. const korean = /[ㄱ-ㅎ|ㅏ-ㅣ|가-힣]/ // 사용 사례 : 한글을 기준으로 문자열 자르기 koreanData = '124515가123124' const data = koreanData.split(korean) // [ 124515, 123124 ]

FrontEnd/JavaScript 2022. 2. 28. 14:39