끄적끄적 어디서나 개발
    • 메뉴 닫기
    • 글작성
    • 방명록
    • 환경설정
      • Developer
        • Project
          • 주식자동매매
        • Language
          • JAVA
          • Python
          • Spring
          • Ruby&Rails
          • CSS&javascript
          • Databases
          • ETC
        • Linux
        • Mobile
        • Tool
          • Notion
          • Git
        • Quiz
        • Book
        • Review
    • 홈
    • 태그
    • 방명록
    Language/CSS&javascript

    [JavaScript] var, let, const 차이점

    JavaScript 에서 변수 선언 방식에는 var, let, const 가 있다. 이들의 차이점은 무엇이며 어떻게 사용하면 되는지에 대하여 알아보자. 1. var 의 문제점 예전에는 JavaScript 에서 변수는 var 를 사용하였다. 하지만 var 는 큰 단점을 가지고 있다. var text = 'java' console.log(text) var text = 'script' console.log(text) Output: java script 변수를 한 번 더 선언 했지만 해당 코드는 에러가 발생하지 않고 각 다른 값이 출력 되는 것을 볼 수 있다. 옛날에는 유연한 변수선언 방식으로 장점으로 꼽혔으나, 현재는 이런 유연한 때문에 오류가 발생하면 파악하기도 어렵고 값이 이렇게 변경될 여지가 있다. 그래..

    2023. 1. 12. 18:32
    Language/CSS&javascript

    [JavaScript] 한글, 영어(알파벳), 숫자 만 입력 받기(정규표현식)

    등록이나 수정페이지에서 입력 받을 때 숫자만 입력 받거나, 영어-알파벳 또는 한글만 입력 받을 수 있도록 제한이 필요할 수가 있습니다. 숫자는 number type을 사용할 수도 있지만 꼭 text type 으로 받아야 한다면 정규표현식을 사용하면 쉽게 구현하여 확인 할 수 있습니다. 어떻게 구현하는지 알아보겠습니다. 정규표현식 정규표현식의 문법을 간단하게 알아보면 아래와 같습니다. ^ : 문자열의 시작을 의미 [pattenr] : 찾으려는 패턴 \+ : 문자 1개 이상을 의미 $ : 문자열의 끝을 의미 문자열에 한글만 있는지 확인 정규표현식 패턴 /^[ㄱ-ㅎ|가-힣]+$/ 는 한글 1개 이상을 의미합니다. const regex = /^[ㄱ-ㅎ|가-힣]+$/; let str = "가나다"; console..

    2023. 1. 12. 17:32
    Language/CSS&javascript

    [HTML] input number 숫자 최소값, 최대값 설정

    input number 숫자만 입력 받고 싶을 때는 type="text 가 아닌 아래와 같이 입력해 주면 된다.

    2023. 1. 11. 15:17
    Language/CSS&javascript

    [CSS] input box 테두리 없애기 ( + 부트스트랩 bootstrap 5 )

    html 에서 input box의 테두리를 없애야 필요가 있을 경우가 있습니다. 그럴때는 CSS 으로 추가해 주어야 합니다. 부트스트랩 부트스트랩을 사용하고 있다면 기존에 제공해 주고 있는 것으로 사용할 수 있습니다. 부트스트랩을 사용하면 조금 더 깔끔한 코드를 얻을 수 있습니다.

    2023. 1. 10. 16:50
    Language/CSS&javascript

    jQuery 데이타(data) 속성 값으로 데이터 요소 찾는 방법

    data 넣는 방법 $('li').data('seq', 1); 단순하게 이렇게 넣으면 데이터가 들어간다. 하지만 데이터를 넣고 이 데이터를 가지고 무언가 따로 처리하여 찾아야 한다면 못찾을 확률이 있다. 만약 동적 처리를 하기 위해서 찾았는데 못찾을 경우 바꾸어 주면 된다. $('li').attr('data-seq', 1); 그럴 경우에는 attr 속성을 사용하여 넣어주면 된다. data 찾는 방법 이렇게 li에 속성으로 seq 값을 넣어주었다. 이 seq 값으로 li를 찾는다면 아래와 같이 하면 된다. $('li').find('[data-seq="1"]') 그럼 해당 dat의 값을 가지고 요소를 찾을 수 있다.

    2023. 1. 6. 10:28
    Language/Ruby&Rails

    Ruby 에서 배열 리스트에 있는 값 문자열로 이어주기

    요즘 기본적으로 문자열 함수가 잘 되어 있죠? Ruby 도 기본적인 문자열 함수들을 제공합니다. 예전에는 배열에 있는 문자들을 이어 줄려면 for 문을 돌려서 하나의 변수에 이어주는 작업을 했었는데 이제는 기본적으로 제공되는 함수들을 사용해서 하면 됩니다. Ruby 에서도 b_list = ['a','b','c','d'] 이렇게 문자가 들어가 있다면 b_string = b_list.join => abcd 이렇게 자동으로 이어주게 됩니다. 여기서 이 문자열 사이를 구분하고 싶다면 b_string = b_list.join(',') => a,b,c,d 이렇게 넣어주면 됩니다. 굉장히 간단하게 배열 데이터를 문자열로 바꿀 수 있습니다.

    2022. 10. 20. 16:44
    Tool

    [MAC] 터미널 추천 및 단축키 - iTerm2

    맥OS에서 기본 터미널도 좋다. 하지만 윈도우와 다르게 개발을 하다보면 터미널 쓸 일이 많은 맥OS 에서 작업을 하다보면 아쉬움이 따르기 마련이다. 창분할, 멀티탭,커스텀 스타일 등을 제공하고 거기다 무료로 쓸 수 있기 때문에 많은 분들이 iTerm을 사용하고 계실것이다. 다운로드 https://iterm2.com/ iTerm2 - macOS Terminal Replacement iTerm2 by George Nachman. Website by Matthew Freeman, George Nachman, and James A. Rosen. Website updated and optimized by HexBrain iterm2.com 다운로드를 받고 압축을 풀면 나오는 실행 파일을 Application. 폴..

    2022. 8. 16. 18:47
    Language/JAVA

    [MAC]OpenJDK 설치하기 - 개발자를 확인 할 수 없기 때문에 열 수 없습니다. 문제해결

    맥 OS 에서 OpenJDK 를 설치하는 방법은 아래와 같다. 1. 다운로드 OpenJDK 공식 사이트에서 OpenJDK 파일을 다운로드 한다. https://jdk.java.net/archive/ Archived OpenJDK GA Releases Archived OpenJDK General-Availability Releases This page is an archive of previously released builds of the JDK licensed under the GNU General Public License, version 2, with Classpath Exception. WARNING: These older versions of the JDK are provided to he jd..

    2022. 8. 16. 15:26
    Language/CSS&javascript

    [jQuery, javascript] 동적으로 radio, checkbox를 만들었을 경우 이벤트 동작 처리하기 - onclick, onchange

    radio 와 checkbox. 등은 선택 했을 경우와 값이 바뀔 경우 이벤트를 처리하는 경우가 종종 있다. 그런데 이 이벤트를 제대로 작성했는데도 동작을 하지 않았다. $("input:radio[name='radio_test']").on("change", function(){ alert("왜 안뜨니..."); }); 무엇이 문제 일까 고민을 했다. 다른 점은 저 라디오 버튼을 동적으로 생성 했다는 것이었다. 이럴 경우에는 $(document).on을 사용하여 이벤트를 바인딩 하면 된다. $(document).on('change', "input:radio[name='radio_test']", function() { alert("이제 뜬다"); }); document.ready 나 document.load..

    2022. 6. 23. 17:52
    Tool/Notion

    노션 이모티콘 이모지 단축키로 쉽게 넣기

    노션에서 기본적으로 제공해 주는 템플릿들을 보면 이모지(이모티콘)이 예쁘게 들어가 있는 것을 볼 수 있습니다. 기본 명령어인 / 을 넣어서 찾으려면 오래걸려 단축키를 찾아 보았습니다. 첫번째 방법 - / 사용 / 를 치고 e 를 누르면 위 스크린샷처럼 Emoji 가 나옵니다. 그럼 이걸 누르고 또 거기서 이미지를 선택해야하죠. 이모지 하나 넣는건데 참 번거롭습니다. 두번째 방법 - : 사용 이모지(이모티콘)을 넣기 위해서 : 을 입력합니다. 그리고 내가 원하는 이미지의 단어를 생각해서 입력하세요. 한글도 가능합니다. :ha 만 입력 했는데도 hand happy 등등 해당하는 여러 이모콘들이 나옵니다. 우리 모두 이제 이모지 넣어서 예쁘게 노션 페이지 꾸며 보아요.

    2022. 5. 9. 16:52
    • «
    • 1
    • 2
    • 3
    • 4
    • 5
    • ···
    • 8
    • »

    전체 카테고리

    • Developer
      • Project
        • 주식자동매매
      • Language
        • JAVA
        • Python
        • Spring
        • Ruby&Rails
        • CSS&javascript
        • Databases
        • ETC
      • Linux
      • Mobile
      • Tool
        • Notion
        • Git
      • Quiz
      • Book
      • Review
    Powered by Privatenote Copyright © 끄적끄적 어디서나 개발 All rights reserved. TistoryWhaleSkin3.4

    티스토리툴바