본문 바로가기

기초 문법

[CSS] Reset CSS 프로젝트를 새로 만들 때 필요한 리셋 CSS입니다. 웹 브라우저가 기본적으로 제공하는 CSS 를 초기화 해주는 코드로써 나의 코드를 보다 더 자유롭게 꾸밀 수 있다는 장점이 있습니다. 또한 브라우저 간의 최소한의 차이를 제거함으로써 브라우저 요소들의 스타일이 존재하지 않는 처음 상태에서 디자인할 수 있습니다. # Contents Reset CSS 코드 # Reset CSS 코드 아래 코드를 reset.css 파일로 저장하여 사용하세요 /* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, .. 더보기
[CSS] Flex 웹페이지의 레이아웃을 잡을 때 보통 display, float, position과 같은 css 속성들을 이용하지만 이러한 속성은 특성 상 한계와 복잡도가 존재합니다. 그 한계를 극복하기 위해서 css3에 flex라는 방식이 새롭게 추가되었습니다. flex CSS 속성은 하나의 플렉스 아이템이 자신의 컨테이너가 차지하는 공간에 맞추기 위해 크기를 키우거나 줄이는 방법을 설정하는 속성입니다. flex CSS는 부모 요소인 flex 컨테이너 와 자식 요소인 flex 아이템으로 구성됩니다. flex 컨테이너가 flex 태그의 영향을 받는 공간이고, 그 안에서 flex 아이템들의 배치, 정렬이 설정된 속성에 따라 변경되는 것이기 때문에 flex 를 사용하려면 부모먼저 정의한 후 자식 요소에 배치를 고려해야 하겠습.. 더보기
[Java] SSL and TrustStore and KeyStore 간단한 설명 및 예제 자바 SSL 을 이용하여 간단하게 통신하는 방법을 다루겠습니다. SSL 이란 전송 계층 보안(영어: Transport Layer Security, TLS, 과거 명칭: 보안 소켓 레이어/Secure Sockets Layer, SSL)는 컴퓨터 네트워크에 통신 보안을 제공하기 위해 설계된 암호 규약입니다. 서버 사이에 전송된 데이터를 암호화하여 제3자가 도청이나 데이터를 훔치는 일을 방지하는 역할을 합니다. 그리고 암호화를 해서 최종단의 인증, 통신 기밀성을 유지시켜줍니다. 그러면 자바에서 SSL을 이용하는 방법에 대해 알아보도록 하겠습니다. 본 예제를 구성하고 테스트하기 전 기본적인 상식과 환경설정이 요구됩니다. 처음부터 천천히 따라와주시는 것을 권장합니다. SSL에서는 데이터를 암호화해서 전송하므로 본.. 더보기
[Java] 자바로 SCP 전송 ssh 원격 접속 프로토콜을 기반으로 한 SecureCopy(scp)의 약자로서 원격지에 있는 파일 혹은 디렉터리를 보내거나 가져올 때 사용하는 파일 전송 프로토콜입니다. 위키백과에서는 ssh 프로토콜에 기반된 것으로써 로컬 호스트와 원격 호스트 또는 두 원격 호스트 사이의 컴퓨터의 파일을 보다 안정하게 전송하기 위한 수단으로 작성된 프로토콜이라고 할 수 있습니다. cp와 같은 동작을 하지만 cp는 현재 시스템 내부의 파일을 복사하는 것이라면 scp는 현재 시스템으로부터 원격지 시스템까지의 데이터를 전송하는 차이가 있습니다. 이러한 리눅스 명령어를 Java에서 지원하는 라이브러리가 존재하는데 이 라이브러리의 명칭은 JSch, JSSE 등 여러가지 라이브러리가 있다. 그 중 오늘 이용할 라이브러리는 Jsc.. 더보기
[JavaScript] Decorator Decorator Pattern(데코레이터 패턴)은 "주어진 상황 및 용도에 따라 어떤 객체에 책임을 덧붙이는 패턴으로, 기능 확장이 필요할 때 서브클래싱 대신 쓸 수 있는 유연한 대안이 될 수 있다." 고 위키백과에 정의되어 있습니다. 객체의 함수 혹은 전역 함수의 기능을 새로 붙여서 사용하거나 기능을 수정할 때 사용한다고 생각합니다. 다음 예제를 통해 데코레이터를 좀 더 알아보고, 자바스크립트에서 데코레이터 패턴을 사용하기 위한 방법을 제시해보도록 하겠습니다. # Contents 자바스크립트에서 Decorator Pattern # 자바스크립트에서 Decorator Pattern 먼저 기본적인 흐름에 대해 알아보도록 하겠습니다. 아래 그림을 보면서 설명하도록 하죠. 위의 예제는 ProcessMath 객.. 더보기
[JavaScript] AES128 암호화/복호화 자바스크립트에서 AES128를 이용하여 양방향 암호화 및 복호화를 하는 예제입니다. Hash 암호화와는 다르게 양방향이므로 대칭키를 가지고 있으며, AES128, AES192, AES256 등 키의 bit수의 따라 나뉘게 됩니다. AES128 은 16byte로써 키의 길이가 16자리인 암호 방식입니다. 키의 길이에 따라 라운드의 수가 다르며 AES 암호 알고리즘에서 마지막 라운드에서는 MixColumn 단계가 없다. AES 이론적인 내용을 참고하시려면 https://www.crocus.co.kr/1230 등을 참고해주시기 바랍니다. # Contents 전체 코드 # 전체 코드 AES128 암호화 및 복호화 코드 예제입니다. const Crypto = require("crypto"); var key = ".. 더보기
[JAVA] AES128 암호화/복호화 자바에서 AES128를 이용하여 양방향 암호화 및 복호화를 하는 예제입니다. Hash 암호화와는 다르게 양방향이므로 대칭키를 가지고 있으며, AES128, AES192, AES256 등 키의 bit수의 따라 나뉘게 됩니다. AES128 은 16byte로써 키의 길이가 16자리인 암호 방식입니다. 키의 길이에 따라 라운드의 수가 다르며 AES 암호 알고리즘에서 마지막 라운드에서는 MixColumn 단계가 없다. AES 이론적인 내용을 참고하시려면 https://www.crocus.co.kr/1230 등을 참고해주시기 바랍니다. # Contents 암호화 복호화 전체 코드 # 암호화 AES128 암호화 코드 예제입니다. iv는 설정하지 않고 암호화를 하였습니다. private static String key.. 더보기
객체에서 배열, 배열에서 객체 자바스크립트에서 배열과 객체는 많이 다르다고 생각합니다. 객체는 Key와 Value로 이루어진 형태의 타입이며, 배열은 스택과 같은 느낌의 형태 타입으로 이루어졌다고 생각합니다. 코딩을 많이 하다 보면 객체에서 배열로 타입을 변환하여 사용하는 경우도 있고, 배열에서 객체로 타입을 변환하여 사용하는 경우도 있다고 생각합니다. 오늘은 이 안건에 대해 알아보는 시간을 가지려고 합니다. # Contents 객체에서 배열 배열에서 객체 # 객체에서 배열 객체에서 배열로 만드는 방법은 아주 다양합니다. 다양한 방안들 중 기초적인 핵심과 어렵지 않는 부분만 다룰 예정입니다. 한번 보시죠. 1. Object.keys() var object = Object.keys(target) Object.keys() 메소드는 tar.. 더보기