본문 바로가기

전체 글348

vs code 에서 html 한 번에 입력하기 - html 필수코드 자동완성 오늘 코드잇 강의를 듣다가 (나에게는) 대단한 꿀팁 하나를 알게되어 블로그에도 공유하려고 한다. html 파일의 구조를 보면 ,, , 등의 태그를 순서대로 쓰는데, 이런 필수 코드들을 한 번에 자동으로 입력할 수 있는 방법이다. html 필수 코드 한 번에 입력하기 먼저 vs code를 실행하고 새로운 html 파일을 만든다. 그 다음 느낌표(!)를 쓰면 아래에 자동 완성 창이 뜬다. 그 상태에서 그대로 엔터(enter) 키를 누른다. 그러면 오오오오오!!! 자동으로 코드들이 입력된다. 다시 한 번 검토해서 본인의 사이트 상황에 맞게 바꾸어 주어야 하는 부분도 있지만, 필수 코드들을 한 번에 입력할 수 있다니 나같은 코린이들에게는 정말 반가운 꿀팁이다. 그리고 깨알 자랑! 강의를 열심히 들어서 오늘 드디.. 2023. 7. 25.
정규 표현식 - 플래그란? 몇가지 플래그 옵션 소개 정규표현식을 사용할 때, 플래그 옵션 설정에 따라서 갖는 결과값이 완전히 달라진다. 때문에 플래그 옵션 종류를 잘 기억해두었다가 원하는 상황에 맞게 쓰는 것이 중요하다. 플래그 정의 플래그는 정규 표현식에 적용되는 설정을 조정해주는 역할을 한다. 특정 의미를 가진 알파벳을 플래그 사용 위치에 적어주면 그 옵션에 맞는 결과값이 보여진다. 플래그 옵션 종류 g 문자열에서 일치하는 모든 부분을 찾고 싶을 때 사용하는 플래그 옵션이다. g 옵션 없이 사용하면 일치하는 패턴 하나를 찾은 뒤, 정규표현식이 바로 종료된다. i 정규표현식은 기본적으로 대소문자를 구분하는데, 플래그 옵션 i를 사용하면 대소문자 구분 없이 알파벳만 일치하면 선택해준다. m 줄 바꿈이 된 부분도 문장의 경계로 인식해 주는 플래그 옵션이다... 2023. 7. 7.
변수명, 함수명으로 사용할 수 없는 예약어 목록 파이썬에서 변수명, 함수명을 정할 때 사용하면 안 되는 단어들이 있다. 프로그램에서 역할이 미리 정해져 있는 단어들로 '예약어'라고 부른다. 파이썬의 예약어 목록에 대해 알아보자. 파이썬 예약어 목록 and as assert break class continue def del elif else except False finally for from global if import in is lambda nonlocal None not or pass True raise return try shile yield 2023. 7. 6.
정규 표현식 - 하위 표현식 하위 표현식이란, 정규 표현식 안에서 특정 패턴을 나타내는 표현식을 하나로 묶어 처리하는 것을 말한다. 하위 표현식은 메타 문자 소괄호()로 나타내며, 아래와 같은 상황에 주로 사용한다. 가독성이 떨어질 때 정규 표현식을 사용할 때, 그 길이가 너무 길어지면 가독성이 떨어지게 된다. 이럴 때 하위 표현식인 소괄호로 묶어주면 표현식이 훨씬 한 눈에 들어와 이해하기 쉽다. 표현식을 반복해야 할 때 하위 표현식 뒤에 수량자를 붙이면, 소괄호 안에 있는 문자열을 반복할 수 있다. 정규 표현식을 훨씬 더 간결하게 표현할 수 있는 것이다. ex) 하위 표현식 ()를 사용하여 ip 주소를 간단하게 나타냄 논리 연산자 or을 사용할 때 문자들 사이에서 논리 연산자 or을 함께 사용할 수 있다. 참고로 or은 | 기호로.. 2023. 7. 6.
정규 표현식 - 단어 경계, 문장 경계 이번 포스팅에서는 단어 경계, 문장 경계를 나타내는 정규 표현식에 대해서 알아보도록 하겠다. 단어 경계 아래와 같은 문장이 있고 is를 입력하면 알파벳 is가 사용된 부분이 모두 선택된다. 이 때 띄어쓰기 조건을 추가로 사용하고 싶다면 \b, \B를 사용하면 된다. \b : 단어의 경계인 위치 \B : 단어의 경계가 아닌 위치 ex) 위의 문장에서 is가 be동사로 쓰인 곳만 찾기 (앞 뒤로 띄어쓰기) ex) 위의 문장에서 His만 찾기 ex) 위의 문장에서 island만 찾기 문장 경계 단어가 아닌 문장의 경계를 나타낼 때에는 캐럿(^)과 달러 기호($)를 사용한다. ^ : 문장의 시작점 $ : 문장의 끝 지점 캐럿(^)은 집합 안에서는 부정의 의미로 사용되는 메타 문자이지만, 집합 밖에서 쓰이면 경계.. 2023. 7. 5.
정규 표현식 - 수량자 수량자는 문자의 반복 횟수를 설정하는 문법으로, 반복하고 싶은 문자{수량자}의 형태로 사용한다. 반복하고 싶은 문자 부분에는 일반 문자, 집합, 문자 클래스, 메타 문자, 하위 표현식 등이 올 수 있다. 수량자 기본 표현 반복 횟수를 대괄호 안에 넣어서 {n}과 같은 형태로 사용하는 것이 기본이다. ex) 네 자리 숫자가 연속으로 오는 경우를 찾고 싶을 때 \d{4} 외에 아래와 같이 써도 동일한 결과를 얻을 수 있다. [0-9]{4} [0123456789]{4} \d\d\d\d [0-9][0-9][0-9][0-9] [0123456789][0123456789][0123456789][0123456789] 수량자 범위 지정 수량자를 {min,max} 형태로 사용하면 {최소값, 최대값} 사이의 경우를 찾는다... 2023. 7. 4.
정규 표현식 - 이스케이핑 이번 포스팅에서는 이스케이핑에 대해서 알아보자! 정규 표현식에서 이스케이핑 문자(\)를 추가하면, 메타 문자들을 일반 문자로 사용할 수 있다. 마침표(.)를 선택하고 싶어서 위와 같이 .을 찍으면 메타 문자인 Dot(.)으로 인식하며 모든 문자를 선택하지만, 앞에 이스케이핑 문자를 추가하면 의도한대로 마침표(.)만 제대로 출력된다. 슬래시(/)의 경우 정규 표현식의 시작과 끝을 나타내는 구분 문자로 사용되는데, 마찬가지로 이스케이핑을 하여 슬래시를 선택할 수 있다. 백슬래시(\)도 동일하다. 백슬래시를 두 번 연속으로 입력하면 된다. 2023. 7. 4.
정규 표현식 - 문자 클래스, 메타 문자 문자 클래스는 자주 사용하는 집합들을 좀 더 쉽게 사용할 수 있도록 한 예약어이다. 보통 백슬래시(\) 뒤에 특정 알파벳을 합쳐서 표기한다. \d 모든 숫자를 나타내는 집합인 [0-9]의 예약어이다. \w 영어 대소문자, 숫자, 언더바(_)를 선택해주는 예약어이다. 특수문자, 한글은 포함하지 않는다. 만약 찾아야하는 문자열에 한글이 포함된다면 [\w가-힣]으로 쓴다. \s 공백을 선택해주는 예약어이다. 스페이스 바와 탭을 구분하지 않고 문자 사이를 구분짓는 공백은 모두 선택된다. (줄바꿈 문자 \n도 포함) 문자 클래스의 부정 의미 표현 위에서 정리한 문자 클래스 알파벳을 대문자로 쓰면 부정의 의미가 된다. \D 숫자를 제외함 \W 영문 대소문자, 숫자, 언더바(_)를 제외함 \S 띄어쓰기를 제외함 메.. 2023. 7. 4.
정규 표현식 - 집합 표현 방법, 하이픈, 캐럿 정규 표현식은 문자열을 일정한 패턴으로 표현하는 방식으로, 프론트엔드, 백엔드, 데이터 분석 등 여러 분야에서 활용할 수 있다. 이번 포스팅에서는 정규 표현식의 기초인 집합에 대해서 정리해 보려고 한다. 정규 표현식은 아래 사이트에서 실습하였는데, 무료로 사용할 수 있으니 참고하면 좋을 것 같다. https://regex101.com/ regex101: build, test, and debug regex Regular expression tester with syntax highlighting, explanation, cheat sheet for PHP/PCRE, Python, GO, JavaScript, Java, C#/.NET, Rust. regex101.com 집합 표현방법 집합은 표현하고 싶은 문.. 2023. 7. 3.
config 2023 피그마 변수를 활용하여 라이트/다크 모드 설정하기 이번 포스팅에서는 피그마 변수를 활용하여 라이트/다크 모드 색상을 적용하는 방법에 대해서 소개하려고 한다. 임의로 라이트/다크 모드의 색상 팔레트를 준비해보았다. 피그마 변수가 무엇인지 알고 싶은 분들은 아래 링크 클릭 ▼▼▼ 2023.06.22 - [디자인/Figma] - config 2023 variables 디자인 변수 종류, 생성, 관리하기(number/color) config 2023 variables 디자인 변수 종류, 생성, 관리하기(number/color) 피그마의 디자인 변수는 모든 종류의 디자인 속성(채우기 색상, 패딩 등)과 프로토타이핑 작업에 적용할 수 있는 재사용 값을 저장한다. 변수는 스타일 및 구성 요소와 마찬가지로 팀 라이브러 heinafantasy.com 라이트/다크 모드 .. 2023. 6. 22.

티스토리툴바