You Can Become A
늦게 시작해도 누구든지 노력하면 개발자가 될수 있어요 !
🚀 자바스크립트 배열 동등 비교 방법
자바스크립트 배열 동등 비교 숫자나 문자열 비교할때는 == 이나 === 연산자를 이용하면 되지만, 배열이나 객체를 비교할때는 불가능하다. 왜냐하면 reference 타입으로써 값이 비교 되는 것이 아닌 주소값이 비교되기 때문이다. const a = [1, 2, 3]; const b = [1, 2, 3]; // 배열 구성을 비교하는게 아닌 배열 메모리 주소값 비교가 된다 a == b; // false a === b; // false 따라서 배열 구성 요소를 동등 비교하기 위해서는 직접 하드 코딩하여 비교하는 수밖에 없다. 여러가지 방법이 있는데 몇가지 사례를 소개해 본다. JSON.stringify JSON.stringify() 메소드로 배열을 직렬화(문자열) 하여 문자열 비교 const equals = ..
☕ JAVA 배열(Array) 완벽 다루기 가이드
배열 자료형 배열(array)은 프로그래밍에서 필수로 등장하는 요소이며 정말 자주 쓰이는 자료형이다. 배열은 하나의 블록안에 여러 데이터들을 모아 집합시켜 저장함으로써 데이터를 구조적으로 다루는데 도와준다. 배열을 구성하는 각각의 값을 배열 요소(element)라고 하며, 배열에서의 위치를 가리키는 숫자를 인덱스(index)라고 칭한다. 배열 선언 & 초기화 자바(Java)의 배열은 코드를 보면 볼 수 있듯이 배열을 선언할때 미리 공간의 갯수(길이)를 지정해야 한다. 이는 곧 공간의 제약이 생겨 데이터를 저장하는데 애로사항이 있을 수 있다는 뜻이기도 하다. 자바스크립트나 파이썬의 배열 같은경우 유기적으로 늘어나는 특성 때문에 배열에 데이터를 저장하는데 있어 공간을 따진적이 없었기 때문에 적응이 힘들 수도..
📘 타입스크립트 모듈 & 네임스페이스 시스템 이해하기
타입스크립트 모듈 시스템 모듈은 독립 가능한 기능의 단위이다. 프로그램은 여러 모듈로 구성되어 있고 모듈을 결합해 하나의 프로그램을 만든다. 모듈을 사용하면 다음과 같은 장점이 있다. 유지 보수의 용이성 : 중복 코드의 최소화 전역 스코프 오염을 방지 : 이름 공간이 파일 단위로 제한되어 전역 이름 공간을 침범하지 않음 재사용성 향상 : 모듈을 다른 프로젝트에 공유하여 재사용 가능 이처럼 모듈은 전역 변수와 구분되는 파일 자체 유효 범위(Local Scope)를 가진다. 이는 모듈 내 선언된 변수, 함수, 클래스 등을 명시적으로 내보내지 않는 이상 모듈 외부에서 접근할 수 없음을 의미한다. 예를들어 타입스크립트 프로젝트에 다음과 같이 index.ts , test/test.ts 두 파일이 있다고 하자. 그..
🤖 구글봇 / 크롤러 방문 감지하기
검색봇이 크롤링/스크랩핑 하는지 감지하기 우리가 잘아는 대표적인 검색봇은 구글봇이 있다. 이 구글봇이 우리의 티스토리나 웹사이트를 크롤링해야 구글 노출을 시켜준다. 다만, 구글봇도 하나의 사용자처럼 웹사이트를 방문해 조회하기 때문에 내 홈페이지를 조회한게 로봇인지 사람인지 구분할 필요성이 생길 때 가 있다. 이때 간단하게 웹브라우저 전반에 대한 정보를 제공하는 window 객체의 navigator.userAgent 에 적힌 정보를 뒤져서 졍규식으로 봇이름을 가지고 있는지 판별하는 식으로 감지할 수 있다. const detectRobot = (userAgent) => { const robots = new RegExp([ /bot/,/spider/,/crawl/, // GENERAL TERMS /APIs-G..
![[PUG] 📚 퍼그 문법 총정리 - 한눈에 마스터하기](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2Fbd7RHp%2FbtrjLjBb9Hp%2FAAAAAAAAAAAAAAAAAAAAANI-Jn0CWAeRkd6B0NR75wBQSiMkqpRjuQrsO0jfpqJS%2Fimg.png%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1753973999%26allow_ip%3D%26allow_referer%3D%26signature%3DGd0phoXlNwAcy9%252FxymC9MQzEV48%253D)
[PUG] 📚 퍼그 문법 총정리 - 한눈에 마스터하기
Pug 태그 문법 Pug와 HTML 문법 구성을 서로 비교해가며 익혀보자. 기본 태그 입력 Script / Style 태그 안에 다른 언어 (js, css)를 쓰는 특별한 태그는 반드시 뒤에 점. 을 찍어주어야 인식된다. 태그 속성 입력 id / class 속성 입력 div 같은건 생략이 가능하다 Attributes(속성) 입력 1. 속성 하나 넣기 2. 속성 여러개 넣기 3. 속성에 자바스크립트 매핑 4. Boolean 속성 처리 boolean속성은 true일 때만 표시 텍스트 넣기 엘리먼트 다음에 한칸 띄고 내용을 적으면 된다. 유의 할점은, 태그 쓰고 한칸 스페이스 띄면 바로 평문 처리되니 조심하자 긴 문장을 입력하려면 pip | 을 쓰면 된다. 인라인 태그(inline Tags) 인라인 태그 처리..
📚 JavaScript 정규 표현식 문법 총정리 + 응용 예제
정규 표현식(Regular Expression) 정규식(Regular Expression)은 문자열에서 특정 내용을 찾거나 대체 또는 발췌하는데 사용된다. 대표적으로 입력칸에 전화번호나 이메일을 입력하라고 했을때 옳지 않은 값을 입력하면 정규표현식에 의해 필터링되어 걸러져 경고창을 띄우는 화면을 본적이 있을 것이다. 이처럼 반복문과 조건문을 사용해야 할것같은 복잡한 코드도 정규표현식을 이용하면 매우 간단하게 표현할 수 있으며 주로 다음과 같은 상황에서 굉장히 유용하게 사용된다. 각각 다른 포맷으로 저장된 엄청나게 많은 전화번호 데이터를 추출해야 할 때 사용자가 입력한 이메일, 휴대폰 번호, IP 주소 등이 올바른지 검증하고 싶을 때 코드에서 특정 변수의 이름을 치환하고 싶지만, 해당 변수의 이름을 포함하..
☕ 자바는 Call by reference 개념이 없다 ❓
자바의 Call by Value / Call by Reference 프로그래밍을 하다보면 반드시 마주치는 것이 바로 call by value / call by reference 개념이다. 함수의 매개변수에서 값을 복사하느냐 주소값을 참조하느냐에 따라 반환 결과가 달라지기 때문에 대부분의 프로그래밍 교육과정에선 중요시 하게 여긴다. 자바에서도 역시 call by value 와 call by reference 동작 차이가 존재한다. 자바의 데이터형을 알아보면 크게 두가지로 나뉘게 된다. 기본형(primitive type) - Boolean Type(boolean), Numeric Type(short, int, long, float, double, char) 참조형(reference type) - Class ..
☕ 그림으로 보는 자바 코드의 메모리 영역(스택 & 힙)
자바의 메모리 영역 이번 포스팅에선 자바(JAVA)를 사용하는 입장에서 알아야 할 메모리 구조 및 특징에 대해서 알아보려고 한다. 자바 프로그램이 실행되면 JVM(자바 가상 머신)은 OS로부터 메모리를 할당받고, 그 메모리를 용도에 따라서 여러 영역으로 나누어 관리를 한다. JVM의 메모리 공간(Runtime Data Area)은 크게 Method(Static) 영역, Stack 영역, Heap 영역으로 구분되고 데이터 타입(자료형)에 따라 각 영역에 나눠서 할당 되게 된다. 컴퓨터의 메모리는 사용할 수 있는 공간이 한정되어 있기 때문에 어떻게 관리하느냐에 따라서 프로그램의 성능(속도 등)이 좌우된다. 그래서 메모리 설계가 잘되어 있는 프로그램에 비해 그렇지 않은 프로그램은 속도 저하 현상이나 튕김 등의..
![[AWS] 📚 S3 - CLI 명령어 종류 💯 총정리](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdna%2FmI3CW%2FbtrNvybRqeS%2FAAAAAAAAAAAAAAAAAAAAALMzweFLSg0BcCHbmBr0SeE8iUtf0EfKOGxMpk0SEkxL%2Fimg.jpg%3Fcredential%3DyqXZFxpELC7KVnFOS48ylbz2pIh7yKj8%26expires%3D1753973999%26allow_ip%3D%26allow_referer%3D%26signature%3DiI6%252BAPcwnEMAE1SyA3eEhJCpPtY%253D)
[AWS] 📚 S3 - CLI 명령어 종류 💯 총정리
AWS S3 CLI 명령어 지금까지 S3에 버킷을 생성하고 파일을 저장하려면 웹브라우저 콘솔 화면에 가서 일일히 화면을 눌러 적용해야 했다. 기능상에는 문제는 없지만 웹서비스 자체가 조금 느리다는 점이 사용에 불편함을 느끼게 된다. 거기다 브라우저 한 페이지에 표시되는 파일 갯수 역시 한계가 있다. 하지만 AWS CLI를 이용하면 간편하게 S3 버킷을 제어하고 S3 오브젝트에 접근할 수 있어 활용성이 높아진다. 예를들어 10만 단위의 파일을 한 번에 이동하거나 삭제하고 싶을 때 커맨드를 이용해 패턴을 이용해 빠르게 처리를 할수 있다. AWS CLI 란? AWS Command Line Interface(AWS CLI)는 명령줄 셸의 명령을 사용하여 AWS 서비스와 상호 작용할 수 있는 오픈 소스 도구. 최..
💽 IntelliJ - 플러그인 & 에디터 설정 동기화 방법
인텔리제이 세팅 동기화(Sync) 만일 다른 컴퓨터에서 인텔리제이로 개발을 진행해야 할때 내 컴퓨터에서의 인텔리제이 세팅과 플러그인 구성을 그대로 들고 오고 싶은 경우가 있을 것이다. 플러그인 세팅을 zip으로 만들어 파일 형태로 내보낸뒤 불러오는 식으로, 로컬로 연동이 가능하지만 매번 새로이 세팅을 변경해줄 때마다 백업해주어야 한다는 불편함이 존재한다. 따라서 인텔리제이에서는 클라우드로 세팅을 동기화 시키게 해주는 기능을 제공해준다. 이 포스팅에서는 JetBrains 계정과 Github 계정에 세팅 동기화 하는 두가지 과정을 소개해 볼 예정이다. JetBrains 계정으로 동기화 가장 직관적인 설정법은 jetbrains 계정에 내 인텔리제이를 연동시켜 동기화 하는 방법이다. 인텔리제이 IDE에서 연동하..
📘 타입스크립트 @데코레이터 개념 & 사용법
타입스크립트 Decorator 란 타입스크립트로 Angular.js 나 Nest.js 개발을 진행하다보면 필연적으로 데코레이터란 것을 접하게 된다. 자바(Java)를 해본 분들이라면 어노테이션과 비슷하다고 볼수 있지만, 자바 어노테이션은 컴파일 타임에 상관지만 타입스크립트 데코레이터는 컴파일 타임에는 상관하지 않아, 오히려 파이썬(Python)의 데코레이터와 거의 비슷하다고 말하는게 옳다. 데코레이터는 일종의 함수 이다. 데코레이터는 말 그대로 코드 조각을 장식해주는 역할을 하며, 타입스크립트에서는 그 기능을 함수로 구현하는 것이다. 예를들어 메소드 / 클래스 / 프로퍼티 / 파라미터 위에 @함수 를 장식해줌으로써, 코드가 실행(런타임)이 되면 데코레이터 함수가 실행되어, 장식한 멤버를 보다 파워풀하게 ..
📘 타입스크립트 공변성 & 반공변성 완벽 이해
타입의 공변성과 반공변성 타입스크립트는 자바스크립트에 타입을 추가해준 라이브러리 이지만, 타입을 다루는 언어이기도 하다. 그래서 어느새 타입 자체를 코딩하고 있는 자신을 발견하기도 한다. 타입을 코딩하는 도중 많이 당황하는 개념이 타입 간의 관계 이다. 어떤 타입은 다른 타입에 들어가는데 어떤 타입은 안 들어가서 결과가 다르게 나오는 당황스러운 경우가 있기 때문이다. 그리고 여러분들은 이런 이상한 인과를 찾아보다 결국 공변성(Covariance) 이라는 단어까지 도달했을 거라 추측한다. 타입스크립트에는 용어부터 어려워 보이는 이 단어 이외에도 3가지 더 개념이 있는데 간단히 정리하면 다음과 같다. 공변성(Covariance) : A가 B의 서브타입이면, T는 T의 서브타입이다. 반공변성(Contravar..
