Brackets 사용해보기

Brackets

사용해보기

ㆍ 요즘 다시 HTML을 조금씩 하고 있는데

    주위에서 Brackets을 써보라고 해서 써봤습니다

ㆍ 별로 안써보긴 했지만 쓰자마자 편리하다는걸

    느꼈습니다.

일단 다운받아 보자!

http://brackets.io/

위에 링크를 타고 들어가면

다운을 받을 수 있습니다.

컴 사양에 따라 다르겠지만

길어야 5분정도 걸리는듯?

다운을 완료하면

엔터 연타를 눌러서

설치를 완료하면 됩니다.

어디 깔린지 모르겠으면

시작 눌러보면 요렇게 숨어있습니다.

대충 실행을 시켜보면

이렇게 쫜 하고 나옵니다.

Brackets 편리한 점 첫번째!

실시간 미리보기!

저는 Sumlime만 써서 그런지

다른 에디터에서도 이런기능이

있는지 모르겠지만.

써보고 놀랐습니다.

사용방법은 우측 상단에

번개가 누워있는 모양을 누르면 됩니다.

누르게 되면 크롬이 하나

뜨게 됩니다.

여기서는 작업하는 내용이 표시되는데

신기한건 새로고침을 안해도 Brackets에서

저장만 하면 실시간으로 값이 변합니다.

(지금은 데탑인데 노트북에도 깔아봤는데

그때는 저장 안해도 즉각즉각 바뀌던데..

뭔가 설정이 있을거 같습니다.

아직 익숙하지 않아서 ㅠ 찾아보시면 있을겁니다)

아래를 보시죠

간단하게 써봤습니다

대충 이런 느낌입니다 ㅎㅎ

모니터가 왕 크거나

듀얼모니터 쓰면 편하겠죠?

Brackets 편리한 점 두번째!

보통 작업을 할때

파일을 분리해서 쓸텐데

Brackets을 사용한다면

html 파일에서 바로 수정이

가능합니다.

이렇게 CSS와 연결되어있는

id에 커서를 놓고 오른쪽마우스

클릭을 하면 위 사진과 같이

빠른 편집을 보실 수 있습니다.

이것을 눌러주게 되면

이런식으로 바로 아래에 창이 하나

확장되면서 바로 CSS 코드를 수정할 수 있게

도와줍니다.

역시나 수정을 하면서 미리보기로

바로바로 확인 할 수 있습니다

원래 좀 더 편한게 많은데

여기 데탑 설정이 뭔가 바꿔줘야하는듯..

수정중인 부분이 미리보기 화면에서

블럭잡히고 하는 부분도 있는데..

ㅠ.ㅠ

나중에 공부하고 

한번 더 올려보겠습니다

끝!