Web
[CSS] 티스토리 코드블럭 여백, 테두리 없애기 : pre / !important
어느 순간부터 다음 사진처럼 코드블럭에 흰색 여백과 함께 테두리가 함께 생겼는데 거슬려하다 오늘에서야 해결방법을 찾아 없앴습니다 아래 코드블럭 보이시죠? 테두리를 없앴습니다 제가 해냈습니다 1. 해결 과정 바로 해결 방법만 보고 싶은 분들은 2.해결방법 으로 이동하세요 과정은 그저 제 기록용 1.1 코드블럭 Styles 확인 F12 키를 눌러 개발자 모드를 켠 후, 커서 모양을 누르고 코드블럭 근처로 마우스를 가까이 두면 해당 부분에 대한 html 코드가 하이라이팅됩니다 pre 태그가 붙은 부분을 클릭하면 테두리 영역과 관련된 Styles도 확인할 수 있습니다 1.2 테두리 영역에 해당하는 라인 찾기 padding, border를 위주로 체크를 해제해보며, 어떤 부분을 수정해야 코드블럭 테두리를 없앨 수..
[MyBatis] CDATA : XML 쿼리에서 부등호 / 비교연산자 에러 해결하기
스프링 프로젝트에서 SQL Mapper를 xml 파일에 작성할 때 다음과 같이 그냥 , 등의 비교연산자나 부등호를 사용하게 되면, 태그로 인식해서 오류가 발생합니다...! (빌드되면서 해당 모듈 전체를 사용할 수 없을 수도..저도 알고싶지 않았음 🙃) SELECT * FROM TEST_TABLE WHERE COL1 > 100 이와 같이 MyBatis에서 쿼리문 안에 를 사용해야할 때 방법입니다 🍉 이런 오류을 해결하기 위해 '태그가 아니라 실제 쿼리에 사용될 코드' 라고 알려주기 위해 사용하는 구문 CDATA의 사용 1. 비교연산자나 부등호만 CDATA로 감싸기 - 일반적으로 많이 사용 SELECT * FROM TEST_TABLE WHERE COL1 ]]> 100 2. 쿼리 전체 감싸기 100 ]]..
[Spring] 웹 개발을 하는 세 가지 방법(3) : API
웹 개발의 세 가지 방법 1. 정적 컨텐츠 2. MVC와 템플릿 엔진 3. API 👈 정적 콘텐츠가 아니라면 HTML로 내리냐 API 방식으로 데이터를 바로 내리느냐 두 가지만 생각하면 된다!! API > 간단한 String API 구현해보기 1. HelloController에 코드 추가 @GetMapping("hello-string") @ResponseBody public String helloString(@RequestParam("name") String name) { return "hello " + name; //"hello spring" } @ResponseBody : HTML의 응답 Body에 직접 데이터를 넣어주겠다 뷰 없이 문자가 그대로 내려간다 2. 실행 localhost:8080/hell..
[Spring] 웹 개발을 하는 세 가지 방법(2) : MVC와 템플릿 엔진
웹 개발의 세 가지 방법 1. 정적 컨텐츠 👈 2. MVC와 템플릿 엔진 👈 3. API MVC와 템플릿 엔진 MVC : Model, View, Controller 과거 JSP 모델 1 방식에서는 View와 Controller가 구분되어 있지 않고, View에서 모든 역할을 다 수행했다 View는 화면을 그리는 데 모든 역량을 집중해야 한다 Controller는 비즈니스 로직, 내부적인 처리를 한 후, 화면에서 필요한 것을 모델에 담아 화면 쪽에 넘겨준다 > 실행해보기 controller 동작에 대해 살펴봅니다 1. HelloController 파일에 다음과 같은 내용을 추가 @GetMapping("hello-mvc") public String helloMVC(@RequestParam("name") St..
[Spring] 웹 개발을 하는 세 가지 방법(1) : 정적 콘텐츠
웹 개발의 세 가지 방법 1. 정적 컨텐츠 👈 2. MVC와 템플릿 엔진 3. API 정적 컨텐츠 - 스프링 부트는 정적 컨텐츠 기능을 기본적으로 제공한다 https://docs.spring.io/spring-boot/docs/2.3.1.RELEASE/reference/html/spring-boot-features.html#boot-features-spring-mvc-static-content /static 디렉터리에서 정적 콘텐츠를 불러온다고 합니다 웰컴 페이지 만들기에서 static 폴더에 정적 파일을 넣었었죠! > 실행해보기 hello-static.html 파일을 static에 생성하고 아무 내용이나 입력해보았습니다 프로젝트를 실행하고 다음과 같은 파일명으로 접근합니다 localhost:8080/h..
[Spring] 웹 개발을 하는 세 가지 방법 : 정적 컨텐츠, MVC와 템플릿 엔진, API
웹 개발의 세 가지 방법 자세한 예시 및 동작 설명은 각 게시물에 대한 링크로 달아두었습니다 1. 정적 컨텐츠 서버에서 하는 것 없이 서버에서 웹 브라우저에 파일을 그대로 내려주는 것 👉 Click to Go [Spring] 정적 콘텐츠 웹 개발의 세 가지 방법 1. 정적 컨텐츠 👈 2. MVC와 템플릿 엔진 3. API 정적 컨텐츠 - 스프링 부트는 정적 컨텐츠 기능을 기본적으로 제공한다 https://docs.spring.io/spring-boot/docs/2.3.1.RELEASE/referen.. codesyun.tistory.com 2. MVC와 템플릿 엔진 가장 많이 사용하는 방법으로, HTML을 그냥 주는 것이 아니라 서버에서 프로그래밍하여 HTML을 동적으로 바꿔서 내려주는 것 대표적인 템플..
[Spring] 스프링 프로젝트 빌드하고 실행하기
cmd 창에서 프로젝트를 build 해보고 실행까지 해보기 😎🙌 제 글은 모두 window 사용을 기준으로 합니다! 1. 프로젝트 폴더로 이동해서 cmd 창 열기 강사님은 맥을 쓰셨지만, 저는 윈도우에서 작업하기 때문에 파일 탐색기에서 폴더로 이동! 다음 사진처럼 주소창에 cmd + [enter] 치면 해당 위치에서 cmd 창이 열립니다 📌 참고 : 윈도우 cmd 명령어 리눅스 명령어만 사용해봤어서 이번에 찾아가면서 사용했네요 🙄 이번에 게시글에서 사용한 두 가지 명령어만 써두겠습니당 cd : 폴더 이동할 때 사용 (리눅스의 cd) dir : 현재 폴더의 파일, 폴더 목록을 보여준다 (리눅스의 ls) 2. build 다음 명령어로 build ! gradlew build 📌 build가 잘 안될 때에는 c..
[Spring] 정적 / 템플릿 Welcome Page 만들기
지난 글에서 프로젝트를 실행했을 때, localhost를 통해 접속하면 다음과 같은 화면이 나왔었습니다! 프로젝트 내용이 아무것도 없기 때문에 위와 같은 에러가 떴죠?! 이렇게 localhost:8080으로 접속했을 때 뜨는 첫 페이지! welcome page를 만들어보도록 하겠습니다 🧨🧨🧨 > static Welcome Page 만들기 1. src > main > resources > static 에 index.html 파일 생성 2. 다음과 같은 내용 입력 Hello hello 3. 프로젝트 실행 후, localhost:8080 접속 입력한 HTML 파일의 내용대로 Welcome Page가 생성되었습니다 ✨ 저는 /hello에 만들어둔 페이지가 있어서 hello를 클릭하면 해당 페이지로 이동되네요 이..
[Spring] 스프링 부트 / 테스트 라이브러리 살펴보기
강의를 들으면서 다음과 같이 External Libraries, Gradle 창을 직접 살펴보며 라이브러리를 살펴보았습니다! 라이브러리는 직접 사용해봐야 와닿기 때문에 있구나~하고 듣자고 하셨기 때문에 자세한 설명은 머리에만 남기고! 주요 라이브러리만 정리해두고 넘어가겠습니당 👊 🔎 라이브러리 살펴보기 Gradle / Maven은 의존관계가 있는 라이브러리를 함께 다운로드 합니다. 스프링 부트 라이브러리 > spring-boot-starter-web ˙ spring-boot-starter-tomcat : 톰캣 (웹서버) ˙ spring-webmvc : 스프링 웹 MVC > spring-boot-starter-thymeleaf : 타임리프 템플릿 엔진 (View) > spring-boot-starter(공..
[Web] Java 백엔드 개발자가 되기 위해 공부해야 할 것들 : JSP 모델, Ajax, jQuery, SPA(React, Vue.js, Angular)
Kevin Java 개발자 로드맵 강의를 보면서 [무료] Kevin의 알기 쉬운 Java 개발자 로드맵 이야기 - 인프런 | 강의 Kevin의 알기 쉬운 Java 개발자(웹 개발자) 로드맵 이야기, - 강의 소개 | 인프런... www.inflearn.com Java 웹 개발자로서 공부해야할 것들이 머리에 잘 들어온 것 같아 기억해두려고 정리하는 글입니다 🧐 JSP 모델 1 방식 - DB에서 조회한 Data를 View Page(HTML 조각코드)로 가공하여 응답으로 보낸다 JSP 모델 2 방식 - JSP는 View Page를 만드는 역할만을 분리하여 가지기 때문에 코드가 간단하고 깔끔하다 - Servlet에서 DB로 부터 얻은 Data를 JSP에 제공하고, View Page를 돌려받는다 AJAX Asyn..