hj_kim97의 네이버 블로그 포스트 목록: 3 페이지

hj_kim97의 등록된 링크

키자드에 등록된 총 289개의 포스트를 확인하실 수 있습니다.

Naver Blog

[JavaScript]팝업창 띄우기(window.open, CORS, postMessage)

JavaScript 팝업창 띄우기(window.open) - window.open() 함수 - 팝업 옵션(windowFeatures) - 팝업창 열기 예제 - 부모, 자식 팝업창 간의 함수 호출 및 값 전달 · 부모창에서 자식창 제어하기 · 자식창에서 부모창 제어하기 - 데이터를 전송하여 팝업창 생성하기(submit) - 부모, 자식 팝업창 간의 함수 호출시 CORS 문제 · Window.postMessage() 메소드 · postMessage() 메소드 예제 window.open() 함수 Window 인터페이스인 open() 메소드는 명시된 리소스를 명시된 이름으로 브라우징 컨텍스트에 로드합니다. · url : 로드할 리소스의 URL · windowName : 팝업창의 이름 · windowFeatures : 팝업 옵션(창의 크기, 스크롤, 리사이즈, .. 등의.......

원문보기 내부링크

Naver Blog

[H2 Database]H2 Database 설치 및 간단 사용법

H2 Database - H2 Database란? - H2 Database 설치 및 서버 구동 - H2 웹 콘솔 H2 Database란? H2 Database는 자바 기반의 오픈소스 관계형 데이터 베이스 관리 시스템(RDBMS) 입니다. 서버(Server) 모드와 임베디드(Embedded) 모드의 인메모리 DB 기능을 지원하며, 브라우저 기반의 콘솔모드를 이용할 수 있으며, 별도의 설치 과정이 없고 용량이 매우 가벼워 개발용 로컬 DB로 사용하기 좋은 데이터베이스입니다. · Java로 작성된 오픈소스 RDBMS · 스프링 부트가 지원하는 인메모리 관계형 데이터베이스입니다. · 인메모리로 띄우면 애플리케이션을 재시작할 때마다 초기화됩니다. · 별도의 설치가 필요 없습니다. · 로컬 환경, 테스트 환경에.......

원문보기 내부링크

Naver Blog

[Spring]Spring 의존성 주입(DI, Dependency Injection)

Spring 의존성 주입(Dependency Injection) - 제어의 역전(IoC, Inversion of Control) - 의존성 주입(DI, Dependency Injection) - 의존성 주입(DI)를 사용하는 이유 - 스프링 빈(Bean) - 스프링 의존성 주입(DI) - 스프링 IoC 컨테이너 - 스프링 빈 등록 방법 - 의존 객체 자동 주입 · 생성자 주입 - @Autowired · 수정자 주입 - @Autowired · 필드 주입 - @Autowired · 필드 주입 - @Resource, @Injection 제어의 역전(IoC, Inversion of Control) IoC는 Inversion of Control의 약자로 제어의 역전이라는 뜻을 갖고 있습니다. 스프링에서는 일반적인 Java 객체를 개발자가 new로 생성하여 관리하는 것이 아닌 Spring Container가 객체를 생성.......

원문보기 내부링크

Naver Blog

[프로그래머스]Level1. 신규 아이디 추천

프로그래머스 Level1. 정수 제곱근 판별 링크 : https://programmers.co.kr/learn/courses/30/lessons/72410 문제 설명 카카오에 입사한 신입 개발자 네오는 "카카오계정개발팀"에 배치되어, 카카오 서비스에 가입하는 유저들의 아이디를 생성하는 업무를 담당하게 되었습니다. "네오"에게 주어진 첫 업무는 새로 가입하는 유저들이 카카오 아이디 규칙에 맞지 않는 아이디를 입력했을 때, 입력된 아이디와 유사하면서 규칙에 맞는 아이디를 추천해주는 프로그램을 개발하는 것입니다. 다음은 카카오 아이디의 규칙입니다. · 아이디의 길이는 3자 이상 15자 이하여야 합니다. · 아이디는 알파벳 소문자, 숫자, 빼기(-), 밑.......

원문보기 내부링크

Naver Blog

[Spring]Spring 관점지향 프로그래밍(AOP, Aspect Oriented Programming)

Spring 관점지향 프로그래밍(AOP, Aspect Oriented Programming) - 관점지향 프로그래밍(AOP) 개요 - 관점지향 프로그래밍(AOP, Aspect Oriented Programming) - AOP 주요 용어 - AOP 주요 어노테이션 - Pointcut 표현식 사용법 - AOP 사용하기(인터페이스) - Spring AOP - AOP 사용하기(어노테이션) - AspectJ · XML 기반의 POJO 클래스를 이용한 AOP 구현 · @Aspect 어노테이션을 이용한 AOP 구현 - 포인트컷 응용(커스텀 어노테이션) 관점지향 프로그래밍(AOP) 개요 프로그래밍을 하다보면, 공통적인ㄱ ㅣ능이 많이 발생합니다. OOP에서 이런 공통된 기능을 재사용하는 방법으로는 상속이나 위임을 사용합니다. 하지만, JAVA에서는 다중 상속.......

원문보기 내부링크

Naver Blog

[Spring Batch]Spring Batch 메타 데이터 테이블

Spring Batch란? - Batch Processing이란? - Spring Batch란? - Spring Batch 메타 데이터 테이블 · BATCH_JOB_INSTANCE · BATCH_JOB_EXECUTION · BATCH_JOB_EXECUTION_PARAM · BATCH_JOB_EXECUTION_CONTEXT · BATCH_STEP_EXECUTION · BATCH_STEP_EXECUTION_CONTEXT - 메타 데이터 테이블 생성하기 Batch Processing이란? 일괄 처리(Batch Processing)란 사전적 용어로 컴퓨터 프로그램 흐름에 따라 순차적으로 자료를 처리하는 방식을 뜻합니다. 쉽게 말해, 개별적으로 어떤 요청이 있을 때마다 실시간으로 통신하는 것이 아닌 한꺼번에 일괄적으로 대량 건을 처리하는 것입니다. 이러한 일괄 처리 시스템은 일정 기간마다 주기적으로 한꺼번에.......

원문보기 내부링크

Naver Blog

[Python]파이썬 기본 문법 정리[자료형, 시퀀스자료형, 연산, 제어문]

파이썬 기본 문법 정리 - 자료형 · 숫자 자료형 · 문자 자료형 · 불린형 - 시퀀스 자료형 · 튜플(tuple) · 딕셔너리(dictionary) · 리스트(list) · 집합(set) - 연산 · 대입 연산 · 산술 연산 · 비교 연산 · 논리 연산 · 멤버십 연산 - 제어문 · 조건문(if) · 반복문(while, for) 자료형 변수(Variable) 변수(Variable)란 데이터를 저장할 공간이라고 할 수 있습니다. 파이썬에서는 변수를 선언할 때 따로 자료형을 지정하지 않고, 변수의 이름만을 선언하면 됩니다. · 숫자 자료형, 문자 자료형, 불린형 숫자 자료형 1, 2, 0, -1, 1.5 등은 숫자의 형태이며, 이러한 값들을 저장하는 변수를 숫자형 변수라고 부릅니다. 숫자형 변수는 크게 정수.......

원문보기 내부링크

Naver Blog

[Python]파이썬 기본 문법 정리[함수, 클래스, 모듈, 패키지]

파이썬 기본 문법 정리[함수, 클래스, 모듈, 패키지] - 함수(function) · 함수를 사용하는 이유 · 매개변수와 인수 - 클래스(class) · 상속 · 클래스 더 알아보기 · 객체와 인스턴스 - 모듈(Module) · 모듈 만들기 - 패키지(package) · 패키지 구조 함수(function) 함수(function)란 하나의 특정한 목적의 작업을 수행하기 위해 독립적으로 구성된 프로그램 코드의 집합을 말합니다. · 입력받은 값에 따라 새로운 값을 산출해 내는 것 · def라는 예약어를 사용하여 함수를 정의합니다. [define의 약자 def] 함수를 사용하는 이유 반복적으로 사용되는 부분을 수 작업으로 매번 작성하기 보다는 해당 부분을 한 뭉치로 묶어 함수화하여 사용하면 코.......

원문보기 내부링크

Naver Blog

[Rest Client 툴]포스트맨(POSTMAN) Mock Server 만들기

포스트맨(POSTMAN) Mock Server 만들기 - 포스트맨(POSTMAN)이란? - Mock Server란? - Mock Server 만들기 포스트맨(POSTMAN)이란? 포스트맨(POSTMAN)은 REST API 설계, 개발, 테스팅을 할 수 있는 GUI 툴로 개발 생산성을 높여주는 프로그램입니다. API 구축의 각 단계를 단순화하고 협업을 간소화하여 더 나은 API를 더 빠르게 만들 수 있도록 합니다. · API 개발을 위한 협업 플랫폼 · 포스트맨(POSTMAN) 관련 설명 : [Rest Client 툴]포스트맨(POSTM.. : 네이버블로그 (naver.com) Mock Server란? Mock 서버란 실제 서버처럼 클라이언트로부터 요청을 받으면 응답하는 가짜 서버를 말합니다. 서버와 클라이언트 간의 API가 정의된 상태이고, .......

원문보기 내부링크

Naver Blog

[JavaScript]HTML Media Capture and Streams API(MediaStream, MediaStreamTrack)

HTML Media Capture and Streams API - Media Streams API란? - MediaStream 사용 방법 · MediaStream 객체 · MediaStream 생성 · MediaDevices.getUserMedia(constraints) 사용 방법 · 실시간 영상 재생 예시 - MediaStreamTrack 사용 방법 · MediaStreamTrack 객체 · MediaStreaemTrack 생성 · MediaStreamTrack을 얻어 새로운 스트림 생성 예시 Media Streams API란? Media Streams API, 짧게는 MediaStream API라고 불리는 Media Capture and Streams API는 오디오와 비디오 데이터 스트리밍을 지원하는 WebRTC 관련 API 입니다. 쉽게 말해, 마이크, 카메라 등을 이용해 들어오는 (Media Stream: 오디오, 비디오, 화면 등) 데이터를 다룹니다.......

원문보기 내부링크

Naver Blog

[JavaScript]HTML MediaStream Recording API(MediaRecorder, 녹음/녹화)

HTML MediaStream Recording API - MediaStream Recording API란? - MediaRecorder 사용 방법 · MediaRecorder 생성 · MediaRecorder 메소드 · MediaRecorder 이벤트 핸들러 - 녹음 프로세스 개요 - 저장된 미디어 데이터 후처리 · 미디어 요소에 재생 · 파일 다운로드 · 서버 업로드 선행해야할 내용 Media Capture and Streams API : [JavaScript]HTML Media Ca.. : 네이버블로그 (naver.com) MediaStream Recording API란? MediaStream Recording API는 Media Capture and Stream API, WebRTC API을 유용하게 사용할 수 있도록 제공된 API입니다. MediaStream, HTMLMediaElement, HTMLCanvasElement 객체 등에서 전달되는 데이터를 분석, 처.......

원문보기 내부링크

Naver Blog

[IntelliJ]IntelliJ IDEA 학생 인증 무료 설치하기

IntelliJ IDEA 학생 인증 무료 설치하기 - 개요 - 학생 계정 인증하기 - IntelliJ IDEA 다운로드 및 라이선스 등록 개요 IntelliJ IDEA는 젯브레인스(JetBrains) 사에서 제작한 Java 개발을 위한 툴로 유료 버전(Ultimate)과 무료 버전(Community) 에디션이 제공됩니다. 유료 버전을 이용하는 경우 다양한 기능 및 프로젝트를 쉽게 만들 수 있지만, 기업용 월 $49.90, 개인용 $14.90가 청구됩니다. 이러한 IntelliJ IDEA를 학생 인증을 통하여 무료로 사용할 수 있고, 학생 계정 인증시 졸업년월을 기준으로 라이선스 유효기간이 적용되는데, 학생 계정 라이선스 갱신은 만료 일주일 전 젯브레인 가입 계정으로 연장 메일이 발송되어, 해당 메일.......

원문보기 내부링크

Naver Blog

[Java]Java Builder Pattern(빌더 패턴, 점층적 생성자 패턴, 자바빈즈 패턴)

자바 빌더 패턴(Java Builder Pattern) - 인스턴스화(Instantiate) - 점층적 생성자 패턴(Telescoping Constructor Pattern) - 자바빈즈 패턴(JavaBeens Pattern) - 빌더 패턴(Builder Pattern) - 자바빈즈와 빌더 패턴 응용(mutable) - 자바빈즈와 빌더 패턴 응용(immutable) - Lombok @Builder 어노테이션 이용 - Builder 패턴을 마치며 인스턴스화(Instantiate) 클래스를 인스턴스화(객체 생성)할 때 생성자를 통해서 할 수 있습니다. 단순히 생성자만을 사용하여 값을 설정하는 경우, 생성자에 많은 인자를 받게되고, 때문에 어떠한 인자 값이 어떤 값을 나타내는지 확인하기 어렵고, 가독성이 매우 떨어집니다. 점층적 생성자 패턴(Telescop.......

원문보기 내부링크

Naver Blog

[IntelliJ]finished with non-zero exit value 1 에러

에러 내용 Execution failed for task ':MvcApplication.main()'. > Process 'command 'C:/Program Files/Java/jdk-11.0.12/bin/java.exe'' finished with non-zero exit value 1 * Try: > Run with --stacktrace option to get the stack trace. > Run with --info or --debug option to get more log output. > Run with --scan to get full insights. 발생 배경 IntelliJ Gradle 환경에서 프로젝트 첫 실행시 발생 해결 방안 Gradle을 통하지 않고, IntelliJ에서 바로 실행하도록 변경 1. File > Settings 메뉴 클릭 (Ctrl + Alt + S) 2. Build, Execution, Deployment > Build Tools > G.......

원문보기 내부링크

Naver Blog

[Spring]Spring Util Assert 클래스

Spring Util Assert 클래스 - Assert 클래스 - 주요 메소드 - Assert 사용 목적 Assert 클래스 스프링 프레임워크를 사용하면 org.springframework.util 패키지 안에 다양한 편의성을 제공해주는 Util 클래스들이 존재하는데, Assert 클래스는 인수의 유효성을 검사하는데 도움을 주는 클래스로 인수를 검증하고 조건에 맞지않는 경우 IllegalArgumentException 또는IllegalStateException를 발생시킵니다. 공식 API 문서 : https://docs.spring.io/spring-framework/docs/current/javadoc-api/org/springframework/util/Assert.html · 인수 검증에 유용한 Util 클래스 · org.springframework.util 패키지 · Null 체크, 빈값 체크, 문자열인지 체.......

원문보기 내부링크

Naver Blog

[Java]URL & URLConnection & HttpURLConnection

URL & URLConnection & HttpURLConnection - URL(Uniform Resource Locator) - URL 관련 용어 예시 - URL Class - URLConnection Class - HttpURLConneciton class URL(Uniform Resource Locator) URI의 하위 개념이며 컴퓨터 네트워크 상의 자원을 모두 나타낼 수 있습니다. URL은 Uniform Resource Locator의 약자로 URL은 네트워크 상에서 자원이 어디 있는지를 알려주기 위한 규약으로 흔히 웹 주소 또는 인터넷 주소라고도 불리며 URI (uniform resource identifier)의 한 유형으로 리소스의 위치와 액세스에 사용되는 프로토콜을 나타냅니다. URL 관련 용어 예시 URL Class URL 클래스는 URL을 추상화하여 만든 클래스입니다. URL .......

원문보기 내부링크

Naver Blog

[Vue]Vue 기초 문법 배우기 4. 이벤트 핸들링(v-on)

Vue 기초 문법 배우기 4. 이벤트 핸들링(v-on) - 이벤트 처리(v-on) - 시스템 수식어 - 메소드 작성(Vue 인스턴스, methods) - 클릭 이벤트 예시(v-on:click) - 키 이벤트 예시(v-on:keyup) - 값 변경 이벤트(v-on:change) 이벤트 처리(v-on) Vue 컴포넌트에서 이벤트를 처리할 때는 "v-on" 디렉티브를 사용합니다. v-on 디렉티브는 유저가 버튼을 클릭하거나 키보드를 통해 키입력을 하는 등의 "이벤트"가 발생할 때 Vue 메소드를 실행시키는 이벤트 핸들러입니다. ※ v-on 디렉티브는 자주 쓰이는 기능으로 심볼 @로도 사용가능합니다. ※ 메소드는 Vue 인스턴스에 methods 옵션을 추가하여 만듭니다. 시스템 수식어 Vue 2.......

원문보기 내부링크

Naver Blog

[Vue]Vue 기초 문법 배우기 5. 조건과 반복(v-if, v-show, v-for)

Vue 기초 문법 배우기 5. 조건과 반복(v-if, v-for) - v-if 디렉티브 - v-show 디렉티브 - v-for 디렉티브 · 단순 배열 값 표시 예제 · 오브젝트 배열 값 표시 예제 · 지정한 횟수만큼 반복 예제 - 배열 데이터 추가와 삭제 - 조건과 반복 조합 v-if 디렉티브 조건에 따라 HTML을 표시하고 싶거나 지우고 싶을 때 "v-if" 디렉티브를 사용합니다. ※ 표시/비표시를 바꾸기만 할지, 표시 내용을 변경할지에 따라 사용 방법이 다릅니다. ※ v-if 디렉티브, v-else-if 디렉티브, v-else 디렉티브 단순 표시/비표시 예제 조건에 따라 표시 태그 변경 예제 v-show 디렉티브 "v-show" 디렉티브는 HTML 요소를 미리 만들어놓고, 이미.......

원문보기 내부링크

Naver Blog

[Vue]Vue 기초 문법 배우기 6. 데이터 변화 감지(computed, watch)

Vue 기초 문법 배우기 6. 데이터 변화 감지(computed, watch) - computed, watch 속성 개요 - computed 속성 - watch 속성 - computed와 watch - 사용 예제 computed, watch 속성 개요 Vue에서 계산한 데이터의 값을 표시하고 싶거나 문자를 추가하여 표시하고 싶은 경우 머스태시 안에 JavaScript를 직접 사용할 수 있습니다. 하지만 이렇게 처리하는 것은 코드의 전체 관계를 정확히 머릿속에 두고 있지 않은 사람이라면 해당 값이 무엇인지 직관적으로 알기 어렵습니다. 때문에 HTML만 보고 무엇을 표시하려고 하는 지 알 수 있어야 좋습니다. HTML을 보고 "무엇을 표시하려는가?"를 알고 JavaScript를 보고 "구체적으로 어떤.......

원문보기 내부링크

Naver Blog

[Vue]Vue Markdown 에디터 만들기

Vue Markdown 에디터 만들기 - 마크다운(Markdown)이란? - 마크다운(Markdown)의 장단점 - Vue Markdown 에디터 만들기 마크다운(Markdown)이란? Markdown은 텍스트 기반의 마크업언어로 2004년 존그루버에 의해 만들어졌으며 쉽게 쓰고 읽을 수 있으며 HTML으로 변환이 가능합니다. 특수 기호와 문자를 이용한 매우 간단한 구조의 문법을 사용하여 웹에서도 보다 빠르게 컨텐츠를 작성하고 보다 직관적으로 인식할 수 있습니다. - 문장/문서를 가볍게 작성할 수 있는 "문장 작성법" 중 하나 - 간단한 기호를 사용하여 표제나 강조 등을 표시하고 HTML 변경이 가능 마크다운(Markdown)의 장단점 장점 1. 간결하다. 2. 별도의 도구없이.......

원문보기 내부링크

Naver Blog

[Vue]Vue 기초 문법 배우기 7. 애니메이션 효과(transition 컴포넌트)

Vue 기초 문법 배우기 7. 애니메이션 효과(transition 컴포넌트) - Vue transition 개요 - transition 컴포넌트 - CSS 클래스 - JavaScript 훅 - transition 예제 · 토글 버튼 · 글자 서서히 변하기 - transition-group 예제 · 리스트 트랜잭션 Vue transition 개요 트랜지션의 일반적인 정의는 DOM의 삽입, 삭제, 갱신 등에 관련된 효과라고 볼 수 있습니다. Vue.js 에서는 DOM에 삽입, 갱신 또는 제거 될 때 CSS transition 효과를 빠르고 간단하게 구현할 수 있도록 transition 컴포넌트를 제공합니다. · CSS 트랜지션 및 애니메이션을 위한 클래스를 자동으로 적용 transition 컴포넌트 transition 컴포넌트의 애니메이션 효과는 추가, 삭제.......

원문보기 내부링크

Naver Blog

[Vue]Vue 기초 문법 배우기 8. 컴포넌트 등록 및 사용법(전역 컴포넌트, 지역 컴포넌트, props)

Vue 기초 문법 배우기 8. 컴포넌트 등록 및 사용법 - 컴포넌트란 무엇인가? - 컴포넌트를 등록하는 방법[전역(Global), 지역(Local)] - 컴포넌트 옵션 요소 - 컴포넌트 데이터 전달(부모 props, 자식 event) - props란? - props를 이용하여 자식 컴포넌트에게 데이터 전달하기 - 컴포넌트 props 사용 예시 컴포넌트란 무엇인가? 컴포넌트(Componenet)란 좋바하여 화면을 구성할 수 있는 블록을 의미합니다. 컴포넌트를 활용하면 화면을 빠르게 구조화하여 일괄적인 패턴으로 개발할 수 있으며, 코드를 쉽게 이해하고 재사용할 수 있습니다. 컴포넌트는 Vue의 가장 강력한 기능 중 하나입니다. 기본 HTML 엘리먼트를 확장하여 재사용 가능한 코드.......

원문보기 내부링크

Naver Blog

[Vue]Vue 기초 문법 배우기 9. 컴포넌트 데이터 전달($emit, $on, slot)

Vue 기초 문법 배우기 9. 컴포넌트 데이터 전달 및 커스텀 이벤트 - 커스텀 이벤트 : $emit과 $on - 부모 컴포넌트에서 자식 컴포넌트로 데이터 전달 : props - 부모 컴포넌트에서 자식 컴포넌트의 이벤트 실행 : $refs, $emit, $on - 자식 컴포넌트에서 부모 컴포넌트로 이벤트 전달 : $emit - 자식 컴포넌트에서 부모 컴포넌트로 데이터 전달 : $emit - 비 부모-자식간 통신 : $emit, $on - 슬롯(slot)이란? - 양방향 데이터 바인딩 · .sync 수식어 · v-model 커스텀 이벤트 : $emit과 $on $on(eventName)을 이용하여 이벤트를 감지할 수 있고, $emit(eventName)을 이용하여 이벤트를 트리거할 수 있습니다. 이벤트 트리거 : $emit('event.......

원문보기 내부링크

Naver Blog

[2021 마이 블로그 리포트] 블로그 빅데이터로 알아보는 '2021 내 블로그 스타일'

기억보다 기록을

원문보기 내부링크

Naver Blog

[JavaScript]HTML Geolocation API(GPS)

HTML Geolocation API(GPS) - Geolocation API란? - Geolocation API 인터페이스 - Geolocation API 사용법 - 예제) 현재 위치 정보 얻기 - 예제) 연속적인 위치 정보 얻기 예제) 구글 지도 API에 현재 위치 마커 출력하기 Geolocation API란? Geolocation API는 사용자의 현재 위치 정보를 가져올 때 사용하는 자바스크립트 API입니다. 개인 정보 보호를 위해, 브라우저는 위치 정보를 제공하기 전에 사용자에게 위치 정보 권한에 대해 확인을 받습니다. 이것을 이용하면 사용자의 위치를 지도에 표시하거나, 사용자 근처의 상점을 찾아주는 등의 위치기반 서비스를 할 수 있습니다. - HTML 5에 추가된 API - 사용자의 위치 정보 - window.navig.......

원문보기 내부링크

Naver Blog

[Linux]리눅스 네트워크 설정 및 점검(ifconfig, ping, arp, traceroute, route, netstat, nslookup 명령어)

리눅스 네트워크 설정 및 점검 - 네트워크 OSI 7계층과 TCP/IP 4계층 - 네트워크 인터페이스 카드 - ifconfig 명령어 - 네트워크 설정 파일 - ping 명령어 - arp 명령어 - traceroute 명령어 - route 명령어 - netstat 명령어 - nslookup 명령어 네트워크 OSI 7계층과 TCP/IP 4계층 OSI 7계층이란? OSI 모형은 국제 표준화 기구(ISO)에서 개발한 모델로, 컴퓨터 네트워크 프로토콜 자인과 통신을 계층으로 나누어 설명한 것으로, 일반적으로 OSI 7 계층이라고 합니다. 네트워크의 연결은 각기 다른 역할을 담당하는 기능 및 장비들에 의해 어떠한 절차와 복잡한 규약을 바탕으로 한 논리 구조위에서 이루어지는데, 이 기능과 절차를 1983년도에 표.......

원문보기 내부링크

Naver Blog

[Vue]Vue 기초 문법 배우기 1. 데이터 표시(CDN 설치, Vue 인스턴스, Vue 데이터 표시)

Vue 기초 문법 배우기 - Vue 설치(사용환경 만들기) - Vue 시작하기(Vue 인스턴스) - Hello Vue.js 출력하기 - Vue.js 데이터 표시(문자열, HTML, 배열, 오브젝트) Vue 설치(사용환경 만들기) Vue.js를 설치하는 방법에는 "CDN을 사용하는 방법", "다운로드하는 방법", "Vue-CLI로 시작하는 방법" 등 여러 가지가 존재합니다. Vue에 대한 기초 문법을 공부하기 위해서는 입문자가 가볍게 시작할 수 있는 "CDN을 이용하는 방법"을 사용하는게 가장 편리합니다. 공식 사이트 : https://kr.vuejs.org/v2/guide/installation.html Vue 시작하기(Vue 인스턴스) Vue.js로 화면을 만드는 것은 먼저 Vue 인스턴.......

원문보기 내부링크

Naver Blog

[Oracle/Tibero]시노님(Synonym) 개념 및 사용법

데이터베이스 시노님(Synonym) 개념 및 사용법 - 시노님(Synonym)이란? - 시노님(Synonym)을 사용하는 이유 - 시노님(Synonym)의 종류 - 시노님(Synonym) 사용법 · 시노님 권한 부여 · 시노님 생성 · 시노님 삭제 · 시노님 조회 - 시노님(Synonym). 사용 예제 시노님(Synonym)이란? 데이터베이스 객체는 각자 고유한 이름을 갖고 있습니다. 이 객체들에 대한 동의어를 만드는 것이 바로 시노님입니다. 쉽게 말해, 객체에게 별칭을 주어 해당 별칭으로 객체를 사용할 수 있습니다. - 보통 다른 유저의 객체(테이블, 뷰, 프로시저, 함수, 패키지, 시퀀스 등)를 참조할 때 많이 사용합니다. - 테이블, 뷰, 프로시저, 함수, 시퀀스 등에 별칭을 부여.......

원문보기 내부링크

Naver Blog

[Vue]Vue 기초 문법 배우기 2. 속성 바인딩(v-bind)

Vue 기초 문법 배우기 2. 속성 바인딩(v-bind) - v-bind 디렉티브(속성 표기) - 이미지 지정하기 : src 속성 - 링크 지정하기 : href 속성 - 스타일 지정하기 : style 속성 - 클래스 지정하기 : class 속성 v-bind 디렉티브 태그의 속성을 데이터로 지정할 때는 "v-bind" 디렉티브를 사용합니다. ※ v-bind 디렉티브는 자주 쓰이는 기능으로 생략이 가능합니다. 이미지 지정하기 : src 속성 링크 지정하기 : href 속성 v-bind 디렉티브를 이용한 화면에 소스를 보면 결과적으로 속성(attribute)에 데이터 바인딩되어 결과가 처리된 것을 확인할 수 있습니다. 스타일 지정하기 : style 속성 스타일에서 사용하는 속성은 "카멜 표기.......

원문보기 내부링크

Naver Blog

[Vue]Vue 기초 문법 배우기 3. 입력 폼 데이터 바인딩(v-model)

Vue 기초 문법 배우기 3. 입력 폼 데이터 바인딩(v-model) - Form 입력 데이터 바인딩 - Input type=text(텍스트) - Textarea(여러줄 텍스트) - Input type=checkbox(체크박스) - Input type=radio(라디오 버튼) - Select(선택) - 수식어 사용 Form 입력 데이터 바인딩 웹 페이지에서 사용자로부터 데이터를 입력받을 수 있는 필드를 Form Element라고 합니다. 입력 폼 데이터 바인딩을 사용하기 위해서는 "v-model" 디렉티브를 사용합니다. "v-model" 디렉티브는 Vue 인스턴스의 데이터가 웹 페이지에 표시되고 웹 페이지에서 입력한 값이 Vue 인스턴스의 데이터에 반영되므로 양방향으로 데이터 바인딩 설.......

원문보기 내부링크

Naver Blog

[Linux]리눅스 쉘 스크립트(Shell Script) 총정리

리눅스 쉘 스크립트(Shell Script) - 쉘 스크립트란(Shell Script)? - 쉘 스크립트 실행 방법 - 쉘 스크립트 문법 · 기본 출력 및 사전 정의된 지역 변수 · 주석(Comments) · 변수(Variable) · 예약변수(Reserved Variable) · 연산자(Operator) · 조건문(if..elif..else..fi) · 선택문(case) · 반복문(for, while, until) · 함수(function) 쉘 스크립트란(Shell Sqcript)? 쉘은 명령어 해석기이자 스크립트 언어입니다. 쉘 스크립트는 쉘에 의해 수행되도록 작성된 프로그램으로 제어 구조에 따라 쉘 명령어나 함수를 실행할 수 있습니다. - 평문의 텍스트 파일로 하나의 명령어처럼 실행될 수 있는 실행 가능한 프로그램 - 쉘이 파일의 내용을 읽.......

원문보기 내부링크

Naver Blog

[HTML]HTML 미디어 관련 태그(embed, audio, vedio, 미디어 파일 제어(JS))

HTML 미디어 관련 태그 - <embed> 태그 - <audio> 태그 - <video> 태그 - 미디어 파일 제어(JavaScript) <embed> 태그 HTML <embed> 요소는 외부 어플리케이션이나 상호 작용 콘테츠를 포함시킬 수 있는 컨테이너(container)를 정의할 때 사용하는 태그입니다. 오래전부터 많은 웹 브라우저가 <embed> 요소를 지원했지만, HTML4까지는 정식으로 명세에 포함되지 않았지만, HTML5에서 표준 요소로 추가되어 사용됩니다. 사용할 수 있는 속성 사용 예시 <audio> 태그 HTML <audio> 요소는 문서에 음악이나 오디오 스트림과 같은 사운드를 정의할 때 사용하는 태그입니다. <audio> 요소 내에.......

원문보기 내부링크

Naver Blog

[JavaScript]드래그 앤 드롭(Drag & Drop) API

드래그 앤 드롭(Drag & Drop) API - 드래그 앤 드롭(Drag & Drop)이란? - Drag & Drop API 용어 - 드래그 속성 - 드래그 이벤트 - dataTransfer 객체 - 예제) 이미지 드래그로 옮기기 드래그 앤 드롭(Drag & Drop)이란? 드래그 앤 드롭이란 마우스를 이용하여 특정 콘텐츠를 끌어다 놓는 것을 말합니다. 파일 탐색기에서 파일을 복사하거나 이동할 때, 또는 웹 메일에서 파일을 첨부할 때 마우스로 파일을 선택한 후 끌어다가 놓는 것으로 업로드 하는 드래그 앤 드롭 방식이 사용됩니다. - HTML 5에서 드래그 앤 드롭을 위한 전용 API 제공 Drag & Drop API 용어 드래그 대상(Source) 드래그 대상은 말 그대로 드래그하기 위.......

원문보기 내부링크

Naver Blog

[JavaScript]웹 스토리지(Web Storage) API

웹 스토리지(Web Storage) API - 웹 스토리지(Web Storage)란? - 웹 스토리지와 쿠키 비교 - 웹 스토리지 종류(Session, Local) - 웹 스토리지 API - 예시)팝업창 오늘하루 보지않기 웹 스토리지(Web Storage)란? 웹 스토리지(Web Storage)는 서버가 아닌, 클라이언트에 데이터를 저장할 수 있도록 지원하는 HTML 5의 새로운 기능입니다. 웹 스토리지 API는 기존 쿠키(Cookie)의 사용에 대한 불편함과 제약으로 인한 문제점을 극복하기 위해 기능이 생겨났습니다. - 클라이언트에 데이터를 저장하기 위한 영역 - HTML 5에 웹 스토리지 API 제공 - 쿠키의 단점을 보완하기 위해 사용 - 키/값(key/value)의 쌍으로 저장 웹 스토리지와 쿠키 비교 웹.......

원문보기 내부링크

Naver Blog

[JavaScript]파일 접근 API(FileList 객체, File 객체, FileReader 객체)

FileReader 객체(파일 접근 API) - 파일 접근 API - FileList 객체 - File 객체 - FileReader 객체 예제) 이미지파일 선택시 이미지 출력하기 예제) Drag&Drop 파일 읽기 파일 접근 API HTML5 에서는 웹 애플리케이션이 자바스크립트로 로컬 컴퓨터에 있는 파일데이터에 직접 접근할 수 있도록 파일 API를 지원하는데, 보안상의 문제 없이 안전하게 접근하기 위해서 모든 파일에 접근을 허용하는 것이 아니며, 또한 해당 파일의 수정이나 삭제는 제공하지 않고 읽기 전용의 접근만 허용합니다. - 읽기 전용 API(수정/삭제 불가) - 읽기 가능한 파일 : 사용자가 드래그 앤 드롭한 파일, <input type="file">에서 선택한.......

원문보기 내부링크

Naver Blog

[Linux]리눅스 vi 편집기 사용법 총정리(명령모드, 입력모드, 라인모드)

리눅스 - 리눅스 텍스트 편집기 종류 - vi 편집기 사용법 - vi 편집기의 세가지 모드 - 라인 모드 - 입력 모드 - 명령 모드 - 커서 및 화면 이동 - 텍스트 삭제 명령 - 텍스트 변경(혹은 치환) 명령 - 텍스트 복사/붙여넣기 - 블록 지정하기 - 명령의 취소와 기타 명령 - 검색 명령 - 검색과 대치(치환) 리눅스 텍스트 편집기 종류 gedit GNOME 데스크톱에서 제공하는 작고 가벼운 편집기로 X윈도 기반이기 때문에 X윈도를 사용하지 않는 서버 기본 텍스트모드에서는 사용할 수 없습니다. - 그래픽 모드에 부팅된 X윈도에 기본 GUI 에디터 emacs Editor Macros의 약자로 리처드 스톨만이 매크로 기능이 있는 텍스트 교정 및 편집기로 개발하였습.......

원문보기 내부링크

Naver Blog

[Linux]리눅스 파일 찾기와 문자열 검색(locate, find, grep 명령어)

리눅스 파일 찾기와 문자열 검색 locate 명령어(파일 찾기) find 명령어(파일 찾기) grep 명령어(문자열 찾기) locate 명령어 문자열 패턴이 파일 이름에 포함될 떄, 해당 파일의 이름을 출력하는 명령어입니다. - 절대 경로 상의 디렉터리나 파일 이름에 문자열이 포함되면 출력 - 접근할 수 없는 파일은 출력이 안됨 - 리눅스 어딘가에 저장되어 있는 파일 목록 DB를 참조해 검색을 진행하여 속도가 매우 빠름 - updatedb 명령어를 실행해서 DB를 업데이트 해야함 - 기본적으로 상위 경로에 해당 파일명이 포함되면 모두 검색되어 -b 옵션을 통해 최상위 파일명이나 최상위 디렉토리명으로 검색 사용 방법 주요 옵션 find 명령어 find 명령어는.......

원문보기 내부링크

Naver Blog

[Linux]리눅스 파일 시스템 관리(마운트, 파티션 관리, 볼륨 관리)

리눅스 파일 시스템 관리(마운트, 파티션 관리, 볼륨 관리) - 마운트(mount)란? - /etc/fstab 파일 - mount 명령어(마운트) - umount 명령어(마운트 해제) - 파티션(Partition)이란? - 파티션의 종류 - 파티션 관리도구 - parted 사용법 - 볼륨(Volumn)이란? - LVM 유틸리티 마운트(mount)란? 디스크에 프로그램과 데이터를 저장하기 위해서는 먼저 파팃견을 만들고 파티션에 파일 시스템을 만들어 주어야 합니다. 또 저장 장치를 사용하기 위해서는 전체 디렉터리 트리의 어딘가에 붙여야하는데, 이것을 마운트라고 합니다. 즉, 리눅스는 보조기억장치(HDD, FDD, CD-ROM 등)나 기타 외의 물리적인 장치를 사용하기 위해서는 파일 시스템으로 인.......

원문보기 내부링크

Naver Blog

[JavaScript]Promise 사용법 총정리

JavaScript Promise 총정리 - 프로미스(Promise)란 무엇인가? - 동기와 비동기의 차이점 - 프로미스(Promise)를 사용하는 이유 - 기존 비동기 함수 후속 처리 예시(콜백 이용) - 프로미스(Promise) 사용법 · 프로미스(Promise) 기본 골격 · 프로미스(Promise)의 3가지 상태(Status) · 프로미스(Promise) 동작 설명 · 여러 개의 프로미스를 순차적으로 실행하는 방법 · 여러 개의 프로미스가 모두 완료되었을 때 실행하는 방법 프로미스(Promise)란 무엇인가? 프로미스(Promise)는 자바스크립트 비동기 처리에 사용되는 객체입니다. 여기서 비동기 처리란 특정 코드의 연산이 끝날 때 까지 코드의 실행을 멈추지 않고, 순차적으로 다음 코드를 먼.......

원문보기 내부링크

Naver Blog

[Linux]사용자 관련 파일 및 관련 명령어 총정리(su, sudo, useradd, passwd, chage, usermod, groupadd, gpasswd, .. 등)

Linux 사용자 관련 명령어 총정리 - 사용자 관리 - 사용자 계정 생성 절차 - 사용자 관련 파일 - 그룹 계정 - 그룹 계정 관련 파일 - su 명령어(사용자 전환) - sudo 명령어(다른 유저의 권한 사용) - useradd 명령어(사용자 생성) - passwd 명령어(비밀번호 지정) - chage 명령어(비밀번호 만기 정보 설정) - usermod 명령어(사용자 정보 수정) - userdel 명령어(사용자 삭제) - groupadd 명령어(그룹 생성) - gpasswd 명령어(그룹 관리) - groupmod(그룹 정보 수정) - groupdel(그룹 삭제) - groupmems(그룹 구성원 관리) - groups(사용자 그룹 확인) 사용자 관리 관리자 입장에서 사용자 계정 별로 접근 권한을 통제할 수 있습니다. - 리눅스.......

원문보기 내부링크

Naver Blog

[CSS]CSS 변형(transform) 속성 총정리

CSS 변형(transform) 속성 총정리 - CSS 변형(transform)이란? - 변형(transform) 관련 속성 - 2D 변형(transform) 함수 - 3D 변형(trnasform) 함수 - translateX 예시 CSS 변형(transform)이란? CSS3의 transform 속성으로 요소를 회전하거나 확대/축소 및 모양, 크기, 위치 등을 자유롭게 바꿀 수 있습니다. CSS3에서는 transform 속성을 사용하여 2D 변형(transform)과 3D 변형(transform)을 모두 제공합니다. - 제공 속성 : translate(이동), rotate(회전), scale(크기 변경), skew(기울임) 변형(transform) 관련 속성 2D 변형(transform) 함수 3D 변형(transform) 함수 translateX 예시 마우스 호버시 왼쪽에서 오른쪽으로 이동하는 예시 출.......

원문보기 내부링크

Naver Blog

[CSS]CSS 전환(transition) 속성 총정리

CSS 전환(transition) 속성 총정리 - CSS 전환(transition)이란? - 전환(transition) 관련 속성 - 전환(transition) 효과 지정 방법 예시 - 전환(transition) 사용 예시 CSS 전환(transition)이란? CSS3의 transition 속성으로 어떤 이벤트에 대해서 지정한 시간 내에 속성의 특정 상태가 다른 상태로 부드럽게 변화하는 효과를 줄 수 있습니다. - 스타일의 점진적인 변화 → 애니메이션과 같은 효과 부여 - 변형(transform) 속성과 함께 사용하여 이동 효과를 적용할 수 있음 전환(transition) 관련 속성 전환(transition) 효과 지정 방법 예시 전환(transition) 사용 예시 transition-property값을 width주고 마우스를 갖다대는 경우 height, w.......

원문보기 내부링크

Naver Blog

[Spring]Spring JSON 데이터 받는 방법 총정리(JSON, JSONArray)

Spring json 데이터 받기 - JSON이란? - JSON 특징 - JSON 문법 - JSON 데이터 만들기 - Maven Dependency - Spring JSON 데이터 받기 참고해야 할 내용 - Jackson 라이브러리 : https://blog.naver.com/hj_kim97/222391370482 JSON이란? JSON은 JavaScript Object Notation의 약자로 쉽게 데이터를 교환하고 저장하기 위하여 만들어진 텍스트 기반의 데이터 교환 표준입니다. 이러한 JSON은 XML의 대안으로서 좀 더 쉽게 데이터를 교환하고 저장하기 위하여 고안되었습니다. - 데이터 포맷, 단순히 데이터를 표시하는 표현 방법 - 경량의 DATA 교환 형식 JSON 특징 서버와 클라이언트 간의 교류에서 일반적으로 많이 사용됩니다. 자바스크립트 객.......

원문보기 내부링크

Naver Blog

[JSP]쿠키(Cookie) 생성, 변경, 삭제

JSP 쿠키(Cookie) 생성, 변경, 삭제 - 쿠키(Cookie)란 무엇인가? - 쿠키(Cookie)의 구성요소 - 쿠키(Cookie)의 사용방법 - 쿠키(Cookie)의 용도 - 쿠키(Cookie) 클래스의 메소드(JSP) - 쿠키(Cookie)의 생성과 전송(JSP) - 쿠키(Cookie)의 값 읽기(JSP) - 쿠키(Cookie)의 값의 변경 및 삭제(JSP) - 쿠키(Cookie)의 도메인(JSP) 쿠키(Cookie)란 무엇인가? 쿠키(Cookie)란 ㄹ하이퍼 텍스트의 기록서(HTTP)의 일종으로서 인터넷 사용자가 어떠한 웹사이트를 방문할 경우 그 사이트가 사용하고 있는 서버를 통해 인터넷 사용자의 컴퓨터에 설치되는 작은 기록 정보 파일을 일컫습니다. - 임의 조각의 데이터로, 웹 브라우저에 의해 클라이언트 컴퓨터.......

원문보기 내부링크

Naver Blog

[JSP]세션(Session) 사용하기

JSP 세션(Session) 사용하기 - 세션(Session)이란 무엇인가? - 세션(Session)의 특징 - 세션(Session)의 동작 순서 - 세션(Session) 내장 객체(JSP) - 세션(Session) 클래스의 메소드(JSP) - 세션(Session) 속성 사용하기(JSP) - 세션(Session) 삭제하기(JSP) - 세션(Session)의 유효 시간 설정하기(JSP) - getSession() 메소드 주의점 세션(Session)이란 무엇인가? 사용자가 웹 브라우저를 통해 웹서버에 접속한 시점으로부터 웹 브라우저를 종료하여 연결을 끝내는 시점까지, 같은 사용자로부터 오는 일련의 요청을 하나의 상태로 보고, 그 상태를 일정하게 유지하는 기술입니다. 쉽게 말해, 방문자가 웹 서버에 접속해있는 상태를 하나의 단위.......

원문보기 내부링크

Naver Blog

[Microsoft Azure]리소스 그룹 및 가상머신 만들기

Microsoft Azure 리소스 그룹 및 가상머신 만들기 - 리소스 그룹이란? - 리소스 그룹 생성하기 - 가상 머신이란? - Azure 가상 머신 시리즈 종류와 크기 - 가상 머신 생성하기 리소스 그룹이란? 리소스 그룹은 Azure 솔루션에 관련된 리소스를 보유하는 컨테이너입니다. 리소스 그룹에는 솔루션에 대한 모든 리소스 또는 그룹으로 관리하려는 해당 리소스만 포함될 수 있습니다. 사용자의 조직에 가장 적합한 내용에 따라 리소스 그룹에 리소스를 어떻게 할당할지 결정합니다. 일반적으로 쉽게 배포, 업데이트하고 그룹으로 삭제할 수 있도록 동일한 리소스 그룹에 대해 동일한 수명 주기를 공유하는 리소스를 추가합니다. - 영역을 구분하기 위.......

원문보기 내부링크

Naver Blog

[Microsoft Azure]SQL 데이터베이스 만들기

Azure SQL 데이터베이스 만들기 - SQL 데이터베이스 만들기 - SQL 데이터베이스 서버 접근하기 SQL 데이터베이스 만들기 1. Azure Portal에서 SQL 데이터베이스를 검색하고 클릭합니다. 2. 만들기 버튼을 클릭합니다. 3. SQL 데이터베이스 기본 탭을 설정합니다. 구독 : 청구 계정 리소스 그룹 : 리소스 그룹 데이터베이스 이름 : 계정 내에서만 중복되지 않으면 됩니다. 서버 : 데이터베이스를 사용하기 위한 서버(VM), 데이터베이스 서버용 서버 3-1. SQL 데이터베이스 서버 만들기 서버 이름 : 전세계에서 유니크한 이름을 사용 위치 : 서버 리전 위치 계정 암호 : 영문자 + 숫자 + 특수문자 형태로 입력합니다. 3-2. 데이터베이스 구성 변경.......

원문보기 내부링크

Naver Blog

[Bootstrap]부트스트랩(Bootstrap) 개념 및 사용법

부트스트랩(Bootstrap) 개념 및 사용법 - 부트스트랩(Bootstrap) 개요 - 부트스트랩(Bootstrap)이란? - 부트스트랩(Bootstrap) 적용 - 부트스트랩(Bootstrap) 사용하기 부트스트랩(Bootstrap) 개요 부트스트랩의 원래 이름은 Twitter Blueprint로 Mark Otto와 Jacob Thornton이 만들었습니다. 기존에 여러 인터페이스에 대응하기 위한 다양한 라이브러리들이 존재했지만 정형화되지 않아 유지, 보수에 어려움이 있었습니다. 트위터의 개발자였던 Mark Otto는 이를 통합하기 위해 부트스트랩을 만들었고 트위터의 다른 개발자들이 개발에 기여하기 시작했습니다. 부트스트랩이라는 이름은 2011년 8월 19일 오픈 소스가 발표되면서 지어졌습니다 - .......

원문보기 내부링크

Naver Blog

[JSP]자바빈(JavaBean) 사용하기

JSP 자바빈(JavaBean) 사용하기 - 자바빈(JavaBean)이란? - 자바빈(JavaBean) 설계 규약 - 자바빈(JavaBean) 관련 액션 태그(JSP) - 자바빈(JavaBean) 관련 액션 태그 처리 과정(JSP) - 자바빈(JavaBean) 사용 예제 자바빈(JavaBean).이란? JavaBean API Specification(자바빈 API 스펙)에 따라 작성된 사용자 정의 자바 클래스입니다. JSP 페이지의 디자인과 로직을 분리시키기 위해서 나온 자바 클래스의 설계 규약, 즉 표준입니다. - 자바빈 규약을 따르는 클래스 - JSP 페이지에서 사용할 데이터를 다루려는 목적 - DTO(Data Transfer Object)나 DAO(Data Access Object) 클래스의 객체 JSP 페이지에서 사용할 목적 - 스프링의 <bean>,.......

원문보기 내부링크

Naver Blog

[자료구조]트리(Tree)

자료구조 트리(Tree) - 트리(Tree)의 정의 - 트리(Tree) 관련 용어 - 이진 트리(Binary Tree) - 이진 트리(Binary Tree)의 종류 - 이진 트리(Binary Tree) 구현 방법 - 이진 트리(Binary Tree) 순회 - 이진 트리(Binary Tree) 구현 트리(Tree)의 정의 트리(Tree)란 계층적인 자료를 표현하는데 이용되는 자료구조입니다. 트리는 정점(Node, 노드)과 선분(Branch, 가지)을 이용하여 사이클을 이루지 않도록 구성한 Graph의 특수한 형태입니다. - 데이터 사이의 계층 관계를 노드로 나타낸 자료구조 트리(Tree) 관련 용어 노드(Node) : 트리의 기본 요소로서 자료 항목과 다른 항목에 대한 가지(Branch)를 합친 것 - 트리의 구성요소 하나하나 루트.......

원문보기 내부링크

Naver Blog

[Java]자바 JDBC 사용법(Statement, PreparedStatement)

자바(Java) JDBC 사용법 - 자바(Java) JDBC란? - 자바(Java) JDBC 사용 방법(Statement, PreparedStatement) - 이클립스에서 JDBC 사용하기 자바(Java) JDBC란? JDBC는 Java DataBase Connectivity의 약자로 Java 프로그램에서 관계형데이터베이스(RDBMS: Relational Database Management System)와 연동할 수 있도록 제공하는 표준 API입니다. RDBMS와 연동하려면 RDBMS 의 표준 질의어인 SQL을 프로그램 내에서 처리할 수 있어야 하는데 JDBC가 제공하는 API를 통해 간으하게 해줍니다. JDBC API는 RDBMS 제조사가 제공하는 JDBC 드라이버(Driver)를 통해 구현되기 때문에 특정 RDBMS와 연동하는 Java 프로그램을 작성하려면 해당 RDBMS 제조사.......

원문보기 내부링크

Naver Blog

[MyBatis]java.sql.SQLException: 부적합한 열 유형: 1111

에러 내용 java.sql.SQLException: 부적합한 열 유형: 1111 Caused by: org.apache.ibatis.type.TypeException: Error setting null for parameter #3 with JdbcType OTHER . Try setting a different JdbcType for this parameter or a different jdbcTypeForNull configuration property. Cause: java.sql.SQLException: 부적합한 열 유형: 1111 발생 원인 MyBatis에서 parameterType으로 넘겨 바인드 변수로 사용하는 값 중에 NULL 이 존재할 때 발생 에러 내용에 Error setting null for parameter #3 with JdbcType은 3번째 해당하는 바인드 변수가 NULL 이라는 것을 확인할 수 있음. - insert나 update에서 parameter 값으로 사용하는 바인.......

원문보기 내부링크

Naver Blog

[jQuery File Download]jQuery 파일 다운로드 플러그인 사용법

jQuery File Download 공식사이트 : Jquery.fileDownload.js | johnculviner.com 깃헙 주소 : https://github.com/johnculviner/jquery.fileDownload 요구 사항 : jQuery 1.6 이상 파일 다운로드시 파일 다운로드 이후 콜백 처리를 쉽게 할 수 있는 플러그인 예를 들어 대용량 데이터를 조회하여 엑셀 파일을 다운로드를 하는 경우 속도가 오래 걸리기 때문에 사용자에게 progressbar를 보여주고 다운로드가 완료되었을 때 종료를 알려주어야 하는데 이때 완료 콜백 처리를 쉽게 구현할 수 있습니다. 사용 방법 1. Front 단에서 파일 다운로드 처리 생성 2. Back 단에서 Header에 쿠키 정의 Front 단(HTML, JS, ..) Back 단(java, ..) 출처 최고.......

원문보기 내부링크

Naver Blog

[CSS]CSS 애니메이션(Animation) 속성 총정리

CSS 애니메이션(Animation) 속성 총정리 - CSS 애니메이션(Animation)이란? - 키 프레임(keyframes) - 키 프레임(keyframes) 문법 - 애니메이션 관련 속성 - 애니메이션 예시(공튀기기) - 애니메이션 예시(로딩바) CSS 애니메이션(Animation)이란? 애니메이션(Animation) 효과는 HTML 요소에 적용되는 CSS 스타일을 다른 CSS 스타일로 부드럽게 변화시키는 효과입니다. 애니메이션은 애니메이션을 나타내는 CSS 스타일과 애니메이션의 sequence를 나타내는 복수의 키프레임(@keyframes)들로 이루어집니다. - 각 프레임을 연결하여 동작을 완성 키 프레임(keyframes) 애니메이션 효과를 사용하기 위해서는 키프레임을 이용하여 애니메이션의 중간.......

원문보기 내부링크

Naver Blog

[Cloud Computing]클라우드 서비스 모델(IaaS, PaaS, SaaS)

클라우드 서비스 모델(IaaS, PaaS, SaaS) - 클라우드 서비스 모델 - 온프레미스 - IaaS(Infrastructure as a Service) - PaaS(Platform as a Service) - Saas(Software as a Service) 클라우드 서비스 모델 클라우드 컴퓨팅은 인터넷으로 가상화된 IT 리소스를 서비스로 제공하는 것을 의미합니다. 그리고 클라우드 컴퓨팅에서 가상화하여 서비스로 제공하는 대상은 서버, 플랫폼, 소프트웨어, .. 등이 있습니다. 클라우드 서비스 환경에 따라 4가지 모델로 나눌 수 있습니다. 쉽게 말해, 사용자가 얼마만큼 관리하고, 클라우드에서 제공받는가에 따라 [온프레미스, IaaS, PaaS, SaaS] 네 가지로 나눌 수 있습니다. 온프레미스 자세한 내용은 링.......

원문보기 내부링크

Naver Blog

[Cloud Computing]서버 가상화 기술 정리(호스트, 하이퍼바이저, 컨테이너)

서버 가상화 기술 정리 - 가상화(Virtualization)란? - 호스트 가상화 방식 - 하이퍼 바이저 가상화 방식 - 컨테이너 가상화 방식 가상화(Virtualization)란? 가상화는 하드웨어에 종속된 리소스를 사용해 유용한 IT 서비스를 만들 수 있는 기술입니다. 쉽게 말해, 컴퓨터 안에 독립적인 컴퓨터를 만드는 것입니다. 가상화를 사용하는 주요한 목적 중 하나는 물리적인 리소스를 여러 사용자 또는 환경에 배포해서 제한된 리소스를 최대한 활용하기 위함입니다. 예를 들어 다음과 같이 각각 용도가 다른 3개의 물리 서버가 있다고 가정합니다. 하나는 메일 서버, 하나는 웹 서버, 하나는 내부 레거시 애플리케이션 실행 서버 각 서버는 잠재적인 실.......

원문보기 내부링크

Naver Blog

[Cloud Computing]네트워크 가상화 기술

네트워크 가상화 기술 - 네트워크 가상화 기술 - 네트워크 가상화의 장점 - VLAN (Virtual LAN) 가상화 - VPN (Virtual Private Network) - NVF (Network Functions Virtualization) - SDN (Software Defined Network) 네트워크 가상화 기술 네트워크 가상화(Network Virtualization)는 하나의 물리적 네트워크가 마치 여러 개의 다른 기종 프로토콜이 운영되는 논리적 오버레이 네트워크로 운용되는 것을 말합니다. 클라우드 컴퓨팅과 미래 인터넷에서 핵심기술로 대두되고 있으며, 인터넷에서 요구하는 가상화 기술에는 호스트 가상화, 링크 가상화, 라우터 가상화, 스위치 가상화 등이 있습니다. 네트워크 가상화의 장점 네트워크 리소스 보.......

원문보기 내부링크

Naver Blog

[CSS]CSS 배경(background) 관련 속성

CSS 배경(background) 관련 속성

원문보기 내부링크

Naver Blog

[CSS]CSS 테두리(border) 및 아웃라인(outline) 관련 속성

테두리(border) 및 아웃라인(outline) 관련 속성

원문보기 내부링크

Naver Blog

[CSS]CSS 리스트(list) 및 테이블(table) 관련 속성

CSS 리스트 및 테이블 관련 속성 사용 예시 리스트의 마커를 이미지로 사용하기 리스트의 마커를 특정 글자로 사용하기

원문보기 내부링크

Naver Blog

[CSS]CSS 그라데이션(gradient) 속성

CSS 그라데이션(gradient) 속성 - 그라데이션(gradient)이란? - 색상 진행 방향 - 선형(linear) 그라데이션 - 방사형(radial) 그라데이션 그라데이션(gradient)이란? 그라데이션(gradient)이란 둘 이상의 색 사이의 색상 표현을 부드럽게 전환해주는 효과를 의미합니다. - 두 개 이상의 색상 사이에서 색상의 점진적인 변화 - 선형 그라데이션 : linear-gradient(..) - 선형 그라데이션 반복 : repeating-linear-gradient(..) - 방사형 그라데이션 : radial-gradient(..) - 방사형 그라데이션 반복 : repeating-radial-gradient(..) 색상 진행 방향 선형(linear) 그라데이션 색상의 변화가 한 직선 방향으로 변하는 효과 - linear-gradient() - r.......

원문보기 내부링크

Naver Blog

[자료구조]배열(Array)

자료구조 배열(Array) - 배열의 정의 - 배열의 추상 자료형 - 배열의 연산의 구현 - 1차원 배열 및 배열의 확장 - 희소행렬의 개념 배열의 정의 사전적 의미로 배열은 동일한 특성을 가지며 일정한 규칙에 따라 여러 요소가 나열되어 있는 데이터들의 집합입니다. 의미그대로 배열은 같은 형태를 지닌 데이터들이 동일한 크기의 순서를 갖고 나열되어 있는 집합입니다. 배열은 원소의 메인 메모리 공간에서의 물리적인 위치를 순서적으로 결정하는 특징이 있어 배열의 순서는 메모리 공간에서 저장되는 원소값의 물리적 순서입니다. 쉽게 말해, 물리적으로 보이는 배열의 인덱스 순서대로 실제 메모리에서도 같은 순서로 저장되어 있습니다. - 차.......

원문보기 내부링크

Naver Blog

개발자로서 도움이 되는 글 모음

키워드 : 개발지식, 기술스택, 스타트업, 취업, 면접, 조언, 동기부여, 자격증 #기술스택 #개발지식 복잡한 업무 코드 빠르게 분석하기 https://www.popit.kr/복잡한-업무-코드를-빠르게-분석하기/ 2019/12/09, 유영모 #기술스택 #스타트업 스타트업을 위한 기술 스택 http://www.codeok.net/스타트업을%20위한%20기술%20스택 2015/01/26, Youngrok Pak #취업 #면접 2년차 개발자가 이직을 하면서 배우고 느낀점 https://okky.kr/article/861866 2021/01/30, salsal #취업 #면접 비전공자, 상시 채용을 통해 네카라 신입으로 합격했습니다. https://okky.kr/article/800361 2020/10/21, 히알 #동기부여 #조언 흔하지 않고 좋은 웹 개발자가 되는.......

원문보기 내부링크

Naver Blog

2021 한강나이트워크 42K 후기

2021 한강나이트워크 42K 후기 - 한강나이트워크 신청 및 시작 - 한강나이트워크 기념품 - 한강나이트워크 대회 방식 - 한강나이트워크 42K 후기 한강나이트워크 신청 및 시작 공식 사이트 : 2021 한강나이트워크42K (nightwalk42k.co.kr) 2019년 한강나이트워크 25K를 했던 기억으로 작년에는 코로나로 인해 일정이 취소되었고, 이번 년도에 새로 시작하게 되어서 신청을 하게 되었습니다. 그간 운동을 하지 않았던 터라 25K를 신청할 지, 42K를 신청할 지 고민이 되었는데 걷기 마라톤이기도 하고 이왕 하는거 최선을 다해보자는 마음으로 42K를 신청하게 되었습니다. 신청 기간은 원래 6월 23일 부터 시작하여 9월 달에 시작하는 것으로 되어.......

원문보기 내부링크

Naver Blog

[자료구조]큐(Queue)

자료구조 큐(Queue) - 큐의 정의 - 큐의 예시 - 사용 용어 - 큐의 추상 자료형 - 큐의 구현 - 선형 큐와 원형 큐 큐의 정의 큐(Queue)는 컴퓨터의 기본적인 자료 구조의 한가지로, 먼저 집어 넣은 데이터가 먼저 나오는 FIFO(First In First Out)구조로 저장하는 형식을 말합니다. 영어 단어 queue는 표를 사러 일렬로 늘어선 사람들로 이루어진 줄을 말하기도 하며, 먼저 줄을 선 사람이 먼저 나갈 수 있는 상황을 생각하면 됩니다. - 나중에 집어 넣은 데이터가 먼저 나오는 스택과는 반대되는 개념 - 선입선출(FIFO, First In First Out) 큐의 예시 1. 택시를 타기 위해 서 있는 행렬 2. 병원의 접수대 3. 은행의 예금 인출기 4. 백화점의 계.......

원문보기 내부링크

Naver Blog

[MyBatis]invalid comparison: java.util.ArrayList and java.lang.String 에러

에러 내용 java.util.ArrayList and java.lang.String ### Error querying database. Cause: java.lang.IllegalArgumentException: invalid comparison: java.util.ArrayList and java.lang.String ### Cause: java.lang.IllegalArgumentException: invalid comparison: java.util.ArrayList and java.lang.String 발생 원인 MyBatis에서 사용하는 비교(if)문에서 배열(Array) 혹은 리스트(List) 객체를 문자열과 비교할 때 발생 발생 예시 해결 방안 배열(Array) 혹은 리스트(List) 객체를 문자열과 비교하지 않고 해당 객체의 크기를 비교 ex) <if test='LIST.size != 0'> 출처 사용자 Bulbasaur, https://055055.ti.......

원문보기 내부링크

Naver Blog

[HTML]HTML 캔버스(Canvas) 총정리

HTML 캔버스(Canvas) 총정리 HTML 캔버스(Canvas) 태그란? HTML 캔버스 사용하는 방법 HTML 캔버스 메서드 HTML 캔버스 속성 캔버스 메서드 사용 예시 HTML 캔버스(Canvas) 태그란? Canvas API는 JavaScript와 HTML <canvas> 엘리먼트를 통해 그래픽을 그리기위한 수단을 제공합니다. 무엇보다도 애니메이션, 게임 그래픽, 데이터 시각화, 사진 조작 및 실시간 비디오 처리를 위해 사용됩니다. - 별도의 프로그램 설치 없이 사용 가능 - 단순히 그림을 표현하는 기능 이외에 그림의 합성, 변환, 애니메이션과 같은ㄷ ㅏ양한 효과의 표현 가능 HTML 캔버스 사용하는 방법 1. HTML에 <canvas> 태그를 생성합니다. - canvas 요소를 사용.......

원문보기 내부링크

Naver Blog

[HTML]HTML SVG 태그 총정리

HTML SVG 태그 총정리 SVG란? SVG와 캔버스의 차이 SVG 요소 내에서 사용할 수 있는 도형 태그 SVG 요소 내에서 사용하는 속성 SVG 사용 예시 SVG란? Scalable Vector Graphics의 약자로 벡터 기반 그래픽을 XML 형식으로 정의하는 것을 의미합니다. - XML 기반의 2차원 벡터 그래픽을 위한 플랫폼 - 웹에서 사용하는 확장 가능한 벡터 그래픽 - XML, JPEG/PNG, DOM, CSS, XSL 등의 다른 표준을 기반/준수 - W3C에 의한 로열티가 없는 벤더 중립적인 공개 표준 SVG와 캔버스의 차이 SVG 사용법 1. SVG 태그를 이용하는 방법 - svg 요소를 이용하여 직접 HTML 페이지에 삽입 2. 별도의 소스 파일(*.svg)로 작성하는 방법 - iframe 요소나 a 요소로.......

원문보기 내부링크

Naver Blog

[CSS]CSS 포지션(position) 속성

CSS 포지션(position) - CSS 포지션(position) 속성이란? - 정적 위치(static position) 지정 방식 - 상대 위치(relative position) 지정 방식 - 절대 위치(absolute position) 지정 방식 - 고정 위치(fixed positioin) 지정 방식 - 요소안에서 사용하는 속성 CSS 포지션(position) 속성이란? HTML 요소에 사용되는 위치 설정 방식을 지정하는 속성입니다. CSS에서 요소의 위치를 결정하는 방식에는 다음과 같이 4가지 방식이 있습니다. - 정적 위치(static position) 지정 방식 - 상대 위치(relative position) 지정 방식 - 고정 위치(fixed positioin) 지정 방식 - 절대 위치(absolute position) 지정 방식 정적 위치(static position) 지정 방.......

원문보기 내부링크

Naver Blog

[CentOS]CentOS 다운 및 설치하기(VMware 사용)

CentOS 설치하기 - CentOS - CentOS의 주요 기능 - CentOS 최소 사양 - CentOS 다운로드 - CentOS 설치하기(VMware) - CentOS 실행하기(VMware) 선행해야 할 내용 가상머신이란? : [Virtual Machine]가상머신(VM).. : 네이버블로그 (naver.com) VMware 다운로드 및 설치하기 : [VMware]VMware 다운로드 및 설치하기 : 네이버 블로그 (naver.com) CentOS 공식 홈페이지 : The CentOS Project CentOS란 Red Hat 엔터프라이즈 리눅스의 소스코드 기반으로 만들어진 무료 배포판입니다. Red Hat 리눅스가 엔터프라이즈 버전을 출시하고, 이것에 대한 업데이트, 기술 지원 및 품질 보증에 대해 연간 사용료를 지급하도록 하는 것에 반해, CentOS는 무.......

원문보기 내부링크

Naver Blog

[자료구조]스택(Stack)

스택(Stack) 스택(Stack)이란? 스택 추상 자료형 스택의 구현 스택의 활용 예시 스택(Stack)이란? 스택은 나중에 들어온 것이 먼저 나가는 후입선출(LIFO, Last In First Out) 구조를 가진 자료 구조입니다. 쉽게 말해 스택(Stack)은 말 뜻 그대로 쌓아 올린다는 것을 의미하며, 차곡차곡 쌓아 올린 형태의 자료구조를 말합니다. - 가장 먼저 입력된 자료가 가장 나중에 출력 - 가장 나중에 입력된 자료거ㅏ 가장 먼저 출력 - 후입선출(LIFO, Last In First Out) 예를 들어 일상 생활에서 티슈를 생각할 수 있는데, 티슈는 먼저 저장된 것을 제일 마지막에 사용하게 되고, 가장 나중에 저장된 티슈를 먼저 사용하는 후입선출 구조라고 생각할 수.......

원문보기 내부링크

Naver Blog

[HTML]HTML 시맨틱 태그(Semantic Tag)

HTML 시맨틱 태그(Semantic Tag) - HTML 시맨틱 태그란? - 시맨틱 태그를 사용하는 이유 - 시맨틱 태그의 종류 - 웹사이트 태그 구조 - 중요한 태그들(헷가리는 태그) HTML 시맨틱 태그란? Semantic이란 의미있는 혹은 의미의 라는 뜻으로, 뜻 그대로 표현 중심이 아닌 의미 있는 구조의 문서 작성을 위한 요소입니다. HTML5에 도입된 시맨틱 태그를 이용하여 개발자와 브라우저에게 의미있는 태그를 제공합니다. - 검색 엔진, 문서 해석시 등의 프로그램에 의한 문서 처리와 해석도 가능 시맨틱 태그를 사용하는 이유 1. SEO(Search Engine Optimization) - 검색엔진 최적화 검색 엔진이 검색을 수행할 때에는 HTML 내에 있는 태그를 분석합니다.......

원문보기 내부링크

Naver Blog

[Cloud Computing]온프레미스(On-Premise)

온프레미스(On-Premise) - 온프레미스(On-Premise)란? - 다양한 서버의 종류와 기능 - 데이터 센터란? - 온프레미스 시스템 구축 단계 온프레미스(On-Premise)란? IT 서비스 제공에 요구되는 데이터 센터에 H/W 및 S/W 서비를 자체적으로 보유하고 운용하는 방식입니다. 즉, 자체적으로 보유한 전산실 서버에 직접 설치하여 운영하는 방식을 뜻합니다. 반대로 클라우드 방식의 서비스를 오프-프레미스(Off-Premise)라고 합니다. - 클라우드 컴퓨팅 기술이 나오기 전까지 기업의 인프라 구축의 일반적인 방식 - 개인 혹은 기업이 IT 서비스를 제공하기 위하여 서버 구축 다양한 서버의 종류와 기능 데이터 센터란? 위에 언급된 다양한 서버들을 한.......

원문보기 내부링크

Naver Blog

[Microsoft Azure]학생용 계정 만들기

Microsoft Azure 학생용 계정 만들기 - 학생용 계정 - 학생용 계정 만들기 학생용 계정 학생용 이메일 주소를 통해 인증을 받고 가입을 하는 경우 100USD의 크레딧을 제공받을 수 있습니다. 계정을 만들기 위해서는 우선 학교 홈페이지에서 학생용 메일 계정을 만들어야 합니다. 학생용 계정을 사용하는 경우 아래 서비스들을 제공받을 수 있습니다. 또한 학생용 계정을 만들기 위해서는 별도의 신용카드 정보가 필요하지 않기 때문에 과금 걱정을 하실 필요가 없습니다. 일반 계정에 경우 평가 기간이 끝나면 자동으로 유료로 전환이 되지만 학생용 계정은 카드 정보를 입력하지 않았기 때문에 자동으로 사용이 정지가 됩니다. 학생용 계정 만들.......

원문보기 내부링크

Naver Blog

[Linux]쉘 변수(Shell Variables)

쉘 변수(Shell Variables) - 쉘 변수 - 환경 변수 - 변수 사용하기(쉘 변수, 환경 변수 만들기) - 자주 사용되는 환경 변수 쉘 변수 쉘도 단순한 프로그램으로, 다른 프로그램처럼 변수를 만들어 사용할 수 있습니다. - 현재 쉘에서만 사용이 가능하고 서브 쉘로는 전달되지 않는 지역변수로 만들어집니다. 환경 변수 현재 쉘뿐만 아니라 서브 쉘로도 사용할 수 있는 전역 변수로 만들어집니다. - 보통 변수 이름으로 대문자를 사용합니다. - 모든 환경 변수와 값을 출력하기 위해 printenv 명령을 사용할 수 있습니다. 변수 사용하기 1. 쉘 변수 만들기 - 공백이 포함되면 안됩니다. 2. 쉘 변수를 환경 변수로 만들기 3. 한번에 환경 변수 만들.......

원문보기 내부링크

Naver Blog

[Linux]cd 명령어(디렉토리 이동) 및 절대경로, 상대경로

cd 명령어 - cd 명령어 - 사용 방법 - 사용 예시 - 절대경로 및 상대경로 cd 명령어 CD는 Change Directory의 약자로 디렉토리의 경로를 이동할 때 사용하는 명령어입니다. 사용 방법 사용 예시 절대경로 및 상대경로 [1] 절대 경로 절대경로란 최상위 디렉토리 (/)부터 싲가해서 목표 디렉토리까지 가는 경로를 전부 기술하는 방식입니다. - 현재 위치에 상관없이 최상위 루트 디렉토리부터 하위로 이동하여 해당 디렉토리가 위치하는 곳 까지의 경로를 모두 기술합니다. 예를 들어, doran이라는 사용자 홈 디렉토리에 test라는 폴더로 이동하는 경우 아래와 같이 모두 기술합니다. - 현재 작업 디렉토리는 사용자 홈 디렉토리라고 가정합니다. .......

원문보기 내부링크

Naver Blog

[Linux]파일 내용 확인하기(more, less, head, tail, cat 명령어 및 입출력 리다이렉션)

파일 내용 확인하기 - more 명령어 - less 명령어 - head 명령어 - tail 명령어 - cat 명령어 - 입출력 리다이렉션 특수 문자를 이용한 cat 명령어 more 명령어 파일의 내용을 화면 단위로 출력하는 명령어입니다. 왼쪽 하단에 화면에 출력된 내용이 전체의 몇 % 인지를 표시하며, Enter 키를 입력하면 한 줄씩 출력되고, Space bar를 입력하면 한 화면씩 출력됩니다. - 한 화면을 보여준 상태에서 멈춤 - Space Bar를 누르면 다음 화면으로 이동 - Enter를 누르면 한 라인씩 이동 - q를 누르면 종료 ※ 이 명령어는 위에서 아래 방향으로 출력되기 때문에 지나간 내용을 다시 볼 수 없는 단점이 있습니다. 사용 방법 옵션 조작 버튼 less 명령어.......

원문보기 내부링크

Naver Blog

[HTML]HTML 색상을 표현하는 방법(색상명, RGB 색 모델, 16진수 색상값, HSL 색 모델)

HTML 색상을 표현하는 방법 - 색상명을 이용한 방식 - RGB 색 모델을 이용한 방식 - 16진수 색상값으로 표현 - HSL 색 모델을 이용한 방식 색상명을 이용한 방식 색상명에 해당하는 영어 단어를 직접 사용 - W3C에서 정의한 16개의 HTML 색상 이름은 다음과 같습니다. - 색상 이름은 대소문자를 구분하지 않습니다. - 현재 주요 브라우저들은 140개의 색상 이름을 모두 지원 RGB 색 모델을 이용한 방식 삼원색의 성분이 더해져서 색을 만드는 가산색 모델 - RGB 색상의 기본색(Red, Green, Blue)은 각각 0부터 255까지의 범위를 가집니다. - RGB 함수를 이용합니다. → rgb(R, G, B) : R, G, B의 각 값을 0 ~ 255 사이의 10진수로 표시 → rgb(R%.......

원문보기 내부링크

Naver Blog

[VMware]VMware 다운로드 및 설치하기

VMware 다운로드 및 설치하기 - VMware - 주인(Host)과 손님(Guest) - VMware의 장단점 - VMware의 작동 구조 - 가상 머신의 하드웨어 - VMware 다운로드 및 설치하기 - VMware 실행하기 선행해야 할 내용 가상머신(Virtual Machine)이란? : https://blog.naver.com/hj_kim97/222497427027 VMware VMware는 가상 머신 소프트웨어로 보통 하나의 PC를 가지고 여러 대의 PC가 있는 효과를 누리기 위해 사용되고 있습니다. 주인(Host)과 손님(Guest) VMware와 같은 가상 머신에서 가장 중요한 개념 중에 하나가 바로 Host(호스트)와 Guest(게스트)의 개념입니다. Host는 단어 그대로 주체가 되는 주인을 의미하며 Guest는 이러한 주인을 이용하는 손.......

원문보기 내부링크

Naver Blog

[Microsoft Azure]Microsoft Azure란?

Microsoft Azure - 클라우드 서비스 - 클라우드 컴퓨팅의 보급 원인 - Microsoft Azure - Microsoft Azure 서비스 클라우드 서비스 클라우드 컴퓨팅은 IT 자원을 구매하거나 소유할 필요 없이 필요한 만큼 사용료를 주고 쓰는 서비스를 말합니다. 중앙 집중화된 대형 데이터 센터에서 서비스를 받고 소프트웨어나 프프로그램을 인터넷을 통해 자유롭게 빌려쓰는 방식입니다. - 클라우드 = Cloud = 구름 = 구름은 형태가 보이지만 만질 수 없는 것처럼 클라우드 서비스도 존재하지만, 어딘가에 있는 가상공간을 빌려쓴다는 생각으로 자원을 빌려쓴다고 생각하시면 됩니다. 클라우드 컴퓨팅의 보급 원인 1. 서버의 유휴 리소스 활용.......

원문보기 내부링크

Naver Blog

[코딩테스트]코딩테스트 사이트 모음

국내 코드업 기초 100제 https://codeup.kr/ 구름레벨 https://level.goorm.io/ 해커링크 https://www.hackerrank.com/ 백준온라인저지 https://www.acmicpc.net/ 프로그래머스 https://programmers.co.kr/ 정올 http://www.jungol.co.kr/ 삼성 역량테스트 https://swexpertacademy.com/main/main.do 코더그라운드 https://codeground.org/ 코드업 https://codeup.kr/ 코딩도장 https://codingdojang.com/ 해외 해커링크 https://www.hackerrank.com/ 릿코드 https://leetcode.com/ 코딜리티 https://www.codility.com/ 코드포스 https://codeforces.com/ 탑코더 https://www.topcoder.com/ 긱스포긱스 https://geeksforgeeks.com/

원문보기 내부링크

Naver Blog

[HTML]HTML 이미지맵(image map) 총정리

HTML 이미지맵(image map) 이미지맵이란 한 이미지를 여러 개의 구역으로 나누어 링크를 거는 것 사용해야 하는 태그 1. 이미지 태그 : <img src="사진경로" usemap="#이미지맵"/> 2. 이미지 맵 태그 : <map> 3. 이미지 안에 구역을 나눌 태그 : <area shape="형태" coords="좌표값" href="링크" target="_blank"/> area 태그 사용 속성 값 shape : 이미지에 구역을 나눌 때 사용할 모양을 지정합니다. - rect : 사각형 - circle : 원 - poly : 다각형 coords : 모양에 따른 좌표를 지정합니다. - 사각형일 경우 : "시작x좌.......

원문보기 내부링크

Naver Blog

[Virtual Machine]가상머신(VM)이란?

가상화 기술 H/W를 S/W적으로 애플리케이션, 서버, 스토리지, 네트워크와 같은 컴퓨팅 리소스를 논리적으로 분할/통합하여 리소스의 이용률과 가용성을 높이는 기술입니다. CPU, GPU, 메모리, 스토리ㅣ지와 같은 물리적 리소스와 운영체제, 런타임 등 논리적 리소스를 가상화하여 소프트웨어 플랫폼의 역할을 합니다. - 물리적 IT 리소스를 가상의 IT 리소스로 전환 - 가상화 기술을 활용하여 하나의 서버로 여러 실행 환경 구성 - 물리적 리소스의 소유 비용을 감축 - 간편한 유지보수 가상 머신(Virtual Machine)이란? 가상 머신은 물리적 컴퓨터와 동일한 기능을 제공하는 소프트웨어 컴퓨터입니다. 가상 머신은 물리적 컴퓨터처럼 애플리케이.......

원문보기 내부링크

Naver Blog

[Linux]리눅스 표준 디렉토리 구조 및 기능

리눅스 표준 디렉토리 구조 리눅스의 디렉토리 구조는 전체적으로 트리(Tree) 구조를 가지며, 명령어의 성격과 내용 및 사용 권한 등에 따라 디렉토리로 구분되고 있습니다. 리눅스 파일 시스템 구조는 기본적인 구조를 제외하고는 사용자의 설정에 따라 달라질 수 있습니다. 하지만 리눅스의 디렉토리 구조는 파일 시스템 표준안(FSSTND, Linux File System Standard)을 기반으로 하는 것이 바람직합니다. - 대부분의 리눅스 배포판들은 기본 골격이 같음 루트 디렉토리 : / 마운트되는 모든 파일 시스템을 포함하는 디렉토리로, 파일 시스템에 존재하는 모든 파일의 조상이 되는 최상위 디렉토리입니다. 파일이나 디렉토리의 절대경로를 표기할.......

원문보기 내부링크

Naver Blog

[AWS - EC2]AWS EC2 Java 설치 및 환경변수 설정

AWS EC2 Java 설치 및 환경변수 설정 - 설치 가능한 Java 버전 조회 - Java 1.8 설치 - 설치 확인 - 환경변수 설정 선행해야할 내용 - AWS EC2 인스턴스 생성 : AWS, 로그의 개발일지 : 네이버 블로그 (naver.com) 설치 가능한 Java 버전 조회 : yum list Java 1.8 설치 : yum install 설치 확인 : java -version 환경변수 설정 1. 절대 경로 찾기 1-1. Java 위치 찾기 : which java 1-2. 절대 경로 찾기 : readlink -f /usr/bin/java 1-3. 절대 경로 복사 : Ctrl + Shift + C 2. 환경변수 등록하기 2-1. vi 편집기로 환경 변수 설정 파일 접근 : vi 파일명 2-2. 편집기 마지막으로 이동 : Shift + G 2-3. 수정 모드로 변경 : i 2-4. 환경 변수 내.......

원문보기 내부링크

Naver Blog

[프로그래머스]Level1. 정수 제곱근 판별(Java)

프로그래머스 Level1. 정수 제곱근 판별 링크 : 코딩테스트 연습 - 정수 제곱근 판별 | 프로그래머스 (programmers.co.kr) 문제 설명 임의의 양의 정수 n에 대해, n이 어떤 양의 정수 x의 제곱인지 아닌지 판단하려 합니다. n이 양의 정수 x의 제곱이라면 x+1의 제곱을 리턴하고, n이 양의 정수 x의 제곱이 아니라면 -1을 리턴하는 함수를 완성하세요. ※ 제한 조건 n은 1이상, 50000000000000 이하인 양의 정수입니다. 예시 답안 - 정수의 제곱은 1 -> 4 -> 9 -> 16 -> 25 -> .. 로 현재값 + (3 + 2n) 으로 커짐 Math 메소드 이용 - Math.sqrt(int num) : 루트, 값의 제곱근 - ex) Math.sqrt(25) : 루트25 = 5 .......

원문보기 내부링크

Naver Blog

[프로그래머스]Level1. 정수 내림차순으로 배치하기(Java)

프로그래머스 Level1. 정수 제곱근 판별 링크 : https://programmers.co.kr/learn/courses/30/lessons/12933 문제 설명 함수 solution은 정수 n을 매개변수로 입력받습니다. n의 각 자릿수를 큰것부터 작은 순으로 정렬한 새로운 정수를 리턴해주세요. 예를들어 n이 118372면 873211을 리턴하면 됩니다. ※ 제한 조건 n은 1이상 8000000000 이하인 자연수입니다. 예시 답안 - 숫자를 배열로 만들고 난 후, Arrays.sort() 메소드를 이용하여 오름차순 정렬 후 값을 반대로 가져옴 - 내림차순으로 할 경우 Arrays.sort(배열, Collections.reverseOrder());

원문보기 내부링크

Naver Blog

[프로그래머스]Level1. 상위 N개 레코드(Oracle, MySQL)

프로그래머스 Level1. 상위 N개 레코드 링크 : https://programmers.co.kr/learn/courses/30/lessons/59405 문제 설명 예시 답안 MySQL : limit Oracle : rownum

원문보기 내부링크

Naver Blog

[자료구조]자료구조의 개념(자료와 정보, 선택 기준, 특징, 분류)

자료구조의 개념 - 자료와 정보 - 자료구조가 필요한 이유 - 자료구조의 선택 기준 - 자료구조의 특징 - 자료구조의 분류 자료와 정보의 관계 자료 : 현실 세계에서 관찰이나 측정을 통해서 수집된 값(value)이나 사실(fact) 정보 : 어떤 상황에 대해서 적절한 의사결정(decision)을 할 수 있게 하는 지식(knowledge) 쉽게 말해, 자료는 처리되지 않은 데이터이고 정보는 자료가 사용될 수 있는 형태로 가공된 2차 처리 결과물이라고 할 수 있습니다. 자료 = 도서관의 무수한 책 구조 = 특정한 규칙과 방법에 따라 책장에 정리하는 방식 정보 = 규칙에 따라 정리된 책 자료구조가 필요한 이유 데이터를 효율적으로 저장, 관리하여.......

원문보기 내부링크

1 2 3