You Can Become A
늦게 시작해도 누구든지 노력하면 개발자가 될수 있어요 !
📘 타입스크립트 인터페이스 활용 💯 총정리
타입스크립트 Interface 인터페이스는 자바(JAVA)를 배운 분들은 매우 익숙하면서도 반가운 단어일 것이다. 다만 자바에서의 인터페이스는 추상 메소드와 상수만을 정의한 클래스를 위주로 다루지만, 타입스크립트(TypeScript)의 인터페이스는 객체를 위주로 다룬다는 점에서 차이가 있다. 타입스크립트의 인터페이스는 두개의 시스템 사이에 상호 간에 정의한 약속 혹은 규칙을 포괄하여 의미한다. 혹은 객체의 껍데기 또는 설계도라고 할 수 있다. 즉, 프로그래밍에서 클래스 또는 함수의 '틀' 을 정의하는 것처럼, 타입의 '틀'로서 사용할 수 있는 것이 인터페이스 인 것이다. 여러 함수가 특정한 시그니처를 동일하게 가져야 할 경우 또는 여러 클래스가 동일한 명세를 정의해야하는 경우 인터페이스를 통해서 정의할 ..
📘 타입스크립트 함수 타입 다루기 💯 총정리
타입스크립트 함수 표현 타입스크립트에서 함수를 표현하는 방법은 머리 아플 정도로 여러가지이다. 내가 쓰기 편한 함수 선언 방식을 이용하면 되겠지만, 남이 만든 라이브러리나 코드를 보기 위해서는 어떤 타입스크립트 함수 표현식이 있는지 알 필요가 있다. 일반적인 함수 정의 자바스크립트에서 함수를 표현하는데 크게 3가지 표현식이 있다. 여기에 그냥 매개변수와 리턴값만 타입만 지정해주면 되니 그렇게 난해하지는 않다. 함수 선언식 //* 함수 선언식 function myFunc1(x: number, y: number): number { return x + y; } 함수 표현식 //* 함수 표현식 let myFunc2 = function (x: number, y: number): number { return x +..
📘 타입스크립트 타입 선언 & 종류 💯 총정리
타입 - Boolean 단순한 참(true) / 거짓(false) 값 let isBoolean: boolean; isBoolean = true; let isDone: boolean = false; 타입 - Number 정적 타입이라 해서 C / JAVA 처럼 int, float, double 타입은 없고, Javascipt의 number 자료형을 그대로 사용한다. 16진수, 10진수, 2진수, 8진수 리터럴도 지원한다. let num: number; let integer: number = 6; let float: number = 3.14; let hex: number = 0xf00d; // 61453 let binary: number = 0b1010; // 10 let octal: number = 0o7..
📘 타입스크립트 컴파일 설정 - tsconfig 옵션 총정리
타입스크립트 컴파일 설정 tsconfig.json은 타입스크립트를 자바스크립트로 변환 시키는 컴파일 설정을 한꺼번에 정의 해놓는 파일이라고 보면 된다. 프로젝트를 컴파일 하는데 필요한 루트 파일, 컴파일러 옵션 등을 상세히 설정할 수 있다. 보통 tsconfig.json 파일은 TypeScript 프로젝트의 루트 디렉토리(Root Directory)에 위치된다. 그래서 tsconfig.json 파일이 프로젝트에 있다면 vscode는 우리가 타입스크립트로 개발한다는 것을 인식하게 되는 것이다. tsconfig에서 옵션들을 미리 정의해 놓으면, 더이상 컴파일 할때 명령어에 일일히 대상 파일이나 옵션을 지정하지 않아도 된다. 그래서 tsc 나 ts-node 명령어를 그냥 실행하게 되면, 현재 폴더에 있는 ts..
📘 TypeScript 소개 & 개발 환경 구성하기
타입스크립트 소개 자바스크립트는 동적 타입 언어로서 자유도가 높아 진입 장벽이 낮고 생산성이 높은 대신, 형식이 정해져 있지 않기 때문에 오류(버그)가 런타임 중에 발생한다거나, 또는 팀원간에 코드를 통한 의사소통에 어려움이 생긴다는 단점이 있다. 예를들어 자바스크립트는 다음과 같은 정신 나간 코드에 대해서 어떠한 오류 없이 스스로 판단해 결과를 만들어 버린다. 자바스크립트는 최대한 개발자의 실수에 대해서 오류를 자제하고 실행하도록 유도하여 위와 같은 결과가 나오는 것이다. 이는 생산성을 확대라는 장점이 있지만 의도치 않는 버그를 마구 내뿜는다는 아주 큰 단점이 생기게 된다. C#과 Java 같은 체계적이고 정제된 언어들에서 사용하는 강한 타입 시스템은 높은 가독성과 코드 품질 등을 제공할 수 있고 런타..
☕ JDK / JRE / JVM 개념 & 구성 원리 💯 총정리
자바를 처음 설치하면 C:\Program Files\Java 폴더에 아래와 같이 JDK와 JRE 가 각각 설치되는 것을 볼 수 있다. 그렇다면 이 JDK와 JRE의 역할은 무엇인지 그리고 자바 프로그램(JVM)은 어떤식으로 돌아가는지에 대해 정리해보는 시간을 가져보자. JDK (Java Development Kit) JDK는 자바 개발키트(Java Development Kit)의 약자로 개발자들이 자바로 개발하는 데 사용되는 SDK 키트라 생각하면 된다. 그래서 JDK안에는 자바를 개발 시 필요한 라이브러리들과 javac, javadoc 등의 개발 도구들을 포함되어 있고, 개발을 하려면 자바 프로그램을 실행도 시켜줘야 하기 때문에 뒤에서 배울 JRE(Java Runtime Environment)도 함께 ..
☕ JAVA 소스 코드 구조 - 한눈에 이해하기
자바 소스코드의 구조 본격적으로 자바(Java) 문법에 대해 배우기 전에, 전반적인 자바 소스 코드가 어떤식으로 구성이 되어있는지에 대해서 알아보자. 보통 일반적인 자바 소스코드는 다음과 같은 형태로 만들어 진다. [ Sample.java ] /* 패키지 선언 */ package com.oracle.util; /* 패키지 가져오기 */ import java.lang.*; // 해당 패키지 내 모든 클래스를 불러옴 /* 클래스 블록 */ public class Sample { /* 메인 메소드 블록 */ // [public|private|protected] [static] (리턴자료형|void) 메소드명1(입력자료형 매개변수, ...) public static void main(String[] args) ..
🌐 FormData 사용법 & 응용 총정리 (+ fetch 전송)
FormData API 보통 서버에 데이터를 전송하기 위해서는 HTML5 의 폼 태그를 사용해 다음과 같이 메뉴를 구성하여 제출 해본 기억들이 있을 것이다. 아이디 비밀번호 성별 남자 여자 응시분야 영어 수학 이 처럼 보통은 HTML5의 태그이용해 input 값을 서버에 전송하지만, 자바스크립트에서 FormData() 클래스를 이용해 똑같이 스크립트로도 전송을 할수 있다. 즉, FormData란 HTML 단이 아닌 자바스크립트 단에서 폼 데이터를 다루는 객체라고 보면 된다. 그리고 HTML에서의 Submit 제출 동작은 Ajax를 통해 서버에 제출한다고 보면 된다. let formData = new FormData(); // new FromData()로 새로운 객체 생성 formData.append('i..
![[Python] 🐍 소수 찾기 알고리즘 (에라토스테네스의 체)](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fbs5thM%2FbtrIBU4CR6i%2F6UzeaeyLXgZCoWODkkzgH1%2Fimg.jpg)
[Python] 🐍 소수 찾기 알고리즘 (에라토스테네스의 체)
문제 : 1부터 입력받은 숫자 n 사이에 있는 소수를 찾아라 다음 코드는 우리가 흔히 알고 있는 소수를 찾는 방법이다. import time start_time = time.clock() n = 20000 num = list(range(n+1)) # 0~50까지의 숫자를 리스트에 저장한다. num2 = [] # 빈 리스트 for i in range(len(num)): # 리스트에 담긴 원소들을 하나하나씩 뽑을 것이다. for j in range(2, i): if i % j == 0: # 소수의 기본 연산. 2에서 자기자신-1 까지 나누어떨어지지 않는다면 소수이다. num[i] = 0 # 만일 소수가 아니면 해당 위치에 0을 대입하여 수정한다 num.remove(1) # 1은 소수가 아니기 때문에 리스트에..
☕ JDK & JRE 초간단 설치 및 환경 변수 설정
자바 (JDK / JRE) 설치 먼저 아래 홈페이지에서 jdk와 jre를 설치해준다. JRE : 자바 실행 환경(Java Runtime Environment)의 약자로 자바로 만들어진 프로그램을 실행시키는데 필요하다. JDK : 자바 개발키트(Java Development Kit)의 약자로 이름 그대로 개발자들이 자바로 개발하는 데 사용된다. ※ JAVA SE 8 ( 8u202 and earlier ) 버전을 사용하는 이유 Oracle이 2018년 7월부터 JAVA를 유료( Paid ) 구독형 라이센스로 개편하면서 JAVA SE 8 ( 8u211 and later ) 버전부터는 6개월 이후부터는 보안 업데이트가 이루어지지 않는 형태로 변경되었다. 그렇기 때문에 Oracle에서 무료로 보안 업데이트를 지원..
📚 JavaScript 배열 고차 함수 총정리
자바스크립트 배열 고차함수 여러분이 자바스크립트를 배우는 중이라면, 고차 함수(Higher-Order Function) 라는 용어를 얼핏 들어본 적이 있을 것이다. 고차 함수란, 함수를 파라미터로 전달받거나 연산의 결과로 반환해주는 메서드를 일컫는다. 요즘 자주 거론되는 함수형 프로그래밍의 핵심이기도 하며, 자바스크립트를 함수형 프로그래밍에 알맞은 언어로 만들어주는 특성이기도 하다. 함수형 프로그래밍이란? 함수형 프로그래밍은 함수를 다른 함수의 파라미터로 넘길 수도 있고 반환(return) 값으로 함수를 받을 수도 있는 프로그래밍 형태를 말한다. 함수형 프로그래밍에서, 개발자는 함수라는 용어 하에서 생각하고 코딩하게 된다. 이번 시간에는 자바스크립트에서 광범위 하게 사용되는 배열의 고차함수를 총정리 해보..
🌐 드래그 앤 드롭(Drag and Drop) 기능 이해 & 구현하기
HTML 드래그 앤 드롭 사용법 드래그(drag)와 드롭(drop)은 컴퓨터를 이용하면서 정말 많이 사용하는 기능 중에 하나일 것이다. 파일 애플리케이션에서 문서를 복사해 이동하는 것 부터 주문 하려는 물건을 장바구니에 드롭하는 것 까지 일상생활에서 많이 접해 봤을 것이다. HTML 그리고 JavaScript에서의 드래그 드롭은 이벤트 기반으로 작동하게 되는데, 마우스 커서로 객체(object)를 드래그해서 놓을 때까지 여러 단계의 이벤트가 순차적으로 발생하게 되어 동작이 완료되게 된다. 이번 포스팅에서는 자바스크립트를 이용해 드래그 앤 드롭 이벤트 동작 원리를 이해하고 여러 예제를 구현하는 시간을 가져볼 예정이다. 드래그 & 드롭 이벤트 종류 HTML에서 요소가 드래그 이벤트가 발생 할 수 있도록 해당..
