피곤핑
코딩일탈
피곤핑
전체 방문자
오늘
어제
  • 분류 전체보기
    • Kotlin & Java
    • Spring
      • Spring Security
      • Spring
    • 네트워크
    • JavaScript & Node js
    • Docker
    • Python3
    • Unity
    • 딥러닝
    • 객체지향프로그래밍
    • Error 보고서
    • 나의 이야기 & 회고
    • HTML & CSS
    • Archive
    • 독서

블로그 메뉴

  • 홈
  • 방명록

공지사항

인기 글

태그

  • nodejs
  • 코딩테스트준비
  • 오블완
  • 항해99
  • 99클럽
  • JavaScript
  • Client
  • 개발자취업
  • 티스토리챌린지
  • TiL

최근 댓글

hELLO · Designed By 정상우.
피곤핑

코딩일탈

[Sublime Text] 설치하고 FTP 연결하기 (mac)
HTML & CSS

[Sublime Text] 설치하고 FTP 연결하기 (mac)

2020. 8. 26. 23:12

- 설치하러 가기

https://www.sublimetext.com/

 

Sublime Text - A sophisticated text editor for code, markup and prose

Goto Anything Use Goto Anything to open files with only a few keystrokes, and instantly jump to symbols, lines or words. Triggered with Ctrl+P⌘+P, it is possible to: Type part of a file name to open it. Type @ to jump to symbols, # to search within the f

www.sublimetext.com

 

1. 위의 링크를 통해서 설치한다

2. 처음에 키게 되면 아무것도 뜨지 않을텐데

https://packagecontrol.io/installation

 

Installation - Package Control

Installation Use one of the following methods to install Package Control: Command Palette Open the command palette Win/Linux: ctrl+shift+p, Mac: cmd+shift+p Type Install Package Control, press enter This will download the latest version of Package Control

packagecontrol.io

이곳에서 Package control 을 설치한다. 

방법은 그냥 쉽다. 나는 아래의 이미지 대로 따라했다!

 

3. 여러가지 필요한 패키지들을 설치한다.

(맥북의 경우, command + shift + p 를 통해서 설치 할 수 있음.)

내가 설치한 패키지들 

 

4. 원하는 디렉토리 목록을 구성한다.

원하는 경로에 디렉토리를 생성하고 SublimeText 창으로 드래그 하면 된다!

 

5. FTP를 연결한다.

드래그한 디렉토리에서 마우스 우클릭을하고 Map to Remote... 를 누르면 

아래와 같은 config.json 파일이 나온다.

- 첫번째 빨간 박스는 ftp 로 바꿔주고

- 두번째 빨간 박스의 host, user, password, port 의 네가지 정보를 입력해준다.

- 세번째 빨간 박스는 주석을 풀어주고 각 777로 모든 권한을 준다.

 

6. 다시 디렉토리에 우클릭하여 FTP 메뉴바에 보면 Download Folder 라는 것이 활성화 되어 있을 텐데 이것을 누른다!

(아! 그전에 꼭 꼭 꼭 저장 (crtl+s) 를 해야한다! 이걸 안했다가 다운로드를 못하는 현상이...)

잘 다운받아지고 있다면 위와 같이 success 가 모두 뜬다.

 

7. 이제 sublimetext 에서 코드를 수정하고 서버에 올리도록 하자!

 

* bracket 과 sublimetext 의 차이점!

bracket은 추가적인 소스들을 직접 서버에 올려야 하지만 sublimetext는 서버에서 다운받은 소스를 local 에서 수정 후 다시 서버에 올릴 수가 있음!

'HTML & CSS' 카테고리의 다른 글

[HTML5] 반응형 사이트 만들기 - 미디어쿼리  (0) 2020.08.25
[HTML, CSS] 게시판의 두 줄을 한줄로 바꾸는 효과  (1) 2020.08.19
[HTML, CSS] overflow: hidden;  (1) 2020.08.19
[HTML, CSS] 헤더 아이콘 수정 2 (이미지 스프라이트)  (0) 2020.08.18
[HTML, CSS] 웹 폰트 초기 세팅  (0) 2020.08.18
    'HTML & CSS' 카테고리의 다른 글
    • [HTML5] 반응형 사이트 만들기 - 미디어쿼리
    • [HTML, CSS] 게시판의 두 줄을 한줄로 바꾸는 효과
    • [HTML, CSS] overflow: hidden;
    • [HTML, CSS] 헤더 아이콘 수정 2 (이미지 스프라이트)
    피곤핑
    피곤핑

    티스토리툴바