본문 바로가기

DevOps45

[Eclipse] 자동 줄바꿈 설정, Toggle Word Wrap 이클립스에서 web.xml을 편집하다가 자동 줄바꿈 설정이 되어 있지 않아서 보기에 불편함을 느꼈습니다. 편집기에서 자동 줄바꿈 설정이 있을 것으로 검색해봤는데 의외의 곳에 숨겨져 있었습니다. 1. Toggle Word Wrap 이클립스에서 자동 줄바꿈 기능은 토글 기능으로 메뉴에서 On/Off 가 가능하도록 만들어졌습니다. 메뉴는 [ Windows > Editor > Toggle Word Wrap ]입니다. 단축키는 Alt + Shift + Y 로 누를 때마다 On/Off 상태로 번갈아 가며 바뀝니다. 1.1 Word Wrap : OFF 1.2 Word Wrap : ON 2. width guide line 설정 Word Warp 기능은 찾았는데 원하는 폭을 설정할 수 있는 기능을 찾아봤습니다만 찾을 수.. 2022. 5. 24.
[Eclipse] 이클립스 SE Version을 이클립스 EE Version 업그레이드 하기 이클립스는 통합 개발 환경으로 다양한 종류의 개발 환경을 지원합니다. 이 덕분에 많은 버전과 패키지가 있습니다. 기본적인 Java 개발은 이클립스 SE (Standard Edition) Version을 설치하여 사용할 수 있습니다. 그러나 JSP와 같은 웹 애플리케이션을 개발하려면 이클립스 EE (Enterprise Edition)으로 업그레이드해야 합니다. 간단하게 SE Version을 삭제하고 새로 다운로드하는 방법도 있습니다만 여기서는 SE Version을 EE Version으로 업그레이드하는 방법을 설명하겠습니다. 1. 설치 화면 접근 Help > Install New Software... 메뉴 선택 2. 업그레이드 항목 선택 위 화면에서 콤보 박스를 클릭하여 SE Version의 패키지를 선택합.. 2022. 5. 21.
[Eclipse] 이클립스 사용자정의 코드 자동완성 Templates, Snippet 추가 및 사용 에밋(Emmet)을 사용하면서부터는 반복적인 코드를 입력하는 것이 얼마나 불편한 일인지 깨달았습니다. Emmet도 Snippet이 있지만 이클립스에서 Templates 기능으로 반복적인 코드를 약어를 등록하여 간편하게 입력하도록 할 수 있습니다. 1. 사용자 정의 Templates 등록 1.1 Preferences 창 열고 Templates 항목 찾기 Windows > Preferences 메뉴를 선택하여 Preferences 창의 띄웁니다. 창의 검색 란에 'snip'를 입력하여 Templates 항목들을 조회합니다. 저는 Emmet을 설치하여 Snippets 항목도 함께 조회가 되네요. Templates 항목을 입력하면 다른 형태로 보이지만 Java > Editor > Templates 항목을 찾을 .. 2022. 5. 19.
[Emmet] Emmet #2 약어 문법, Abbreviations Syntax Emmet #1 시작하기 1. Abbreviation : 약어 앞서 Emmet에 대해 간단히 살펴봤습니다. 이번에는 Emmet의 핵심이라 할 수 있는 약어(Abbreviation)와 약어를 사용하는 문법입니다. Emmet의 문법을 따른 표현식은 바로바로 분석되어 구조화된 코드 블록(HTML, CSS 등)으로 변환됩니다. 다음은 약어입니다. #page>div.logo+ul#navigation>li*5>a{Item $} 이 약어는 단축키(Tab, Ctrl + E)를 입력하면 아래와 같이 코드를 생성해 줍니다. Item 1 Item 2 Item 3 Item 4 Item 5 약어는 HTML과 XML 생성에 최적화되어 있지만 다른 Markup 및 CSS를 쉽고 편리하게 작성할 수 있도록 도와줍니다. 약어와 더불어.. 2022. 5. 18.
[Eclipse] 이클립스에서 Tomcat 서버 설정하기 웹 애플리케이션 개발을 위해서는 WAS가 필요하고 가장 잘 알려진 WAS 가운데 하나가 Tomcat입니다. 먼저 Tomcat을 설치하고 나면 개발환경인 이클립스에서 Tomcat 서버를 설정해서 연동하여 편리하게 사용할 수 있습니다. 만약 Tomcat이 설치되어 있지 않다면 아래의 링크에서 설치 방법을 확인하고 설치 후 아래 작업을 진행하면 됩니다. Tomcat 9.0.xx 설치 1. Eclipse에서 Tomcat Server 설정하기 1.1 Servers 창 띄우기 Eclipse 메뉴에서 Windows > Show View 창을 엽니다. Window > Show View > Other... Bookmarks ~ Task List 사이에 Servers 항목이 목록에 나와있다면 Servers 항목을 선택합니.. 2022. 5. 17.
[WAS] Tomcat 9.0.xx 설치 Tomcat의 현재(2022.5.16) 일자 기준으로 최신 버전은 10.0.20입니다. alpah 버전인 10.1.0-M14은 아직은 안정화 전이니 특별한 사유가 없는 한 굳이 선택할 이유가 없습니다. 저는 안정화를 생각해서 최신 버전보다 낮은 9.0.62 버전을 선택하여 설치하였습니다. Tomcat 버전의 선택에 대해서 궁금하시면 이 포스팅을 참고해주시면 됩니다. Tomcat 버전 별 요구사항 1. Tomcat 9.0.xx 다운로드 https://tomcat.apache.org/download-90.cgi 위의 페이지에 접속해서 스크롤 다운하면 Windows Service Installer 버전을 다운로드할 수 있습니다. 이름 그대로 Windows의 서비스에 등록하여 Tomcat 서버 실행을 관리할 수.. 2022. 5. 17.
[WAS] Tomcat 버전 별 요구사항 웹 애플리케이션 개발 환경을 구축하기 위해서는 JDK, WAS (Web Application Server), 개발용 IDE (Integrated Development Environment)의 3가지가 필요합니다. WAS는 데이터베이스에 저장된 다양한 정보를 조회하여 동적으로 제공하기 위한 서버 애플리케이션 프로그램입니다. WAS는 WebLogic(BEA사), WebSphere(IBM사), iPlanet(SUN사), 9iAS(Oracle사), Jeus(티맥스), Tomcat(Apache) 등이 있습니다. 다른 WAS와 달리 Tomcat은 무료 WAS로 간단한 서비스나 개발자의 로컬 개발환경을 구축하기에 보다 용이합니다. Tomcat은 역사가 오래되었으며 Java와 함께 진화하면서 Java 버전에 따른 요구.. 2022. 5. 16.
[Emmet] Emmet #1 시작하기 처음 Emmet을 접하게 된 것은 최근에 사용하기 시작한 Visual Studio Code 였습니다. 간단한 문법부터 사용하기 시작했으며, HTML과 CSS 코딩의 힘들고 지루한 작업들을 보다 빠르게 하기 위한 도구로서 최적이었습니다. 그래서 조금 더 알아보기 위해 홈페이지를 방문하고 나서는 보다 정확한 이해를 위해서 문서화하기로 마음먹고 이 시리즈를 시작했습니다. 기본적으로는 Emmet의 문서화 내용들을 정리하는 것을 방향으로 삼았으며, 가능한 짧고 간결하게 핵심만 정리해서 찾아보기에 좀 더 편한 것으로 만들어 봤습니다. 1. Emmet(에밋) 이란? Emmet(에밋)은 HTML과 CSS 등의 문서를 편집할 때 보다 빠르게 작업할 수 있도록 도와주는 텍스트 편집기용 플러그인입니다. 원래는 Zen Cod.. 2022. 5. 15.
[VSC] 선택영역 태그로 감싸기, 선택한 코드 Emmet 약어로 Wrap 하기 VSCode, Visual Studio Code로 HTML 코드를 작업하다 보면 코드 블록을 태그로 감싸야하는 경우가 종종 생깁니다. 일반 텍스트 문장 가운데 일부를 스타일을 변경하거나, 어떤 블록을 태그 등으로 묶어야 하는 경우가 있습니다. 비주얼 스튜디오 코드에서 Emmet을 설치한 경우 이 기능을 지원하고 있습니다만, 단축키가 꺼진 채로 설치가 됩니다. 단축키를 설정하고, 이 기능을 사용하면, 좀 더 편리하게 HTML을 편집할 수 있습니다. 1. 선택영역 태그로 감싸기( Emmet 약어로 래핑 ) 기능 확인 1.1 모든 명령어 보기 기능 확인 기능을 찾기 위해서 VSCode의 모든 명령어 보기 기능을 사용합니다. Ctrl + Shift + P 키를 누르면 확인할 수 있습니다. 1.2 블록 선택 선택.. 2022. 5. 12.
[VSC] VSCode : HTML 자동 완성 만들기, HTML 사용자 코드 조각 추가 및 삭제 VSCode에서 HTML을 작성하면서 가장 만족하면서 사용하고 있는 기능 가운데 하나가 코드 자동완성 기능입니다. 타이핑 시에도 많은 도움을 주지만 시작하면서 기본적인 HTML 코드 블록을 만드는 것도 귀찮은 일 가운데 하나인데 기본 기능으로 지원하고 있습니다. 그런데 자동완성 기능 가운데서 기본 코드 입력 시 계속 수정을 해야 하는 부분이 있습니다. HTML 파일을 생성하고 처음 입력 시 ! 키를 누르고 Tab 키를 누르면, 위와 같은 HTML 자동 완성 내역을 볼 수 있습니다. 기본적인 요건은 만족하는데 매번 빨간색으로 표시한 한글 부분과 viewport 부분은 HTML 샘플 작성이나 연습에는 굳이 필요하지 않은 부분입니다. 그래서 사용자 정의 기능을 사용하여 lang="en"부분과 viewport .. 2022. 5. 10.

티스토리툴바