Til

Web/Spring

[Spring] 스프링에 관한 잡다한 이야기

스프링에 관한 잡다한 이야기 프로젝트 생성 이클립스에서 스프링 프로젝트 생성 시 다음과 같은 창이 뜬다. 옛날에는 (옛날이라 해도 1년도 안됐지만) 별생각 없이 만들어서 썼었는데 위에 보이는 Service URL은 대체 무엇일까.. 이는 스프링 프로젝트 설정을 기본적으로 Service URL에서 가져온다는 뜻이다. 실제로 https://start.spring.io/ 홈페이지에 들어가 보면 스프링 프로젝트를 설정할 수 있다. 메이븐 프로젝트로 할지, 그래들 프로젝트로 할지 설정할 수 있고 Language와 Spring Boot 버전, Project 정보 등을 설정할 수 있다. (최근에는 그래들 프로젝트로 많이들 설정한다.) 아래에 Dependencies 오른쪽의 ADD ... 버튼을 클릭하여 Depende..

Daily/TIL

[TIL] 2022.01.27 - JSP, Serlvet, Spring

음~ 오늘도 다 아는 내용~ 하지만 서블릿 재밌어~... 하다가! 갑자기 어려운 내용 쏟아져버리기 아파치와 톰캣 예전에 아파치는 정적 페이지였고 이후 톰캣이 동적 페이지를 만들었다. 나중에 아파치가 톰캣을 인수해서 아파치/톰캣이 되었다. 그래서 동적 페이지를 말할 땐 아파치/톰캣이라 한다. 즉 두 개를 같이 붙여서 말하는 게 동적 페이지라는 뜻. 그냥 아파치라고만 부르면 그건 정적 페이지를 뜻하는 것이다. 참고로 정적 페이지는 단순 Web Server라 하고, 동적 페이지는 Web Application Server라 한다. 추상화 공통된 것들을 추려 기능과 구현의 역할을 나누는 것이다. 예를 들어 인터페이스에는 DB 접속에 연결하기 위한 방법과 정보 등을 작성하고, 이를 구현하는 클래스에서 직접적인 기능..

Daily/TIL

[TIL] 2022.01.19 - JS DOM 예제

왜 나만 졸려하는걸까.. 나도 뭘 마셔야되나.. JavaScript (JS) DOM (Document Object Model) 예제 예제 1 - 버튼 클릭으로 style 바꾸기 스타일 DOM으로 변경 스타일 변경 하기 const style에 div.style을 저장하고, const color에 style.color를 저장하였는데 이렇게 하지 않고 그냥 div.style.color로 하여도 되긴하다. 위 방법처럼 button에 바로 onclick을 주어도 되고, 이벤트 리스너를 추가해도 된다. 스타일 DOM으로 변경 스타일 변경 하기 button 클릭 시 EventListener가 동작한다. 위 코드와는 다르게 button에 onclick을 주지 않았다. 예제 2 - className 값 1 값 2 값 3..

Daily/TIL

[TIL] 2022.01.12 - CSS

CSS margin 겹침 (통합) 현상 (margin-collapsing) 두 개 이상의 margin 값이 세로 방향으로 만났을 때 하나의 margin으로 합쳐지는 현상이다. 이런 게 있는지 이번에 처음 알았는데 그동안 디자인할 때 왜 그렇게 margin이 안 맞았는지 이제야 알았🤣🤬 div가 위 아래로 위치해있다 가정하고, 위 div의 margin-bottom이 20px이고, 아래 div의 margin-top이 30px 일 때 두 개가 만나면 bottom, top이 합쳐진 50px가 아닌 둘 중 큰 값인 30px가 된다. line-height 폰트는 그대로 있고 폰트 위 아래의 행간이 넓어진다. background color | image | repeat | position | attachment | ..

Daily/TIL

[TIL] 2022.01.11 (YIL) - HTML 태그 정리 및 CSS 정리

2개월 동안 HTML부터 Spring까지 다시 복습하는 시간을 가져본다 ! 근데 어제는 정리를 안 했기 때문에 TIL가 아닌 YIL (Yesterday I Learned) HTML XML 구조 언어로 인터넷에서 기존에 사용하던 HTML의 한계를 극복하고 SGML(Standard Generalized Markup Language)의 복잡함을 해결하기 위해 만들어졌다. !DOCTYPE (문서형 선언 DTD) 문서형 선언 Document Type Definition 줄여서 DTD이다. (오 한글로 치면 ㅇㅅㅇ) !DOCTYPE을 사용해 브라우저가 현재 HTML5 또는 HTML4 또는 XHTML로 작업할 거라는 걸 알려준다. 브라우저가 해당 문서는 웹 버전이라는 것을 인식시키게 하므로 필수적으로 넣어야 한다. ..