emacs에서 html을 편집할 때 

C-c C-v 단축키로 해당 html을 브라우저에서 열 수 있습니다.

C-c / 단축키로 열린 태그에 대한 닫는 태그를 자동 입력할 수 있습니다.


관련: http://www.gnu.org/software/emacs/manual/html_node/emacs/HTML-Mode.html

Ceylon (http://ceylon-lang.org) 언어는 Java와 JavaScript 두 가지 플랫폼을 지원합니다. JVM 또는 node.js 플랫폼에서 동작하는 진정한 일타쌍피 언어이죠.

이 실험적인 언어의 기능(Feature)이 정해졌다고 합니다.

http://www.theserverside.com/news/thread.tss?thread_id=77418 (Gavin King이 직접 쓴 뉴스)

http://www.infoq.com/news/2013/09/ceylon-beta


Ceylon은 C, Java언어를 아시는 분들은 아주 잘 읽힙니다. html도 구조대로 프로그래밍을 하고 동적으로 생성해줍니다.

Table table = Table {

    title = "Squares";

    rows = 5;

    Border {

        padding = 2;

        weight = 1;

    };

    Column {

        heading = "x";

        width = 10;

        String content(Integer row) {

            return row.string;

        }

    },

    Column {

        heading = "x^2";

        width=10;

        String content(Integer row) {

            return (row^2).string;

        }

    }

};


하이버네이트로 자바 표준인 JPA도 이끌어낸 Gavin이라 이 분이 만든 Ceylon이 어떤 반향을 일으킬 것 같습니다. 특히나 메이저 언어가 된 자바스크립트와 전혀 다른 언어 자바를 통합시켰으니까요.


15분이면 Ceylon 언어를 탐험하실 수 있습니다. 

http://ceylon-lang.org/documentation/current/introduction/

영어가 안되서 당황하시면 안 됩니다. ^^;

아이폰엔 있습니다. 이런 괴물... 이미지 상단에 "콘솔 디버그 오류 없음" 이라고 보입니다.

설정에서 브라우저 정보에 보면 개발자용이라고 표시됩니다.

콘솔 디버그 옵션을 활성화하면 됩니다.

오류가 생긴 경우 더 자세한 정보를 볼 수 있습니다.

HTML/JavaScript/CSS 의 오류가 보여집니다.

모바일웹 개발시 유용하게 쓰일 것 같습니다.



온실에서 키운 화초는 약하다고 합니다. 프로그램 개발환경 중에서 가장 온실같다고 할까요, 그런 게 있습니다. 바로 브라우저의 HTML 렌더러입니다. 가장 마음이 넓은 실행기라서 마크업이 깨져도 알아서 대체로 잘 보여주는 편입니다.

때문에 웹 개발자들은 프로그래머 취급도 못받고 허드렛일꾼으로 대하던 시절이 있었습니다.
하지만 그런 유약한 개발습관에서 벗어나 조금 깐깐해질 필요가 있는 것 같습니다.
자바원의 북스토어에서 본 책 중 인상적인 것 하나가 Refactoring HTML이었습니다.

IBM DW에도 비슷한 류의 글이 올라왔군요.

유효성 검사는 여러분의 페이지에 "예측 가능한"이라는 도장을 찍는 방법이다. 태그를 적절히 사용하면, 페이지는 구조적으로 건전하며, 사용과 탐색도 쉽다.

from: http://www.ibm.com/developerworks/kr/library/wa-inherit1/

프로그래머들의 애매한 결과에 대한 삽질은 누구나 겪는 일이지만 HTML 개발자들이 가장 심하다고 말하면 지나친 생각일까요?

유지보수하는 입장에서 HTML을 다루는 자세와 기법에 대해서 도움이 되는 내용이었습니다.

좋아하는 기획자 중 한 부류는 기획서가 깐깐해서 처음에 답답해 보이지만 프로젝트 후반에 말바꾸지 않고 신뢰감있게 독려하는 분들입니다. 웹개발도 깐깐하게 바꿔보는 것이 어떨까요.
검사(validation)이라는 녀석은 말이죠, 아무 때나 들이대면 피곤합니다. 3.3에서 추가된 spelling check도 마찬가지죠. 지난 번에는 이 기능을 잠재우는 방법을 소개했었습니다. 이번에도 비슷한 경우를 얘기해봅니다. 툴의 기본 성격은 자동화입니다. 문법 자동 체크, 형식 자동 체크 등이죠. 하지만 느슨한 검사를 하는 HTML 같은 경우, 신경쓰고 싶지 않은 때가 많습니다. 더군다나 기존의 html코드가 저주받은 경우는 더 하죠.
사용자 삽입 이미지

index.jsp 파일에 경고도 아니고, 빨간 딱지가 붙었습니다. 굉장히 신경쓰이죠.
사용자 삽입 이미지

파일을 열어봤습니다. 도대체 무엇을 잘 못 했길래... 쯔업. 주석처리한다는 것이 >/tr<를 낙오시켜 버렸군요.
잘못한 것 많네요. 하지만, 이런 류의 미스는 신경쓰기 싫다 하시는 분들, 언제 저주받은 html을 다 정리하냐 현실적으로 불가능하다 하시는 분들, 그래서 준비했습니다. 음주단속 피하는 방법처럼 이것도 피하는 방법이 있습니다. 음주단속이야 술 안마시면 걸리지 않죠. 양조장에서 일하기 때문에 몸에서 기본적으로 알코올 도수가 나온다면... 음... 지금 삼천포로 가고 있습니다. 일단 Preferences 를 열어서 validation이라고 칩니다. Validation 메뉴 선택하고 세팅을 다음과 같이 맞춰줍니다.
사용자 삽입 이미지


xml 문법체크는 중요하기 때문에, 어긋나면 웹 애플리케이션이 죽어버리니까 체크했습니다.
그리고 프로젝트 다시 빌드하시면 깨끗하게 나옵니다. 그래도 찜찜하죠. 앞으로 짜는 코드는 말끔하게 짜 주세요. 특히나 table 태그 안에서 tr 사이에 있는 기생하는 form 태그, table 밖으로 나오시거나 td 안으로 들어가세요.
한 줄이 붕 뜬다고요? form 태그 속성에 style="margin:0" 주시면 그런 거 없습니다.
웹표준, 그리 나쁘지 않습니다.

+ Recent posts