Tag: pow

로컬에서 개발하던 것을 쉽고 엘레강스하게 다른 기기에서 보기(feat. Pow)

서론

드디어 크로스 브라우징을 할 때가 되었다.
나는 매우 의욕이 없어지고 집에 가고 싶어지며 기분이 다운되었다.
테스트 폰 / 윈도우 노트북을 구할 생각에 막막해졌으며,
인터넷 익스플로러를 켜서 내 더러운 코드를 돌려 깨지는 것들을 다 디버깅할 생각을 하니 심장이 내려앉았다.

무거운 VMWare를 설치해 나의 청순한 맥에 윈도우를 들여놓기도 싫었고(미안 윈도우)
Browser Stack이란 솔루션으로 브라우저 내에서 가상머신을 돌리는 것을 free trial로 24시간만 써볼까 했더니, 그것도 IE 8, 9는 유료 버전만 되는 등 생각처럼 되지 않았다.

그런 절망 속에서 Pow가 나타났다!

Pow

예전에 로컬 서버를 이름으로 관리해주는 툴인 pow 사용법 글을 올렸었는데, 그 곳에서 지원해주는 기능이 있다.

예를 들어, pow로 돌린 내 앱 url이

http://pinkfong-china-apps.dev/

라면, 원하는 다른 기기를 같은 망에서 접속하고(동일 와이파이를 사용한다던지…)

http://pinkfong-china-apps.10.0.12.100.xip.io/

란 url로 들어가주면
S__12828781

OH OH
아름답게 접속 된다
OH OH

이는 장고나 npm 등등에서도 많이 지원해 주는데, pow를 사용하면 쉽고 엘레강스하게 돌릴 수 있다.

결론

  1. pow와 anvil은 참 좋다.
  2. 두근두근하며 IE와 안드로이드 기본 브라우저에서 돌려보았는데 transition이 되지 않는 것만 빼곤 아름답게 동작해서 한시름 덜었다.

[LESS] Less error – ‘less Failed to execute ‘send’ on ‘XMLHttpRequest’을 anvil로 해결하기

개인 프로젝트에 less를 사용하려고 아래 cdn 소스를 한 줄 추가하였다.

<br /><a href="https://cdnjs.cloudflare.com/ajax/libs/less.js/2.5.1/less.min.js">https://cdnjs.cloudflare.com/ajax/libs/less.js/2.5.1/less.min.js</a>

(이렇게 처음 설치 과정이 SASS보다 편하다 한다)

그런데 less가 이런 에러를 내며 동작하지 않는 것이었다.

<br />less Failed to execute 'send' on 'XMLHttpRequest

찾아보니 크롬에서 file:///...처럼 그저 html 파일을 열어선 less 컴파일이 동작하지 않는다 한다.

The less.js script currently doesn’t work if you’re using Chrome and the path to your page starts with “file:///”.

몇 가지 우회 방법이 있는데, 난 anvil로 돌려서 해결했다.

예전에 TIL(Today I learn)이라는 개인 위키 리포지토리를 쉽게 접근할 때 쓰던 anvil이었는데, 막상 다른 프로젝트에선 활발히 쓰고 있지 않았었네.

anvil은 pow를 GUI로 돌리게 해주는 툴인데,

프로젝트 경로를 추가해두면 다음부터 anvil을 on하고 http://food-todo.dev/와 같은 경로만 입력하면 local 프로젝트들을 쉽게 켤 수 있다.

설치 방법은 아웃사이더님 블로그 참고.