본문 바로가기
반응형

팁 & 노하우16

javascript, 엔터키 줄바꿈 쉽게 정규식으로 변경 (br 태그) textarea 를 통해서 등록된 내용을 보여 줄 때, 엔터키로 줄바꿈된 내용이 옆으로 붙어 나오게 됩니다. 이럴 경우 엔터키를 br 태그를 이용해서 줄 바꿈하여 나타내는데 많이 사용하는 함수를 알려드립니다. 보통 문자열을 치환하거나 제한을 할 경우에 정규식 표현을 많이 사용하는데, 이번에 알려드리는 방법 또한 정규식을 활용한 함수 예제입니다. function newLineToBr(checkString) { let returnValue = checkString; if (checkString !== '' && typeof (checkString) !== 'undefined') { returnValue = checkString.replace(new RegExp('\r?\n', 'g'), ' '); } ret.. 2024. 3. 5.
javascript 천 단위 구분 기호 표시 요즘 Vue, React, Node 등 Javascript 기반 프레임워크를 많이 사용하는 추세입니다. Java, C#, Kotlin 등 Backend 프로그램에 대해서는 체계적으로 공부하는 편이지만, Javascript에 대해서는 체계적으로 배우지 못하는 경우가 많은 것 같습니다. 이번 시간에는 Javascript 정규식 표현을 활용하여 숫자에 천단위 구분기호 (, 콤마)를 추가하는 방법을 간단하게 설명해 드립니다. Javascript 천 단위 구분 콤마 표시 함수 정규식 이용하기 function makeNumberFormat(checkString) { let returnValue = checkString; if (checkString !== '' && typeof (checkString) !== 'u.. 2024. 3. 5.
C#, .net 8, core, MVC HttpResponseMessage XML to JSON 변환 API 개발 및 서비스에서 많이 사용하는 형식은 XML, JSON 타입이 있습니다. JSON은 일반적으로 API, 모바일 앱 및 데이터 스토리지에 더 적합하고, XML은 데이터 교환이 필요한 복잡한 문서 구조에 더 적합한 특징이 있지만, 요즘 API 개발 및 서비스에는 거의 JSON을 많이 사용합니다. 하지만, 예전에 개발된 서비스 및 특정 사유로 인해서 XML로 데이터로 전달하는 경우가 있는데, C#에서 XML을 JSON으로 변경하는 간단한 방법을 알려 드리겠습니다. C# JSON 라이브러리 중 가장 많이 사용하는 것이 Newtonsoft.Json입니다. https://www.newtonsoft.com/json Json.NET - Newtonsoft × PM> Install-Package Newtons.. 2024. 2. 29.
moment "Invalid date" 에러 처리 하기 Javascript Library 중에 날짜 시간 처리가 가장 편한 라이브러리는 moment.js 인 것 같습니다. 예전에는 숫자, 통화 변환 등 처리 작업을 Backend에서 처리했지만, 이제는 API, JSON, Frontend 개발로 변경되면서 Frontend에서 많이 처리하고 저 또한 이러한 방식을 사용합니다. moment "Invalid date" 에러 처리 방법 moment 시간 변환 처리 중 가장 많이 발생하는 것은 날짜 형식이 맞지 않는 문제인데, 변환 후 리턴 값을 받아 보면 "Invalid date" 가 나옵니다. 개발 시간이 부족해서 사용자가 입력하는 값의 데이터 검증을 모두 처리하기도 소홀히 하게 되면 많이 발생하는 문제입니다. 그렇다고 무작정 View 화면에 "Invaild dat.. 2024. 2. 29.
Vue js 3, v-html button click event 처리 (버튼 클릭 이벤트) 최근 프로젝트에 Vue.js 3 버전을 사용 중인데, v-html 을 이용해서 html 태그가 포함된 문자열을 반환 중 Button Click 버튼 클릭 이벤트를 처리야햐 하는 경우가 발생해서 제가 처리했던 방안을 알려드립니다. 버튼 클릭 시 해당 버튼의 페이지 값을 Parameter 로 전달하하는 간단한 방법입니다. Button에 data-page attribute 활용하여 Parameter 전달 클릭 이벤트를 Parent div 에 적용 클릭 이벤트 리스너를 통해서 dataset 의 page 값 가져와서 특정 함수에 전달 다른 방법도 있는 것 같지만 간단하게 처리하는 것에는 적합한 것 같아서 알려드립니다. 2024. 2. 26.
영화진흥위원회 오픈API 활용 C#, .net 8.0, MVC, Vue.js 이번 게시물에서는 백엔드(Backend) C# .net 8.0 MVC 패턴과 프론트엔드(Frontend) Vue.js 3.0 버전을 활용한 영화진흥위원회 오픈 API 활용 예제를 설명하겠습니다. 네이버에서 영화 관련 API 를 제공하였으나 2023년 3월 31일에 종료되어서 영화진흥위원회에서 제공하는 API가 좋은 대안이 될 수 있습니다. 영화진흥위원회 오픈API 활용 1. 영화진흥위원회 API 신청 https://www.kobis.or.kr/kobisopenapi https://www.kobis.or.kr/kobisopenapi/ www.kobis.or.kr 우선, 영화진흥위원회 API 사이트 회원 가입 후, 상단의 "키 발급/관리"를 통해서 API에 사용할 키를 발급받아야 합니다. 현재, 1계정당 2.. 2024. 2. 20.
반응형