본문 바로가기
반응형

전체 글217

JavaScript 타입 확인하는 방법 JavaScript에서 변수나 함수 등타입을 체크하고 싶을 때간단한 함수로 체크할 수 있습니다. 타입 확인 방법은 typeof()를이용하면 됩니다. 아래의 예제를 통해서 간단하게확인해보겠습니다.     See the Pen Untitled by bskim (@chocoball3) on CodePen." data-ke-type="html">HTML 삽입미리보기할 수 없는 소스 위와 같이 typeof 함수안에확인할 변수나 함수 등을입력받으면 해당 파라미터에 대한타입을 리턴합니다. 2024. 7. 22.
JavaScript 엔터키 (Enter Key) 감지 방법, 이벤트 처리 JavaScript에서 엔터키를 감지하는 방법은아주 간단합니다. 일반적으로 input과 같은 태그에서엔터를 눌렀을 때 이벤트를 처리할 때가 많이 있습니다. 간단하게 input태그에서 Enter키를입력 받았을 경우로 예제를 들어서확인해보겠습니다.   function keydown(){ if (this.event.keyCode == 13) // Enter의 KeyCode인 13이 입력되면 { console.log('Enter'); // Enter }} 위의 예제를 확인해보면input태그에 onkeydown 이벤트가 존재하여키보드 입력값이 들어왔을 때 keydown함수를호출합니다. 모든 입력이벤트가 감지되지만엔터키의 keyCode는 "13"이기 때문에"13"일 경우에만 이벤트를처리하면 됩니다.   .. 2024. 7. 19.
Windows10 시작 프로그램 등록하기, 부팅 시 프로그램 시작 윈도우 환경에서 컴퓨터가 부팅되면특정 프로그램을 등록하여부팅이 완료된 후 프로그램을시작하게 할 수 있습니다. 키보드에서 "window + R" 을눌러줍니다.    아니면 위와 같이좌측 하단의 "찾기"에서"실행" 입력 후 프로그램을실행하셔도 됩니다.  실행 메뉴가 열리면"shell:startup" 입력 후확인 버튼을 클릭합니다.    위와 같이 "시작프로그램" 위치의폴더가 열리면 부팅 시 시작하고 싶은프로그램의 바로가기를 등록한 후재부팅하면 프로그램이실행되는 것을 확인 할 수 있습니다. 2024. 7. 15.
우체국의 우체통 찾기, 우체통의 위치는 어디? 요즘에는 잘 사용하지 않는 것 같지만우체국에 갈 수 없을 때 우체통을 이용하는 경우가 있습니다.우체국은 검색만 해도 나오기 때문에 간단하게 찾을 수 있지만우체통의 위치는 일반적으로 검색해도나오지 않기 떄문에 우체통의 위치를 찾는 법에 대해서알아보도록 하겠습니다. 우체통의 위치는 우체국 홈페이지에서 조회할 수 있습니다.일단 검색 포털에서 우체국을 검색하여 접속합니다.    아래 링크로 바로 접속하셔도 됩니다.http://www.epost.go.kr  우체국 홈페이지에 접속하였다면 우측 하단에"전국우체국안내" 링크를 클릭합니다.    "우체국 찾기" 링크를 클릭합니다.  우체국 위치 찾기 페이지 좌측 검색영역란에서"일반검색" -> "우체통" -> "기타조건 선택" -> "검색"그럼 검색 조건에 맞는 우체통의.. 2024. 7. 15.
JavaScript 형변환 int to String or String to int JavaScript 변수를간단하게 형변환하는 방법입니다. 형태가 Number, String이여도숫자의 형태라는 가정하에예외처리 없이 형변환하는 방법에 대해 알아보겠습니다. 숫자 -> 문자 형변환방법입니다. 위와 같은 방식으로"int to string"전환 가능합니다.   아래는 반대로문자 -> 숫자 형변환방법입니다.  위와 같은 방식으로"string to int"전환 가능합니다. 2024. 7. 11.
태그에 특정 클래스 있는지 JavaScript에서 확인하는 방법 javaScript에서 특정 태그에클래스가 있는지 확인하는 방법은아주 간단합니다. 아래의 예제를 통해서확인해보시면 되겠습니다.  javaScript에서는 위와 같이className을 includes를 통해class명이 일치하는 문자가 있는지체크하여 boolean 형태로받을 수 있습니다.   아래는 똑같은 상황에서jQuery로 체크하는방법입니다.  jQuery에서는hasClass를 이용하여확인할 수 있습니다. 2024. 7. 11.
Jquery Ui Dialog 버튼 추가 및 Callback 받기 (alert, confirm) Jquery Ui에는 Dialog가 있습니다.Jquery에서 제공하는 Modal입니다.  Dialog에 버튼을 추가하는 방법과버튼을 눌렀을 때 Callback을받는 방법에 대해서 간단하게 예제 소스를 가지고확인해보겠습니다.  열기  위는 참고용 소스입니다. dialog 안에 buttons에서버튼을 추가할 수 있습니다. click 이벤트에 callback을 담아return 값으로 callback 처리를하실 수 있습니다. buttons에 버튼을 하나 추가하여alert 형태로 사용하여도 되고,위와 같이 두개를 추가하여callback 처리로 구분하여confirm 형태로 사용 가능합니다. 버튼 추가 방법은 dialog 안의 buttonscallback은 test_open function을참고하시면 .. 2024. 7. 10.
크롬 키오스크 모드 사용하기(Chrome Kiosk Mode) 크롬에서는 키오스크 모드를 지원합니다.브라우저가 실행된 상태에서F11 버튼을 누르게 되면전체화면 모드로 전환되는데브라우저를 실행할 때부터키오스크 모드로 실행할 수 있습니다. 설정은 간단하며 키오스크모드를사용하면 브라우저의 탭이나작업표시줄 등이 보이지 않고종료도 Alt + F4를 이용하여종료하여야 합니다.     크롬 브라우저의 키오스크 설정방법입니다.  크롬 바로가기 브라우저를우측클릭한 후 속성 메뉴를 클릭합니다.   기본적으로 대상에는 ~~exe"로 설정되어있습니다.exe" 에서 한칸 띄우고--kiosk 입력 후 확인하시면 됩니다. 모든 브라우저를 종료 후브라우저를 실행하시면키오스크모드로 브라우저가 실행됩니다. --kiosk 뒤에 url 정보를 입력하면브라우저가 실행되면서 호출하는첫페이지를 지정할 수 .. 2024. 7. 10.
IPhone USB 테더링 연결 안되는 현상(연결 되었다가 안되었다가) 아이폰 USB 테더링을 위해서는ITunes를 설치해야 합니다. 설치하지 않으셨다면 이전글 아래를참고하여 설치해주시면 되겠습니다.2024.07.09 - [IT/Tip] - IPhone USB 테더링 연결 (Window PC) ITunes를 설치하고 USB를 연결해도계속 아래와 같이"이 기기가 사진 및 비디오에 접근하도록허용하시겠습니까?"라는 메세지와 함께 디스크만 연결된다면드라이버가 꼬였을 수 있기 때문에저도 계속 연결이 안되다가아래와 같이 진행 후 해결 되었습니다.    시작에서 "장치 관리자" 검색 후장치관리자 메뉴를 클릭합니다.     위와 같이 "범용 직렬 버스 컨트롤러" 아래에Apple Mobile Device USB Driver가 있으면 정상입니다.    위와 같이 "범용 직렬 버스 장치" 하위.. 2024. 7. 9.
IPhone USB 테더링 연결 (Window PC) 인터넷 연결이 쉽지 않은 상황에서휴대전화의 핫스팟을 이용하여인터넷을 연결할 수 있습니다. 핫스팟을 키면 PC 네트워크 목록에일반적으로 Iphone wifi가 나타나며해당 wifi를 클릭하면 인터넷이무선으로 연결되게 됩니다. 하지만 무선으로 연결하지 않고USB 방식의 테더링을 이용하고 싶을 때아이폰을 USB로 연결하면 "이 기기가 사진 및 비디오에 접근하도록허용하시겠습니까?"라는 메세지와 허용을 누르면아이폰의 디스크에 접근할 수 있게 되며네트워크는 연결되지 않습니다. 아이폰 USB 테더링을 위해서는 Itunes를 설치해야하며아래와 같이 진행해주시면 되겠습니다.   아래의 링크를 통해 Apple itunes 사이트로이동합니다.https://www.apple.com/kr/itunes/ 위와 같이 이동하여 하단.. 2024. 7. 9.
[JavaScript] 배열에서 조건에 맞는 값만 추출하기! filter 함수 사용법 배열에서 특정 조건에 해당하는 값만 추출하고 싶을 때 filter 함수를 이용하면 조건에 충족하는 값만 추출할 수 있습니다. 사용방법이 그렇게 어렵지 않기 때문에 간단하게 사용할 수 있습니다. 예시를 몇가지를 들어서 사용방법에 대해서 알아보도록 하겠습니다. filter 함수 var arrays = [1, 3, 5, 7, 9, 11, 13, 15, 17, 19]; arrays = arrays.filter(function(val, idx) { console.log(val); // 결과 : 1, 3, 5, 7, 9, 11, 13, 15 17, 19 배열안의 값 console.log(idx); // 결과 : 0, 1, 2, 3, 4, 5, 6, 7, 8, 9 배열의 순번 return val; // 리턴 }); .. 2022. 9. 27.
[Font Awesome] 5 & 6 cdn 및 사용법 FontAwesome은 CSS를 이용한 아이콘 툴킷으로 제공하는 css파일을 이용하면 제공하는 아이콘들을 간단하게 사용할 수 있습니다. 무료 버전과 프로 버전이 있어서 프로 버전에서 제공하는 아이콘이 훨씬 다양하지만 무료 버전으로도 개인 사이트에서는 충분하기 때문에 무료 버전 기준으로 확인해보겠습니다. FontAwesome 도 다양한 버전이 있지만 최근 버전인 5와 6버전을 기준으로 확인해보겠습니다. Font Awesome 5 CDN Font Awesome 6 CDN FontAwesome에서 제공하는 아이콘들은 해당 사이트에서 확인 할 수 있습니다. https://fontawesome.com/ 아니면 직접 검색포털에서 fontawesome으로 검색하여 접속하셔도 됩니다. FontAwesome의 사이트는 .. 2022. 9. 26.
[JavaScript] 문자열 구분자로 자르기 split 특정 문자열을 기준으로 값을 구분 할 때가 있습니다. 구분자가 있다면 javascript에서는 특정 구분자를 이용하여 문자를 잘라 배열 형태로 받을 수 있습니다. javacript의 split 함수를 이용하면 되는데, 간단하하게 이용하는 방법에 대해서 알아보도록 하겠습니다. 구분자로 문자열 자르기 var animals = '강아지;사자;고양이;말;기린'; // 동물 목록 console.log(animals) // 결과 '강아지;사자;고양이;말;기린' var animal = animals.split(';'); // 동물들 구분자인 ;(세미콜론)으로 split console.log(animal) // 결과 ['강아지', '사자', '고양이', '말', '기린'] console.log(animal.length.. 2022. 9. 23.
[JavaScript] 변수 타입 확인 방법 typeof JavaScript의 변수들의 타입을 확인이 필요할 때가 있습니다. 타입을 체크하여 특정 타입만 활용할 때 필요할 수 있습니다. JavaScript의 기본 함수로 간단하게 체크가 가능합니다. 사용 예제를 통해 간단하게 사용방법에 대해서 알아보도록 하겠습니다. 변수의 타입 확인하기 var typeA = [1, 2, 3]; var typeB = 123; var typeC = '123'; // typeof 함수로 변수의 타입 체크 console.log(typeA); // 결과 'object' console.log(typeB); // 결과 'number' console.log(typeC); // 결과 'string' // type 활용 예제 if (typeof(typeA) == 'object') { consol.. 2022. 9. 23.
[JavaScript] 세자리 콤마 정규식으로 처리하기 숫자로 된 부분을 화폐로 표시하기 위해 일반적으로 3자리 마다 콤마를 표기해줘야 할 때가 있습니다. JavaScript의 정규식을 이용하면 간단하게 처리가 가능합니다. 간단하기 때문에 바로 확인 해보겠습니다. 정규식으로 세자리 숫자마다 콤마 var number = 10000000; // number 변수에 숫자 입력 console.log(number); // 결과 10000000 number = number.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ','); // 정규식으로 변환 console.log(number); // 결과 10,000,000 위의 예제와 같이 일반적인 숫자를 정규식으로 변환하면 3자리 숫자마다 ,(콤마)를 입력하여 화폐 단위처럼 변한 것을 확인할.. 2022. 9. 23.
[JavaScript] 시간 지연 함수과 시간 반복 함수 setTimeout, setInterval Javascript에서는 특정 시간이 지난 후 이벤트가 호출되도록하는 함수와 특정 시간마다 반복이 되게하는 함수가 있습니다. 이벤트를 반복하거나 일정시간을 지연하고 실행해야 되는경우가 간혹 생기는데 이런 경우 사용할 수 있습니다. 각 함수는 setTimeout과 setInterval입니다. 해당 함수를 사용하는 방법에 대해서 간단하게 알아보도록 하겠습니다. 시간 지연 함수 setTimeout setTimeout(function() { // setTimeout 함수 console.log(1); // 실행 할 이벤트 }, 5000); // 5000ms -> 5초 // 5초 뒤 // 결과 1 setTimeout 함수는 일정 시간을 지연한 뒤 함수 안에 있는 이벤트를 실행하는 함수입니다. 위의 예제와 같이 사용.. 2022. 9. 23.
[JavaScript] 삼항연산자란? 삼항연산자 조건문 사용방법 Javascript에서는 조건문 중에 삼항연산자라는 조건문이 존재합니다. 여러 조건문(If, Swich Case 등..) 이 있지만 삼항연산자에 대해서 간단히 알아보도록 하겠습니다. 삼항연산자의 형태는 아래와 같습니다. 조건 ? 참 : 거짓 굉장히 간단하며 소스 예제를 통해서 보겠습니다. var count = 1; // count에 1이라는 숫자 입력 console.log(count); // 출력 : 1 count = count == 1 ? '맞음' : '틀림'; // 삼항연산자로 비교, 조건 ? 참 : 거짓 console.log(count); // 출력 : 맞음 상단과 같이 조건에 맞으면 첫번째 값이 호출되며, 조건에 맞지 않으면 두번째 값이 호출되는 것을 확인할 수 있습니다. 삼항연산자는 if els.. 2022. 9. 20.
윈도우 블루투스 아이콘 사라짐 현상, 간단하게 활성화하는 방법! 윈도우를 사용하다가 블루투스를 연결할 일이 있을 때 블루투스 아이콘이 아이콘 트레이에 보이지 않아서 당황할 때가 있는데요. 블루투스가 꺼짐 상태일 수 있습니다. 간단하게 블루투스를 켜서 활성화 해주면 됩니다. 일반적으로 윈도우의 우측 하단에 아이콘 트레이에 바로 블루투스 아이콘이 보이거나 아이콘이 많다면 화살표 버튼을 클릭하면 블루투스 아이콘이 보여야 되는데 위와 같이 안보일 때가 있습니다. 블루투스 아이콘이 보이지 않는다면 좌측 하단 검색란에 bluetooth로 검색하면 "Bluetooth 및 기타 디바이스 설정" 메뉴가 나타납니다. 해당 메뉴를 클릭합니다. 메뉴로 이동하였다면 바로 제일 상단에 Bluetooth가 끔 상태로 되어있는 것을 확인할 수 있습니다. 마우스로 클릭하여 켬 상태가 되도록 변경해.. 2022. 9. 5.
무료 그래픽 디자인 툴 추천! 화면캡쳐 및 녹화 이미지 편집 등 다양한 기능, 픽픽(PickPick) 이미지를 간단하게 편집하거나 화면 녹화, 캡쳐 색상 편집 등이 필요할 때 가볍게 사용할 수 있지만 기능들이 다양하고 개인 및 기업에게도 무료인 툴이 있는데요. 바로 픽픽(pickpick)입니다. 프로그램이 가볍고 무료지만 기능들이 많아서 다양하게 활용이 가능합니다. 간단한 색상수정 및 추출, 화면 편집 기능 또한 각도기나, 눈금자 기능들도 제공하기때문에 아주 유용하게 사용할 수 있습니다. 픽픽을 다운받는 방법과 간단한 기능에 대해서 알아보도록 하겠습니다. https://picpick.app/ko/ 상단의 링크를 통해서 픽픽에 접속하시거나 검색포털에서 "픽픽"으로 검색하시면 접속하실 수 있습니다. 픽픽 사이트에 접속하시면 상단과 같은 화면을 보실 수 있습니다. 바로 프로그램을 다운받기 위해서 다운로드 탭을.. 2022. 9. 2.
삼성 노트북 자동 부팅 설정 해제하기 삼성노트북을 사용하면 기본적으로 자동부팅이 설정되어 있어서 노트북 덮개만 열어도 노트북이 켜집니다. 이 기능이 편리할 수 있지만 오히려 불편하다고 느낄 수 있기 때문에 자동 부팅 설정을 하는 방법에 대해서 알아보겠습니다. 아주 간단하기 때문에 금방 설정이 가능합니다. 삼성 노트북을 사용하면 기본적으로 삼성 앱들이 설치되어 있습니다. 윈도우 좌측 하단의 검색영역에서 Samsung Settings로 검색합니다. 그럼 나타나는 Samsung Settings 앱을 클릭하여앱을 실행합니다. Samsung Settings 앱이 실행되면 시스템 메뉴에 자동 부팅에 대한 설정이 존재합니다. 자동부팅이 되는 상태라면 자동 부팅의 스위치가 켬 상태일텐데 이 스위치 버튼을 클릭하여 끔 상태로 변경해주면 자동부팅 옵션이 해제.. 2022. 9. 2.
올해 스케일링 보험적용 여부 간단하게 확인하는 방법 스케일링은 치아에 있는 치석을 제거해주는 치과 시술입니다. 매년 1회 보험이 적용되어 저렴한 가격으로 스케일링을 받을 수 있는데요. 매년 1월1일에 1회의 스케일링 보험이 생기는데, 시간이 흐르다보면 내가 올해 스케일링을 했는지 작년에 했는지 기억이 나지 않아 보험적용 여부를 확인해보고 싶을 때가 있습니다. 스케일링 보험의 잔여 여부는 국민건강보험공단에서 간단하게 확인을 해볼 수 있습니다. https://www.nhis.or.kr/ 상단의 링크를 통해서 접속하시거나 포털사이트에서 "국민건강보험공단"을 검색하셔서 접속하셔도 괜찮습니다. 국민건강보험공단 홈페이지에 접속하면 상단과 같은 화면을 볼 수 있습니다. 자신의 보험여부를 확인하기위해서는 먼저 로그인이 필요함으로 우측 상단의 로그인 버튼을 클릭하여 공인.. 2022. 8. 17.
[React-Native] 안드로이드 기본 텍스트 색상 지정하기 Android default font color React-Native 프로젝트에서 안드로이드로 앱 기동 시 텍스트들의 색상이 정상적으로 보이지 않아서 Text의 기본 색상을 설정하는 방법에 대해 알아보겠습니다. /android/app/src/main/res/values/styles.xml 상단 경로에 있는 styles.xml 파일을 열어줍니다. 그리고 아래와 같이 기본 색상 컬러 값을 지정합니다. ※ 관련 포스팅 2022.08.09 - [Programing/React-Native] - [React-Native] react-native-camera-kit Build failed with 2 errors 2022.08.09 - [Programing/React-Native] - [React-Native] Unable to load script. Make .. 2022. 8. 9.
[React-Native] Unable to load script. Make sure you're either running Metro 오류 React-Native npx react-native run-android로 앱 실행 시 아래와 같은 오류가 발생할 때가 있습니다. Unable to load script. Make sure you're either running Metro (run 'npx react-natvie start') or that your bundle 'index.android.bundle' is packaged correctly for release. Metro가 정상적으로 켜지지 않았을 경우가 있음으로 1. 터미널에서 해당 프로젝트로 이동 2. npx react-native start 3. 에뮬레이터 화면에서 RR 입력 새로고침되면서 빌드됩니다. ※ 관련 포스팅 2022.08.09 - [Programing/React-Na.. 2022. 8. 9.
[React-Native] react-native-camera-kit Build failed with 2 errors React-Native에서 카메라 기능을 사용하기 위해서 react-native-camera-kit를 설치 후 아래와 같은 오류 발생 Build failed with 2 errors react-native-camera-kit/android/build.gradle' line: 2 Plugin with id 'kotlin-android' not found. 환경 : project react-native version 0.69.1 - 해결 방법 - 1. /android/build.gradle에 kotlin_version 설정 buildscript { ext { ... kotlin_version = '1.5.10' } 2. buildscript.repositories와 allprojects.repositorie.. 2022. 8. 9.
네이버 실시간 검색어 확인 하는 방법! Naver Signal 현재 실시간으로 사람들이 많이 검색하는 이슈를 예전에는 순위별로 포털 사이트에서 제공하였지만, 네이버와 다음은 실시간 검색어 기능을 폐지하였습니다. 네이버의 홈화면에서는 더이상 실시간 검색어를 제공하지 않지만 네이버앱을 이용하여 실시간 검색어 기능을 다시 제공하고 있습니다. 바로 "네이버 시그널" 이라는 사이트입니다. PC와 모바일에서 네이버 실시간 검색어를 확인하는 방법에 대해서 간단하게 알아보겠습니다. 먼저 PC 환경에서 인터넷 브라우저를 통해서 실시간 검색어를 사용하는 방법입니다. 브라우저를 열고 네이버에 접속한 뒤 "네이버 시그널"을 검색합니다. 검색을 하지 않으시고 직접 접속하시려면 하단의 링크를 클릭하여 접속하셔도 됩니다. https://www.signal.bz/ 검색을 하면 상단과 같은 사이.. 2022. 2. 13.
유니코드 <> 한글 변환기 (웹에서 바로 확인하자!) 유니코드 한글 간의 변환 페이지입니다. 변환 버튼을 클릭하여 변환이 완료되면 변환 내용을 확인할 수 있습니다. 변환된 내용을 복사하셔서 사용하셔도 되지만 정상적으로 복사가 안되면 하단에 복사란에서 복사하시면 정상적으로 복사가 가능합니다. HTML 삽입 미리보기할 수 없는 소스 ※ 관련 포스팅 2021.08.02 - [Programing/JavaScript] - [JavaScript] 숫자, 문자 배열 간단하게 정렬하는 방법 Sort 2020.07.27 - [Programing/JavaScript] - [JavaScript] 문자열 대문자 소문자 변환 하기 toUpperCase(), toLowerCase() 2020.07.27 - [Programing/JavaScript] - [JavaScript] 특정 .. 2022. 2. 5.
크롬 F12 막힘으로 개발자 도구 안될 때 개발자 도구 여는 방법 크롬이나 익스플로러와 같은 브라우저에서 개발자도구를 이용하여 웹을 조작할 일이 있습니다. 웹 개발자분들이나 일반인들도 많이 알고있는 상황이라 일반적으로 F12를 눌러서 개발자도구를 실행하는데요. 크롬 기준으로 F12를 눌러도 개발자 도구가 열리지 않게 막혀있는 사이트들에서 개발자 도구를 사용하는 방법에대해서 간단하게 알아보도록 하겠습니다. 일반적으로 개발자 도구를 실행하는 단축키인 F12를 눌러서 실행하는 경우가 많습니다. 하지만 간혹 웹사이트에서 F12 단축키를 사용하지 못하도록 막아서 개발자 도구를 실행하지 못하도록 막는 경우가 있습니다. 하지만 개발자 도구는 F12 단축키 말고도 하나의 단축키가 또 존재합니다. Ctrl + Shift + I 입니다. 개발자 도구가 실행되지 않는 페이지에서 해당 단축.. 2021. 12. 28.
인터넷 익스플로러 엣지 자동실행 취소 방법 (IE Edge 자동실행 해제) 인터넷 익스플로러를 사용하시다가 어느순간부터 익스플로러를 클릭하여 열어도 엣지로 자동연결이 되는 상황이 발생하는 경우가 있습니다. 엣지로 자동연결이 되도록 설정이 된 경우인데, 간혹 엣지 자동연결에 대한 확인창을 확인하지 않으시고 누르셔서 자동으로 연결되는 경우인데요. 익스플로러를 다시 사용하기 위해서는 설정을 변경해야합니다. 간단하게 변경하여 다시 익스플로러로 연결하는방법에 대해서 알아보겠습니다. 먼저 익스플로러의 엣지로 자동실행되는 설정은 Edge에서 설정할 수 있습니다. Edge를 클릭하여 브라우저를 열어줍니다. 엣지를 실행하였다면 우측 상단의 점선 아이콘을 클릭하여 펼쳐지는 메뉴에서 제일 하단 부분의 설정 메뉴를 클릭합니다. 좌측 메뉴 트리에서 기본 브라우저 메뉴를 클릭합니다. 기본 브라우저 메뉴.. 2021. 12. 21.
[JavaScript] 숫자, 문자 배열 간단하게 정렬하는 방법 Sort 자바스크립트의 배열에서 숫자나 문자를 가지고 있는 변수들이 있는데 순서가 뒤죽박죽일때, 정렬이 필요할 때가 있습니다. 간단하게 sort 함수를 이용하여 정렬을 할 수 있는데요. 간단하게 이 함수를 이용하여 정렬하는 방법에 대해서 알아보겠습니다. 상단의 예제와 같이 순서가 없이 숫자로 이루어진 배열(Array)이 존재합니다. 콘솔을 이용하여 출력해보면 입력 되어있는 순서대로 출력이 되는 것을 확인할 수 있습니다. 숫자 배열 정렬 방법 숫자로 되어있는 배열을 정렬하는 방법은 상단의 화면과 같습니다. 사용 방법은 [변수].sort(function(a, b) { return a - b; } ); 위와 같이 실행하면 정렬된 숫자들이 변수 array에 입력되어 출력되는 것을 확인할 수 있습니다. 숫자 배열 역순 정.. 2021. 8. 2.
JPG, PNG, GIF 등 이미지 배경 포토샵없이 간단하게 제거하기! Removebg 이미지 파일의 배경의 색상이 존재할 때, 투명한 배경색인 이미지가 필요할 때가 있습니다. 보통 포토샵을 잘 다룬다면 이미지의 배경을 지울 수 있겠지만, 일반적으로 포토샵이 없을 수도 있고, 사용하지 못하는 상황이 있을 수 있습니다. 이번 포스팅에서는 간단하게 설치 없이 배경색을 투명하게 변경해주는 사이트에 대해서 알아보도록 하겠습니다. https://www.remove.bg/ 상단의 링크를 통해서 접속하거나 검색 포탈에서 removebg로 검색하여 접속하셔도 됩니다. 링크를 통해 removebg 사이트를 접속하면 상단과 같은 화면을 확인할 수 있습니다. 아주 사이트가 간결하기 때문에 쉽게 사용이 가능합니다. 사용방법은 두 가지로 존재하는데, 첫 번째로 하단의 URL이라는 버튼을 클릭하여 다운로드 받은 이.. 2021. 7. 26.
반응형