CSS

도구소개 - brackets

지금부터 수업에서 bracket을 사용하려고 합니다. bracket는 adobe에서 만든 오픈소스 에디터로 html, css 코딩을 하는데 최적화된 좋은 도구입니다. 하지만 이 도구는 코딩을 편리하게 해줄 뿐 우리수업의 내용과는 직접적인 연관은 없기 때문에 보셔도 좋고 안 보셔도 전혀 문제 되지 않습니다. 

http://brackets.io/

댓글

댓글 본문
작성자
비밀번호
  1. funlife
    비거님 감사합니다.
    덕분에 원도우에서 emmet 설치했습니다. ^^
    대화보기
    • funlife
      정말감사합니다.
    • yeoandante
      extract for braket이 사라져서 아쉽네요 :) 그래도 bracket 설명 감사합니다 ^^
    • 비거
      Extract for brackets는 http://blog.brackets.io......ew/ 에 들어가시면 서비스가 중단되었다고 공지가 되어있네요.. 참고하세요.
    • 비거
      emmet이 '설치에 실패했습니다. 알 수 없는 내부 에러'로 뜨면서 설치가 안되는 분들을 위해 답변해드리겠습니다.
      먼저 https://brackets-registry.aboutweb.com/ 사이트에 들어가셔서 Ctrl+F 찾기를 누르고 "emmet"을 찾아 "brackets-emmet-1.2.2"이라는 zip파일을 다운받습니다.
      다운 받은 zip 파일을 C:\Users\(사용자의 이름)\AppData\Roaming\Brackets\extensions\user에 압축을 풉니다. 압축을 풀면 제대로 된 폴더에 압축이 풀어졌는지 확인하기 위해 bracket 창 메뉴에서 도움말>확장 기능 폴더 열기를 누릅니다. 탐색창이 뜨면 user 폴더에 "brackets-emmet-1.2.2"폴더가 있으면 된겁니다.
      bracket을 종료한 후 다시 시작하시면 emmet이 설치되어 있을 겁니다.
      저도 이 문제를 겪었는데 영문 사이트 참고해서 알려드립니다.
    • matheios
      강의 감사합니다
    • matheios
      저도 초보 단계라서 확실한 답변이 될지는 모르겠지만 아는 범위에서 답변 드립니다.
      아마도 새파일로 파일 생성하시면 해당 파일이 어떠한 확장자를 가진 파일인지를 몰라서 emmet 기능이 작동을 안할 겁니다.
      ****.html 등과 같은 확장자로 파일을 저장하시고 탭키로 한 번 해보시면 되실 겁니다.
      답변이 되셨는지 모르겠네요...
      대화보기
      • Starter
        혹시 Windows10 때문일까요...
        저도 역시 '알 수 없는 내부에러' 라는 메세지로 설치가 되지 않습니다.
      • mj chang
        emmet 설치가 안될 때 어떻게 해야 하는지요?
      • 송기린
        확장기능을 설치하려하면 '설치에 실패했습니다. 알 수 없는 내부 에러' 뜨면서 설치가 전혀 안돼는데 해결 방법 아시는 분 계신가요? 다시 깔아봐도 똑같이 설치가 안됍니다.ㅠㅠ
      • 싱하
        강의 너무 감사합니다. 많은 사람들이 찾아봤으면 좋겠어요
      • egoing
        파일 저정을 하시고 해야합니다~
        대화보기
        • 임영재
          안녕하세요 새해는 복많이 받으시고 새해에는 회원님들의 뜻하시는 모든일들을
          꼭 이루시길 소원합니다.
          제는 브라켓에서 에밋을 설치했는데 새파일에서 html을 쓰고 탭키를 누르면 작동을 하지
          안네요 어찌된일인지 아시는 분 있으시면 가르쳐 주시면 감사하겠습니다.
          감사합니다.
        • 임영재
          paper 닉네임님께서 https://github.com......eb4이웹주소를 주셔서 이 주소로 가서 brackets 1.5버전
          다운로드 해서 설치하니 Extract for Brackets (Preview) 같이 설치가 되는데 사용하려고 아이디와 패스워드창이
          형성이 않되고 오류가 나네요
          더이상 사용을 못하게 하는것인지 궁금하네요
        • 이찬용
          저도그런데;;해결하셧나요>
          대화보기
          • egoing
            현재는 지원을 안하는 것 같더라구요
            대화보기
            • 삐꾸돼지
              이제 psd기능은 못쓰는건가요??? extract for braket인가 그게 아예 사라졌네요.
            • souLTrain
              라이브 프리뷰가 원인을 알지못하는 에러가 발생해서 중지된다는 메세지가 나오네요 ㅠㅠ
              이거 구글링해도 해결을 못하겠네요... ㅠㅠ
            • 수강생
              adobe@@@@.com/kr/creativecloud/extract.html
              해당 플러그인이 어도비에 정식으로 들어가서 포토샵과 드림위버외에 지원이 종료된것 같습니다
            • 주니꾸기
              추가로 밑에 이전버젼+extract번들 패키지 받는 방법 올려주셔서 다운 받고 플러그인 실행해 봤는데

              Extract for Brackets
              Extract for Brackets service is no longer available. If you wish to continue using Extract, download Adobe Dreamweaver CC:

              https://creative.adobe.com......ver

              기능 지원 종료되었네요..
            • 주니꾸기
              Update about Extract for Brackets (Preview)

              Some of you are familiar with the Extract for Brackets extension, a tool used to work with PSDs shared via Creative Cloud. As announced in this post on the Creative Cloud blog today, we are discontinuing the extension effective on June 28 due to low usage. Please note that any PSD files you’ve used with Extract will still be available to access or share within the Creative Cloud Assets service.

              To continue using Extract functionality, we suggest checking out the Extract panel in Dreamweaver CC. Thank you for your feedback and support during this process.

              출처: http://blog.brackets.io......ew/

              이거 보면 extract for brackets는 이제 지원하지 않는 것 같구요..(많이 사용 안 해서) 이 기능 계속 쓰고싶다면 Dreamweaver CC라는 프로그램을 이용해라는 뜻인 것 같습니다... 아쉽네요
            • 아..행복하다..정말 행복합니다!
            • 아, 저도 방금 들어가봐서 해봤더니 똑같은 문구가 뜨네요. 확인도 제대로 안하고 지레짐작 해결했다고 댓글 달아버렸네요ㅠㅠ
              대화보기
              • Extract for Brackets service is no longer available. If you wish to continue using Extract, download Adobe Dreamweaver CC:

                extract for bracket이 더이상 지원이 안돼나봐요 ㅠ...
                NAMO님 말씀처럼 다운그레이드 해서 사용이 가능하길래 써봤더니 adobe cc에서 open psd 파일 누르니까 저런 문구가 떠요 ㅠ
              • 이은혜
                extract for brackets 이제 지원 안하나봐요 ㅠㅠ
              • 강정우
                win10 / brackets 설치는 했구요. 진도 나가는 와중에 이젠 emmet도 사용하고 싶은데
                emmet 설치하려고 하면 '설치에 실패했습니다.알 수 없는 내부 에러'라고 뜹니다
                기존에 설치한 atom도 지우고, brackets 재설치도 두어번 해보고,
                수동설치파일 받아도 안되고 Node.js , npm 도 깔아봤는데 이것들은 사용법도 잘 모르겠구요
                구글링을 한참 해도 해결법을 정확하게 모르겠습니다 어떻게 해야 할까요 ㅠㅠ
              • 임지호
                님 덕에 겨우 깔았네요 감사합니다!
                대화보기
                • Kijin Roh
                  브라켓을 만나 정말 행복합니다. ^^
                • 폭스킴
                  extract for brackets (preview) 플러그인이 다른 이름으로 변경되거나 사라진 것 같은데,
                  이에 대해 자세한 조언 주실 수 있는 분~~~
                  AEM BRACKETS EXTENSION 이라는 게 있는데 혹시 이걸로 바뀐 건가요?
                • /로데

                  왜안뜨죠?

                  다시 천천히 emmet 입력해보세요. 저는 뜨네요
                  대화보기
                  • 로데
                    emmet 말고 다른 플러그인 설치법좀 알려주세요. 현재 검색해도 나오지 않네요
                  • skinplex
                    감사합니다
                    대화보기
                    • 저도 한참찾다 플러그인으로는 검색이 안됬었어요.
                      https://github.com......eb4
                      Extract와 묶여있는 파일로 다시 다운로드했더니 되네요
                      대화보기
                      • 오르빈도
                        안녕하세요 생활코딩를 보며 배우고 있는데요 brackets를 배워 보려는데
                        선생님의 패키지 검색에서 extract for brackets (preview) 이 패키지가 검색이 않되는데요
                        brackets를 잘 못 설치 한것인가요?
                        emmet은 설치가 되어 사용이 가능한데 위 패키지는 왜 검색이 않되는지
                        방벙이 있으면 가르쳐 주시면 감사하겠습니다.
                        않되다 보니 삽질을 많이 하게 되는군요
                        설명해 주신대로 에티터는 참 좋은 것 같습니다
                      • 권행신
                        오.. 포토샵을 이용해서 웹페이지를 만들 수도 있군요.
                        저는 머리속이나 구상도를 간단히 그리고 그것을 보면서 코드를 짜면서 만든다고 생각했었거든요.
                        근데 이 동영상에서 보면 꽤나, 구체적인 배치까지 포토샵을 이용해서 만든 후, 홈페이지를 제작하네요.

                        제가 잘 몰라서 그런데, 이러한 방식이 일반적인거에요?
                        예전 웹페이지 만들기 수업에서도 구상에 대한 설명을 하시며 여러 프로그램을 설명해주셨는데
                        포토샵이 아니더라도, 그런 프로그램들도 이렇게 디자인적인 측면을 짜놓고 코드를 옮기는 식으로 웹페이지가 제작되는건지.. 궁금해서 질문 올려봅니다. !
                      • 활화산
                        adobe 자료는 본인이 올려 놓은 것을 사용하는 것이죠? adobe cc 에 유료 가입 안한 사람은 이용할 수 없겠군요
                      • ㄴㅁㅇㄹ
                        진짜 좋네요 ㅋㅋㅋ 다만 ftp 서버와 연결이 불안정하다는 평이 많던데, 어찌됐건 브라켓은 초보자가 쓰기엔 아주아주아주 좋은 프로그램인것같아요.
                      • 정윤호
                        질문이 있습니다. 알려주신 브라켓 정말 유용하게 잘 쓰고 있는데요.

                        강의중 9:08 때 쯤에 나오는
                        emmet 설치 후에 사용하시는 기능중에;

                        html>head>ul>li*3 + tab

                        을 하면 들여쓰기 되어서 자동 완성이 되어야하는데. 안되는지 이유를 알 수가 없어서요.
                        브라켓하고 emmet 확장자를 삭제 후 재설치한다음에 해도 안되네요. ㅠ_ㅠ

                        위 문제 현상 해결 방법에 대해서 아시는 분 공유 부탁드립니다.
                        설정 변경이라든지.. 등등
                      • Hyunki Yu
                        아톰쓰다 넘어왔는데 Css 구현이 너무 편해 보이네요! 신세계!
                      • Chizcake
                        OSX El Capitan 사용자입니다.

                        Brackets의 Live Preview를 사용하다가 크롬의 개발자 도구를 사용하면 Live Preview가 종료되는 현상이 발생하네요. 이고잉님께서는 강의하실 때 Live Preview를 쓰시다가 개발자 도구를 사용하셔도 Live Preview가 종료되지 않던데, 혹시 추가적인 설정을 해줘야 하는건지 궁금합니다.

                        Live Preview 종료 현상에 대해서 알고 계신 분이 있다면 해결 방법에 대해서 공유해주시면 감사하겠습니다 :)
                      • 햇빛
                        12분쯤에 나오는 EXTRACT기능에서 이미지는 내가 미리 올려놓은것을 활용하는 거죠?
                        그부분에서 목소리가 살짝 안들려서요..
                      • 햇빛
                        멋있습니다..
                      • 해앵인
                        확장자를 html로 해보세요~ 저도 첨에 몰랐는데 바꾸니까 되더라구요..
                        대화보기
                        • 흓흓
                          Brackets 설치해서 조금 사용해봤는데 자동완성이 전혀 되지 않습니다. ㅠ.ㅠ

                          설정을 바꿔서 자동완성 실행되도록 할 수 있는 방법이 없을까요?
                        • 와...... 진짜 소름입니다.. ㅠㅠㅠㅠㅠㅠ 너무 좋습니다 감사합니다 ㅠㅠㅠ
                        버전 관리
                        egoing
                        현재 버전
                        선택 버전
                        graphittie 자세히 보기