사이트나 티스토리에서 HTML이나 CSS코드 또는 JavaScript코드를 작성할 때 매번 작성 후 적용해보고 하는게 여간 번거로운 일이 아닙니다.
따라서 테스트 후에 적용 해볼 수 있으면 정말 좋겠죠?
작성한 코드를 곧바로 적용해서 결과를 옆창에서 확인해 볼 수 있는 사이트가 있습니다.
두 사이트가 있는데요,
첫 번째 사이트 W3Schools
첫 번째는 바로 유명한 코딩 교육 사이트인 w3schools 입니다.
W3Schools is a popular web site for learning web technologies online. Content includes tutorials and references relating to HTML, CSS, JavaScript, PHP, AngularJS, SQL, Bootstrap, Node.js, and jQuery. It receives more than 10 million unique visitors monthly.
출처 : 위키피디아
매달 방문자수가 천만명을 넘어가며, 위 처럼 다양한 종류의 웹 프로그래밍 언어를 교육하는 사이트입니다.
w3schools에서 제공하는 코드 작성 테스트 페이지가 있습니다.
사용법 및 링크
사용법이라고 하기 민망할 정도로 간단합니다. 그냥 옆에 html, javascript, css 코드를 작성 후 Run버튼을 클릭하기만 하면 결과가 오른쪽 창에 나타납니다.
아래 링크를 타고 들어가시면 HTML 을 곧바로 테스트 해보실 수 있습니다.
저는 북마크 해놓고 html, javascript, css 관련 포스팅을 할 때 이용합니다.
팁
media 쿼리로 반응형 스킨을 만들때 저 오른쪽 창의 크기가 윈도우 창 크기 역할을 합니다.
따라서 반응형 스킨 제작시에도 css를 이용해 media쿼리를 테스트 해보기가 용이합니다.
두 번째 사이트 liveweave
위의 테스트 페이지가 정말 간단한 테스트를 위한 페이지 였다면 이번엔 좀 더 깔끔한 UI를 가진 테스트 페이지를 소개해 드리겠습니다.
티스토리 블로그 수정을 테스트할 때 매우 용이합니다.
이 테스트 페이지들을 알게 된 이후로 메모장으로 html을 작성해서 html파일로 저장 후 테스트 해보곤 했었습니다...
정말 피곤 한 일이죠.
혹시 모르시는 분이 계셨다면 북마크 해두시고 사용해보세요.
유용한 정보가 되었길 바랍니다.
감사합니다.