웹 앱 (5) 썸네일형 리스트형 스프링 부트 웹 개발 기초 - 스프링 부트가 브라우저에 컨텐츠를 전달하는 법 Spring boot를 학습하기 위해 여러 강의들을 찾아 돌아다녔지만 DI, AOP 등 추상적인 개념들이 서두에 나와 나를 괴롭게 하였다. 항상 개념들을 보고 대충 따라하다가 관두면서 스프링 공부를 항상 미뤄왔다. 의존성을 한 곳으로 어떻게 위임는지, 어떤 장점이 있는지 대충 이해는 가지만 실제 개발을 통해 와닿지 않는 점이 나를 지치게 했다. 그러던 중 김영한 선생님의 인프런 강의를 접하게 됐는데 일단 코드부터 따라하면서 시작하는 점이 쉽게 다가왔다. 강의 튜토리얼에서 하신 말씀 중 '이론공부를 하다가는 졸아도 코드를 짜다가 졸지는 않는다'라는 이야기에 적극 공감한다. 실습 위주로 강의를 들으며 얕고 쉽게 공부할 예정이다. 개발 공부하면서 느끼는 거지만 IT지식은 밑바닥부터 차근차근 쌓아 올리는 것이 .. [tomcat] Apache와 tomcat의 상관관계 Apache & Tomcat 기본적으로 아파치는 웹서버(WS), 톰캣은 웹 어플리케이션 서버(WAS)이다. 그래서 versus가 아니라 &를 썼다. WAS와 WS의 기능적인 부분을 이해하면 둘의 관계를 알 수 있다. 대략적인 웹 서버와 웹 어플리케이션 서버의 관계도이다. 1. 웹 서버(Web Server) 웹 클라이언트로부터 http 요청을 받아서 컨텐츠를 제공하는 프로그램이다. 컨텐츠라는 것은 정적인 컨텐츠와 동적인 컨텐츠로 나뉘는데 그 종류에 따라서 서비스 방식이 바뀐다. 1) 정적인 컨텐츠 제공 WAS를 거치지 않고 바로 클라이언트로 자원을 제공한다. 2) 동적인 컨텐츠 제공 클라이언트의 요청(Request)을 WAS에 보내고, WAS가 처리한 결과를 클라이언트에게 전달(Response)한다. - .. [CSS] link vs import page2 - : html 태그로 css 파일을 로드할 때 사용. - @import : css 안에서 다른 css 파일을 로드할 때 사용. css 파일 안에서는 @import ulr("")로 사용 가능. [부트스트랩]Jumbotron 만들기 점보트론 : 부트스트랩이 제공하는 component로 홈페이지를 소개하는메인 전광판. 원래는 소니에서 만든 대형 스크린 TV의 상표명이었다고 한다. 스포츠 경기장 및 콘서트장에서 많이 썼다고 하는데 큰 정광판의 대명사처럼 쓰인다. 부트 스트랩의 점보트론 역시 홈페이지에 들어오자마자 딱 보이는 큰 전광판 느낌으로 사용하는데 웹 페이지를 소개하는 대문 같은 느낌이다. 가장 기본적인 점보트론을 생성했을 때의 모습이다. div태그의 class 형태로 사용된다. 그냥 모서리가 둥근 회색 사각형모양으로 나온다. 부트 스트랩의 특성상 반응형으로 브라우저의 크기를 줄이면 같이 모양이 바뀐다. container 클래스는 내용물을 담는 그릇정도로 보면 된다. 레이아웃을 만드는 가장 상위 요소에서 쓰이며 전체 가로폭을 정하.. [부트스트랩]bootstrap 시작 웹 디자인 프레임 워크. 기본적으로 반응형 웹을 제공하고 있고, 사용하기 편리하여 많이들 쓴다고 한다. 웹 디자이너가 따로 디바이스에 신경쓸 필요가 없다는게 장점인듯 하다. 설치하면 css와 js 파일이 설치된다. 안경잡이 개발자님이 다운했을 때는 font도 있었는데 왜 없는지 모르겠지만 폰트는 중요한 요소가 아니기 때문에 패스. index.html 파일은 내가 만들었다. 개발툴은 vs code를 사용. 처음이니깐 Hello world!를 찍어보자. 어차피 html 위에 쓰는거기 때문에 전체적인 틀은 익숙하다. 나동빈님 강의를 그대로 따라했다. 결과물은 Hello world!를 찍는 것이지만 사실 요지는 부트스트랩 프레임 워크를 사용하기 위한 head 작업을 이해하는 것이다. 부트스트랩을 위한 가장 기본.. 이전 1 다음
