코딩레시피

이전 두 개의 글을 통해서 Organization을 만들고 repository를 만들고 clone하는 내용을 소개해 드렸습니다. 

이번 글에서는 팀장 및 팀원이 각자의 코드를 작성하고 github에 공유하는 방법에 대한 내용을 소개하려고 합니다. 

꼭 기억할 부분은 팀장이든 팀원이든 절대 main(또는 master) branch에서 작업을 하지 않아야 한다는 겁니다. 반드시 기능 개발할 때 branch를 새로 만들고 push를 하고 팀장은 해당 branch를 main으로 합치고 다시 pull을 받아 진행하는 방법이 가장 무난하다고 볼 수 있습니다. 주요 단계를 요약하자면 다음과 같습니다. 

1. 팀원들은 각자의 로컬에서 branch를 만들어서 작업

2. 기능개발이 완료되면 해당 branch를 push 

3. github에서 pull request 작성하고 팀장에게 알림 

4. 팀장은 해당 commit의 충돌 문제는 없는지 확인한 뒤 pull request 수행하여 main branch에 코드 병합 

5. push를 완료한 팀원만 pull 수행하여 main branch 최신화

(push를 하지 않은 팀원은 main branch가 최신화 됐다고 하여 pull 할 필요가 없습니다. 여기서 pull 하면 열심히 작성한 코드 good bye..)

6. pull이 문제없이 진행된 팀원은 새로운 branch 만들어서 개발 진행 

1~5번 작업이 계속 반복 됩니다. 

팀원이 본인의 로컬에서 회원 기능을 개발한다고 하겠습니다. 

코드 개발 전 branch를 추가합니다. 

branch는 하단의 Git 탭에서 main 에서 우클릭 후 New Branch from 'main'을 클릭합니다.

branch이름을 자유롭게 작성합니다. Checkout branch를 체크해 놓으면 자동으로 branch를 생성하면서 전환됩니다. 

branch 생성 후 화면입니다. 

개발을 시작합니다. 

간단하게 MemberController만 추가합니다. 

기능 개발이 끝났다 가정하고 commit, push를 수행합니다. IntelliJ의 git 기능을 활용합니다. (Commit시 상단에 Commit to 'branch 이름' 을 확인하시기 바랍니다. main으로 되어있다면 branch를 만들어야 합니다.)

push 완료 후 github에 접속하여 Pull Request를 작성합니다. Pull requests 탭을 클릭하고 New pull request 버튼을 클릭합니다. 

그러면 방금 전 push한 branch가 목록에 보이게 됩니다. 해당 branch를 클릭합니다. 

다음 화면에서 Create pull request를 클릭해줍니다. 

특이사항이 있다면 내용을 작성하고 Create pull request를 클릭합니다.

pull request 완료 화면입니다. 

지금부터는 팀장역할을 하는 사람이 해야하는 내용입니다. 

Pull requests 탭을 클릭해보면 조금 전 팀원이 작성한 PR(pull request) 이 보입니다. 해당 PR을 클릭합니다.

 Merge pull request를 클릭하면 코드를 병합할 수 있습니다. 버튼을 클릭합니다. 

아래와 같은 화면이 나오며, Confirm merge 를 클릭합니다. 

문제가 없다면 아래와 같이 성공했다는 내용이 보이며, Delete branch를 클릭하여 해당 branch를 삭제해 줍니다. 

첫 화면으로 돌아와보면 해당 commit이 함께 보이는 것을 확인할 수 있습니다. 

push를 조금 전 했던 팀원은 병합된 main branch 내용을 본인의 로컬에 적용하도록 합니다. 

main branch에서 우클릭 후 checkout을 합니다. 

checkout 후 다시 main에서 우클릭하여 update를 클릭하여 pull을 해줍니다. 

pull 이 잘 수행된 것을 확인할 수가 있습니다. 

다음 글에서는 두 사람이 작업했을 때의 상황에 대해 소개해드리도록 하겠습니다. 

이전 글에 이어서 repository를 만들고 공동 작업하는 내용입니다. 

팀장은 Repositories 탭을 클릭하여 새로운 repository를 생성합니다. 

저장소 이름을 작성하고 공개범위는 private을 선택하여도 팀원은 볼 수가 있습니다. 

repository 생성 완료 화면에서 Manage access 클릭하여 권한 관리 화면으로 들어갑니다. 

Add people을 클릭하여 팀원 추가를 해줍니다. 

추가 방법은 똑같이 github의 username으로 검색하도록 합니다. 

추가시 role을 Admin으로 선택합니다. 

모두 추가한 화면입니다. 

이제 실제 코딩하는 상황을 가정하고 진행해보도록 하겠습니다. 

IntelliJ 에서 새로운 SpringBoot 프로젝트를 만들어봅니다. (새로운 프로젝트는 팀장 역할을 하는 사람만 만듭니다. 팀장이 기본 세팅을 하고 github에 올리면 다른 팀원은 해당 repository를 clone 받아 프로젝트를 시작하는 형태로 진행하였습니다.)

간단하게 index를 출력하는 컨트롤러를 하나 만들고 push하도록 하겠습니다. 

터미널 작업이 좀 더 수월하여 터미널로 작업합니다. (초기 세팅 이후에는 IntelliJ 에서 지원하는 git 기능을 활용하면 편하게 작업할 수 있습니다.)

git init로 초기화 작업을 하고 

git remote add 를 이용하여 원격저장소 설정을 해줍니다. 원격저장소 주소는 조금 전 만든 repository의 주소입니다. 

git add . 를 실행하여 모든 파일을 추가합니다. 

commit을 수행합니다. 

push를 수행합니다.

push 완료 후 github에 접속하여 정상적으로 push가 수행되었는지 확인합니다. 

지금부터 팀원이 진행하는 내용입니다. 

팀원은 프로젝트를 저장할 폴더에서 git clone으로 팀장이 올린 프로젝트를 다운받습니다.

clone 수행 후 IntelliJ를 이용하여 프로젝트를 열어보면 모든 내용을 잘 가져온 것을 확인할 수 있습니다. 

다음 글에서는 팀장 및 팀원이 개발을 진행할 때의 상황을 소개하도록 하겠습니다. 

다른 사람과의 협업을 위해 github를 사용하는 경우 활용하면 좋을 Github organization 세팅 및 기본 기능에 대한 내용입니다. 

팀장 역할을 하는 분이 먼저 작업을 해야할 부분이 있습니다. 

github에 로그인 후 프로필 이미지를 클릭하여 Your Organizations을 클릭합니다. 

접속 후 New organization을 클릭하여 새로운 조직을 추가합니다. 

비용과 관련된 화면이 나오는데 상황에 맞게 선택하시면 됩니다. 무료로 선택하도록 하겠습니다. 

다음 화면에서 조직이름, 팀장의 이메일 그리고 로봇이 아니라는 절차를 처리하고 Next를 클릭합니다. 

조직이름 입력시 영문자숫자만 가능합니다. 

조직 생성이 완료되면 팀원을 추가할 수 있는 화면이 나옵니다. 여기서 팀원으로 등록할 사람의 github username 이나 이메일로 입력하여 초대 메일을 보낼 수 있습니다. 여기서 하셔도 되고 나중에 추가할 수도 있으니 넘어가도 됩니다. 

조직을 만들고 나서의 첫 화면 입니다. 

People 탭을 클릭후 Invite member를 클릭하여 팀원을 추가합니다. 

추가할 팀원의 username을 검색하여 초대 메일을 보내도록 합니다. 

다음 화면에서 Role 선택 항목이 나오는데 팀원이 push, pull 등 작업을 모두 해야 한다면 Owner로 선택합니다. 

팀원은 본인 이메일을 확인하여 초대를 수락해줍니다. 

팀원이 초대를 수락한 이후의 화면입니다. 

여기까지가 github 로 조직을 설정하는 과정이고 다음글에서 repository를 만들고 공동작업 수행하는 내용에 대해서 설명하도록 하겠습니다. 

JSP로 화면작업을 하다보면 javascript 도 함께 사용을 많이 하게 됩니다. 

이 때 javascript의 유용한 문법인 템플릿 리터럴(template literals) 를 쓰려고 하다보면 문제가 생깁니다. 

(템플릿 리터럴은 변수값을 ${변수명} 으로 표현하고 일반 텍스트와 함께 작성하고 백틱(`)으로 묶어서 변수값이나 console.log에 활용하는 방식을 말합니다.)

예를 들어 아래와 같은 javascript를 단독으로 쓴다면 문제는 없습니다. 

const name = "노트북";
const price = 1000000;

console.log(`${name}의 가격은 ${price} 원 입니다.`);

하지만 위의 내용을 JSP파일에 작성하게 되면 JSP는 ${} 표현을 model에 담긴 값으로 인식하여 제대로 처리를 하지 못하는 경우가 발생합니다. 

이런 상황에서는 아래와 같이  \ 기호를 추가해주면 됩니다. 

const name = "노트북";
const price = 1000000;

console.log(`\${name}의 가격은 \${price} 원 입니다.`);

위와 같이 작성하면 model 값과 구분을 하여 활용이 가능합니다. 

인텔리제이를 처음 사용할 때 콘솔에 한글이 깨져서 나오는 현상을 겪으시게 될겁니다.

간단하게 설정이 가능하니 참고하시면 될 것 같습니다.

File-Settings 에 들어간 뒤 Editor-FileEncodings를 클릭합니다. 그리고 Global Encoding, Project Encoding 모두 UTF-8로 설정합니다.

다음으로 Shift를 두번 누르면 검색창이 나타나고 

VM 이라고 검색어를 입력합니다. 

검색 결과에서 Edit Custom VM Options... 를 클릭하고 아래 두줄을 입력해줍니다.

-Dfile.encoding=UTF-8
-Dconsole.encoding=UTF-8

저장한 뒤 IntelliJ를 재시작(열려있는 모든 창을 닫아줘야 합니다) 해주면 한글이 깨지지 않고 나오는 것을 확인할 수 있습니다.

IntelliJ Community로 SpringBoot 프로젝트를 만드는 내용입니다. 

환경은 아래와 같습니다. 

- JDK 17

- IntelliJ Community 2023.2

Community 버전은 직접 Spring Boot 프로젝트 만드는 기능을 지원하지 않으며, Spring 공식 홈페이지에서 프로젝트를 생성하여 열어줘야 합니다. 

프로젝트 생성 페이지는 아래와 같습니다. 

https://start.spring.io/

왼쪽 부분은 프로젝트에 대한 설정 부분으로 아래와 같이 따라해보시면 됩니다.(하단의 Java 부분은 설치된 JDK 버전에 따라 선택해주시면 됩니다.)

다음으로 dependency를 선택하는 부분입니다. ADD DEPENDENCIES 버튼을 클릭하여 추가하시면 되고 찾기 어려우면 상단에 검색 부분에서 검색으로 하셔도 됩니다.

DB 연동없이 서버 실행 후 기본페이지를 열어볼 목적이기 때문에 최소한의 dependency만 추가하였습니다.

- Spring Web(기본적인 웹 서버 및 내장 톰캣 지원)

- Thymeleaf(타임리프 템플릿엔진. JSP나 리액트와 같은 화면을 사용하신다면 없어도 됩니다.)

완료된 화면입니다.

하단의 GENERATE 버튼을 클릭하면 프로젝트 파일을 다운받을 수 있습니다.

다운받은 파일을 압축 풀면 아래와 같은 폴더 및 파일이 있습니다.

IntelliJ 메뉴에서 Open 클릭 후 압축을 해제한 폴더를 선택하여 열어줍니다.

신뢰하냐는 창이 뜨면 Trust Project를 선택합니다.

처음 열었을 때는 dependency 다운로드 등에 약간의 시간이 소요되니 우측 하단의 진행상태를 지켜봐주시면 됩니다. 

로딩 완료 후 src-main-java-com-codingrecipe-demo 패키지에 접근하여 우클릭 후 controller 라는 패키지를 추가해줍니다.

그리고 HomeController 라는 이름의 클래스를 추가합니다. 그리고 기본 페이지(index.html)를 띄우기 위한 코드를 작성합니다. 아래 그림을 참고해주세요. 

index.html 을 추가하기 위해 src-main-resources-templates 폴더에서 우클릭 후 html 을 추가해줍니다. 

추가 후 간단하게 h2 태그만 작성하였습니다.

이제 기본 세팅은 완료됐고 실행할 일만 남았습니다. 

DemoApplication 클래스를 열어보면 클래스 옆에 초록색 세모의 실행버튼이 보일겁니다. 그 버튼을 클릭 후 Run을 클릭하면 실행이 됩니다. 

실행 후 브라우저에 http://localhost:8080 으로 접속하시면 아래와 같이 index.html에 작성한 내용이 출력됩니다.

이클립스에서 서블릿(servlet) 프로젝트를 생성하려면 Tomcat은 사전에 설치가 되어 있어야 합니다. Tomcat 설치는 아래 글을 확인해주시기 바랍니다. 

https://codingrecipe1.tistory.com/9

이클립스 실행 후 File-New-Other 를 클릭합니다.

Web 폴더의 Dynamic Web Project를 선택하고 Next를 클릭합니다. 

아래 화면에서 프로젝트 이름을 지정하고 나머지 부분은 그대로 두셔도 됩니다. 

프로젝트 이름 입력 후 Finish를 클릭합니다.

프로젝트 생성 후 보여지는 구조 입니다. 

혹시 보이는게 조금 다르다면 우측에 있는 Open Perspective 버튼을 클릭해서 Java EE로 선택해주세요. 

그 다음 서블릿 프로젝트를 구동하려면 Tomcat을 연결해줘야 합니다. 

다시 File-New-Other 클릭 후 Server 폴더의 Server를 선택하고 Next를 클릭합니다. 

서버 타입을 선택하는 화면입니다. Apache 폴더를 확장한 뒤 Tomcat v9.0 Server를 선택합니다. 

서버 런타임 환경 추가를 위해 Server runtime environment 우측에 있는 Add 링크를 클릭합니다. 

아래 화면에서 Tomcat 설치폴더를 가져와야 하는데 Browse 버튼을 클릭하여 tomcat이 설치된 경로를 선택해줍니다. 

세팅이 완료됐다면 Finish를 클릭합니다. 

하단의 Servers 탭을 클릭하고 Tomcat 서버를 더블클릭하여 포트 설정을 해줍니다. 

혹시 하단에 Server 탭이 보이지 않으면 Window-Show View 에서 Servers를 선택하시면 됩니다. 

Tomcat admin port를 80, HTTP/1.1 을 8080으로 설정해줍니다. 

이제 마지막으로 index.jsp를 만들어보겠습니다. 

webapp 폴더에서 우클릭 후 JSP파일을 추가하고 이름은 index로 작성합니다. 

index.jsp의 body에 Hello Servlet을 작성해줍니다.

실행할 때는 index.jsp에서 우클릭 후 Run As-Run on Server를 클릭하여 실행합니다.  

Run On Server 화면에서 Tomcat을 선택하고 Finish를 클릭합니다. 

실행한 화면입니다. 

감사합니다.

Oracle Database에서 일반 사용자 계정을 생성하는 방법입니다. 

관리자 계정에서 만들어야 하는데 관리자 계정에 접속하는 방법은 아래글에 작성하였습니다. 

https://codingrecipe1.tistory.com/7

사용자 계정은 아래와 같은 쿼리문으로 만들 수 있습니다. 사용자이름과 비밀번호는 자유롭게 만들어주시면 됩니다. 

아래와 같이 계정을 생성할 때 오류가 발생한다면 아래글을 참고해주시기 바랍니다.

https://codingrecipe1.tistory.com/11

-- CREATE USER 계정이름 IDENTIFIED BY 비밀번호;
CREATE USER USER1 IDENTIFIED BY "1234";

계정을 만들고나면 권한이라는 것을 줘야하는데 권한의 종류는 아래와 같이 간단하게 구분할 수 있습니다. 

• DBA
  • 관리자권한(모든 작업을 할 수 있음)
• CONNECT
  • 접속을 할 수 있는 권한
• RESOURCE
  • 테이블, 시퀀스, 프로시저 등을 만들 수 있음

연습용이기 때문에 간단하게 DBA 권한을 부여하도록 하겠습니다. 

-- GRANT 권한종류 TO 계정이름;
GRANT DBA TO USER1;

각 쿼리문은 작성하고 Ctrl+Enter로 실행을 해야 합니다. 

계정생성 및 권한부여가 끝나면 해당 계정으로 접속을 합니다. 

아래 그림에서 녹색 더하기 버튼을 클릭합니다. 

Name에는 구분용 이름을 작성하고 

사용자이름에 만든계정의 이름

비밀번호에 해당 계정의 비밀번호를 입력 후 하단의 테스트 버튼을 클릭하여 좌측 상태에 성공이 뜨면 됩니다. 

그리고 접속 버튼을 클릭하면 해당 계정으로 접속이 가능합니다. 

sql developer 사용시 우측 상단에 어떤 접속이름으로 설정되어 있는지 항상 체크하셔야 합니다. 간혹 관리자 계정이나 다른계정으로 접속된 상태에서 쿼리를 수행하다 보면 엉뚱한 계정에 테이블이 만들어질 수도 있습니다. 

감사합니다.