이 환경설정은 학교에서 진행하는 교재에서 이클립스 환경으로 진행하던 프로젝트를 인텔리제이로 바꿔 진행하기 위해 설정해야하는 것들을 기록했다.

교재: JSP 2.3 & Servlet 3.1

1. TOMCAT 다운로드

https://tomcat.apache.org/download-90.cgi 링크를 타고 들어가서 Tomcat을 다운로드 한다. 안정적인 tomcat9을 추천한다. 압축을 푼다. 이때, Tmcat 파일 위치를 기억하기 쉬운곳에 저장한다.

V 아래 형광펜 쳐놓은 파일을 다운로드해서 진행하면 편함.

2. SDK 다운 JAVA 11 or 8

자체적으로 sdk를 다운받아도 되지만 인텔리제이는 프로그램 자체에서 sdk를 다운받을 수 있게 해놓았다. 편한쪽으로 진행하면 된다!

v 인텔리제이 내에서 다운받는건 아래 참고. https://tychejin.tistory.com/328

3. CATALINA_HOME 환경변수 설정

이걸 안하면 나중에 인텔리제이에서 서버를 돌릴때 에러가 발생할수 있으므로 환경변수를 설정해야한다.

V 마찬가지로 아래 사이트 참조! https://hongeui.tistory.com/11

4. 새 프로젝트 설정 JAVA+ InteliJ로 설정

1) 프로젝트 -> 새 프로젝트 클릭

🌟2)🌟 새 프로젝트로 생성 -> 아래 형광펜 표시한것 꼭 지켜서 설정!

5. 프로젝트 구조 라이브러리 + 패싯+ 아티팩트

1) 파일 -> 프로젝트파일 -> 라이브러리에서 +버튼 누르고 Java 선택.

2) 설치한 Tomcat 파일 아래 lib파일에서 jsp-api.jar,servlet-api.jar 파일 선택 후 확인 누르기

3) 파일 -> 프로젝트파일-> 패싯에서 +버튼 누르고 web 선택.

4) 아래 형광펜 친 web 패싯 리소스가 아티팩트에 없습니다. 경고 문구가 보이면 옆에 있는 아티팩트 생성버튼 누르기

아래와 같이 아티팩트가 자동으로 생성된다

적용버튼 누르고 확인 누르고 나가면 아래와 같이 web 폴더가 생성되어있는데 이것이 이클립스의 webContent 폴더 파일과 같다!

런 환경 톰캣+ 아티팩트 배포 주소 변경

1) 런환경 설정하기 -> 현재파일 아래 구성편집 누르기

2) + 버튼 눌러서 새 구성추가 목록중에 Tomcat 서버 로컬선택

3) 형광펜 친곳을 똑같이 설정 만약 애플리케이션 서버가 자동으로 인식 되어있지 않다면, 옆의 구성버튼을 눌러 Tomcat파일을 찾아주면 된다.

4) 배포 메뉴를 눌러서 애플리케이션 컨텍스트를 /로 설정하기

실행

예시로 로그인창에 아이디와 비밀번호를 입력후 버튼을 누르면 아이디와 비번이 보여지는 파일을 작성해보았다.

이해 안가는 점(공부하면서 하나하나 찾아서 추가할 예정)

• 원래 실행했었던 jakarta EE 제너레이터로 만들었을때는 왜 작동이 안될까.
• 패싯,아티팩트의 의미
• 시스템 빌드 Gradle, Maven의 의미.
• 🌟 새 파일을 만들때마다 일일이 프로젝트 구조와 패싯, 아티팩트, 서버를 설정해 주어야하는데 자동으로 심어지게 만드는 방법은 없을까.

참고자료

https://sosopro.tistory.com/162

https://actually94.tistory.com/121

https://velog.io/@jwo0o0/JSP-IntelliJ%EC%97%90%EC%84%9C-JSP-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-404-%EC%98%A4%EB%A5%98%EC%99%80-%ED%95%B4%EA%B2%B0

https://velog.io/@lukehongg/intellij-jsp-project

https://velog.io/@max9106/JSP-intelliJ%EB%A1%9C-JSP-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-%EC%83%9D%EC%84%B1-jek572fhfx

https://hhk1364.tistory.com/209

New Servlet 추가

https://admd13.tistory.com/43

🧶가벼운 서론

파이썬 리스트 문제를 풀면서 항상 까먹었던 부분 중 하나. 정리를 해두지 않으니 문제 풀때만 기억하고 까먹고했었는데 이번에 백준 문제 10988문제를 풀면서 제대로 정리해 두고로 다짐 했다.

🖱️List.reverse()란?

• List 타입에서 제공하는 함수 → 오로지 List에서만 사용가능!

• 원본의 리스트의 값을 직접 바꿈.

• 🎯주의사항: 위 그림에서도 볼 수 있듯 None을 반환. → 변수에 값을 할당 할수 없음.

# .reverse()
li=[1,2,3,4]
li.reverse()

print(li.reverse()) #None반환
print(li) #[4,3,2,1]반환

🖱️reversed(List)란?

• 파이썬의 내장함수

• 리스트뿐 아니라, 다른 반복가능한 Iterable Object 시퀀스 자료형 (ex 튜플, 스트링,딕셔너리..)에도 사용 가능

• ** 🎯 iterator을 반환함 **

  1. 원본 객체에 영향을 끼치지 않음.
     2. 자료형 변환 메서드 ( list(),tuple()..)를 사용해 사용하고 하는 타입의 객체로 변환해 주여야함.

  #reversed()
  li2=[1,2,3,4,5]
  reversed_li2=list(reversed(li2))
  print(li2) # [1,2,3,4,5]반환 값변화 없음
  print(reversed_li2) #[5,4,3,2,1]
  print(reversed(li2)) # 이터레이터 값 ex)<list_reverseiterator object at 0x00000243DAE3D9C0> 반환```
  
  

📌 정리

• 수도 선택자의 한 종류로 요소 중 n번째 요소를 선택한다.

수도 선택자란?

1. 어원

처음에 딱 수도라는 말만 들으면 도시의 수도가 생각 날수도 있지만, 여기서 수도란, 'persudo' 를 그대로 발음 한 것이다.

2. persudo의 뜻

persudo

1. 형용사 허위의, 가짜의; 모조의
2. 명사 구어 꾸며 보이는 사람, 사칭자

3. 수도(persudo) 선택자인 이유

persudo의 첫번째뜻 처럼, 클래스가 부여되지 않은 요소에 허구의,가짜의 클래스를 부여한다.

4. 종류

• :first-child :요소중 첫번째 요소
• :last-child : 요소중 마지막 요소
• nth-child(n): 요소중 n번째 요소
• nth-of-type(n): 같은 종류의 요소중 n번째 요소
• not(selector):해당 선택자 빼고 선택
• ::before :해당요소 앞에 가상요소 추가
• ::after : 해당요소 뒤에 가상 요소 추가

.:nth-child(n) 작동 예시

ex 1)

section 아래 같은 형제 클래스

   section .content:nth-child(2){
           border-bottom: 2px dashed #000;
   }

작동방식

1. section 태그 인식
2. :nth-child(2) 를 인식하는 동시에 .content의 형제들을 탐색함.
3. .content가 형제들 중에서 2번째가 맞는지 확인

4. section의 후손중에서 .content가 형제 중에서 두번째가 맞는가?

4번을 최종 확인 후 스타일을 적용한다!

ex2 n키워드 적용시

• 아래 css와 같이 nth-child() 괄호 안에 2n-1,2n과 같이 변수가 포함된 수식이 들어간다면, 그 안의 변수는 무조건 0부터 순서대로 대입된다.

  <ul id="fruites">
      <li class="strawberry">딸기</li>
      <li>바나나</li>
      <li>포도</li>
      <li>사과</li>
      <li>배</li>
      <li>자몽</li>
      <li class="orange">오렌지</li>
    </ul>

#fruites li:nth-child(2n){ //짝수번째 형제에게만 적용
        background: aqua;
      }
      #fruites li:nth-child(2n-1){//홀수 번째 형제에게만 적용
            background: rebeccapurple;
      }

• 결과