최연탄 원본: What Is XML Used For? 개발자라면 XML 이라는 용어가 무엇을 의미하는지, 어떻게 사용되는지 궁금할 것 입니다. 이 형식 자체는 프로그래밍 언어는 아니지만, 본인이 공부한 프로그래밍 언어에 상관없이 알아야 합니다. 이 포스트에서는 이것이 무엇인지, 왜 유용한 지, 정확히 어디에 사용되는지 알아 보겠습니다. XML 이란? XML 이란 eXtensible Markup Language의 약자로 확장 가능한 마크업 언어를 말합니다. … Read more
원본: 해시 알고리즘 개요: 유형, 방법론 및 사용법 해시 알고리즘은 데이터를 왜곡하여 읽을 수 없게하는 수학 함수입니다. 이는 단방향 알고리즘으로 다른 사람이 텍스트를 해독하거나 디코드할 수 없게 하는 것이 해시의 핵심 개념입니다. 해시는 유휴 데이터를 보호하므로, 다른 사용자가 서버에 접근해 코드를 읽어낸다 해도 저장된 내용을 알아낼 수 없습니다. 또한 작성자가 데이터를 만든 후 데이터가 변경되지 … Read more
원본: HTML textarea – How to Add a Text Box Input Type Tag to Your Website 텍스트 박스는 사용자로부터 텍스트를 입력 받을 수 있는 요소입니다. 텍스트 박스를 클릭하거나 탭하면 깜박이는 커서가 나타나 입력 받을 준비가 되었음을 알려줍니다. 텍스트 박스는 text field와 text area의 두 가지 유형으로 분류됩니다. 이 두 입력 박스는 서로 다른 용도로 사용되며 … Read more
원본: 자바스크립트에서 랜덤 문자열 생성하는 방법 랜덤 문자열은 사용자 ID, 비밀번호 생성, 토큰 생성 등 다양한 목적으로 사용됩니다. 이 포스트에서는 자바스크립트를 사용하여 무작위 데이터인 랜덤 문자열 생성하는 방법을 알아보겠습니다. 랜덤 문자열 필요성 이는 소프트웨어 개발 시 사용자 ID, 비밀번호, 토큰 등을 구성하는데 필요합니다. 웹 애플리케이션을 만든다고 가정했을 때 각각의 사용자가 로그인 할 수 있도록 임의의 … Read more
원본: 자바스크립트에서 문자열 날짜 정규식 확인 방법 이번 포스트에서는 자바스크립트에서 문자열 타입의 날짜 정규식 유효성 검사 방법에 대해 알아보겠습니다. 문자열 날짜 타입의 유효성을 검사하려면 해당 날짜가 해당 형식을 따르는지 확인하고 연도, 월, 일 구성 요소의 순서를 준수하는지 확인해야 합니다. 날짜 타입이 올바른지 여부를 확인하는 방법은 여러 가지가 있습니다. 예제를 통해 여러 방법과 구현을 살펴보겠습니다. Date.parse()로 … Read more
원본: 자바스크립트 정규 표현식으로 특수문자 제거 알파벳이나 숫자가 아닌 구두점, 악센트, 기호 등 읽을 수 없는 문자를 특수문자 라고 합니다. 문자열을 읽거나 이해하기 더 쉽도록 문자열에서 특수문자 제거를 해야합니다. 이 작업을 가장 간단하게 하는 방법은 정규 표현식을 사용하는 것 입니다. 포스트를 시작하기 전에 자바스크립트의 정규 표현식에 대해 간단하게 살펴보고 넘어가겠습니다. 자바스크립트의 정규 표현식 정규 표현식은 … Read more
원본: 자바스크립트로 범위 내의 랜덤 숫자 생성하기 자바스크립트의 Math.random()은 0과 1 사이의 난수를 생성하는 랜덤 함수입니다. 즉, 0과 같거나 크고 1 보다 작은 값을 리턴합니다. (0 <= x < 1) 다른 범위의 숫자가 필요한 경우 간단한 수학을 사용하여 원하는 범위의 값을 얻을 수 있습니다. 참고로 이 메소드는 암호학적으로 안전한 랜덤 값을 생성하지 않습니다. 보안과 관련된 … Read more
원본: 자바스크립트의 round(), ceil(), floor()를 사용하여 반올림 이 포스트에서는 자바스크립트의 round(), ceil(), floor() 메소드를 사용하여 숫자를 반올림, 올림, 내림 하는 방법을 알아보겠습니다. 위의 모든 메소드는 Math 객체의 정적 메소드입니다. 즉, Math 객체의 인스턴스에서 메소드를 호출하는 것이 아니라 Math.method()와 같은 형태로 직접 호출합니다. (Math에는 생성자가 없습니다.) 참고로 이 메소드는 숫자(정수, 소수)에 대해서만 호출할 수 있으며, 그 … Read more
원본: HTML로 라디오 버튼 만들기 방문자를 늘리기 위해 매년 새로운 웹 기술이 도입되지만, 시간이 지나도 변하지 않는 기술도 있습니다. 이번 포스트에서 그런 요소 중 하나인 HTML 라디오 버튼에 대해 알아보겠습니다. Form 양식에서 라디오 버튼 타입을 통해 여러 가지 옵션 중 하나를 선택하는 필드를 본 적 있을 것 입니다. HTML에서는 편리하게도 input 태그의 type 으로 라디오 … Read more
원본: 자바스크립트에서 문자열 제거 방법 자바스크립트의 문자열은 기본 자료형으로 작은따옴표(‘), 큰따옴표(“), 백틱(`)으로 묶인 일련의 문자를 가집니다. 문자열은 수정할 수 없습니다(immutable). 즉, 문자열을 변경하려면 원래 문자열은 놔두고 새 문자열을 만들게 됩니다. 문자열을 조작해주는 빌트인 메소드로 문자열을 수정하고 변환할 수 있으며, 이는 더 적은 코드로 작업을 더 쉽게 만듭니다. 문자열을 조작하는 작업 중 하나는 문자열에서 문자를 제거하는 … Read more
원본: JavaScript Substring Method 이번 포스트에서는 자바스크립트의 substring() 메소드를 효과적으로 사용하는 방법에 대해 알아보겠습니다. 여기서는 메소드의 작동 방식을 알아보기위해 예제와 패턴, 특이점 등을 확인해 보겠습니다. 일반적으로 substring() 메소드는 문자열의 일부를 추출하고 저장할 때 사용하는 String 객체의 메소드입니다. 추출하는 동안 원본 문자열은 그대로 유지되며 대상 부분만 새 문자열로 리턴됩니다. 문자열의 특정 부분을 가져올 때 사용하기 좋습니다. … Read more
원본: 자바스크립트 체크박스 이 포스트에서는 자바스크립트를 사용하여 체크박스가 선택되었는지 확인하고, 선택된 값을 가져오고, 모든 체크박스를 선택/해제하는 방법을 알아보겠습니다. 체크박스 생성 체크박스를 생성하기 위해서는 다음 예제와 같이 <input> 요소의 type 속성을 checkbox로 설정하면 됩니다: 가용성과 접근성을 향상시키기 위해 체크박스와 <label> 요소를 항상 연결하여 사용하는 것이 좋습니다. 이렇게 하면 다음과 같이 레이블을 클릭해도 체크박스가 선택되거나 해제됩니다: 또는: … Read more
원본: HTML Drop-down Menu – How to Add a Drop-Down List with the Select Element 대부분의 웹 페이지나 응용프로그램에서는 드롭다운 메뉴를 사용하여 정보 목록을 표시합니다. 우리는 이를 사용하여 탐색 메뉴, Form 옵션 등을 만들 수 있습니다. 웹 사이트나 프로그램의 메뉴를 보면 ‘메뉴를 만들기 복잡할 것 같다’라는 생각이 들 것 입니다. 맞습니다. 경우에 따라 복잡해지기도 합니다. … Read more
원본: 자바스크립트로 드롭다운 메뉴를 만드는 방법 웹 서핑을 하면서 드롭다운 메뉴를 사용해 본 적이 있을 것 입니다. 이는 주로 Form 양식에서 사용자 입력 수집하기, 웹 애플리케이션에서 탐색 메뉴 구현 등에 사용됩니다. 드롭다운은 애플리케이션의 레이아웃 흐름을 깨지 않고 여러 기능을 제공하는 가장 좋은 방법입니다. 웹 외에도 exe 프로그램, 운영체제 등에서 사용됩니다. 이 포스트에서는 HTML, CSS, 자바스크립트를 … Read more
원본: Forms and Form Input Fields form 양식은 사용자가 제공한 정보를 HTTP를 통해 서버로 제출하게 하는 요소로, 자바스크립트 웹 초기 버전에서 서버와의 상호 작용 이후에는 항상 새 페이지로 이동한다는 가정 하에 설계된 요소입니다. 하지만 이제는 DOM의 일부이며 form 필드를 나타내는 DOM 요소는 다른 요소에는 없는 속성과 이벤트를 지원합니다. 이를 통해 입력 필드를 검사, 제어하고 기존 … Read more
원본: 자바스크립트 배열 – 배열 생성 방법 배열은 순서가 있는 요소의 목록을 가지는 자료구조입니다. 이 포스트에서는 자바스크립트를 사용하여 배열을 생성하는 4 가지 방법을 알아보겠습니다. 할당 연산자로 배열 생성 자바스크립트에서 가장 일반적으로 배열을 만드는 방법은 다음과 같이 배열 변수를 할당하는 것 입니다: 개발자 도구를 켜고 console.log() 메소드를 사용하여 배열 값을 확인하면 4 개의 요소를 가진 배열이 … Read more
원본: JavaScript Console Log: Best Logging Techniques 자바스크립트의 console.log() 메소드와 고급 자바스크립트 로깅 기술은 현대 웹 개발에 중요한 위치를 차지하고 있습니다. Safari, Chrome 등 브라우저의 개발자 도구 없이는 대부분의 프로젝트에서 채택하고 있는 애자일 방법론에 따른 빠른 릴리즈 주기를 맞출 수 없을 것 입니다. 이러한 도구는 앱이 실제 환경에서 어떻게 작동하는지를 보여주고, 개발자가 소스 코드를 자세히 … Read more
원본: 크롬 개발자 도구 가이드 프론트 엔드 개발자나 테스터로서 작업 시 웹 애플리케이션의 버그를 찾고 수정하는 작업은 쉬운 일이 아닙니다. 왜냐면 API 호출이나 불확실한 사용자 상호 작용 때문에 예기치 않은 오류가 발생하기 때문입니다. 하지만 요즘 나오는 최신 브라우저에는 오류를 디버깅할 수 있는 개발자 도구를 함께 제공하고 있습니다. 개발자 도구를 사용하면 개발자와 테스터가 실행 중인 웹 … Read more
원본: Try/Catch in JavaScript – How to Handle Errors in JS 자바스크립트 코딩 시 버그와 오류 발생은 불가피한 요소입니다. 개인 프로젝트에 오류가 있어서 밤새 디버깅했는데 단순한 쉼표 같은 것이 원인이었다면 허탈했을 것 입니다. 하지만 고객이 보고한 오류는 좀 더 진지하게 심각합니다. 오류는 개발자를 짜증나고 고통스럽게 합니다. 이 포스트에서는 이러한 고통을 줄이기 위해 try…catch 라는 자바스크립트 … Read more
원본: How to Validate URL in JavaScript Uniform Resource Locator(URL)은 인터넷의 페이지나 파일을 연결합니다. 이는 인터넷에 있는 서버의 주소 역할을 합니다. 유효한 URL은 특정 패턴을 따르므로 패턴을 알고 있으면 URL이 유효한지 확인하고, 피드백을 제공하고, 오류를 발생시키는 등의 작업을 할 수 있습니다. 이 포스트에서는 자바스크립트 문자열이 유효한 URL인지 확인하는 세 가지 방법을 알아보겠습니다. URL 생성자로 검증 … Read more