2016년 8월 31일 수요일

스프링(Spring) 개발하기 - (3) 개발환경 플러그인 설치 STS / Git

1. STS 플러그인 설치


1-1. 상단 Help > Eclipse Marketplace를 선택한다.

1-2. Marketplace에서 STS를 검색한다.

1-3. Spring Tool Suite for Eclipse 를 선택하고 Install버튼을 클릭한다.



1-4. 설치항목 선택후 Confirm 버튼을 클릭한다.


1.5. 동의버튼 선택후 Finish 버튼을 클릭한다.


1-6. 설치가 진행된다.


1-7. 설치가 완료되면 재시작 할거냐고 물어본다 Yes 버튼을 클릭한다.


1-8. STS 정상적인 설치여부 확인을 위해 상단 File > New > Others 선택후 spring이 있는지 확인한다.


2. Git 설치


2-1. 상단 Help > Eclipse Marketplace를 선택한다.

2-2. Marketplace에서 Egit를 검색한다.

2-3. Egit - Git Team Provider 을 Install 한다.


2-4. Git 정상적인 설치여부 확인을 위해 상단 Windows > Open Perspective > Other 선택하고 Git 선택후 OK버튼을 클릭한다.


2-5. Git 선택 박스가 추가된다.



3. 이클립스 Perspective 및 하단 View 설정


3-1. 오른쪽 상단에 있는 Open Perspective 버튼을 클릭한다.



3-2. Git 하고 Team Synchronizing를 추가한다.


3-3. 상단 Windows > Open View 선택후 많이 사용하는 Console, Progress, Search 를 추가한다.





Share:

스프링(Spring) 개발하기 - (2) 개발환경 Tomcat / Maven 설정

1. Tomcat 설정


1-1. 상단 Window > Preferences 선택한다.

1-2. Server > Runtime Environment 선택한다.

1-3. Add.. 버튼을 클릭한다.

1-4. Apache tomcat 버전 선택하고 Next > 버튼을 클릭한다.

1-5. Tomcat directory 는 develop 안에 있는 C:\develop\Tomcat 7.0 선택한다.


1-6. 목록 확인후 OK버튼을 클릭한다.


1-7. View Tab에 있는 Servers를 선택한다. ( 없으면 상단 Window - Show View 에서 Server 선택)

1-8. No Servers are available. Click this link to create a new server 클릭한다.


1-9. Tomcat v7.0 Server 선택후 Nexr> 버튼을 클릭하고  Finish 버튼을 클릭한다.

1-10. 서버를 선택하고 ▷ 버튼 ( 또는 단축키 Ctrl + Alt + R 또는 우클릭 Start ) 을 클릭한다.



1-11. console에 다음과 같이 나오면 성공




2.1 Maven Repository 변경 ( 라이브러리가 다운받아지는 곳 )


2-1. C:\develop\apache-maven-3.3.9\conf 폴더로 이동하여 settings.xml 파일을 연다.

2-2. develop 폴더에서 관리할 예정이니 C:\develop\apache-maven-3.3.9 폴더로 이동  repository 폴더를 생성한다.



2-3. Settings.xml 에서 <localRepository>/path/to/local/repo</localRepository> 부분을 찾 아서 주석을 해제하고 경로를 C:\develop\apache-maven-3.3.9\repository 로 변경해 주고 저장한다.




2.2 이클립스에서 Maven 설정 


2-1. 상단 Window > Preference를 선택한다.

2-2. Maven > User Setting를 선택한다.

2-3. User Settings에서 Browse 버튼을 클릭후 C:\develop\apache-maven-3.3.9\conf\settings.xml를 선택후 OK버튼을 클릭한다.


3. 추후 형상관리를 위해 컴파일 결과가 있는 target폴더 제외


3-1. 상단 Window > Preferences를 선택한다.

3-2. Team > Ignored Resources를 선택한다.

3-3. Add Pattern 버튼을 선택한다.

3-4. */target/* 를 추가하고 OK버튼을 클릭한다..


3-5. OK버튼을 클릭한다.





Share:

2016년 8월 29일 월요일

스프링(Spring) 개발하기 - (1) 개발환경 다운로드 및 Eclipse 설정

0. 개발환경 버전


IED : Eclipse Neon

JDK : jdk-8u101

Tomcat : Tomcat 7.0

Maven : Maven 3.3.9

1. 개발환경 다운로드


1.1 Eclipse 다운
www.eclipse.org 접속후 Java EE 버전 다운로드

1.2 JDK 다운로드
http://www.oracle.com/technetwork/java/javase/downloads/index.html
접속후 SE 버전 다운로드

1.3 Tomcat 다운로드
http://tomcat.apache.org/ 접속후 다운로드

1.4 Maven 다운로드
http://maven.apache.org/ 접속후 Binary zip archive 다운로드

2. 개발 환경 구성


2.1 폴더 구성
C드라이브 develop 폴더 생성후 다운로드한 폴더를 넣는다. 폴더안에 workspace 폴더도 만들어준다.

JDK는 실행하여 설치한다. 설치하면 C:\Program Files\Java\jdk1.8.0_101 폴더가 생긴다.
설치한 jdk 폴더를 복사하여 develop 폴더에 넣어준다.


2.2 경로 설정
eclipse 폴더에 있는 eclipse.ini 실행한다.

설정 참고 : http://lalwr.blogspot.kr/2017/03/eclipse-ini.html

1. JDK 경로를 추가한다. ( vmargs 옵션 위쪽에 추가해야 한다. )
-vm
C:\develop\jdk1.8.0_101\bin\javaw.exe
※ Exclipse Neon버전을 사용시 JDK 1.8이상버전을 사용해야 한다.
(이클립스 실행시 error 발생시 -vmargs 삭제 해볼것 )

2. -vmargs 설정을 수정한다.  ( RAM이 8G 이상인 경우만 2048로 한다. 4G는 1024)
-Xms1024, -Xmx2048 로 수정한다.


eclipse.ini 저장하고 C:\develop\eclipse 에 있는 eclipse.exe를 실행한다.
설정이 제대로 되었다면 아래 그림과 같은 창이 뜰것이다.


workspace를  C:\develop\workspace 수정하고 이 폴더를 계속 사용할려면 Use this as the default and do not ask again 를 체크해준다.

다음 그림과 같은 창이 뜬다면 기본 환경은 완료.



3. 개발환경 UTF-8 설정


3-1. 상단 Window > Preferences 을 선택한다.

3-2. 다음 목록 encoding을 UTF-8로 설정한다.
  • General >Workspace
  • General >Editors > Spelling
  • Web > CSS Files
  • Web > HTML Files
  • Web > JSP Files
  • Web > XML Files








Share:

2016년 8월 4일 목요일

sublimetext 단축키 및 플러그인

- 기본단축키

Editing
- Ctrl+A 전체선택
- Ctrl+O 열기
- Ctrl+S 저장하기
- Ctrl+C 복사하기
- Ctrl+V 붙여넣기
- Ctrl+F Text 검색
- Ctrl+Z 이전작업으로가기
- Ctrl+Y 다음작업으로가기
- Ctrl+D 동일 단어 선택기능 (한단어를 선택한 뒤 Ctrl+D를 한번 누를 때 마다 다음 동일 단어를 추가로 선택합니다)
- Ctrl+Shift+F 동일 폴더 내에서 단어나 문장을 찾아줍니다.
- Ctrl+G 원하는 행으로 바로 이동해주며
- Ctrl+P 폴더트리 살펴보지 않고 원하는 파일을 바로 열 수 있도록 해줍니다. ( @ 입력 후 검색시 : 클래스, 메소드 검색, # 입력 후 검색시 : 텍스트 검색, : 입력 후 (숫자)검색시 : 라인 검색 )
- Ctrl+[ 행 들여쓰기 (Mac : CMD+[ )
- Ctrl+] 내어쓰기(Mac : CMD+] )
- Ctrl+h : 단어를 찾아서 바꾸기
- Ctrl+SHIFT+[ 코드블럭 접기 (Mac : CMD+OPT+[ )
- Ctrl+SHIFT+] 코드블럭 펴기 (Mac : CMD+OPT+] )
- Ctrl+SHIFT+K 행을 삭제합니다.
- Ctrl+ENTER 다음행에 입력할 수 있는 공간을 만들어줍니다.
- Ctrl+SHIFT+ENTER 이전행에 입력할 수 있는 공간을 만들어줍니다.
- Ctrl+SHIFT+UP,Ctrl+SHIFT+DOWN 해당 행을 그 윗행이나 아랫행으로 자리를 옮깁니다. 만약 영역을 설정하면 영역에 포함된 모든 행의 위치를 옮깁니다. (Mac : CMD+SHIFT+UP, CMD+SHIFT+DOWN)
- Ctrl+L 커서가 위치한 행을 선택합니다.
- Ctrl+D 커서가 위치한 부분의 단어를 선택합니다. 반복해서 누를 경우 그 다음에 나오는 동일단어를 찾아서 선택합니다.
- Ctrl+KK 커서위치부터 행끝까지 삭제
- Ctrl+K+DEL행시작부터 커서위치까지 삭제
- Ctrl+SHIFT+D 현재 행 복사하여 붙여넣기, 영역을 설정하면 설정 된 영역만 복사하여 붙여넣기 (Ctrl+C 후 Ctrl+V와 같습니다.)
- Ctrl+J 다음행을 같은 행으로 당긴 뒤 당겨온 행의 처음으로 커서 이동
- Ctrl+ / 현재 행 주석처리, 반복하면 주석처리 취소, 영역 선택시에는 선택한 부분만 주석처리
- Ctrl+SHIFT+/ 현재위치에 주석넣을 블록 생김
- Ctrl+Z, Ctrl+U 이전작업으로 돌아가기
- Ctrl+Y 다음작업으로 돌아가기, 돌아갈 작업이 없을 경우 가장 마지막으로 했던 작업을 함
- Ctrl+KU 해당단어 모두 대문자로
- Ctrl+KL 해당단어 모두 소문자로
- Ctrl + DEL(Backspace) 단어단위 삭제
- SHFT + DEL(BackSpace) 현재커서가 있는 줄 삭제

Navigation/Goto Anywhere
- Ctrl+P 열려있는 폴더내의 파일을 빨리 찾아 열 수 있다. (Ctrl+P 후 @를 달아주면 Ctrl+R과 같다.#를 달아주면 Ctrl+ ; 과 같다. :를 달아주면 Ctrl+G과 같다.) (Mac : CMD+P)
- Ctrl+R 파일내의 css 선택자나 id를 찾아 이동한다.
- Ctrl+ ; 파일내의 단어를 찾아 이동한다.
- Ctrl+G 파일내의 행을 찾아 이동한다.

General 
- Ctrl+SHIFT+P 명령어 목록을 보여줌-command prompt (Mac : CMD+SHIFT+P)
- Ctrl+KB 사이드바를 숨겼다 꺼냈다 한다

Find/Replace 
- Ctrl+F 해당 문서에서 단어 찾기
- Ctrl+H 교체  (Mac : CMD+OPT+F)
- Ctrl+SHIFT+F 전체 파일에서 단어가 포함 된 파일 찾기 (Mac : CMD+SHIFT+F)

Tabs 
- Ctrl+SHIFT+t 가장 최근에 닫은 문서(탭)열기
- Ctrl+PgDn,Ctrl+PgUp 여러 창이 열려있는 경우, 다음창으로 이동 (이동순서는 두 버튼이 반대로 실행됨)
- Ctrl+RIGHT, Ctrl+LEFT 해당위치에서 다음(이전)단어로 이동
- Ctrl+SHIFT + ,  태그 닫기와 열기

Split window
- Alt+SHIFT+2~4 숫자 개수만큼 창 분할하기(세로 분할)
- Alt+SHIFT+1 1개의 창으로 보여지기
- Alt+SHIFT+5 2행 2열 4개의 창으로 분할하기
- Ctrl+[1,2,3,4] 여러창으로 보인 상태에서 해당 번호의 창으로 커서이동
- Ctrl+SHIFT+[1,2,3,4] 여러창으로 보인 상태에서 해당 번호의 창으로 현재창을 이동

Etc
- F11  전체화면모드
- Only Mac
- Ctrl+M 현재 코드의 닫는 괄호로 이동, 반복시 여는 괄호로 이동
- Ctrl+SHIFT+M현재 괄호의 모든 내용을 선택(중괄호, 대괄호, 괄호)
- CMD+SHIFT+V복사한 단어나 문장을 붙일 때 들여쓰기를 같이 한다.

- 플러그인(plugin)


1. Aligment

단축키 :  원하는 부분을 블럭을 잡고 Ctrl+Shift+a

- 구분자 설정 setting - default 에서 alignment_chars 수정

2. AdvancedNewFile

단축키 :  ctrl+alt+n

ex ) css/style.css 입력하면 css폴더에 style.css 파일 생성.

3. AutoBackups

자동백업기능

4. DocBlockr

단축키 : /** 입력 후 Enter

- 자동으로 주석으로 달아준다.

5. SublimeCodeIntel

단축키 : 변수명에 대고 ALT+Click 또는 CTRL+F3 을 누르면 변수가 지정되어 있는 파일로 자동으로 이동해 준다.

- 웹 에서 쓰이는 대부분의 언어(JavaScript, Mason, XBL, XUL, RHTML, SCSS, Python, HTML, Ruby, Python3, XML, Sass, XSLT, Django, HTML5, Perl, CSS, Twig, Less, Smarty, Node.js, Tcl, TemplateToolkit, PHP)에 대해서 변수를 찾아주는 기능을 한다.

6. Sublime Linter

단축키 :
- ctrl+alt+ l : 에러 개수를 팝업으로 알려줌
- ctrl+alt+ e : 커서에서 아래쪽 방향으로 에러가 발생한 지점으로 이동
- ctrl+alt+ shift + e : 커서에서 위쪽 방향으로 에러가 발생한 지점으로 이동
- Preferences > Package Setting > SublimeLinter > Key Bindings - Default에서 단축키를 변경할 수 있다.

- Node.js를 필수 설치
- 링크 : http://www.sublimelinter.com/en/latest/
- Python, javascript, css, ruby, c/c++, coffeescript, git, haml, html, java, lua, objective-j, perl, php, puppet, xml 코드에 오류가 있을 경우 알려준다.

7. ConvertToUTF8

- link : https://github.com/seanliang/ConvertToUTF8
- 한글이 안깨지도록 도와준다

8. HTML-CSS-JS Prettify 

단축키 : Ctrl + Shift + H

- 자동으로 줄을 정렬시켜주는 Package 입니다.
- Node.js를 필수 설치
- 패키지 세팅 : 들여쓰기 Size 설정(Preferences - Package Settings - HTML/CSS/JS Prettify - set Prettify Preferences ) → indent_size 의 값 조절

9. Bracket Highlighter

- link : https://github.com/facelessuser/BracketHighlighter
{},[],<>,"",'',() 와 같이 열리고 닫히는 기호가 쌍으로 존재해야 하는 코드를 하이라이트 처리해주는 확장 기능이다.
아래처럼 하이라이트 된다.

10. IMESupport

- 한글입력할때 텍스트창에서 입력값을 보여준다

11. preview

단축키 : F12

- 작업 중이던 문서를 미리 웹브라우저 보여준다.




Share:

2016년 8월 2일 화요일

a 태그에서 onclick return false를 사용하는 이유

a 태그에서 href="#" 를 사용 할시 페이지 상단으로 위치가 이동한다.

하지만
function aa(){
   return false;
}
<a href="#" onclick = "aa(); return false;" />

onclick 에서 return false; 를 사용하면 기본 속성을 무시하고 페이지가 이동하지 않는다.

1. <a href="#" onclick = "aa(); return false;" />
2. <a href="#" onclick = "return aa();"  />

1번과 2번 소스 2개다 페이지가 이동하지 않는다.


Share:

phpmyadmin 에서 excel import 하는법

★ 데이터 작성법
1. 양식 excel 에 데이터를 넣는다.
( 해당 DB내보내기 에서 excel 다운받는다. )
2. 다른이름으로 저장을 선택해 csv 로 선택한다.
3. 다른이름으로 저장한 파일을 메모장으로 열어서 첫줄은 지우고 다른이름으로 저장 선택후 저장 버튼 왼쪽에 있는 인코딩을 UTF-8로 저장후 저장한다.


★데이터 넣는법
1. 브라우저 켠후 주소 pypmyadmin 주소 입력
2. 로그인 접속후
3. 해당 DB에서 상단 Import 클릭
4. 파일선택후 파일 첨부 ( csv로 저장한 파일 )
5. 하단 CSV using LOAD DATA 선택
6. 필드 구분자 , 입력  //  열(칼럼) 이름에
메모장에서 삭제한 첫줄 입력
7. 실행 버튼 클릭






Share: