Step2 24기 2주차

Step2 24기 week2 수업 정리

• maven Dependency(빈 팩토리) 밑의 .jar 파일들은 전자정부 프레임워크를 구성하는 중요 클래스 압축 파일들을
  pom.xml에서 한꺼번에 관리 한다.
  
  
• 타일즈란? 화장실 바닥의 타일을 떠올리고, 하나의 웹 화면에 여러 영역을 붙여주는 라이브러리를 의미한다.
  
  
• 하나의 웹 페이지에서 head 란 문서에 대한 정보를 담고 있는 곳이다.
  
  
• 타일즈를 세팅하려면 반드시 Dependency(빈)를 넣어줘야 한다. Dependency를 추가하는 과정을 인젝션(Injection)이라고 한다.
  
  
• dispatcher-servlet.xml 이 WEB-INF(화면단)에 있는 이유는 화면, 즉 뷰와 관련된 설정을 적어주는 곳이기 때문이다.
  
  
• 타일즈의 강점은 수많은 페이지를 관리할 수 있다는 점이다.
  
  
• 동적으로 바뀌는 부분은 default-layout.xml에서 경로를 절대 경로를 사용하지 않고 밑에서 동적으로 상대경로를 지정한다.
  
  
• ~~~example/{1}{2} 이것은 example 밑의 파일들을 모두 타일즈 설정해준다는 의미이고, .tiles가 붙은 파일들은 타일즈 설정을 해준다라는 
  두 조건을 만족해야 타일즈가 설정된다.
  이 때 반드시 example 안에 파일이 있어야 하고, default-layout의 tiles를 변경하면 MainController의 리턴 값도 변경시켜줘야 하는 조건이 있다.
  
  
• SVN 사용법
  - 프로젝트 우클릭 > Team > Share Project > SVN next > create 라디오 버튼 > next > 방 이름, id, 비번 작성 > Finish
  
  
• SVN 주의 사항
  1. 프로젝트 전체 Check Out 금지! , 톰캣에서 Add and Remove에 나오지 않는다, 연결이 안된다.
  2. 연결 해제 후 저장할 때 Team > Share Project 하지않고 둘 중 하나 지우고 할 것.
  3. SVN 편리하게 관리하기 위해서는 폴더를 새로 만들어서 새로 만든 파일 이름으로 중간 경로를 꼭 추가할 것!
  
  
  

---

• 프로젝트 셋팅

  1. eGovFrame web project 생성
  2. pom.xml 설정 (maven을 이용해서 tiles라이브러리 받아옴)
  3. dispatcher-servlet.xml 설정파일 뷰리졸버 설정 우선순위 타일즈를 1순위로변경하고 기존에 있던 뷰리졸버는 2순위로 변경
  4. /WEB-INF/tiles/default-layout.xml 생성
  5. /WEB-INF/tiles/default-layout.xml 에서 필요한 jsp 파일들 생성
     
     

• 타일즈 분할할 퍼블리싱 파일 분석
  <메트로킹 대시보드 화면>

  헤더, 네비게이션과 레프트 사이드바 그리고 메인컨텐츠가 존재 푸터는 없다.

고민한 부분

• 화면마다 다른 JS 소스는 어떻게 할 것인가?

  1. 타일즈로 빼서 화면마다 js소스를 jsp로 불러온다(만들어야할 파일이 늘어나고 각 페이지마다 공통JS파일마저 각각 관리해주어야 한다는 단점이 있다. DOM 조작하는 JS는 당연히 분리되어야한다.)
  2. 기존 content 부분 하단에 추가한다. (이렇게 할 경우 스크립트가 화면이 렌더링 되는 중간에 불러와지고 JS파일이 클수록 렌더링을 방해한다. )

  결론 : 각 페이지마다 불러오는 JS라이브러리를 공통으로 전부 불러오고 해당 페이지에서만 쓰는 라이브러리와 페이지 조작하는 script는 콘텐트 하단에 넣는게 개발자의 입장에서는 가장 편할것 같다. 하지만 JS라이브러리들이 content보다 위에서 불러져와야함. 이거는 성능적으로 안좋은 영향을 끼친다. (현업에서는 어떻게 할까..굳이 정답을 찾자면 AA아니면 PM의 결정에 따르면 된다가 아닐까?)

  
  추가 : 성진이가 알려준내용 - content내에서 하단에 include를 활용해서 공통 JS 소스를 불러온 방식을 쓴다고 한다.
  
  

  ---

  
  

• 화면마다 다른 헤드는 어떻게 할 것인가?

  헤드 태그안에 주로 CSS파일 이므로 calendar.css만 추가 해주면 공통으로 사용해도 오류는 나지 않으나, 헤드태그안의 타이틀은 전부 다름

  결론 : 이거는 컨트롤러단에서 논리적주소에따라 title에 들어갈 값을 모델에 담아서 JSTL로 처리해주는게 가장 이상적일것 같다.
  
  

  ---

  
  

• 좌측 사이드바가 클릭되어진 상태는 어떻게 나타낼 것인가..
  <메트로킹 대시보드 left>

사이드바의 각 항목에 class속성에 "색상, current" 또 펼쳐지는 속성은 "open"이 있어야함..

1. JS로 URL에 따라 처리해준다.
2. JSTL로 처리해준다
3. 사이드바도 주소마다 공통이 파일이 아닌 다른 파일들로 다르게 처리해준다. (사이드바는 헤더와 조금 다르게 거의 공통적이고 class 속성의 값만 다를뿐이라 타일즈로 전부 나눈다 해도 비효율적.. 만약 사이드바에 하나의 메뉴가 추가해주면 전부 추가 해주어야 하기때문에 그건 아닌듯..)

결론 : 이번 과제의 주제에 어긋나는 고민인것 같으므로 일단은 배제하고 처리해준다면 1번과 2번 방법으로 해야 할 것 같다.