본문 바로가기

728x90
반응형

웹언어/코딩에디터사용법

(9)
[이클립스] 이클립스 프로젝트 자동업데이트 되도록 처리 - 이클립스를 처음 설치하면 Project Explorer가 자동으로 업데이트되지 않아서 매번 [F5]눌러서 새로고침해야 합니다. - 그래서 자동으로 새로고침하는 법을 보겠습니다. 1. [window]메뉴 설정 가기 - [window]-[preferences]메뉴로 들어갑니다. 2. 자동 설정 체크하기 - [General]-[Work Space] 카테고리를 눌러 줍니다. - [Refresh using native hooks or polling]이 미체크되어 있다면 체크해줍니다.
[VS CODE] 도구설명힌트(마우스 오버시 뜨는 창) 없애는 법 - VS CODE를 쓰다보면 태그나 코드에 마우스를 올리면 자꾸 설명해주려고 뜨는 창이 있습니다. - 도움이 될 수도 있으나 잘못해서 클릭하면 계속 인터넷으로 연결되서 새창이 뜨고 짜증나는 측면이 있습니다. - 그래서 이번 강의에서는 VS CODE에서 도구설명힌트를 뜨지 않게 하는 법을 보도록 하겠습니다. 1. [F1]을 눌러 검색창을 꺼냅니다. 2. 검색창에 [setting]이라고 검색한 후 [Open Settings(UI)]를 클릭합니다. 3. 설정창에서 [editor.hover.enabled]를 검색하여 나오는 체크박스를 해제합니다. - 이렇게 해놓으면 이제 안뜹니다!
[VS CODE] FTP-Simple - 원격서버접속 플러그인 1. 확장플러그인 설치 - 확장플러그인에 가서 [ftp]라고 검색하면 처음에 나옵니다. 이것을 설치해주세요~ 2. [F1]을 눌러 ftp설정맞추기 - [F1]키를 누르면 검색창이 띱니다. 거기서 FTP라고 치면 위에 보이시는 것처럼 검색이 됩니다. - 그 중 [ftp-simple:Config - FTP connection setting]를 클릭합니다. 3. [ftp-simple-temp.json] 파일 변경 - 처음 접속한 화면입니다. - 주석으로 달아놓은 곳을 개인 호스트서버로 연결 - 위에 보이는 것처럼 작성해주시면 됩니다. 4. 서버에 있는 파일 열기 - [F1]키를 누르고 [ ftp-simple:Open - Open the file directly from FTP server]를 선택 - 위에 보..
[VS CODE] VS CODE의 외부 JS문서에서 제이쿼리 자동완성기능 추가 - html문서에 직접 제이쿼리 플러그인을 연결하고 제이쿼리언어를 치면 자동완성 기능이 실행됩니다. ## 예시 화면 - 하지만 외부 js문서를 빼고 작업하면 자동완성이 뜨지 않아 모두 코딩해야합니다. ## 예시화면 - 자동완성이 전혀 되지 않는 것을 확인할 수 있습니다. ** VS CODE 외부JS문서에서 제이쿼리 자동완성하는 법!!! 1. node.js를 설치 - Node.js를 사용하면 서버에서 JavaScript를 실행할 수 있다. ## 다운로드 주소 https://nodejs.org/ko/ Node.js Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine. nodejs.org ## 버전 선택 - 다운로드 받은 파일을 설치..
[Brackets] 브라켓 플러그인 - Brackets Synapse - Brackets Synapse : 서버에 바로 접속해서 파일의 코드를 수정할 수 있도록 해주는 플러그인 1. 설치 - 플러그인 설치 아이콘을 누릅니다. - 검색에 [brackets synapse]라고 검색한 후 [설치]버튼을 누릅니다. - 설치가 다 되면 [설치에 성공했습니다]라는 경고창이 뜹니다. - 그러면 [닫기]버튼을 눌러줍니다. 2. 서버 설정 - 설치가 다 되면 [플러그인설치]아이콘 아래에 [S]자로 되어 있는 [synapse]아이콘이 있습니다. - 그 아이콘을 클릭해주세요. - 버튼을 누르고 나면 Synapse의 [Server List]가 보입니다. - 혹시 위에 보이는 아이콘이 잘 안보이면 검은 라인을 늘려줍니다. - 위의 영상처럼 왔다갔다 하면 아이콘이 다 보일겁니다. - [+]버튼을 ..
[VS CODE] Reactjs Code Snippets ## Reactjs Code Snippets의 단축키 단축키 설명 rcc 클래스 컴포넌트 생성 rrc 클래스 컴포넌트와 react-redux 리덕스를 연결해서 생성 rccp 클래스 컴포넌트와 prop type들을 클래스 뒤에 생성 rcjc import와 export없이 클래스컴포넌트 생성 rcfc 클래스 컴포넌트와 모든 라이프사이클 메서드를 포함해서 생성 rwwd import없이 클래스 컴포넌트 생성 rsc 화살표함수형 컴포넌트 생성 rsf 함수형 컴포넌트를 생성 rsc 화살표함수형에 props를 내려서 생성 ## JS파일에서 단축키 사용
[VS CODE] Live Sass Compiler ** 영상으로 보고 싶은 분은 아래 주소를 클릭하세요 https://youtu.be/LhokSBByMek 1. 설치하기 - SASS 컴파일을 자동으로 해주는 플러그인 - [SASS Lint]도 같이 설치하면 SASS문법을 쉽게 코딩할 수 있다. ** 최근에(2022년) [Sass Lint]는 지워진듯합니다. 위의 [Sass]를 깔아도 자동완성이 되니 설치해보세요. 2. [Watch SASS] - [Live Sass Compiler]를 설치하면 하단 상태표시줄에 [Watch Sass]버튼이 생성 - [test.scss]에서 구문을 작성 후 [Watch Sass]를 누르면 [test.css]가 바로 생성 1) 자동생성해보기 # HTML코드 제목태그 # SCSS코드 $mainColor: red; h1{ col..
[VS CODE] 설치 및 확장플러그인 ** 영상으로 보고 싶으신 분은 아래 링크를 클릭해주세요. https://www.youtube.com/watch?v=6on6YoXJWiA&t=242s 1. 설치하기 - Visual Studio Code(VS code)는 MS사의 오픈소스 기반의 크로스 플랫폼이다. - 다양한 개발언어를 지원하고, extension을 통해 쉽게 설치, 삭제가 가능하다. - 아래 주소에 가서 다운 받는다. https://code.visualstudio.com/ Visual Studio Code - Code Editing. Redefined Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and clo..

728x90
반응형