ruriruriya

script 태그는 html의 body 안에서 동작한다. 그냥 html과 script 태그는 정적인 작업 동적인 작업으로 구분해서 볼 수 있다. 아래 코드를 보면 좀더 쉽게 이해할 수 있다. ex1.html 파일을 생성해서 아래 코드에서 body 태그 안에서 1+1과 script 태그에서 1+1을 함께 작동 시켜보았다. JavaScript html 1+1 결과는 script 태그 내에서 자바스크립트로 작성한 1+1은 연산이 되었지만 html 태그인 body 태그에서는 1+1 문자열로 그대로 나온다. 이 부분에서 JavaSctipt는 동적인 역할을 하고 HTML은 정적인 역할을 하는 것을 확인할 수 있다.

스프링부트에는 정적 컨텐츠를 올릴 수 있는 기능이 있다. 아래는 정적컨텐츠를 스프링이 실행하는 순서이다. 스프링부트 공식 사이트 메뉴얼을 먼저 살펴보면 /static 폴더에 파일을 생성해서 불러올 수 있다. https://docs.spring.io/spring-boot/docs/2.3.1.RELEASE/reference/html/spring-boot-features.html#boot-features-spring-mvc-static-content Spring Boot Features Graceful shutdown is supported with all four embedded web servers (Jetty, Reactor Netty, Tomcat, and Undertow) and with both r..

웹 개발을 할 때 다양한 방식으로 클라이언트에게 데이터를 제공하고 인터페이스를 구성할 수 있다. 여기서 정적콘텐츠, MVC와 템플릿 엔진, API는 웹 개발에서 매우 중요하고 각각의 특징과 용도가 있다. 1. 정적콘텐츠 정적콘텐츠는 서버에 미리 저장된 파일인 HTML, CSS, Javascript 등을 그대로 웹 브라우저에 전송하는 방식이다. 클라이언트의 요청에 따라 서버는 별로의 처리없이 해당 파일을 찾아 보낸다. 이 정적콘텐츠는 동작하지 않는 웹 페이지, 이미지, 스타일 시트, 클라이언트 사이드 스크립트(js 파일) 등의 배포에 사용한다. 변경되지 않는 데이터를 보여줄 때 효율적이기 때문이다. 2. MVC와 템플릿 엔진 MVC(Model-View-Controller)는 웹을 구성하는 데에 사용되는 디..

지난번까지는 IntelliJ에서 빌드하여 로컬로 테스트했지만 오늘은 윈도우 cmd 창으로 직접 빌드하여 로컬테스트를 해보자. 1. gradlew.bat 파일 build - cmd 창을 열어 경로를 찾는다. - dir 명령어로 디렉토리 안에 파일 확인 후 - gradlew.bat build 명령어로 build 디렉토리를 생성한다. - build 디렉토리에서 libs 디렉토리를 찾고 이동한다. - dir 명령어로 디렉토리 확인 후 java -jar 명령어로 디렉토리 안에 있는 ~SNAPSHOT.jar 파일을 실행한다. 그렇게 하면 스프링 실행 완료! 2. 위에 1번처럼 되지 않는다면? - cd .. 명령어로 다시 build 디렉토리가 포함되어 있는 상위 디렉토리로 이동한 다음 - gradlew.bat cle..

지난번엔 라이브러리까지 모두 확인했으니 HTML 파일을 만들어 Welcom Page를 만들어보자. 1. Welcom Page 만들기 recources - static에 index.html 파일을 생성한다. 그리고 아래와 같이 기본형식을 써주고 아래 body에 a태그의 링크는 url를 써준다. 이렇게 간단하게 해주고 실행하면 body의 텍스트와 a태그 링크가 달린 텍스트가 나온다. 참고하면 좋을 자료 https://docs.spring.io/spring-boot/docs/2.3.1.RELEASE/reference/html/spring-boot-features.html#boot-features-spring-mvc-welcome-page Spring Boot Features Graceful shutdown i..

Gradle을 사용하는 스프링 부트 프로젝트에서는 build.gradle 또는 build.gradle.kts 파일에 의존관계를 설정한다. 이 파일에서 필요한 라이브러리를 지정하면 Gradle이 자동으로 다운로드하고 프로젝트에 통합한다. 지난 번 포스팅에서 스프링부트 스타터로 설정할 때 add dependencies에서 Spring Web과 Thymeleat 두 라이브러리만 선택하여 설치했지만 이 두 라이브러리를 설치함과 동시에 연관있는 라이브러리까지 자동으로 같이 설치되는 것이다. https://ruriruriya.tistory.com/202 [Spring Boot]자바 스프링부트 프로젝트 환경 설정(스트링 부트 스타터) 자바 스프링(Spring)은 자바 기반의 오픈 소스 애플리케이션 개발 프레임워크이다..

자바 스프링(Spring)은 자바 기반의 오픈 소스 애플리케이션 개발 프레임워크이다. 주로 웹 애플리케이션 및 대규모 엔터프라이즈급 애플리케이션을 개발하는 데 사용된다. 스프링은 애플리케이션의 각 부분을 쉽게 개발하고 테스트할 수 있도록 종속성 주입(Dependency Injection)과 같은 기술을 제공한다. 이를 통해 코드의 결합도를 낮추고, 유지 보수성과 확장성을 높일 수 있다. 또한, 스프링 부트(Spring Boot) 같은 도구를 사용하여 설정을 간소화하고, 빠르게 프로토타입을 만들거나 애플리케이션을 배포할 수 있다. 00. 사전 작업 - Java 17 이상 설치 - IDE : IntelliJ or Eclipse 설치 * 스프링부트 3.0 이상은 JDK 17 이상을 사용해야 한다. 01. 스프..

CSS 미디어쿼리란? CSS 미디어쿼리는 브라우저의 환경에 따라 CSS 스타일을 적용하는 방법입니다. 미디어쿼리는 @media 키워드로 시작하며, 미디어 유형과 미디어 표현식을 괄호로 묶습니다. @media screen and (max-width: 600px) { /* 화면 너비가 600px 이하일 때 적용되는 CSS */ } 위 예시에서는 화면 너비가 600px 이하일 때 @media 블록 내의 CSS가 적용됩니다. CSS 미디어쿼리 활용방법 CSS 미디어쿼리는 화면 너비, 해상도, 장치 유형 등 브라우저의 환경에 따라 다양한 방식으로 활용할 수 있습니다. 다음은 몇 가지 예시입니다. 화면 너비에 따른 스타일링 화면 너비에 따라 다른 스타일을 적용하는 것은 CSS 미디어쿼리의 가장 기본적인 사용법입니다..