본문 바로가기

Language/HTML

(4)
웹 개발자의 지옥, 이메일 폼 개발하기 웹을 개발하다보면 사용자를 위해, 법률적인 요소로 인해, 효율성을 위해, 등 다양한 이유 때문에 이메일을 전송하게 됩니다. 하지만 이 이메일을 HTML/CSS로 구현할 때 굉장히 고통스럽다는 사실은 상대적으로 알려져 있지 않습니다. 저도 이메일 관련 작업을 하면서 고통을 항상 겪는데요, 그렇기에 다른 분들도 겪을 수 있다고 생각해 쉽게 개발할 수 있는 가이드를 작성하고자 합니다. 이 글이 개발자들에게 조금이나마 도움이 되었으면 좋겠습니다. 순서 이메일 작업을 해야하는 이유 이메일 작업이 어려운 이유 이메일 작업 문제 재정의 이메일 작업하기 작업한 이메일 페이지 검증하기 1. 이메일 작업을 해야하는 이유 간단하게 언급했지만, 이메일 작업을 하는 가장 큰 이유는 법률적인 이슈때문이라고 볼 수 있습니다. ‘전..
data URIs로 image 생성하기 흔한 일은 아니지만 data URIs를 이용하여 html을 작성할 필요가 생기는 경우가 가끔있습니다. (이미 만들어진) 크기가 작은 이미지를 이미지 파일없이 html에 만들어 넣는다거나 하는 일 따위 말이죠.예를 들어 메일을 html로 작성할 때나 간단한 페이지를 작성해 임시로 사용할 html같은 경우에 필요할 수 있겠습니다. 요소의 src속성에 base64인코딩 방식으로 소스를 넣는 방식을 이용하는데, 기본적인 형식은 아래 같습니다.Syntax data:[][;base64], Sample data:,Hello%2C%20World! Simple text/plain data data:text/plain;base64,SGVsbG8sIFdvcmxkIQ%3D%3D base64-encoded version of ..
[CANVAS] 비동기적이벤트 & HELLO WORLD 사용자 입력 처리하기 = 이벤트 핸들러 사용하기 사용자의 입력은 항상 비동기적!비동기적 이벤트(마우스클릭 등)란 이벤트가 언제 일어날지 프로그래머가 전혀 알 수 없는 이벤트를 말한다. Hello, World 출력하기
[HTML5] CANVAS CANVAS표준화된 그래픽 인터페이스사각형이나 원, 다각형 등 단순한 도형을 그릴 수 있다.캔버스를 직접 사용하는 것은 매우 어렵고 손이 많이 가기 때문에, 일반적으로 라이브러리(PaperJS, KineticJS, EaselJS 등)를 많이 쓴다. PaperJs 1. PaperJs CDN 라이브러리 링크 추가 (Line 10)* 습관들이기 (링크 순서)- 는 body 마지막에 추가 : head의 복잡도 줄이기 + 자바스크립트 성능 향상- 웹 개발에서 제이쿼리가 빠지는 일은 거의 없으므로 제일 먼저 추가.- Line 12 : main.js 에서 제이쿼리와 paper.js 둘다 사용할 것이기 때문에 아래와 같은 순서로 링크 추가. 2. Line 4 : Paper.js를 전역 스코프에 설치Line 5 : Pa..