<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0">
  <channel>
    <title>코히의 개발 스토리</title>
    <link>https://sujspace.tistory.com/</link>
    <description>IT 웹 백엔드 개발자 입니다. 여기는 개발하는 과정에서 다양하게 작성하는 공간입니다.  </description>
    <language>ko</language>
    <pubDate>Thu, 25 Jun 2026 12:04:10 +0900</pubDate>
    <generator>TISTORY</generator>
    <ttl>100</ttl>
    <managingEditor>suj-space</managingEditor>
    <image>
      <title>코히의 개발 스토리</title>
      <url>https://tistory1.daumcdn.net/tistory/5962305/attach/0f66d64c802d44158334c6e1ec7c9a12</url>
      <link>https://sujspace.tistory.com</link>
    </image>
    <item>
      <title>Spring Boot 기초 맛보기</title>
      <link>https://sujspace.tistory.com/25</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;오늘부터는 제가 제일 메인으로 다루는 Spring Boot에 대해서도 알아보려고 합니다. 이번 포스팅에서는 기초 개념정도만 다뤄볼게요.&amp;nbsp; Spring Boot는 개발자가 Spring Framework에서 프로젝트를 착수할 때 많은 작업을 줄여주고, 더욱 높은 생산성으로 개발이 가능하게 해주는 &lt;b&gt;프레임워크&lt;/b&gt;입니다. 이번에는 Spring Boot의 특징과 장점, 그리고 간단한 예제 코드를 통해 Spring Boot의 간단한 사용법을 알아보겠습니다.&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/baMMxH/btsrgp691Uh/lwFMhgl6gzxIKaeLJUrnJ0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/baMMxH/btsrgp691Uh/lwFMhgl6gzxIKaeLJUrnJ0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/baMMxH/btsrgp691Uh/lwFMhgl6gzxIKaeLJUrnJ0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbaMMxH%2Fbtsrgp691Uh%2FlwFMhgl6gzxIKaeLJUrnJ0%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;썸네일&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Spring Boot의 특징&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;스프링 프레임워크 기반&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Spring Boot는 스프링 프레임워크의 자동화된 구성을 기반으로 하고 있습니다. 기존의 스프링 기술들을 계속해서 사용할 수 있으며, IoC와 Spring MVC, AOP, JDBC 등 다양한 기능들을 사용할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;자동 설정&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;스프링 부트는 자동 설정(Auto Configuration) 기능을 이용하여 개발자가 직접 설정 파일을 작성하지 않아도 프로젝트를 구성할 수 있습니다. 스프링 부트는 다양한 환경에서 자동으로 구성하며 구성이 제대로 이루어지지 않았을 때는 자동으로 오류 메시지를 출력합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;내장 서버&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;스프링 부트는 기본적으로 톰캣(Tomcat)과 같은 웹 서버를 내장하고 있습니다. 이는 별도의 서버를 설치하지 않아도 쉽게 서버를 실행할 수 있으며, 더욱 간편한 환경 구성이 가능합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;스타터 종속성(dependency)&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Spring Boot에서는 의존성 관리(dependency management)를 위한 스타터(starter) 종속성을 제공합니다. 이를 이용하면 개발자는 간단한 설정만으로 필요한 라이브러리들을 쉽게 가져올 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;편리한 테스트&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Spring Boot는 JUnit과 같은 테스트 프레임워크와 연동되어 있으며, 간단한 설정만으로 테스트를 설정하고 실행할 수 있습니다. 특히 Mockito와 같은 모의(mock) 객체를 이용한 테스트를 쉽게 구현할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;외부 설정&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Spring Boot에서는 YAML과 같은 파일들을 이용하여 환경 변수(environment variables)를 쉽게 설정할 수 있습니다. 또한 설정 파일들은 Java Config, XML, Groovy와 같은 다양한 형식으로 지원됩니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Spring Boot의 장점&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;간단한 설정&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Spring Boot에서는 YAML이나 프로퍼티 파일을 통해 간단한 설정을 바로 바꿀 수 있습니다. 설정 파일을 변경함으로써 프로그램을 수정할 수 있으며, 이를 통해 더욱 높은 코드 유연성을 얻을 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;빠른 개발 속도&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Spring Boot는 자동 구성, 자동 설정 등을 통해 개발 속도를 크게 높여줍니다. 또한, 자동화된 테스트 실행과 간단한 빌드와 배포 과정이 개발의 생산성을 높여줍니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;높은 확장성&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Spring Boot는 스프링 프레임워크의 완벽한 지원과 유연한 설정을 통해 다양한 플랫폼과 기존 시스템에 쉽게 통합될 수 있습니다. 이를 통해 높은 확장성을 가진 애플리케이션을 개발할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;간편한 배포&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Spring Boot는 내장 서버를 통해 간단한 배포가 가능합니다. 스프링 부트가 포함된 JAR 파일만 있으면, 별도의 웹 서버 설치 없이 스프링 부트를 실행할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Spring Boot 예제 코드&lt;/b&gt;&lt;/h3&gt;
&lt;pre id=&quot;code_1692022904960&quot; class=&quot;java&quot; data-ke-language=&quot;java&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;@RestController
public class HelloController {
    @GetMapping(&quot;/hello&quot;)
    public String hello() {
        return &quot;Hello, Spring Boot!&quot;;
    }
}

@SpringBootApplication
public class Application {
    public static void main(String[] args) {
        SpringApplication.run(Application.class, args);
    }
}&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Spring Boot는 스프링 프레임워크를 기반으로 하여 자동 설정 기능, 내장 서버, 스타터 종속성, 편리한 테스트 등 다양한 기능을 제공하는 프레임워크입니다. 이를 통해 빠르고 간편하게 웹 애플리케이션을 개발할 수 있습니다. Spring Boot는 빠른 개발 속도, 높은 코드 유연성, 간편한 배포 등의 장점을 제공하며, 다양한 라이브러리와 플러그인을 유연하게 통합할 수 있습니다. 앞으로도 Spring Boot를 다룬 주제들을 많이 가져올게요!&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;</description>
      <category>개발/프로그래밍</category>
      <category>java</category>
      <category>Spring Boot</category>
      <category>스프링</category>
      <category>스프링부트</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/25</guid>
      <comments>https://sujspace.tistory.com/25#entry25comment</comments>
      <pubDate>Mon, 14 Aug 2023 23:36:25 +0900</pubDate>
    </item>
    <item>
      <title>제이쿼리(jQuery) 기초 맛보기</title>
      <link>https://sujspace.tistory.com/24</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;제이쿼리(jQuery)는 HTML 문서 객체를 제어하는 &lt;b&gt;자바스크립트 라이브러리&lt;/b&gt; 중 하나로 매우 강력하고 유용한 기능들을 제공합니다. 이번 글에서는 &lt;b&gt;제이쿼리의 기초적인 사용 방법&lt;/b&gt;과 주요 기능들에 대해 자세하게 알아보겠습니다.&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;제목을 입력해주세요_-001 (4).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/PFdED/btsq50eTusA/3B4c5GowXsgFuQABEyO8wk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/PFdED/btsq50eTusA/3B4c5GowXsgFuQABEyO8wk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/PFdED/btsq50eTusA/3B4c5GowXsgFuQABEyO8wk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FPFdED%2Fbtsq50eTusA%2F3B4c5GowXsgFuQABEyO8wk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;썸네일&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;제목을 입력해주세요_-001 (4).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;제이쿼리 시작하기&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;제이쿼리를 사용하려면 먼저 HTML 문서에 적용할 제이쿼리 라이브러리 파일을 불러와야 합니다. 일반적으로는 CDN을 이용하여 불러옵니다. 이제 제이쿼리를 사용해서 HTML 요소를 조작하고 이벤트 처리를 할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;HTML 요소 선택&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;제이쿼리를 사용하여 HTML 요소를 선택할 때는 CSS 선택자(selector)를 사용합니다. 제이쿼리는 모든 HTML 요소 노드를 다룰 수 있으며, 선택한 요소에 대해 다양한 조작을 할 수 있습니다. 선택 방법은 아래와 같습니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691859636253&quot; class=&quot;javascript&quot; data-ke-language=&quot;javascript&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;$(selector)&lt;/code&gt;&lt;/pre&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li&gt;$ 기호로 시작합니다.&lt;/li&gt;
&lt;li&gt;selector로 선택자를 입력합니다.&lt;/li&gt;
&lt;/ul&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;다음과 같은 HTML 요소가 있다고 가정해 봅시다.&lt;/p&gt;
&lt;pre id=&quot;code_1691859702516&quot; class=&quot;html xml&quot; data-ke-language=&quot;html&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;div id=&quot;test&quot;&amp;gt;Hello, world!&amp;lt;/div&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;ID 선택자 #를 사용하여 제이쿼리로 이 요소를 선택할 수 있습니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691859763493&quot; class=&quot;javascript&quot; data-ke-language=&quot;javascript&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;$(&quot;#test&quot;)

$(&quot;#test&quot;).text(&quot;Hello, jQuery!&quot;); // text() 메서드를 이용하여 내부 텍스트를 변경&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;이벤트 처리 &lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;제이쿼리를 사용하여 HTML 요소에서 발생하는 이벤트를 처리할 때는 .on() 메서드를 사용합니다. .on() 메서드는 다음과 같은 형식으로 사용할 수 있습니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691859904430&quot; class=&quot;javascript&quot; data-ke-language=&quot;javascript&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;$(selector).on(event, function() {
  // 실행될 코드
});&lt;/code&gt;&lt;/pre&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li&gt;event에는 이벤트 이름을 입력합니다. ex) click, focus, submit 등&lt;/li&gt;
&lt;li&gt;function() 안에는 이벤트가 발생했을 때 실행될 코드를 작성합니다.&lt;/li&gt;
&lt;/ul&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;이번엔 다음과 같은 HTML 요소가 있다고 가정할게요.&lt;/p&gt;
&lt;pre id=&quot;code_1691861994159&quot; class=&quot;html xml&quot; data-ke-language=&quot;html&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;button id=&quot;myButton&quot;&amp;gt;Click me&amp;lt;/button&amp;gt;
&amp;lt;div id=&quot;output&quot;&amp;gt;&amp;lt;/div&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;버튼을 클릭했을 때, 위의 output 요소에 &quot;버튼이 클릭되었습니다!&quot;라는 텍스트를 적어보겠습니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691862021811&quot; class=&quot;javascript&quot; data-ke-language=&quot;javascript&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;$(&quot;#myButton&quot;).on(&quot;click&quot;, function() {
  $(&quot;#output&quot;).text(&quot;버튼이 클릭되었습니다!&quot;);
});&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;주요 기능&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;제이쿼리는 HTML 요소의 속성이나 CSS 스타일을 자유롭게 변경할 수 있는 기능 외에도 다양한 기능을 제공합니다. 이제 다음 기능들에 대해서 알아보겠습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;HTML 조작&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;제이쿼리를 사용하여 HTML 요소의 내용(content), 속성(attribute), 스타일(style) 등을 변경할 수 있습니다.&lt;/p&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li&gt;.html(): 내부 HTML을 조작&lt;/li&gt;
&lt;li&gt;.text(): 내부 텍스트를 조작&lt;/li&gt;
&lt;li&gt;.attr(): 요소의 속성을 변경&lt;/li&gt;
&lt;li&gt;.css(): 스타일을 변경&lt;/li&gt;
&lt;/ul&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;이펙트 구현&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;제이쿼리를 사용하여 웹 페이지에 이펙트를 구현할 수 있습니다.&lt;/p&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li&gt;.show(): 요소를 나타냄&lt;/li&gt;
&lt;li&gt;.hide(): 요소를 숨김&lt;/li&gt;
&lt;li&gt;.toggle(): 요소를 보이고 숨김을 반복&lt;/li&gt;
&lt;li&gt;.fadeIn(): 요소를 서서히 나타냄&lt;/li&gt;
&lt;li&gt;.fadeOut(): 요소를 서서히 사라지게 함&lt;/li&gt;
&lt;li&gt;.slideUp(): 요소를 위쪽으로 밀어 올리면서 숨김&lt;/li&gt;
&lt;li&gt;.slideDown(): 요소를 아래쪽으로 당겨 내리면서 보여줌&lt;/li&gt;
&lt;li&gt;.slideToggle(): 요소를 위쪽, 아래쪽으로 반복해서 보이고 숨김&lt;/li&gt;
&lt;li&gt;.animate(): CSS 속성을 서서히 변경하여 애니메이션을 구현&lt;/li&gt;
&lt;/ul&gt;
&lt;pre id=&quot;code_1691862427302&quot; class=&quot;javascript&quot; data-ke-language=&quot;javascript&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;$(&quot;#myBtn&quot;).on(&quot;click&quot;, function() {
  $(&quot;#box&quot;).fadeIn(1000);
});&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;이벤트 처리&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;제이쿼리를 사용하여 이벤트 처리를 할 수 있습니다.&lt;/p&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li&gt;.on(): 이벤트 리스너를 추가&lt;/li&gt;
&lt;li&gt;.off(): 이벤트 리스너를 제거&lt;/li&gt;
&lt;/ul&gt;
&lt;pre id=&quot;code_1691862416534&quot; class=&quot;javascript&quot; data-ke-language=&quot;javascript&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;$(&quot;#myBtn&quot;).on({
  mouseenter: function() {
    $(this).addClass(&quot;active&quot;);
  },
  mouseleave: function() {
    $(this).removeClass(&quot;active&quot;);
  }
});&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;오늘은 제이쿼리(jQuery) 주요 기능에 대해 알아보았습니다. HTML 요소를 선택하고 이벤트 처리를 쉽게 구현할 수 있으며, 내용 조작, 스타일 변경, 이펙트 구현 등 다양한 기능을 제공합니다. 이번 내용에서는 기초만 다뤘지만 엄청 강력한 라이브러리들이 더 존재합니다. 앞으로도 계속 다뤄보겠습니다! 감사합니다!&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/프로그래밍</category>
      <category>jquery</category>
      <category>자바스크립트</category>
      <category>제이쿼리</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/24</guid>
      <comments>https://sujspace.tistory.com/24#entry24comment</comments>
      <pubDate>Sun, 13 Aug 2023 03:19:13 +0900</pubDate>
    </item>
    <item>
      <title>JSP에서 AJAX를 활용한 비동기 처리</title>
      <link>https://sujspace.tistory.com/23</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;오늘도 JSP입니다. 이번 포스팅에서는 AJAX를 배워보려고 해요. AJAX는 자바스크립트와 XML을 이용하여 비동기적으로 서버와 브라우저가 데이터를 주고받을 수 있는 기술입니다. AJAX를 이용하면 &lt;b&gt;페이지 전부를 새로고침하지 않고도 필요한 부분만 갱신&lt;/b&gt;할 수 있으므로, 더 나은 사용자 경험을 제공하는 동시에 서버 부하도 줄일 수 있습니다. JSP에서 AJAX를 활용한 비동기 데이터 처리를 구현하는 방법에 대해 설명하겠습니다.&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;제목을 입력해주세요_-001 (2).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/Z9pgp/btsqKAo8uEq/WCQOe5ciOc6fEj3nEf9nr1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/Z9pgp/btsqKAo8uEq/WCQOe5ciOc6fEj3nEf9nr1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/Z9pgp/btsqKAo8uEq/WCQOe5ciOc6fEj3nEf9nr1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FZ9pgp%2FbtsqKAo8uEq%2FWCQOe5ciOc6fEj3nEf9nr1%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;썸네일&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;제목을 입력해주세요_-001 (2).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;AJAX 기본 개념&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;AJAX는 비동기적으로 데이터를 처리하는 기술로, 일반적으로 jQuery나 JavaScript를 이용하여 구현합니다. AJAX 요청을 보내기 위해서는&amp;nbsp; $. ajax() 메서드나 $.post(), $.get() 메서드 등이 사용됩니다. 이 메서드들은 HTTP 요청을 보내고 응답을 받는 비동기적인 방식으로 동작이 가능합니다. 그리고 요청이 완료되면 이벤트 핸들러가 호출되어 결과가 처리됩니다.&amp;nbsp;&lt;/p&gt;
&lt;pre id=&quot;code_1691721509378&quot; class=&quot;javascript&quot; data-ke-language=&quot;javascript&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;$.ajax({
    url: &quot;요청 URL&quot;,
    type: &quot;HTTP 요 방식(GET 또는 POST)&quot;,
    data: &quot;HTTP 요청 데이터&quot;,
    dataType: &quot;HTTP 응답 데이터 타입(JSON, XML 등)&quot;,
    success: function(response){
        // 요청이 성공했을 때 실행할 코드
    },
    error: function(xhr, status, error){
        // 요청이 실패했을 때 실행할 코드
    }
});&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;JSP에서 AJAX 사용하기&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;JSP에서 AJAX를 사용하기 위해서는 $.ajax()` 메서드를 이용하여 서버로 데이터를 전송하고, 이를 처리할 서블릿을 작성해야 합니다. 이번 예제에서는, JSP에서 입력한 값을 서블릿으로 전송하고, 서블릿에서 처리한 결과를 JSP에 출력하는 방법을 보여드릴게요.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;2.1. JSP 페이지 작성하기 &lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;우선 사용자가 입력할 수 있는 폼을 작성해야 합니다. 이 폼에서 입력한 값을 서버로 전송하고, 서버에서 이를 처리한 결과를 받아와서 출력해 보겠습니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691721538880&quot; class=&quot;html xml&quot; data-ke-language=&quot;html&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;form id=&quot;form&quot; method=&quot;post&quot;&amp;gt;
    &amp;lt;label forname&quot;&amp;gt;이름:&amp;lt;/label&amp;gt;
    &amp;lt;input type=&quot;text&quot; id=&quot;name&quot; name=&quot;name&quot;/&amp;gt;
    &amp;lt;br/&amp;gt;
    &amp;lt;label for=&quot;age&quot;&amp;gt;나이:&amp;lt;/label&amp;gt;
    &amp;lt;input type=&quot;text&quot; id=&quot;age&quot; name=&quot;age&quot;/&amp;gt;
    &amp;lt;br/&amp;gt;
    &amp;lt;button type=&quot;submit&quot;&amp;gt;전송&amp;lt;/&amp;gt;
&amp;lt;/form&amp;gt;
&amp;lt;div id=&quot;result&quot;&amp;gt;&amp;lt;/div&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;위 코드에서 form 요소는 사용자가 입력한 데이터를 서버로 전송하기 위한 폼입니다. name과 age 필드를 입력하고, 전송 버튼을 클릭하면 서버로 데이터가 전송됩니다. result 요소는 서버에서 처리한 결과를 출력할 영역입니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;2.2. AJAX 요청 보내기 &lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;다음으로 $.ajax() 메서드를 이용하여 AJAX 요청을 보내는 JavaScript 코드를 작성해야 합니다. 이 코드는 사용자가 입력한 데이터를버로 전송하고, 서버에서 처리한 결과를 받아와서, result 요소에 출력합니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691726629032&quot; class=&quot;javascript&quot; data-ke-language=&quot;javascript&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;$(document).ready(function(){
    $(&quot;#form&quot;).submit(function(event){
        event.preventDefault(); // 폼 기본 동작 방지(브라우저 새로고침)

        var name = $(&quot;#name&quot;).val();
        var age = $(&quot;#age&quot;).val();

        $.ajax({
            url: &quot;servletUrl&quot;,
            type: &quot;POST&quot;,
            data: {name: name, age: age},
            dataType: &quot;text&quot;,
            success: function(response){
                $(&quot;#result&quot;).html(response);
            },
            error: function(xhr, status, error){
                $(&quot;#result&quot;).html(&quot;오류: &quot; + error);
            }
        });
    });
});&lt;/code&gt;&lt;/pre&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li&gt;submit() 메서드는 사용자가 폼을 전송할 때 호출되는 이벤트 핸들러입니다.&lt;/li&gt;
&lt;li&gt;val() 메서드는 해당 요소의 값(value)을 반환합니다.&lt;/li&gt;
&lt;li&gt;$.ajax() 메서드에서는 data 매개변수에 전송할 데이터를 객체 형태로 전달합니다.&lt;/li&gt;
&lt;li&gt;dataType 매개변수는 서버에서 반환하는 데이터의 타입을 지정합니다.&lt;/li&gt;
&lt;li&gt;success() 함수와 error() 함수 요청이 성공했을 때와 실패했을 때 호출됩니다.&lt;/li&gt;
&lt;/ul&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;2.3. 서블릿에서 요청 처리하기&lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;JSP 페이지에서 작성된 데이터를 받아서 처리하는 서블릿을 작성해야 합니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691726662404&quot; class=&quot;java&quot; data-ke-language=&quot;java&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;@WebServlet(&quot;/servletUrl&quot;)
public class MyServlet extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        String name = request.getParameter(&quot;name&quot;);
        int age = Integer.parseInt(request.getParameter(&quot;age&quot;));

        String result = name + &quot;님은 &quot; + age + &quot;살입니다.&quot;;

        response.setContentType(&quot;text/plain&quot;);
        response.setCharacterEncoding(&quot;UTF-8&quot;);
        response.getWriter().write(result);
    }
}&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;doPost() 메서드는 POST 요청을 처리하는 메서드입니다. request.getParameter() 메서드를 이용하여 JSP 페이지 전송한 데이터를 받아서 처리한 결과를 클라이언트에게 전송합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: #333333; text-align: start;&quot;&gt;오늘은 AJAX에 대해 알아보았습니다.&lt;span&gt; &lt;/span&gt;&lt;/span&gt;JSP에서 AJAX를 활용하면 웹페이지의 일분만 갱신하는 등 좀 더 빠른 사용자 경험을 제공할 수 있습니다.&amp;nbsp; 포스팅한 방법을 참고하여 AJAX를 활용해 보세요. 이를 통해 웹페이지에 필요한 부분만 갱신하여 더 효율적으로 작동시킬 수 있습니다! 감사합니다!&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #fff357 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;함께 보면 좋은 글&lt;/b&gt;&lt;/h3&gt;
&lt;figure id=&quot;og_1691727172079&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;JSP 태그 JSTL 사용방법&quot; data-og-description=&quot;오늘은 JSP에 대해 내용을 준비해 보았습니다. JSP 표준 태그 라이브러리 JSTL은 JSP 페이지의 코딩을 더 간결하고 이해하기 쉽게 만들어 주는 커스텀 태그 모음입니다. 오늘 포스팅에서는 JSTL의 주&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/22&quot; data-og-url=&quot;https://sujspace.tistory.com/22&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/dBvEch/hyTCDoX0I5/kyKknSSus7nymAbTihYX3k/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/zPQxL/hyTBCrE7Qa/dBJDoPIOk1ltN5ZFBq9yq1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/ZV6hD/hyTBxw7H2z/PqKSLtrNkAneNMBOBXrW30/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/22&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/22&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/dBvEch/hyTCDoX0I5/kyKknSSus7nymAbTihYX3k/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/zPQxL/hyTBCrE7Qa/dBJDoPIOk1ltN5ZFBq9yq1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/ZV6hD/hyTBxw7H2z/PqKSLtrNkAneNMBOBXrW30/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;JSP 태그 JSTL 사용방법&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;오늘은 JSP에 대해 내용을 준비해 보았습니다. JSP 표준 태그 라이브러리 JSTL은 JSP 페이지의 코딩을 더 간결하고 이해하기 쉽게 만들어 주는 커스텀 태그 모음입니다. 오늘 포스팅에서는 JSTL의 주&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/프로그래밍</category>
      <category>ajax</category>
      <category>java</category>
      <category>javascript</category>
      <category>jsp</category>
      <category>jstl</category>
      <category>비동기</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/23</guid>
      <comments>https://sujspace.tistory.com/23#entry23comment</comments>
      <pubDate>Fri, 11 Aug 2023 13:13:55 +0900</pubDate>
    </item>
    <item>
      <title>JSP 태그 JSTL 사용방법</title>
      <link>https://sujspace.tistory.com/22</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;오늘은 JSP에 대해 내용을 준비해 보았습니다. JSP 표준 태그 라이브러리 JSTL은 JSP 페이지의 코딩을 더 간결하고 이해하기 쉽게 만들어 주는 커스텀 태그 모음입니다. 오늘 포스팅에서는 JSTL의 주요 기능을 간략하게 살펴보고, 직접 적용해 볼 수 있는 예제까지 같이 살펴보겠습니다!&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;제목을 입력해주세요_-001 (3).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/cawyG0/btsqKwtge2C/pgkJSeGfgaSUMNkTb3P3jk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/cawyG0/btsqKwtge2C/pgkJSeGfgaSUMNkTb3P3jk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/cawyG0/btsqKwtge2C/pgkJSeGfgaSUMNkTb3P3jk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FcawyG0%2FbtsqKwtge2C%2FpgkJSeGfgaSUMNkTb3P3jk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;썸네일&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;제목을 입력해주세요_-001 (3).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;JSTL 개념&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;JSTL은 웹 애플리케이션 개발자가 JSP 페이지에서 자주 사용하는 일반적인 기능을 처리하기 위한 여러 태그들을 제공합니다. JSTL은 코어 태그, 조건 태그, 반복 태그, 국제화(i18n) 및 형식 태그, SQL 태그, XML 태그로 분류할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;JSTL 설치 및 설정&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;JSTL을 사용하려면 먼저 관련 라이브러리를 다운로드하고, 아래와 같이 태그를 사용하기 위한 설정을 해야 합니다. 필요한 라이브러리는 다음과 같습니다.&lt;/p&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li&gt;jstl.jar&lt;/li&gt;
&lt;li&gt;standard.jar&lt;/li&gt;
&lt;/ul&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;다운로드한 라이브러리 파일을 프로젝트의 WEB-INF/lib 경로에 복사한 후, JSP 페이지 상단에 다음과 같이 taglib을 추가합니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691675889662&quot; class=&quot;html xml&quot; data-ke-language=&quot;html&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;%@ taglib prefix=&quot;c&quot; uri=&quot;http://java.sun.com/jsp/jstl/core&quot; %&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;JSTL 주요 태그&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;이제 JSTL의 주요 태그들을 살펴보겠습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;3.1 코어 태그&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;코어 태그는 변수 조작, 흐름 제어 등 기본적인 작업을 수행하는 데 사용됩니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;c:set 변수를 설정하거나 수정합니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691675999340&quot; class=&quot;html xml&quot; data-ke-language=&quot;html&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;!-- c:set: 변수를 설정하거나 수정합니다. --&amp;gt;
&amp;lt;c:set var=&quot;name&quot; value=&quot;John&quot;/&amp;gt; 

&amp;lt;!-- c:remove: 변수를 제거합니다. --&amp;gt;
&amp;lt;c:remove var=&quot;name&quot;/&amp;gt; 

&amp;lt;!-- c:if: 조건이 참일 경우 해당 블록을 실행합니다. --&amp;gt;
&amp;lt;c:if test=&quot;${age &amp;gt;= 20}&quot;&amp;gt;
    성인입니다.
&amp;lt;/c:if&amp;gt;

&amp;lt;!-- c:choose, c:when, c:otherwise: 다중 조건 판단을 수행합니다. --&amp;gt;
&amp;lt;c:choose&amp;gt;
    &amp;lt;c:when test=&quot;${age &amp;lt; 13}&quot;&amp;gt;
        어린이입니다.
    &amp;lt;/c:when&amp;gt;
    &amp;lt;c:when test=&quot;${age &amp;gt;= 13 &amp;amp;&amp;amp; age &amp;lt; 20}&quot;&amp;gt;
        청소년입니다.
    &amp;lt;/c:when&amp;gt;
    &amp;lt;c:otherwise&amp;gt;
        성인입니다.
    &amp;lt;/c:otherwise&amp;gt;
&amp;lt;/c:choose&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;3.2 반복 태그&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;반복 태그는 리스트나 배열, 코렉션을 순회하면서 작업을 수행합니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691676174800&quot; class=&quot;html xml&quot; data-ke-language=&quot;html&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;!-- c:forEach: 주어진 범위 내에서 반복 작업을 수행합니다. --&amp;gt;
&amp;lt;c:forEach items=&quot;${names}&quot; var=&quot;name&quot;&amp;gt;
    이름: ${name}
&amp;lt;/c:forEach&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;3.3 형식 및 국제화 태그&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;형식 및 국제화 태그는 숫자, 날짜, 시간 및 통화와 같은 값의 형식을 지정하고 제어하는 데 사용됩니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691676328365&quot; class=&quot;html xml&quot; data-ke-language=&quot;html&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;!-- fmt:formatNumber:숫자를 지정된 형식으로 출력합니다. --&amp;gt;
&amp;lt;fmt:formatNumber value=&quot;${1000}&quot; pattern=&quot;#,###&quot; /&amp;gt;

&amp;lt;!-- fmt:formatDate: 날짜를 지정된 형식으로 출력합니다. --&amp;gt;
&amp;lt;fmt:formatDate value=&quot;${dateObj}&quot; pattern=&quot;yyyy-MM-dd&quot; /&amp;gt;

&amp;lt;!-- fmt:setLocale: 로케일을 변경합니다. --&amp;gt;
&amp;lt;fmt:setLocale value=&quot;ko_KR&quot; /&amp;gt;

&amp;lt;!-- fmt:message: 리소스 번들을 사용하여 다국어 메시지를 출력합니다. ex) welcome=환영합니다! --&amp;gt;
&amp;lt;fmt:message key=&quot;welcome&quot; /&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;3.4 SQL 태그&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;SQL 태그는 JSP 페이지에서 데이터베이스와 관련된 작업을 수행할 수 있게 해 줍니다. 물론, JSP 페이지에서 데이터베이스 작업을 수행하는 것은 좋은 설계 방식이 아닙니다. 이러한 작업은 Servlet이나 DAO 클래스와 같은 백엔드 코드에서 처리하는 것이 좋습니다. 하지만 간단한 예제를 만들거나 테스트를 진행할 때 유용하게 사용할 수 있습니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691676399600&quot; class=&quot;html xml&quot; data-ke-language=&quot;html&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;!-- sql:setDataSource: 데이터 소스를 설정합니다. --&amp;gt;
&amp;lt;sql:setDataSource var=&quot;myDataSource&quot; driver=&quot;com.mysql.jdbc.Driver&quot; url=&quot;jdbc:mysql://localhost/testDB&quot; user=&quot;root&quot; password=&quot;password&quot; /&amp;gt;

&amp;lt;!-- sql:query: SQL 쿼리를 실행하여 결과를 가져옵니다. --&amp;gt;
&amp;lt;sql:query var=&quot;result&quot; dataSource=&quot;${myDataSource}&quot;&amp;gt;
    SELECT * FROM user;
&amp;lt;/sql:query&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;3.5 XML 태그&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;XML 태그는 JSP 페이지에서 XML 문서를 처리하는 데 사용됩니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691676452218&quot; class=&quot;html xml&quot; data-ke-language=&quot;html&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;!-- x:parse: XML 문서를 파싱하여 처리 가능한 형식으로 변환합니다. --&amp;gt;
&amp;lt;x:parse var=&quot;parsedDoc&quot; doc=&quot;${xmlData}&quot; /&amp;gt;

&amp;lt;!-- x:out: XML 노드의 내용을 출력합니다. --&amp;gt;
&amp;lt;x:out select=&quot;$parsedDoc/user/name&quot; /&amp;gt;

&amp;lt;!-- x:forEach: XML 노드를 순회하면서 작업을 수행합니다. --&amp;gt;
&amp;lt;x:forEach select=&quot;$parsedDoc/users/user&quot; var=&quot;user&quot;&amp;gt;
    id: &amp;lt;x:out select=&quot;$user/@id&quot;/&amp;gt;&amp;lt;br/&amp;gt;
    name: &amp;lt;x:out select=&quot;$user/name&quot;/&amp;gt;&amp;lt;br/&amp;gt;
&amp;lt;/x:forEach&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;오늘은 JSTL 예제코드들을 위주로 여러가지 기능들을 알아보았습니다! 이런 기능들을 잘 사용하면 좋은 게 개발자들에게 자주 사용하는 기능을 편리하게 제공하여 JSP 페이지의 가독성을 높이고 코드의 재사용성을 증가시킵니다. 이 포스팅에서 소개한 JSTL 사용법을 참고하고 적절한 상황에 적용해 보세요!&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #fff357 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;함께 보면 좋은 글&lt;/b&gt;&lt;/h3&gt;
&lt;figure id=&quot;og_1691676578492&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;JSP를 활용한 웹 애플리케이션 성능 최적화 방법&quot; data-og-description=&quot;이번 포스팅에서는 웹 애플리케이션 성능 최적화 방법을 알아보려고 합니다. 내용은 간단하게 JSP를 활용해서 알아보도록 하겠습니다. 최적화는 사용자 경험(UX)을 향상하고 빠른 응답 시간을 제&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/13&quot; data-og-url=&quot;https://sujspace.tistory.com/13&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/bHFRpB/hyTCHY8dPq/yPElBSPhAW8SUtAExuKdBk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/t7Kzr/hyTBxw2MnX/4yrPxZTAP929nQdYeFaPBk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/WgH6Y/hyTCy2b9NO/QaQCOUU1rrRLDiEdtOhPl1/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/13&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/13&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/bHFRpB/hyTCHY8dPq/yPElBSPhAW8SUtAExuKdBk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/t7Kzr/hyTBxw2MnX/4yrPxZTAP929nQdYeFaPBk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/WgH6Y/hyTCy2b9NO/QaQCOUU1rrRLDiEdtOhPl1/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;JSP를 활용한 웹 애플리케이션 성능 최적화 방법&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;이번 포스팅에서는 웹 애플리케이션 성능 최적화 방법을 알아보려고 합니다. 내용은 간단하게 JSP를 활용해서 알아보도록 하겠습니다. 최적화는 사용자 경험(UX)을 향상하고 빠른 응답 시간을 제&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/프로그래밍</category>
      <category>java</category>
      <category>jsp</category>
      <category>jstl</category>
      <category>라이브러리</category>
      <category>표준태그</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/22</guid>
      <comments>https://sujspace.tistory.com/22#entry22comment</comments>
      <pubDate>Thu, 10 Aug 2023 23:12:13 +0900</pubDate>
    </item>
    <item>
      <title>MySQL 인덱싱과 성능 최적화</title>
      <link>https://sujspace.tistory.com/21</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;오늘도 MySQL에 대해서 알아보려고 합니다. 오늘의 주제는 현업에서도 큰 효과를 봤던&lt;b&gt; 인덱싱을 이용한 최적화&lt;/b&gt;에대해 알아보겠습니다. MySQL 데이터베이스에서 인덱싱은 데이터 &lt;b&gt;검색 속도를 빠르게 하는 데 중요한 요소&lt;/b&gt;입니다. 그래서 MySQL 데이터베이스의 인덱싱과 성능 최적화 방법을 살펴보며, 실제로 적용해 볼 수 있는 간단한 예제 코드도 살펴보겠습니다.&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;제목을 입력해주세요_-001 (2).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/biNJTq/btsqLS2DTzo/MSKcHbes3MGdNuojiCbcBk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/biNJTq/btsqLS2DTzo/MSKcHbes3MGdNuojiCbcBk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/biNJTq/btsqLS2DTzo/MSKcHbes3MGdNuojiCbcBk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbiNJTq%2FbtsqLS2DTzo%2FMSKcHbes3MGdNuojiCbcBk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;썸네일&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;제목을 입력해주세요_-001 (2).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;인덱싱 이해하기&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;인덱스는 데이터베이스에서 데이터를 빨리 찾을 수 있도록 도와주는 중요한 데이터 구조입니다. 인덱스는 책의 색인처럼 동작하며, 데이터 검색 시간을 크게 줄여줍니다. 인덱스를 사용하면 데이터 행의 물리적인 정렬과 상관없이 빠르게 데이터에 접근할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;인덱스 종류&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;MySQL은 주로 다음의 인덱스 종류를 사용합니다:&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;Primary Key&lt;/b&gt; : 기본 키는 각 행에 고유한 값을 가지며, 인덱싱하기에 적합한 것으로 자동으로 생성됩니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;Unique Index&lt;/b&gt; : 유니크 인덱스는 고유한 값을 가지는 열에 사용되며 중복을 방지할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;Index&lt;/b&gt; : 일반적인 인덱스로, 열의 값들을 빨리 찾을 수 있게 도와줍니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;인덱스 최적화 기법&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;최적화된 인덱스 사용을 통해 데이터베이스 성능을 크게 향상시킬 수 있습니다. 다음은 인덱스 최적화에 도움이 되는 몇 가지 기법입니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;적절한 열 선택&lt;/b&gt; : WHERE 절과 JOIN 조건에 자주 사용되는 열에 인덱스를 설정합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;복합 인덱스 사용&lt;/b&gt; : 두 개 이상의 열을 결합해 인덱스를 생성하면 복잡한 쿼리에도 높은 성능을 보장할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;커버링 인덱스 활용&lt;/b&gt; : SELECT 절에서 필요한 모든 열을 인덱스로 사용하는 것입니다. 이를 통해 불필요한 데이터 읽기를 최소화할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;예제 코드&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;아래는 employees 테이블에서 last_name 열에 인덱스를 추가하는 예제 코드입니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691591764812&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;CREATE INDEX last_name_idx ON employees (last_name);&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;이제 EXPLAIN을 사용하여 인덱스의 효율성을 확인해보겠습니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691591786728&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;EXPLAIN SELECT * FROM employees WHERE last_name='Doe';&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;이 코드를 실행하면 인덱스가 성공적으로 사용되어 성능 향상이 이루어진 것을 확인할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;MySQL에서 인덱싱과 성능 최적화를 고려하는 것은 매우 중요합니다. 다양한 인덱스 유형을 이해하고 올바르게 적용함으로써 데이터베이스의 성능을 개선할 수 있습니다. 인덱스 최적화 기법을 적극 사용하여 데이터 요청 속도를 향상하고 처리량을 높여보세요! 다음에도 개선시키는 내용을 위주로 가져와보겠습니다.&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #fff357 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;함께 보면 좋은 글&lt;/b&gt;&lt;/h3&gt;
&lt;figure id=&quot;og_1691591961565&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;MySQL JOIN 간단하게 이해하기&quot; data-og-description=&quot;이번 포스팅에서는 MySQL에서 사용되는 INNER JOIN, LEFT JOIN, RIGHT JOIN 그리고 FULL OUTER JOIN 오늘은 MySQL 데이터베이스 관리 시스템에서 많이 사용되는 JOIN에 대해 알아보겠습니다. JOIN은 두 개 이상의 테&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/18&quot; data-og-url=&quot;https://sujspace.tistory.com/18&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/BM3xS/hyTBHeQsV6/KkdkFGOf5kF2ZK4aE5B0D0/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bYrm6f/hyTBDQ3n7D/QRRjMHK5sJssGmSZk48Guk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bh6WwO/hyTBF2ozrW/C78mlyOLRbvs5NawRehnEK/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/18&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/18&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/BM3xS/hyTBHeQsV6/KkdkFGOf5kF2ZK4aE5B0D0/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bYrm6f/hyTBDQ3n7D/QRRjMHK5sJssGmSZk48Guk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bh6WwO/hyTBF2ozrW/C78mlyOLRbvs5NawRehnEK/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;MySQL JOIN 간단하게 이해하기&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;이번 포스팅에서는 MySQL에서 사용되는 INNER JOIN, LEFT JOIN, RIGHT JOIN 그리고 FULL OUTER JOIN 오늘은 MySQL 데이터베이스 관리 시스템에서 많이 사용되는 JOIN에 대해 알아보겠습니다. JOIN은 두 개 이상의 테&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;figure id=&quot;og_1691591975823&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;MySQL 외래키(FK) 제약조건 이해하기&quot; data-og-description=&quot;이번 시간에도 MySQL에 대해서 알아보려고 하는데요. 오늘 배울 MySQL 외래 키(Foreign Key) 제약 조건은 데이터베이스를 설계하고 구현하는 데 중요한 요소 중 하나입니다. 외래 키 제약 조건은 데이&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/19&quot; data-og-url=&quot;https://sujspace.tistory.com/19&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/dusjDD/hyTBu7Er3l/NTBq9acvMk7FUFEAEbpBU1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/dIClP6/hyTBCEAEJq/ZJXixmdNMeT0ha55JuzYKk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/yPrIK/hyTBtOrV8l/yVtRMXQaocBNVk6dU3wRVk/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/19&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/19&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/dusjDD/hyTBu7Er3l/NTBq9acvMk7FUFEAEbpBU1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/dIClP6/hyTBCEAEJq/ZJXixmdNMeT0ha55JuzYKk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/yPrIK/hyTBtOrV8l/yVtRMXQaocBNVk6dU3wRVk/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;MySQL 외래키(FK) 제약조건 이해하기&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;이번 시간에도 MySQL에 대해서 알아보려고 하는데요. 오늘 배울 MySQL 외래 키(Foreign Key) 제약 조건은 데이터베이스를 설계하고 구현하는 데 중요한 요소 중 하나입니다. 외래 키 제약 조건은 데이&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;figure id=&quot;og_1691591985010&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;MySQL과 NoSQL 비교하기&quot; data-og-description=&quot;오늘은 MySQL과 NoSQL을 비교해 보면서 파악해 보는 시간을 가져보겠습니다. MySQL은 관계형 데이터베이스로, SQL을 사용하여 데이터를 관리합니다. NoSQL은 스키마를 가지지 않는 데이터베이스로, 다&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/20&quot; data-og-url=&quot;https://sujspace.tistory.com/20&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/dlFAlf/hyTBvMeoMW/pmVKVTQwg1sRPJV7D06aEK/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/cnBrH7/hyTBBsa7Sp/KcwLLPIC5tQpkFEJWAy681/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/rQDlP/hyTBGfVBFS/IU3rR0WCgqVh4uhKyjmDOK/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/20&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/20&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/dlFAlf/hyTBvMeoMW/pmVKVTQwg1sRPJV7D06aEK/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/cnBrH7/hyTBBsa7Sp/KcwLLPIC5tQpkFEJWAy681/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/rQDlP/hyTBGfVBFS/IU3rR0WCgqVh4uhKyjmDOK/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;MySQL과 NoSQL 비교하기&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;오늘은 MySQL과 NoSQL을 비교해 보면서 파악해 보는 시간을 가져보겠습니다. MySQL은 관계형 데이터베이스로, SQL을 사용하여 데이터를 관리합니다. NoSQL은 스키마를 가지지 않는 데이터베이스로, 다&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/DB</category>
      <category>db</category>
      <category>MySQL</category>
      <category>인덱싱</category>
      <category>최적화</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/21</guid>
      <comments>https://sujspace.tistory.com/21#entry21comment</comments>
      <pubDate>Wed, 9 Aug 2023 23:40:33 +0900</pubDate>
    </item>
    <item>
      <title>MySQL과 NoSQL 비교하기</title>
      <link>https://sujspace.tistory.com/20</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;오늘은 &lt;u&gt;&lt;b&gt;MySQL과 NoSQL을 비교해 보면서&lt;/b&gt;&lt;/u&gt; 파악해 보는 시간을 가져보겠습니다. &lt;b&gt;MySQL은 관계형 데이터베이스&lt;/b&gt;로, SQL을 사용하여 데이터를 관리합니다. &lt;b&gt;NoSQL은 스키마를 가지지 않는 데이터베이스&lt;/b&gt;로, 다양한 유형의 데이터를 저장할 수 있습니다. 예제 코드로도 간단하게 파악해보려고 합니다. 이번엔 Python에서 MySQL과 NoSQL 데이터베이스를 다루는 방법을 알아보고, 해당 모듈을 사용한 코드 예제를 다뤄보겠습니다.&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;제목을 입력해주세요_-001 (1).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/cBv8jL/btsqBxldEcN/Kp95pI4mgKC7u6Lwqg6DyK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/cBv8jL/btsqBxldEcN/Kp95pI4mgKC7u6Lwqg6DyK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/cBv8jL/btsqBxldEcN/Kp95pI4mgKC7u6Lwqg6DyK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FcBv8jL%2FbtsqBxldEcN%2FKp95pI4mgKC7u6Lwqg6DyK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;제목을 입력해주세요_-001 (1).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;데이터 구조&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;MySQL은 관계형 데이터베이스(RDBMS)입니다. 데이터는 테이블(table)에 저장되며 관계된 테이블 간에 join 연산을 실행할 수 있습니다. MySQL은 데이터를 정형화된 형식으로 저장하며, 엄격한 데이터 일관성을 유지하는 데 적합합니다. NoSQL 데이터베이스는 데이터의 구조적 유연성을 제공합니다. 데이터는 Document, Key-Value, Column-Family 등 여러 데이터 모델에 따라 저장될 수 있습니다. 이는 비정형 데이터에 적합하며, 빠르게 적응해 변화하는 비즈니스 요구 사항에 대응할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;확장성&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;MySQL은 수평적 확장(Scaling out)과 수직적 확장(Scaling up)을 모두 지원합니다. 수직적 확장은 더 강력한 하드웨어로 업그레이드하는 것이며, 수평적 확장은 여러 노드에 걸쳐 데이터를 분산하는 것입니다. 하지만 수직적 확장은 방대한 양의 데이터를 처리하기에 제한이 있을 수 있습니다. NoSQL 데이터베이스는 수평적 확장이 기본적으로 지원됩니다. 데이터는 여러 노드에 분산 저장되며, 이를 통해 대규모 데이터를 처리할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;속도&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;MySQL은 트랜잭션 처리에 강점을 가지며, ACID(원자성/일관성/격리성/지속성)를 지원합니다. 처리량이 작은 데이터베이스에서는 높은 퍼포먼스를 제공할 수 있습니다. NoSQL 데이터베이스는 수직적 확장과 빠른 쿼리 속도를 제공합니다. 특히, Key-Value 데이터 모델은 매우 빠른 응답 시간과 빠른 쓰기 속도를 보장합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;데이터 일관성&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;MySQL은 데이터 일관성을 보장하는 데 강점이 있습니다. 트랜잭션 처리와 무결성 제약 조건으로 데이터 일관성을 유지합니다. NoSQL 데이터베이스는 데이터 일관성을 제공하는 데 도전적입니다. 일관성이 배타적이지 않고 유연한 구조를 가지기 때문입니다. 데이터 저장소를 구성하는 서버 간의 분산 프로세스 및 네트워크 복잡성 등이 데이터 일관성을 유지하는 것을 어렵게 만듭니다. 그러나 일관성 모델, 즉 &quot;최종 일관성&quot; 및 &quot;범위 일관성&quot; 모델을 사용하여 데이터 일관성을 유지하는 데 도움을 줄 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;파이썬 예제 코드&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;MySQL을 사용하려면 우선적으로 MySQL 서버를 설치하고 데이터베이스를 생성해야합니다. 이후 MySQL 클라이언트를 사용하여 데이터베이스 서버에 연결하고 데이터베이스 작업을 수행할 수 있습니다. 아래는 MySQL 서버에 연결하고 새로운 데이터베이스를 만들고 사용자를 추가하는 간단한 예제 코드입니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691504057017&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;# MySQL 서버에 연결
mydb = mysql.connector.connect(
  host=&quot;localhost&quot;,
  user=&quot;yourusername&quot;,
  password=&quot;yourpassword&quot;
)

# MySQL 데이터베이스 생성
mycursor = mydb.cursor()
mycursor.execute(&quot;CREATE DATABASE mydatabase&quot;)

# MySQL 데이터베이스 사용자 생성
mycursor.execute(&quot;CREATE USER 'myuser'@'localhost' IDENTIFIED BY 'mypassword'&quot;)&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;MongoDB는 NoSQL 데이터베이스이므로 데이터베이스 스키마를 먼저 정의할 필요가 없습니다. MongoDB를 사용하려면 먼저 MongoDB 서버를 설치하고 PyMongo 모듈을 사용하여 Python에서 MongoDB에 연결해야 합니다. 아래는 MongoDB 서버에 연결하고 새로운 document를 추가하는 간단한 예제 코드입니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691504069881&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;# MongoDB 서버에 연결
client = pymongo.MongoClient(&quot;mongodb://localhost:27017/&quot;)

# MongoDB 데이터베이스 및 컬렉션 생성
mydb = client[&quot;mydatabase&quot;]
mycol = mydb[&quot;customers&quot;]

# MongoDB document 추가
mydict = { &quot;name&quot;: &quot;John&quot;, &quot;address&quot;: &quot;Highway 37&quot; }
x = mycol.insert_one(mydict)

# MongoDB document 조회
for x in mycol.find():
  print(x)&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;MySQL과 NoSQL 데이터베이스는 각각의 장단점을 가지며, 적절한 용도에 따라 선택해야 합니다. MySQL은 관계형 데이터베이스 시스템으로, 처리량이 작은 비즈니스 응용 프로그램에 적합합니다. NoSQL 데이터베이스는 대량의 비정형 데이터 처리 및 분산 시스템에 적합합니다. 또한, 데이터의 구조적 유연성, 확장성, 처리량, 데이터 일관성 등을 고려하여 적절한 데이터베이스를 선택하는 것이 중요합니다. 따라서 비즈니스 요구 사항 및 데이터 유형에 따라 데이터베이스를 선택하고 구현하는 것이 가장 중요합니다.&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #fff357 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;함께 보면 좋은 글&lt;/b&gt;&lt;/h3&gt;
&lt;figure id=&quot;og_1691504147243&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;MySQL 외래키(FK) 제약조건 이해하기&quot; data-og-description=&quot;이번 시간에도 MySQL에 대해서 알아보려고 하는데요. 오늘 배울 MySQL 외래 키(Foreign Key) 제약 조건은 데이터베이스를 설계하고 구현하는 데 중요한 요소 중 하나입니다. 외래 키 제약 조건은 데이&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/19&quot; data-og-url=&quot;https://sujspace.tistory.com/19&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/yeWh8/hyTAt1G5SM/TkVxG8KbhVwqKk0NQ2dq61/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/19&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/19&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/yeWh8/hyTAt1G5SM/TkVxG8KbhVwqKk0NQ2dq61/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;MySQL 외래키(FK) 제약조건 이해하기&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;이번 시간에도 MySQL에 대해서 알아보려고 하는데요. 오늘 배울 MySQL 외래 키(Foreign Key) 제약 조건은 데이터베이스를 설계하고 구현하는 데 중요한 요소 중 하나입니다. 외래 키 제약 조건은 데이&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;figure id=&quot;og_1691504166515&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;MySQL JOIN 간단하게 이해하기&quot; data-og-description=&quot;이번 포스팅에서는 MySQL에서 사용되는 INNER JOIN, LEFT JOIN, RIGHT JOIN 그리고 FULL OUTER JOIN 오늘은 MySQL 데이터베이스 관리 시스템에서 많이 사용되는 JOIN에 대해 알아보겠습니다. JOIN은 두 개 이상의 테&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/18&quot; data-og-url=&quot;https://sujspace.tistory.com/18&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/VX8RH/hyTAGmrfXR/YUSuWI6f4rRmkEWJfLJCek/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/yTNx3/hyTABk89p3/pdNBTw9TNa8SCZcIH2hJg1/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/18&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/18&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/VX8RH/hyTAGmrfXR/YUSuWI6f4rRmkEWJfLJCek/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/yTNx3/hyTABk89p3/pdNBTw9TNa8SCZcIH2hJg1/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;MySQL JOIN 간단하게 이해하기&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;이번 포스팅에서는 MySQL에서 사용되는 INNER JOIN, LEFT JOIN, RIGHT JOIN 그리고 FULL OUTER JOIN 오늘은 MySQL 데이터베이스 관리 시스템에서 많이 사용되는 JOIN에 대해 알아보겠습니다. JOIN은 두 개 이상의 테&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/DB</category>
      <category>db</category>
      <category>MySQL</category>
      <category>NoSQL</category>
      <category>데이터베이스</category>
      <category>비교</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/20</guid>
      <comments>https://sujspace.tistory.com/20#entry20comment</comments>
      <pubDate>Tue, 8 Aug 2023 23:16:25 +0900</pubDate>
    </item>
    <item>
      <title>MySQL 외래키(FK) 제약조건 이해하기</title>
      <link>https://sujspace.tistory.com/19</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;이번 시간에도 MySQL에 대해서 알아보려고 하는데요. 오늘 배울 MySQL 외래 키(Foreign Key) 제약 조건은 데이터베이스를 설계하고 구현하는 데 중요한 요소 중 하나입니다. 외래 키 제약 조건은 데이터 일관성 유지와 참조 무결성에 대한 보장을 제공합니다. 이 글에서는 MySQL에서 외래키 제약 조건의 작동 원리와 사용 방법에 대해 자세히 알아보겠습니다.&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;썸넬.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/w32dY/btsqwYobQLM/RLHTYeenuiIccIJhN45Em1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/w32dY/btsqwYobQLM/RLHTYeenuiIccIJhN45Em1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/w32dY/btsqwYobQLM/RLHTYeenuiIccIJhN45Em1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fw32dY%2FbtsqwYobQLM%2FRLHTYeenuiIccIJhN45Em1%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;썸네일&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;썸넬.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;외래 키 제약 조건이란?&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;외래 키 제약 조건(Foreign Key Constraint)은 테이블 간 관계를 유지하기 위한 제약 조건입니다. 다른 테이블의 기본 키(Primary Key)와 연결된 컬럼이 현재 테이블의 외래 키가 됩니다. 아래는 Country 테이블과 City 테이블이라는 두 개의 테이블이 있습니다. City 테이블의 CountryCode 컬럼은 Country 테이블의 Code 컬럼을 참조하는 외래 키입니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691419360731&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;CREATE TABLE Country (
  Code CHAR(2) PRIMARY KEY,
  Name VARCHAR(32) NOT NULL,
  Population INT
) ENGINE=InnoDB;

CREATE TABLE City (
  Name VARCHAR(32) NOT NULL,
  CountryCode CHAR(2),
  Population INT,
  PRIMARY KEY (Name),
  CONSTRAINT fk_City_Country FOREIGN KEY (CountryCode) REFERENCES Country(Code)
) ENGINE=InnoDB;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;기존에 Country 테이블에서 Code &quot;KR&quot;과 이름 &quot;대한민국&quot;, 인구수 100명에 해당하는 레코드가 있다고 가정해 봅시다. 이 정보를 City 테이블의 Seoul City 레코드와 연결하려면, CountryCode 컬럼에 &quot;KR&quot;을 입력하면 됩니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;pre id=&quot;code_1691419414925&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;// 도시
INSERT INTO City (Name, CountryCode, Population) 
VALUES ('Seoul', 'KR', 100);&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;위 쿼리를 실행하면, MySQL은 CountryCode &quot;KR&quot;이 Country 테이블의 Primary Key &quot;Code&quot;과 일치하는지 확인하고, 그렇지 않으면 삽입 작업을 거부합니다. 이것이 바로 MySQL에서 외래 키 제약 조건이 동작하는 방식입니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;외래 키 제약 조건의 이점&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;- 데이터 무결성 보장 &lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;외래 키 제약 조건은 데이터 일관성 유지를 보장합니다. 다른 테이블의 컬럼과 정확하게 일치하는 외래 키 값을 참조할 때만 삽입, 갱신, 삭제 작업이 수행되기 때문입니다. 따라서 데이터 일관성을 유지할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;- 관계의 유지 &lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;외래 키 제약 조건은 각 테이블 사이의 관계를 유지하도록 도와주며, 쉽게 이해할 수 있는 데이터 모델을 만들 수 있습니다. 이를 통해 더 직관적인 데이터베이스 설계를 할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;- 데이터 검색 용이성 &lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;외래 키 제약 조건은 MySQL optimizer이 JOIN 연산을 더 잘 최적화할 수 있도록 도와줍니다. 데이터 검색에 있어서, 조인 연산을 사용할 때 테이블 간의 관계를 이루고 있는 외래 키를 사용하면 비교 연산 비용을 줄일 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;외래 키 제약 조건 설정&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;외래 키 제약 조건을 설정하려면, 테이블 생성 시 CONSTRAINT 키워드를 이용하여 외래 키를 정의하면 됩니다. 아래는 City 테이블에서 CountryCode 컬럼이 외래 키 제약 조건을 가지도록 설정한 예시입니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691419730411&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;CREATE TABLE City (
  Name VARCHAR(32) NOT NULL,
  CountryCode CHAR(2),
  Population INT,
  PRIMARY KEY (Name),
  CONSTRAINT fk_City_Country FOREIGN KEY (CountryCode) REFERENCES Country(Code)
) ENGINE=InnoDB;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;위 코드에서 fk_City_Country은 외래 키 제약 조건 이름을 나타냅니다. CountryCode는 현재 테이블에서 외래 키가 되는 컬럼이고, Country 테이블의 Code 컬럼과 연결됩니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;외래 키 제거&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;외래 키 제약 조건을 제거하려면, ALTER TABLE 문을 이용하여 해당 제약 조건을 삭제할 수 있습니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691419799792&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;ALTER TABLE City DROP FOREIGN KEY fk_City_Country;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;MySQL에서 외래 키 제약 조건은 데이터베이스 설계와 구현 시 매우 중요한 요소입니다. 외래 키 제약 조건은 데이터 일관성 보장과 데이터 모델링의 유연성을 보장합니다. MySQL에서 외래 키를 사용하는 방법에 대해 이해하면 데이터베이스의 일관성과 정확성을 보장할 수 있습니다. 다음에는 다른 키 제약 조건들에 대해서도 알아보겠습니다. 감사합니다!&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #fff357 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;함께 보면 좋은 글&lt;/b&gt;&lt;/h3&gt;
&lt;figure id=&quot;og_1691419952976&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;MySQL JOIN 간단하게 이해하기&quot; data-og-description=&quot;이번 포스팅에서는 MySQL에서 사용되는 INNER JOIN, LEFT JOIN, RIGHT JOIN 그리고 FULL OUTER JOIN 오늘은 MySQL 데이터베이스 관리 시스템에서 많이 사용되는 JOIN에 대해 알아보겠습니다. JOIN은 두 개 이상의 테&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/18&quot; data-og-url=&quot;https://sujspace.tistory.com/18&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/bIjQUh/hyTAF04Dbd/7BqNfefbb06zGsQ6TnrgV1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bKRwEe/hyTy60h6F1/qNkkkgo0W1hhtPTyBpNAB1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/8WTnl/hyTAsAENb3/ISWGaM4qbUhEM7Ym0W3XK1/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/18&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/18&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/bIjQUh/hyTAF04Dbd/7BqNfefbb06zGsQ6TnrgV1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bKRwEe/hyTy60h6F1/qNkkkgo0W1hhtPTyBpNAB1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/8WTnl/hyTAsAENb3/ISWGaM4qbUhEM7Ym0W3XK1/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;MySQL JOIN 간단하게 이해하기&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;이번 포스팅에서는 MySQL에서 사용되는 INNER JOIN, LEFT JOIN, RIGHT JOIN 그리고 FULL OUTER JOIN 오늘은 MySQL 데이터베이스 관리 시스템에서 많이 사용되는 JOIN에 대해 알아보겠습니다. JOIN은 두 개 이상의 테&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;figure id=&quot;og_1691419964097&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;우분투 20.04에서 Mysql 5.7 버전 설치 방법&quot; data-og-description=&quot;이번 포스팅에서는 우분투(Ubuntu) 20.04 버전에서 Mysql 5.7 버전을 수동으로 설치하는 방법을 소개하고자 합니다. Mysql 5.7은 구버전이지만 해당 버전을 사용해야 하는 이유가 있는 경우에만 추천드&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/17&quot; data-og-url=&quot;https://sujspace.tistory.com/17&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/xxYi9/hyTy93OORr/BSZWoTp51KYpKtIqiZ81S1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bEksdI/hyTAC4myAg/ZMuD1Nehzx15D77Q0wtLjk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/x3gRJ/hyTArIwr26/IgAKI2cMpk0yDH63jfWsQK/img.png?width=1714&amp;amp;height=888&amp;amp;face=0_0_1714_888&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/17&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/17&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/xxYi9/hyTy93OORr/BSZWoTp51KYpKtIqiZ81S1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bEksdI/hyTAC4myAg/ZMuD1Nehzx15D77Q0wtLjk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/x3gRJ/hyTArIwr26/IgAKI2cMpk0yDH63jfWsQK/img.png?width=1714&amp;amp;height=888&amp;amp;face=0_0_1714_888');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;우분투 20.04에서 Mysql 5.7 버전 설치 방법&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;이번 포스팅에서는 우분투(Ubuntu) 20.04 버전에서 Mysql 5.7 버전을 수동으로 설치하는 방법을 소개하고자 합니다. Mysql 5.7은 구버전이지만 해당 버전을 사용해야 하는 이유가 있는 경우에만 추천드&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/DB</category>
      <category>FK</category>
      <category>MySQL</category>
      <category>데이터베이스</category>
      <category>외래키</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/19</guid>
      <comments>https://sujspace.tistory.com/19#entry19comment</comments>
      <pubDate>Mon, 7 Aug 2023 23:53:35 +0900</pubDate>
    </item>
    <item>
      <title>MySQL JOIN 간단하게 이해하기</title>
      <link>https://sujspace.tistory.com/18</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;이번 포스팅에서는 MySQL에서 사용되는 INNER JOIN, LEFT JOIN, RIGHT JOIN 그리고 FULL OUTER JOIN 오늘은 MySQL 데이터베이스 관리 시스템에서 많이 사용되는 JOIN에 대해 알아보겠습니다. &lt;b&gt;JOIN은 두 개 이상의 테이블에서 관련된 데이터를 가져와서 하나의 결과 집합으로 조합할 때 사용되는 기능&lt;/b&gt;입니다. MySQL에서는 여러 가지 JOIN 방식을 지원하며 각 JOIN 방식이 어떻게 데이터를 가져오는지 이해하고 알맞게 활용할 수 있다면 효율적인 데이터 추출이 가능합니다.&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;썸네일11.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/73muY/btsp8aRjjfU/8LLqQcKv2CQND4GbAaGREk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/73muY/btsp8aRjjfU/8LLqQcKv2CQND4GbAaGREk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/73muY/btsp8aRjjfU/8LLqQcKv2CQND4GbAaGREk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2F73muY%2Fbtsp8aRjjfU%2F8LLqQcKv2CQND4GbAaGREk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;썸네일&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;썸네일11.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;INNER JOIN&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;INNER JOIN은 두 테이블의 공통된 값을 기준으로 조인되며, &lt;b&gt;양쪽 테이블에서 일치하는 값만&lt;/b&gt; 결과 집합에 반환됩니다. 이 방식은 칼라 간의 일치하는 값이 있는지 찾아 합치는 것이 주된 목적입니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691328452236&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;SELECT users.name, orders.product_id 
FROM users 
INNER JOIN orders 
ON users.id = orders.user_id;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;LEFT JOIN&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;LEFT JOIN은 첫 번째 테이블의 모든 레코드를 가져오고, &lt;b&gt;두 번째 테이블에서 조인 조건에 해당하는&lt;/b&gt; 레코드를 찾아 합칩니다. 만약 조인 조건에 맞는 레코드가 없다면, 두 번째 테이블의 칼럼에 NULL 값을 반환합니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691328509936&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;SELECT users.name, orders.product_id 
FROM users 
LEFT JOIN orders 
ON users.id = orders.user_id;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;RIGHT JOIN&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;RIGHT JOIN은 두 번째 테이블의 모든 레코드를 가져오고, &lt;b&gt;첫 번째 테이블에서 조인 조건에 해당하는&lt;/b&gt; 레코드를 찾아 합칩니다. 만약 조인 조건에 맞는 레코드가 없다면, 첫 번째 테이블의 칼럼에 NULL 값을 반환합니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691328540517&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;SELECT users.name, orders.product_id 
FROM users 
RIGHT JOIN orders 
ON users.id = orders.user_id;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;FULL OUTER JOIN&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;MySQL에서는 FULL OUTER JOIN이 내장되어 있지 않지만, &lt;b&gt;LEFT JOIN과 RIGHT JOIN을 결합하여 사용&lt;/b&gt;하면 비슷한 기능을 구현할 수 있습니다. FULL OUTER JOIN은 두 테이블의 모든 레코드를 가져오며, 조인 조건에 맞지 않아서 합쳐지지 않는 레코드는 NULL 값으로 반환됩니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691328589805&quot; class=&quot;sql&quot; data-ke-language=&quot;sql&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;SELECT users.name, orders.product_id 
FROM users 
LEFT JOIN orders 
ON users.id = orders.user_id 
UNION 
SELECT users.name, orders.product_id 
FROM users 
RIGHT JOIN orders 
ON users.id = orders.user_id;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;조이인.png&quot; data-origin-width=&quot;1120&quot; data-origin-height=&quot;676&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/brVhiN/btsp64xr4ED/Gmirs3G1adryn8pHO74cN1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/brVhiN/btsp64xr4ED/Gmirs3G1adryn8pHO74cN1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/brVhiN/btsp64xr4ED/Gmirs3G1adryn8pHO74cN1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbrVhiN%2Fbtsp64xr4ED%2FGmirs3G1adryn8pHO74cN1%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;join 정리&quot; loading=&quot;lazy&quot; width=&quot;1120&quot; height=&quot;676&quot; data-filename=&quot;조이인.png&quot; data-origin-width=&quot;1120&quot; data-origin-height=&quot;676&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;여기까지 MySQL에서 사용되는 주요 JOIN 방식을 간략히 소개했습니다. 이를 통해 테이블 간 관계를 효과적으로 이해하고 데이터를 추출할 수 있는 기술을 갖추는 것이 중요합니다. 아래 이미지는 JOIN에 대한 정리를 이미지를 통해 한번에 정리된 내용입니다. 어떤 분은 이거를 익숙해질 때까지 배경화면까지 해놓는 분도 있다고 하네요ㅋㅋ 앞으로도 MySQL에서 JOIN을 사용하는 방법 및 각 JOIN 종류를 더욱 깊이 이해하며 데이터베이스 작업을 더욱 효율적으로 사용해 봅시다!&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #fff357 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;함께보면 좋은 글&lt;/b&gt;&lt;/h3&gt;
&lt;figure id=&quot;og_1691329400829&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;우분투 20.04에서 Mysql 5.7 버전 설치 방법&quot; data-og-description=&quot;이번 포스팅에서는 우분투(Ubuntu) 20.04 버전에서 Mysql 5.7 버전을 수동으로 설치하는 방법을 소개하고자 합니다. Mysql 5.7은 구버전이지만 해당 버전을 사용해야 하는 이유가 있는 경우에만 추천드&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/17?category=1045032&quot; data-og-url=&quot;https://sujspace.tistory.com/17&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/W6342/hyTy9awkTC/kLEYh8gqH873wK67RNrvFk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bQjJvU/hyTzfht9as/cHRD7usY6Z00sKPnqhfA8k/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bJtX0D/hyTxVZeAEV/EvsQNlFigYQ0Bj0DE7Bkg0/img.png?width=1714&amp;amp;height=888&amp;amp;face=0_0_1714_888&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/17?category=1045032&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/17?category=1045032&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/W6342/hyTy9awkTC/kLEYh8gqH873wK67RNrvFk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bQjJvU/hyTzfht9as/cHRD7usY6Z00sKPnqhfA8k/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/bJtX0D/hyTxVZeAEV/EvsQNlFigYQ0Bj0DE7Bkg0/img.png?width=1714&amp;amp;height=888&amp;amp;face=0_0_1714_888');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;우분투 20.04에서 Mysql 5.7 버전 설치 방법&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;이번 포스팅에서는 우분투(Ubuntu) 20.04 버전에서 Mysql 5.7 버전을 수동으로 설치하는 방법을 소개하고자 합니다. Mysql 5.7은 구버전이지만 해당 버전을 사용해야 하는 이유가 있는 경우에만 추천드&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/DB</category>
      <category>db</category>
      <category>join</category>
      <category>MySQL</category>
      <category>데이터베이스</category>
      <category>조인</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/18</guid>
      <comments>https://sujspace.tistory.com/18#entry18comment</comments>
      <pubDate>Sun, 6 Aug 2023 22:41:33 +0900</pubDate>
    </item>
    <item>
      <title>우분투 20.04에서 Mysql 5.7 버전 설치 방법</title>
      <link>https://sujspace.tistory.com/17</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;이번 포스팅에서는 &lt;u&gt;&lt;b&gt;우분투(Ubuntu) 20.04 버전에서 Mysql 5.7 버전&lt;/b&gt;&lt;/u&gt;을 수동으로 설치하는 방법을 소개하고자 합니다. Mysql 5.7은 구버전이지만 해당 버전을 사용해야 하는 이유가 있는 경우에만 추천드립니다. 우분투 20.04 APT 레파지토리에서는 기본적으로 Mysql 8.0이 설치되어 있기 때문에, &lt;b&gt;이전 버전의 Mysql인 5.7을 사용하고자 한다면 수동으로 설치&lt;/b&gt;해야 합니다. 그래서 체계적인 단계별 설명과 함께 Mysql 5.7 버전을 우분투 20.04에 수동으로 설치하는 방법을 자세히 알아보겠습니다.&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;썸넬.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/yW9Rr/btsp8Aooax1/5RgRUOXhcOVzBqf8fOKKbK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/yW9Rr/btsp8Aooax1/5RgRUOXhcOVzBqf8fOKKbK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/yW9Rr/btsp8Aooax1/5RgRUOXhcOVzBqf8fOKKbK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FyW9Rr%2Fbtsp8Aooax1%2F5RgRUOXhcOVzBqf8fOKKbK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;썸네일&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;썸넬.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Wget을 이용한 deb 수동 설치 &lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;설치 파일을 다운로드할 경로로 가서 아래 명령어를 실행해주세요.&lt;/p&gt;
&lt;pre id=&quot;code_1691225665163&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;sudo wget https://dev.mysql.com/get/mysql-apt-config_0.8.12-1_all.deb&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;deb에서 Mysql 5.7 패키지 추가&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;설치가 된 경로에서 아래 명령어를 실행해 주세요.&lt;/p&gt;
&lt;pre id=&quot;code_1691225896024&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;sudo dpkg -i mysql-apt-config_0.8.12-1_all.deb&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;저는 이미 5.7 버전을 설치해서 아래 이미지에서는 Mysql Server &amp;amp; Cluter (Currently selected: mysql-5.7)이라고 나오니 당황하지 않아도 됩니다. 우선 첫 번째 항목을 선택해 주세요.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-05 오후 5.59.19.png&quot; data-origin-width=&quot;1714&quot; data-origin-height=&quot;888&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bvFJ6v/btsp35wbqGJ/Fnw95kYEEKaMg3APJEIkBk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bvFJ6v/btsp35wbqGJ/Fnw95kYEEKaMg3APJEIkBk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bvFJ6v/btsp35wbqGJ/Fnw95kYEEKaMg3APJEIkBk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbvFJ6v%2Fbtsp35wbqGJ%2FFnw95kYEEKaMg3APJEIkBk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot; 우분투 패키지&quot; loading=&quot;lazy&quot; width=&quot;1714&quot; height=&quot;888&quot; data-filename=&quot;스크린샷 2023-08-05 오후 5.59.19.png&quot; data-origin-width=&quot;1714&quot; data-origin-height=&quot;888&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;처음에 보이는 &lt;b&gt;mysql-5.7을&lt;/b&gt; 클릭합니다. 그다음 다시 위에 있는 화면에서 네 번째에 있는 &lt;b&gt;Ok&lt;/b&gt;를 클릭해 주세요.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-05 오후 6.01.58.png&quot; data-origin-width=&quot;1706&quot; data-origin-height=&quot;884&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bKGO6K/btsqd4CkGjg/l7odCuK4KDKiT5iHPaQMYk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bKGO6K/btsqd4CkGjg/l7odCuK4KDKiT5iHPaQMYk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bKGO6K/btsqd4CkGjg/l7odCuK4KDKiT5iHPaQMYk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbKGO6K%2Fbtsqd4CkGjg%2Fl7odCuK4KDKiT5iHPaQMYk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot; 우분투 패키지2&quot; loading=&quot;lazy&quot; width=&quot;1706&quot; height=&quot;884&quot; data-filename=&quot;스크린샷 2023-08-05 오후 6.01.58.png&quot; data-origin-width=&quot;1706&quot; data-origin-height=&quot;884&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;만약에 저처럼 위와 같은 보라색 화면이 아닌 텍스트로만 진행이 된다면 아래처럼 입력해 주시면 됩니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691226245863&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;# 1. Add repository to unsupported system?
&amp;gt;&amp;gt; ubuntu bionic

# 2. Which MySQL product do you wish to configure?
&amp;gt;&amp;gt; MySQL Server &amp;amp; Cluster

# 3. Which server version do you wish to receive?
&amp;gt;&amp;gt; mysql-5.7

# 4. Which MySQL product do you wish to configure?
&amp;gt;&amp;gt; Ok&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;우분투 인증키 설치하기&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;아래 명령어를 통해 우분투 인증키를 설치해 주세요.&lt;/p&gt;
&lt;pre id=&quot;code_1691226320688&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;sudo apt-key adv --keyserver keyserver.ubuntu.com --recv-keys 467B942D3A79BD29&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;그다음 apt를 업데이트합니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691226458112&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;sudo apt-get update&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;만약 update가 진행되지 않고 아래와 같은 에러가 나왔다면 우분투 인증키 설치 때 방화벽에서 &lt;b&gt;11371 포트&lt;/b&gt;가 열려있지 않아서입니다. &lt;b&gt;OUTBOUND 정책에서 11371 포트를 열어주고&lt;/b&gt; 우분투 인증키를 다시 설치해 주고 진행해 주세요.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: #ee2323;&quot;&gt;InRelease The following signatures couldn't be verified because the public key is not available: NO_PUBKEY 467B942D3A79BD29&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Mysql 5.7 버전 설치&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;apt 업데이트가 정상적으로 이루어진 후 아래 명령어를 실행해 주세요.&lt;/p&gt;
&lt;pre id=&quot;code_1691226873501&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;sudo apt policy mysql-server&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;실행 후 맨 아래에 5.7.42 버전이 보이면 현재까지는 정상적으로 진행된 상태입니다.&amp;nbsp;&lt;/p&gt;
&lt;pre id=&quot;code_1691226920474&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;mysql-server:
  Installed: 5.7.42-1ubuntu18.04
  Candidate: 8.0.33-0ubuntu0.20.04.4
  Version table:
     8.0.33-0ubuntu0.20.04.4 500
        500 http://kr.archive.ubuntu.com/ubuntu focal-updates/main amd64 Packages
        500 http://kr.archive.ubuntu.com/ubuntu focal-updates/main i386 Packages
     8.0.33-0ubuntu0.20.04.2 500
        500 http://security.ubuntu.com/ubuntu focal-security/main amd64 Packages
        500 http://security.ubuntu.com/ubuntu focal-security/main i386 Packages
     8.0.19-0ubuntu5 500
        500 http://kr.archive.ubuntu.com/ubuntu focal/main amd64 Packages
        500 http://kr.archive.ubuntu.com/ubuntu focal/main i386 Packages
 *** 5.7.42-1ubuntu18.04 100
        100 /var/lib/dpkg/status&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;그다음 mysql 5.7 버전을 설치합니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691227091338&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;sudo apt install -f mysql-client=5.7* mysql-community-server=5.7* mysql-server=5.7*&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Mysql 설치 결과 확인&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;설치 과정에서 생성한 root 계정으로 mysql 쉘 접속을 합니다.&lt;/p&gt;
&lt;pre id=&quot;code_1691227193263&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;mysql -u root -p&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;접속한 후 버전까지 확인해 주세요.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;edited_스크린샷 2023-08-05 오후 6.21.35.png&quot; data-origin-width=&quot;1146&quot; data-origin-height=&quot;522&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/dLJJeo/btsp7pAZmSC/DQcUw6VZ5iDyEvHviS1Um0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/dLJJeo/btsp7pAZmSC/DQcUw6VZ5iDyEvHviS1Um0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/dLJJeo/btsp7pAZmSC/DQcUw6VZ5iDyEvHviS1Um0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FdLJJeo%2Fbtsp7pAZmSC%2FDQcUw6VZ5iDyEvHviS1Um0%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;mysql 성공&quot; loading=&quot;lazy&quot; width=&quot;1146&quot; height=&quot;522&quot; data-filename=&quot;edited_스크린샷 2023-08-05 오후 6.21.35.png&quot; data-origin-width=&quot;1146&quot; data-origin-height=&quot;522&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;지금까지 우분투 20.04 버전에서 Mysql 5.7 버전을 수동으로 설치하는 방법을 소개했습니다. 20.04 버전에서 지원하지 않는 Mysql 5.7 버전을 수동으로 설치하려니 간단하면서도 번거로웠습니다. 저의 경우는 서버를 이전하는 과정에서 운영체제와 Mysql 버전을 동일하게 설치해야 해서 해결한 케이스입니다.&amp;nbsp;가능하면 업데이트 잘 되어있는 Mysql 8 버전을 사용하는 것을 추천드립니다! 이번에도 포스팅 봐주셔서 감사드립니다.&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #fff357 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;함께보면 좋은 글&lt;/b&gt;&lt;/h3&gt;
&lt;figure id=&quot;og_1691329340737&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;MySQL JOIN 간단하게 이해하기&quot; data-og-description=&quot;이번 포스팅에서는 MySQL에서 사용되는 INNER JOIN, LEFT JOIN, RIGHT JOIN 그리고 FULL OUTER JOIN 오늘은 MySQL 데이터베이스 관리 시스템에서 많이 사용되는 JOIN에 대해 알아보겠습니다. JOIN은 두 개 이상의 테&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/18&quot; data-og-url=&quot;https://sujspace.tistory.com/18&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/bJKzZg/hyTxNUp8rQ/qC7vNz42FRKcqEDEpdjKe0/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/cVlpGQ/hyTxWRlRtm/Al6JKlo7EJdjKDVCXIm5k1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/Vow7a/hyTzepl4lM/mwe1HRtYw0kwKV0ZRkh4dK/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/18&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/18&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/bJKzZg/hyTxNUp8rQ/qC7vNz42FRKcqEDEpdjKe0/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/cVlpGQ/hyTxWRlRtm/Al6JKlo7EJdjKDVCXIm5k1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/Vow7a/hyTzepl4lM/mwe1HRtYw0kwKV0ZRkh4dK/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;MySQL JOIN 간단하게 이해하기&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;이번 포스팅에서는 MySQL에서 사용되는 INNER JOIN, LEFT JOIN, RIGHT JOIN 그리고 FULL OUTER JOIN 오늘은 MySQL 데이터베이스 관리 시스템에서 많이 사용되는 JOIN에 대해 알아보겠습니다. JOIN은 두 개 이상의 테&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/DB</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/17</guid>
      <comments>https://sujspace.tistory.com/17#entry17comment</comments>
      <pubDate>Sat, 5 Aug 2023 18:30:28 +0900</pubDate>
    </item>
    <item>
      <title>잼버리 대회 과거 개최국들과 한국과의 비교</title>
      <link>https://sujspace.tistory.com/16</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;한국에서도 제25회&amp;nbsp;&lt;u&gt;&lt;b&gt;잼버리 대회&lt;/b&gt;&lt;/u&gt;가 열렸습니다. 하지만 뉴스에는 한국에 들어온 잼버리 대회 학생들이 폭염 속에서 고생 중이며 안 좋은 얘기들만 가득한데요. 이 시점에서 &lt;b&gt;과거 개최국들의 모습들을 간단하게 비교&lt;/b&gt;해 보겠습니다.&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;22회 잼버리 대회 스웨덴 (2011.08)&lt;/b&gt;&lt;/h3&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-origin-width=&quot;600&quot; data-origin-height=&quot;400&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/tkgJ2/btspTKx6gNP/ycxibahLha4hlGTiowp1QK/img.jpg&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/tkgJ2/btspTKx6gNP/ycxibahLha4hlGTiowp1QK/img.jpg&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/tkgJ2/btspTKx6gNP/ycxibahLha4hlGTiowp1QK/img.jpg&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FtkgJ2%2FbtspTKx6gNP%2FycxibahLha4hlGTiowp1QK%2Fimg.jpg&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;스웨덴&quot; loading=&quot;lazy&quot; width=&quot;869&quot; height=&quot;579&quot; data-origin-width=&quot;600&quot; data-origin-height=&quot;400&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;23회 &lt;b&gt;잼버리 대회&lt;span&gt; &amp;nbsp;&lt;/span&gt;&lt;/b&gt;일본 (2015.07)&lt;/b&gt;&lt;/h3&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-03 오전 11.03.27.png&quot; data-origin-width=&quot;874&quot; data-origin-height=&quot;656&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/cbi1uD/btspTLDL0Y1/hIDCLW05vhHQcfk477dnRK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/cbi1uD/btspTLDL0Y1/hIDCLW05vhHQcfk477dnRK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/cbi1uD/btspTLDL0Y1/hIDCLW05vhHQcfk477dnRK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fcbi1uD%2FbtspTLDL0Y1%2FhIDCLW05vhHQcfk477dnRK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;일본&quot; loading=&quot;lazy&quot; width=&quot;874&quot; height=&quot;656&quot; data-filename=&quot;스크린샷 2023-08-03 오전 11.03.27.png&quot; data-origin-width=&quot;874&quot; data-origin-height=&quot;656&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;24회 &lt;b&gt;잼버리 대회&lt;span&gt; &amp;nbsp;&lt;/span&gt;&lt;/b&gt;미국 (2019.08)&lt;/b&gt;&lt;/h3&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-03 오전 11.05.38.png&quot; data-origin-width=&quot;876&quot; data-origin-height=&quot;648&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/ob5rd/btspFMYEZiD/RY2p6za1mhjLE7HtCIMwjK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/ob5rd/btspFMYEZiD/RY2p6za1mhjLE7HtCIMwjK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/ob5rd/btspFMYEZiD/RY2p6za1mhjLE7HtCIMwjK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fob5rd%2FbtspFMYEZiD%2FRY2p6za1mhjLE7HtCIMwjK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;미국&quot; loading=&quot;lazy&quot; width=&quot;876&quot; height=&quot;648&quot; data-filename=&quot;스크린샷 2023-08-03 오전 11.05.38.png&quot; data-origin-width=&quot;876&quot; data-origin-height=&quot;648&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;25회 &lt;b&gt;잼버리 대회&lt;span&gt; &amp;nbsp;&lt;/span&gt;&lt;/b&gt;한국 (2023.08)&lt;/b&gt;&lt;/h3&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-03 오전 11.15.55.png&quot; data-origin-width=&quot;874&quot; data-origin-height=&quot;492&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/D9H9Z/btspFLej2Ah/kUuVLbE0VxFj2jZ8M707m0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/D9H9Z/btspFLej2Ah/kUuVLbE0VxFj2jZ8M707m0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/D9H9Z/btspFLej2Ah/kUuVLbE0VxFj2jZ8M707m0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FD9H9Z%2FbtspFLej2Ah%2FkUuVLbE0VxFj2jZ8M707m0%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;한국 1&quot; loading=&quot;lazy&quot; width=&quot;874&quot; height=&quot;492&quot; data-filename=&quot;스크린샷 2023-08-03 오전 11.15.55.png&quot; data-origin-width=&quot;874&quot; data-origin-height=&quot;492&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-03 오전 11.16.13.png&quot; data-origin-width=&quot;879&quot; data-origin-height=&quot;587&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bNk30c/btspUgRhPtj/IzXuxXkLRkGDmuGk7gtg90/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bNk30c/btspUgRhPtj/IzXuxXkLRkGDmuGk7gtg90/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bNk30c/btspUgRhPtj/IzXuxXkLRkGDmuGk7gtg90/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbNk30c%2FbtspUgRhPtj%2FIzXuxXkLRkGDmuGk7gtg90%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;한국 2&quot; loading=&quot;lazy&quot; width=&quot;879&quot; height=&quot;587&quot; data-filename=&quot;스크린샷 2023-08-03 오전 11.16.13.png&quot; data-origin-width=&quot;879&quot; data-origin-height=&quot;587&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;&lt;b&gt;잼버리 대회&lt;span&gt;&amp;nbsp;&lt;/span&gt;&lt;/b&gt;아쉬운 점&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;현재 한국에서 잼버리 대회라고 검색만 하면 안 좋은 뉴스들로만 가득하네요. 무더위 폭염 속에서 공연까지 계속 강행 중인 잼버리 조직위도 논란 속에 있습니다. 전북 부안군 새만금에서 열리고 있는 대회에는 6년간의 준비와 막대한 예산으로 큰 기대를 걸었는데 결과는 처참합니다. 심지어 폭염 속에서 온열질환자는 속출 중이라 더 큰 파장이 우려됩니다. 무엇보다 당장 급한 문제들부터 해결되기를 바랍니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;출처 : 네이버 뉴스&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-03 오전 11.17.04.png&quot; data-origin-width=&quot;668&quot; data-origin-height=&quot;647&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bVaScS/btspNQTyoOK/aCn1uq6Q5xhsti5VSZZnd1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bVaScS/btspNQTyoOK/aCn1uq6Q5xhsti5VSZZnd1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bVaScS/btspNQTyoOK/aCn1uq6Q5xhsti5VSZZnd1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbVaScS%2FbtspNQTyoOK%2FaCn1uq6Q5xhsti5VSZZnd1%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;뉴스 요약&quot; loading=&quot;lazy&quot; width=&quot;668&quot; height=&quot;647&quot; data-filename=&quot;스크린샷 2023-08-03 오전 11.17.04.png&quot; data-origin-width=&quot;668&quot; data-origin-height=&quot;647&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-03 오후 3.33.19.png&quot; data-origin-width=&quot;663&quot; data-origin-height=&quot;441&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/cEN0HE/btspNQs1hrZ/oeK1PgeLoqOXKkMoz2LCKK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/cEN0HE/btspNQs1hrZ/oeK1PgeLoqOXKkMoz2LCKK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/cEN0HE/btspNQs1hrZ/oeK1PgeLoqOXKkMoz2LCKK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FcEN0HE%2FbtspNQs1hrZ%2FoeK1PgeLoqOXKkMoz2LCKK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;폭염&quot; loading=&quot;lazy&quot; width=&quot;663&quot; height=&quot;441&quot; data-filename=&quot;스크린샷 2023-08-03 오후 3.33.19.png&quot; data-origin-width=&quot;663&quot; data-origin-height=&quot;441&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;</description>
      <category>잡담</category>
      <category>무더위</category>
      <category>새만금</category>
      <category>스카우트</category>
      <category>온열질환자</category>
      <category>잼버리</category>
      <category>잼버리 대회</category>
      <category>폭염</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/16</guid>
      <comments>https://sujspace.tistory.com/16#entry16comment</comments>
      <pubDate>Thu, 3 Aug 2023 11:20:02 +0900</pubDate>
    </item>
    <item>
      <title>카페24 방화벽 관리에서 포트 열기</title>
      <link>https://sujspace.tistory.com/14</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;카페24에서 &lt;b&gt;웹 서버 호스팅 서비스&lt;/b&gt;를 이용하게되면 &lt;b&gt;방화벽 관리&lt;/b&gt;도 기본적으로 신경 써야 합니다. &lt;u&gt;&lt;b&gt;외부에서 웹 서버 혹은 웹 서버에서 외부로 접근하기 위해서는 방화벽 포트를 열어줘야 합니다.&lt;/b&gt;&lt;/u&gt; 그래서 이번 포스팅에서는 카페24 &lt;b&gt;방화벽 관리에 대해&lt;/b&gt; 알아보겠습니다.&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;제목을 입력해주세요_-001.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/kD6B6/btspVM24wEK/OnKQGfJP4Nu0ItioYuBJsk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/kD6B6/btspVM24wEK/OnKQGfJP4Nu0ItioYuBJsk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/kD6B6/btspVM24wEK/OnKQGfJP4Nu0ItioYuBJsk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FkD6B6%2FbtspVM24wEK%2FOnKQGfJP4Nu0ItioYuBJsk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;썸네일&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;제목을 입력해주세요_-001.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;카페24 방화벽 관리 접속&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;카페24 나의 서비스 관리 들어가면 왼쪽 사이드에 방화벽관리를 클릭합니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-02 오후 11.30.26.png&quot; data-origin-width=&quot;342&quot; data-origin-height=&quot;1002&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bmy2mX/btspFM5fhcj/KBqGksgghUOtpXPrIMROr0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bmy2mX/btspFM5fhcj/KBqGksgghUOtpXPrIMROr0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bmy2mX/btspFM5fhcj/KBqGksgghUOtpXPrIMROr0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fbmy2mX%2FbtspFM5fhcj%2FKBqGksgghUOtpXPrIMROr0%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;방화벽 관리&quot; loading=&quot;lazy&quot; width=&quot;342&quot; height=&quot;1002&quot; data-filename=&quot;스크린샷 2023-08-02 오후 11.30.26.png&quot; data-origin-width=&quot;342&quot; data-origin-height=&quot;1002&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;페이지에 접속 후 중앙에 아래와 같은 화면이 나옵니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;새롭게 정책을 추가할 포트가 있다면 방화벽 정책(Rule) 추가를 클릭합니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;edited_스크린샷 2023-08-02 오후 11.37.48.png&quot; data-origin-width=&quot;2418&quot; data-origin-height=&quot;1370&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/FFMlp/btspXljWH7l/bS5lVvTfU5SkawkXDQM3nK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/FFMlp/btspXljWH7l/bS5lVvTfU5SkawkXDQM3nK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/FFMlp/btspXljWH7l/bS5lVvTfU5SkawkXDQM3nK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FFFMlp%2FbtspXljWH7l%2FbS5lVvTfU5SkawkXDQM3nK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot; 방화벽 정책 현황&quot; loading=&quot;lazy&quot; width=&quot;2418&quot; height=&quot;1370&quot; data-filename=&quot;edited_스크린샷 2023-08-02 오후 11.37.48.png&quot; data-origin-width=&quot;2418&quot; data-origin-height=&quot;1370&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;INBOUND 정책 : 익명접속(모든 IP)&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;새롭게 등록할 포트에 외부에서 내부로 접근 시 모든 IP에서 접속이 가능합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;예를 들어 tomcat 포트나 http 기본 포트인 80 포트를 열어줘야 할 때는 기본적으로 등록해 줍니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-02 오후 11.44.01.png&quot; data-origin-width=&quot;1138&quot; data-origin-height=&quot;1012&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bE7dnr/btspUhbiAtj/KinK4KNgb2cajALdILUWAk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bE7dnr/btspUhbiAtj/KinK4KNgb2cajALdILUWAk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bE7dnr/btspUhbiAtj/KinK4KNgb2cajALdILUWAk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbE7dnr%2FbtspUhbiAtj%2FKinK4KNgb2cajALdILUWAk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot; 인바운드 정책&quot; loading=&quot;lazy&quot; width=&quot;1138&quot; height=&quot;1012&quot; data-filename=&quot;스크린샷 2023-08-02 오후 11.44.01.png&quot; data-origin-width=&quot;1138&quot; data-origin-height=&quot;1012&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;INBOUND 정책 : 개별접속(특정 IP)&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;새롭게 등록할 포트에 외부에서 내부로 접근 시 허용한  특정 IP에서만 접속이 가능합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;데이터 베이스나 FTP 같은 서비스들은 해킹에 노출되기 쉬우니 보안을 위해서 이 정책을 이용하는 게 좋습니다.&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;mysql이나 ftp처럼 직접적으로 서버 자원 혹은 데이터를 다루는 서비스들은 허용된 IP만 접근하도록 설정해 줍니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-02 오후 11.45.28.png&quot; data-origin-width=&quot;1136&quot; data-origin-height=&quot;1008&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/v3FI6/btspK3r7Jm2/imnMwRMeuUyCL8wcoQAfQk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/v3FI6/btspK3r7Jm2/imnMwRMeuUyCL8wcoQAfQk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/v3FI6/btspK3r7Jm2/imnMwRMeuUyCL8wcoQAfQk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fv3FI6%2FbtspK3r7Jm2%2FimnMwRMeuUyCL8wcoQAfQk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;인바운드 정책&quot; loading=&quot;lazy&quot; width=&quot;1136&quot; height=&quot;1008&quot; data-filename=&quot;스크린샷 2023-08-02 오후 11.45.28.png&quot; data-origin-width=&quot;1136&quot; data-origin-height=&quot;1008&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;OUTBOUND 정책&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;위와 반대로 내부에서 외부로 접근해야 할 때 사용하는 정책입니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-08-02 오후 11.48.08.png&quot; data-origin-width=&quot;1138&quot; data-origin-height=&quot;940&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bXPWhQ/btspVOmhw60/MBHjGNIxp2RrNGVqDMeSgk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bXPWhQ/btspVOmhw60/MBHjGNIxp2RrNGVqDMeSgk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bXPWhQ/btspVOmhw60/MBHjGNIxp2RrNGVqDMeSgk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbXPWhQ%2FbtspVOmhw60%2FMBHjGNIxp2RrNGVqDMeSgk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;아웃바운드 정책&quot; loading=&quot;lazy&quot; width=&quot;1138&quot; height=&quot;940&quot; data-filename=&quot;스크린샷 2023-08-02 오후 11.48.08.png&quot; data-origin-width=&quot;1138&quot; data-origin-height=&quot;940&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;카페24 방화벽 관리에 대해 알아보았습니다. 방화벽은 중요한 보안 설정이기 때문에 필요에 따라 최소한으로 포트를 열어줘야 합니다. 편리하게 접근하겠다고 INBOUND 모든 IP 정책을 이용할 경우 해킹 위험이 있으니 꼭 필요에 의해서만 설정해 주세요!&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #fff357 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;함께보면 좋은 글&lt;/b&gt;&lt;/h3&gt;
&lt;figure id=&quot;og_1690989139362&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;가비아에서 카페24로 도메인 연결 네임서버 변경 방법&quot; data-og-description=&quot;가비아에서 구매한 도메인을 카페24(cafe24) 호스팅 서비스와 쉽게 연결하기 위해 네임서버 변경 방법을 예시와 함께 알아보려고 합니다. 목차 가비아 도메인 관리 접속 도메인을 사용 중인 가비&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/12&quot; data-og-url=&quot;https://sujspace.tistory.com/12&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/oPWVD/hyTwpERazz/6P5XybLRxHKkbKAiewLGe1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/b0Vz5V/hyTwc6AAXf/4Kr1b7EZz4k0bC8GEloLxk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/jzhvh/hyTwhtilx1/mKKnTKdceeuSzGDYTuUuyk/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/12&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/12&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/oPWVD/hyTwpERazz/6P5XybLRxHKkbKAiewLGe1/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/b0Vz5V/hyTwc6AAXf/4Kr1b7EZz4k0bC8GEloLxk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/jzhvh/hyTwhtilx1/mKKnTKdceeuSzGDYTuUuyk/img.png?width=1080&amp;amp;height=1080&amp;amp;face=0_0_1080_1080');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;가비아에서 카페24로 도메인 연결 네임서버 변경 방법&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;가비아에서 구매한 도메인을 카페24(cafe24) 호스팅 서비스와 쉽게 연결하기 위해 네임서버 변경 방법을 예시와 함께 알아보려고 합니다. 목차 가비아 도메인 관리 접속 도메인을 사용 중인 가비&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/Cloud</category>
      <category>port</category>
      <category>방화벽관리</category>
      <category>카페24</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/14</guid>
      <comments>https://sujspace.tistory.com/14#entry14comment</comments>
      <pubDate>Wed, 2 Aug 2023 23:58:38 +0900</pubDate>
    </item>
    <item>
      <title>JSP를 활용한 웹 애플리케이션 성능 최적화 방법</title>
      <link>https://sujspace.tistory.com/13</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;이번 포스팅에서는&lt;u&gt;&lt;b&gt; 웹 애플리케이션 성능 최적화 방법&lt;/b&gt;&lt;/u&gt;을 알아보려고 합니다. 내용은 간단하게 JSP를 활용해서 알아보도록 하겠습니다. 최적화는 사용자 경험(UX)을 향상하고 빠른 응답 시간을 제공하기 위해 필수적입니다. 본 글에서는 주요한 방법들을 간략하게 알아보겠습니다.&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;제목을 입력해주세요_-001 (1) (1).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/beBdMj/btspH1z5lrh/oxZKT4JPUUIgR0TUVZGFfk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/beBdMj/btspH1z5lrh/oxZKT4JPUUIgR0TUVZGFfk/img.png&quot; data-alt=&quot;썸네일&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/beBdMj/btspH1z5lrh/oxZKT4JPUUIgR0TUVZGFfk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbeBdMj%2FbtspH1z5lrh%2FoxZKT4JPUUIgR0TUVZGFfk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;제목을 입력해주세요_-001 (1) (1).png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;썸네일&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;캐싱(Caching)&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;가장 효과적인 성능 향상 방법 중 하나는 캐싱입니다. 사용자에게 반복적으로 제공되는 정적 리소스와 데이터를 캐시에 저장하여 처리 속도를 높일 수 있습니다. JSP에서 애플리케이션, 세션, 페이지, 요청 스코프 영역의 캐싱 기법을 사용할 수 있고, Memcached나 Redis와 같은 외부 캐싱 시스템도 적용할 수 있습니다.&lt;/p&gt;
&lt;pre id=&quot;code_1690900463030&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;%@ page import=&quot;java.util.Date&quot; %&amp;gt;
&amp;lt;%@ page import=&quot;javax.servlet.jsp.jstl.core.Config&quot; %&amp;gt;
&amp;lt;%@ page import=&quot;java.text.DateFormat&quot; %&amp;gt;
&amp;lt;%@ page import=&quot;java.util.Locale&quot; %&amp;gt;

&amp;lt;%
  Object cachedData = session.getAttribute(&quot;cachedData&quot;);
  if (cachedData == null) {
    String data = &quot;Data Contents&quot;;
  
    session.setAttribute(&quot;cachedData&quot;, data);
    cachedData = data;
  }
%&amp;gt;

&amp;lt;html&amp;gt;
  &amp;lt;head&amp;gt;
    &amp;lt;title&amp;gt;캐싱 예제&amp;lt;/title&amp;gt;
  &amp;lt;/head&amp;gt;
  &amp;lt;body&amp;gt;
    &amp;lt;h1&amp;gt;Cached Data:&amp;lt;/h1&amp;gt;
    &amp;lt;p&amp;gt;&amp;lt;%= cachedData %&amp;gt;&amp;lt;/p&amp;gt;
  &amp;lt;/body&amp;gt;
&amp;lt;/html&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;애플리케이션 로직 최적화&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;비용이 많이 드는 작업, 중복 계산 및 로직을 간소화함으로써 JSP로 구축한 애플리케이션의 성능을 향상시킬 수 있겠죠. 쿼리 최적화, 자바 객체 생성 비용 최소화, 갱신 빈도를 줄이는 것이 포함되어 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;압축(Compression)&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;서버와 클라이언트 간에 데이터를 주고받을 때 압축 기술을 사용하면 네트워크 지연 시간을 줄일 수 있어요. Gzip을 사용하여 전송된 데이터의 크기를 줄이는 방법이 일반적으로 사용됩니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;정적 리소스 최적화&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;CSS 및 JavaScript 파일을 코드 압축, 병합, 최적화 및 레이지 로딩등을 적용하여, 전송 시간을 줄이고 렌더링 속도를 높일 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;콘텐츠 전송 네트워크(CDN)&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;웹 애플리케이션의 속도를 높일 수 있는 다른 방법은 CDN(Content Delivery Network) 서비스를 사용하는 거예요. CDN은 사용자가 데이터를 요청할 때 지리적으로 가장 가까운 위치의 서버에서 데이터를 제공함으로써 더 빠른 응답 속도를 즐길 수 있게 합니다.&lt;/p&gt;
&lt;pre id=&quot;code_1690900430076&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;!-- 직접 호출 --&amp;gt;
&amp;lt;link rel=&quot;stylesheet&quot; href=&quot;/styles/main.css&quot;&amp;gt;

&amp;lt;!-- CDN URL --&amp;gt;
&amp;lt;link rel=&quot;stylesheet&quot; href=&quot;https://cdn.example.com/styles/main.css&quot;&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;웹 서버 및 애플리케이션 서버 성능 최적화&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;서버 하드웨어 및 소프트웨어 구성에 따라 성능을 향상시킬 수 있는 다양한 최적화 작업이 있습니다. 웹 서버 및 애플리케이션 서버 설정을 조정하여 동시 요청 처리 능력을 높이고 자원 사용 효율을 개선해 보세요.&lt;/p&gt;
&lt;pre id=&quot;code_1690900767594&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;!-- tomcat web.xml --&amp;gt;
&amp;lt;Connector port=&quot;8080&quot; protocol&quot;HTTP/1.1&quot;
   connectionTimeout=&quot;20000&quot;
   redirectPort=&quot;8443&quot;
   maxThreads=&quot;200&quot;
   maxKeepAliveRequests=&quot;1&quot;
   acceptCount=&quot;200&quot;
	/&amp;gt;

&amp;lt;!-- tomcat setenv.sh --&amp;gt;
JAVA_OPTS=&quot;$JAVA_OPTS -Dfile.encoding=UTF-8 -Xms1024m -Xmx&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;코드 최적화&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;실행 속도에 영향을 미치는 코드의 작성 방식을 개선하는 것도 성능 최적화의 한 예입니다. 코드 리팩토링, 알고리즘 개선 및 객체 생성/삭제를 최소화하는 작업이 필요합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;데이터베이스 연결 및 풀링 최적화&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;데이터베이스 연결 속도와 커넥션 풀링 설정 조정을 통해 애플리케이션 성능을 향상할 수 있어요. 데이터베이스와 웹 애플리케이션 간 연결 효율을 높여 응답 시간을 최소화해 보세요.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;프론트엔드 성능 최적화&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;사용자가 웹 페이지를 로드하는 데 걸리는 시간을 줄이기 위해 이미지 최적화, 레이아웃 변경 및 렌더링 블록을 제거하는 등의 프론트엔드 성능 최적화 방법을 적용해 보세요.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;애플리케이션 모니터링 및 성능 메트릭 분석&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;애플리케이션의 성능을 지속적으로 체크하고 분석하여 문제 발생 시 빠르게 대응할 수 있는 모니터링 및 분석 시스템을 구축해야 합니다. 이를 통해 애플리케이션의 안정성과 확장성을 강화하고 시스템 오류를 예방할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;JSP와 함께 웹 애플리케이션 성능을 최적화할 수 있는 방법들을 알아보았습니다. 애플리케이션의 요구 사항과 상황에 맞게 적절한 성능 최적화 전략을 선정하고 적용하여 최상의 사용자 경험을 제공하는 웹 애플리케이션을 만들어 보세요! 단계적 접근을 통해 웹 애플리케이션의 성능을 하나씩 개선해 나가는 것이 좋습니다. 성능 최적화 작업은 지속적인 과정이며 애플리케이션 환경이 변경되고 발전함에 따라 새로운 문제들을 발견하고 개선해 보길 바랍니다.&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;</description>
      <category>개발/프로그래밍</category>
      <category>jsp</category>
      <category>성능 최적화</category>
      <category>애플리케이션</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/13</guid>
      <comments>https://sujspace.tistory.com/13#entry13comment</comments>
      <pubDate>Tue, 1 Aug 2023 23:44:16 +0900</pubDate>
    </item>
    <item>
      <title>가비아에서 카페24로 도메인 연결 네임서버 변경 방법</title>
      <link>https://sujspace.tistory.com/12</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;u&gt;&lt;b&gt;가비아에서 구매한 도메인&lt;/b&gt;&lt;/u&gt;을 &lt;b&gt;카페24(cafe24)&lt;/b&gt; 호스팅 서비스와 쉽게 연결하기 위해 &lt;b&gt;&lt;u&gt;네임서버 변경&lt;/u&gt;&lt;/b&gt; 방법을 예시와 함께 알아보려고 합니다.&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;가비에서 카페24 도메인 변경 방법.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bXqnoN/btspmgkMHy1/KAukFZ9UC2EIzhwk5tGMIK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bXqnoN/btspmgkMHy1/KAukFZ9UC2EIzhwk5tGMIK/img.png&quot; data-alt=&quot;썸네일&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bXqnoN/btspmgkMHy1/KAukFZ9UC2EIzhwk5tGMIK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbXqnoN%2FbtspmgkMHy1%2FKAukFZ9UC2EIzhwk5tGMIK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;썸네일&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;가비에서 카페24 도메인 변경 방법.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;썸네일&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;가비아 도메인 관리 접속&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;도메인을 사용 중인 가비아 홈페이지에 접속합니다.&lt;/p&gt;
&lt;figure id=&quot;og_1690792127016&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;website&quot; data-og-title=&quot;웹을 넘어 클라우드로. 가비아&quot; data-og-description=&quot;그룹웨어부터 멀티클라우드까지 하나의 클라우드 허브&quot; data-og-host=&quot;www.gabia.com&quot; data-og-source-url=&quot;https://www.gabia.com/&quot; data-og-url=&quot;https://www.gabia.com/&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/grAQj/hyTtsQgsyP/oBIoolzNot9vUrTdAyuRK0/img.jpg?width=1200&amp;amp;height=1000&amp;amp;face=0_0_1200_1000&quot;&gt;&lt;a href=&quot;https://www.gabia.com/&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://www.gabia.com/&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/grAQj/hyTtsQgsyP/oBIoolzNot9vUrTdAyuRK0/img.jpg?width=1200&amp;amp;height=1000&amp;amp;face=0_0_1200_1000');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;웹을 넘어 클라우드로. 가비아&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;그룹웨어부터 멀티클라우드까지 하나의 클라우드 허브&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;www.gabia.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;홈페이지에 접속 후 &lt;b&gt;My가비아&lt;/b&gt;를 누르고 &lt;b&gt;서비스 관리&lt;/b&gt;를 선택합니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;제목을-입력해주세요_-001 (1).png&quot; data-origin-width=&quot;1054&quot; data-origin-height=&quot;497&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/mFa8Q/btsppIuqUGp/G4fysQG70k3uUtm6AIV6vK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/mFa8Q/btsppIuqUGp/G4fysQG70k3uUtm6AIV6vK/img.png&quot; data-alt=&quot;마이가비아 접속&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/mFa8Q/btsppIuqUGp/G4fysQG70k3uUtm6AIV6vK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FmFa8Q%2FbtsppIuqUGp%2FG4fysQG70k3uUtm6AIV6vK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot; My가비아 접속&quot; loading=&quot;lazy&quot; width=&quot;1054&quot; height=&quot;497&quot; data-filename=&quot;제목을-입력해주세요_-001 (1).png&quot; data-origin-width=&quot;1054&quot; data-origin-height=&quot;497&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;마이가비아 접속&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;사용중인 도메인의 오른쪽에서 &lt;b&gt;관리 &lt;/b&gt;버튼을 클릭합니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;edited_제목을 입력해주세요_-001 (1).png&quot; data-origin-width=&quot;705&quot; data-origin-height=&quot;429&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/6aihv/btspFLwyKFF/PCraNuQzIQg0SIg3pdUmvK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/6aihv/btspFLwyKFF/PCraNuQzIQg0SIg3pdUmvK/img.png&quot; data-alt=&quot;관리버튼 클릭&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/6aihv/btspFLwyKFF/PCraNuQzIQg0SIg3pdUmvK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2F6aihv%2FbtspFLwyKFF%2FPCraNuQzIQg0SIg3pdUmvK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot; 관리 접속&quot; loading=&quot;lazy&quot; width=&quot;705&quot; height=&quot;429&quot; data-filename=&quot;edited_제목을 입력해주세요_-001 (1).png&quot; data-origin-width=&quot;705&quot; data-origin-height=&quot;429&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;관리버튼 클릭&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;하단에 네임서버 &lt;b&gt;설정&lt;/b&gt; 버튼을 클릭합니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 3.32.18.png&quot; data-origin-width=&quot;1389&quot; data-origin-height=&quot;796&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/cq1pII/btspmfTL2ti/YbC6s0rUfeX1w5m9kaQ8EK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/cq1pII/btspmfTL2ti/YbC6s0rUfeX1w5m9kaQ8EK/img.png&quot; data-alt=&quot;네임서버 설정&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/cq1pII/btspmfTL2ti/YbC6s0rUfeX1w5m9kaQ8EK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fcq1pII%2FbtspmfTL2ti%2FYbC6s0rUfeX1w5m9kaQ8EK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot; 설정 접속&quot; loading=&quot;lazy&quot; width=&quot;1389&quot; height=&quot;796&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 3.32.18.png&quot; data-origin-width=&quot;1389&quot; data-origin-height=&quot;796&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;네임서버 설정&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;가비아 네임서버 변경&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;이미지와 같이 카페24 네임서버로 동일하게 입력해 주고 &lt;b&gt;소유자 인증&lt;/b&gt;을 클릭합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;1차 : ns1.cafe24.com &lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;2차 : ns1.cafe24.co.kr &lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;3차 : ns2.cafe24.com &lt;/b&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;4차 : ns2.cafe24.co.kr&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 3.40.54.png&quot; data-origin-width=&quot;1193&quot; data-origin-height=&quot;767&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bEqWtE/btspFMhWKuk/g92oJOFviIb9JQWJEBU1v0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bEqWtE/btspFMhWKuk/g92oJOFviIb9JQWJEBU1v0/img.png&quot; data-alt=&quot;네임서버 입력&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bEqWtE/btspFMhWKuk/g92oJOFviIb9JQWJEBU1v0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbEqWtE%2FbtspFMhWKuk%2Fg92oJOFviIb9JQWJEBU1v0%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot; 네임서버 입력&quot; loading=&quot;lazy&quot; width=&quot;1193&quot; height=&quot;767&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 3.40.54.png&quot; data-origin-width=&quot;1193&quot; data-origin-height=&quot;767&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;네임서버 입력&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;인증을 진행한 후 확인 버튼을 누릅니다. 최종적으로 하단에서&amp;nbsp;&lt;b&gt;적용&lt;/b&gt; 버튼까지 눌러주세요.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 3.43.57.png&quot; data-origin-width=&quot;660&quot; data-origin-height=&quot;491&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/pwCIU/btspGLQJQ7r/R4SQmFVfJMlKzWUNKK9w0k/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/pwCIU/btspGLQJQ7r/R4SQmFVfJMlKzWUNKK9w0k/img.png&quot; data-alt=&quot;소유자 인증&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/pwCIU/btspGLQJQ7r/R4SQmFVfJMlKzWUNKK9w0k/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FpwCIU%2FbtspGLQJQ7r%2FR4SQmFVfJMlKzWUNKK9w0k%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;소유자 인증&quot; loading=&quot;lazy&quot; width=&quot;660&quot; height=&quot;491&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 3.43.57.png&quot; data-origin-width=&quot;660&quot; data-origin-height=&quot;491&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;소유자 인증&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;카페24 도메인 관리 접속&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;카페24 홈페이지에서 로그인합니다.&lt;/p&gt;
&lt;figure id=&quot;og_1690793685701&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;website&quot; data-og-title=&quot;카페24 호스팅 | 온라인 비즈니스의 시작&quot; data-og-description=&quot;&quot; data-og-host=&quot;hosting.cafe24.com&quot; data-og-source-url=&quot;https://hosting.cafe24.com/&quot; data-og-url=&quot;https://hosting.cafe24.com/&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/dBvFVP/hyTvb0qCu9/WyH1dhXmrhzqzFUEhCYck0/img.png?width=1200&amp;amp;height=630&amp;amp;face=0_0_1200_630,https://scrap.kakaocdn.net/dn/cgOYY6/hyTvn7CDNQ/4LmmBuju6PM7Kv6pW4mXS0/img.png?width=450&amp;amp;height=281&amp;amp;face=0_0_450_281,https://scrap.kakaocdn.net/dn/bj2Zlp/hyTtiUrTAd/kPL8HN5rhebxN8lnK8G7KK/img.png?width=450&amp;amp;height=281&amp;amp;face=0_0_450_281&quot;&gt;&lt;a href=&quot;https://hosting.cafe24.com/&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://hosting.cafe24.com/&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/dBvFVP/hyTvb0qCu9/WyH1dhXmrhzqzFUEhCYck0/img.png?width=1200&amp;amp;height=630&amp;amp;face=0_0_1200_630,https://scrap.kakaocdn.net/dn/cgOYY6/hyTvn7CDNQ/4LmmBuju6PM7Kv6pW4mXS0/img.png?width=450&amp;amp;height=281&amp;amp;face=0_0_450_281,https://scrap.kakaocdn.net/dn/bj2Zlp/hyTtiUrTAd/kPL8HN5rhebxN8lnK8G7KK/img.png?width=450&amp;amp;height=281&amp;amp;face=0_0_450_281');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;카페24 호스팅 | 온라인 비즈니스의 시작&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;hosting.cafe24.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;우측 상단에 &lt;b&gt;나의 서비스관리&lt;/b&gt;를 클릭합니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-07-31 오후 5.55.55.png&quot; data-origin-width=&quot;1416&quot; data-origin-height=&quot;696&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bqUim4/btsplOoz4Yu/2Fci88sByNUNEljLaCBhQK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bqUim4/btsplOoz4Yu/2Fci88sByNUNEljLaCBhQK/img.png&quot; data-alt=&quot;나의 서비스 관리 접속&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bqUim4/btsplOoz4Yu/2Fci88sByNUNEljLaCBhQK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbqUim4%2FbtsplOoz4Yu%2F2Fci88sByNUNEljLaCBhQK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot; 나의 서비스 관리 접속&quot; loading=&quot;lazy&quot; width=&quot;1416&quot; height=&quot;696&quot; data-filename=&quot;스크린샷 2023-07-31 오후 5.55.55.png&quot; data-origin-width=&quot;1416&quot; data-origin-height=&quot;696&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;나의 서비스 관리 접속&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;왼쪽 사이드 메뉴에서 &lt;b&gt;도메인 연결관리&lt;/b&gt;를 클릭합니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 5.57.50.png&quot; data-origin-width=&quot;947&quot; data-origin-height=&quot;347&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/mLUkj/btspE3YAZEV/1Du6b6x6znd5aKNDgysh40/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/mLUkj/btspE3YAZEV/1Du6b6x6znd5aKNDgysh40/img.png&quot; data-alt=&quot;도메인 연결관리&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/mLUkj/btspE3YAZEV/1Du6b6x6znd5aKNDgysh40/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FmLUkj%2FbtspE3YAZEV%2F1Du6b6x6znd5aKNDgysh40%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;도메인 연결관리&quot; loading=&quot;lazy&quot; width=&quot;947&quot; height=&quot;347&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 5.57.50.png&quot; data-origin-width=&quot;947&quot; data-origin-height=&quot;347&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;도메인 연결관리&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;카페24에 도메인 직접 추가&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;하단에 &lt;b&gt;도메인 직접 입력하기&lt;/b&gt;를 클릭한 후 빈칸에 가비아에서 연결할 도메인을 정확하게 입력해 주고 &lt;b&gt;연결하기&lt;/b&gt;를 클릭합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;b&gt;예) test.co.kr&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 3.46.23.png&quot; data-origin-width=&quot;911&quot; data-origin-height=&quot;544&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bsDY8D/btsplPnv30T/TV7H2K7Q8u1fCP9yZIcD80/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bsDY8D/btsplPnv30T/TV7H2K7Q8u1fCP9yZIcD80/img.png&quot; data-alt=&quot;도메인 직접 입력&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bsDY8D/btsplPnv30T/TV7H2K7Q8u1fCP9yZIcD80/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbsDY8D%2FbtsplPnv30T%2FTV7H2K7Q8u1fCP9yZIcD80%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;도메인 직접 입력&quot; loading=&quot;lazy&quot; width=&quot;911&quot; height=&quot;544&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 3.46.23.png&quot; data-origin-width=&quot;911&quot; data-origin-height=&quot;544&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;도메인 직접 입력&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;카페24에서 대표 도메인으로 변경&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;적용했으면 &lt;b&gt;추가 설정된 도메인&lt;/b&gt;에서 새롭게 추가한 &lt;b&gt;도메인의 선택&lt;/b&gt; 버튼을 누르고 &lt;b&gt;대표 도메인으로 변경&lt;/b&gt;을 클릭합니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 6.05.21.png&quot; data-origin-width=&quot;897&quot; data-origin-height=&quot;472&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/H2JuC/btsplNiREQk/AIcvYoDJxGwV3IAcYfAhgk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/H2JuC/btsplNiREQk/AIcvYoDJxGwV3IAcYfAhgk/img.png&quot; data-alt=&quot;대표 도메인으로 변경&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/H2JuC/btsplNiREQk/AIcvYoDJxGwV3IAcYfAhgk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FH2JuC%2FbtsplNiREQk%2FAIcvYoDJxGwV3IAcYfAhgk%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; alt=&quot;대표 도메인으로 변경&quot; loading=&quot;lazy&quot; width=&quot;897&quot; height=&quot;472&quot; data-filename=&quot;edited_스크린샷 2023-07-31 오후 6.05.21.png&quot; data-origin-width=&quot;897&quot; data-origin-height=&quot;472&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;대표 도메인으로 변경&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;도메인 네임서버 변경 후 최종 확인&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;저는 가비아 네임서버 변경에서 카페24 도메인 연결까지 30분 이내에 적용되었습니다.&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;최종적용 확인은 아래 사이트에서 도메인을 입력하면 아까 과정에서 입력했던 카페24의 네임서버가 나오는지 확인합니다.&lt;/p&gt;
&lt;figure id=&quot;og_1690794809742&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;website&quot; data-og-title=&quot;KISA 후이즈검색 whois.kisa.or.kr&quot; data-og-description=&quot;한국인터넷진흥원 인터넷주소자원 검색(후이즈검색) 서비스 입니다.&quot; data-og-host=&quot;xn--c79as89aj0e29b77z.xn--3e0b707e&quot; data-og-source-url=&quot;https://xn--c79as89aj0e29b77z.xn--3e0b707e/kor/whois/whois.jsp&quot; data-og-url=&quot;https://xn--c79as89aj0e29b77z.xn--3e0b707e/&quot; data-og-image=&quot;&quot;&gt;&lt;a href=&quot;https://xn--c79as89aj0e29b77z.xn--3e0b707e/kor/whois/whois.jsp&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://xn--c79as89aj0e29b77z.xn--3e0b707e/kor/whois/whois.jsp&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url();&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;KISA 후이즈검색 whois.kisa.or.kr&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;한국인터넷진흥원 인터넷주소자원 검색(후이즈검색) 서비스 입니다.&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;xn--c79as89aj0e29b77z.xn--3e0b707e&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;가비아에서 사용 중인 도메인을 카페24에서 사용하기위해 네임서버를 변경하여 도메인을 연결하는 방법을 알아보았습니다. 이뿐만 아니라 반대로 카페24에서 가비아로 변경하고 싶으면 이번 과정처럼 네임서버를 카페24가 아닌 가비아의 네임서버로 변경하는 방법도 있습니다. 최종적으로 잘 적용되었는지 후이즈 검색 사이트에서 확인해 주세요!&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #fff357 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;함께보면 좋은 글&lt;/b&gt;&lt;/h3&gt;
&lt;figure id=&quot;og_1690989323070&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-ke-align=&quot;alignCenter&quot; data-og-type=&quot;article&quot; data-og-title=&quot;카페24 방화벽 관리에서 포트 열기&quot; data-og-description=&quot;카페24에서 웹 서버 호스팅 서비스를 이용하게되면 방화벽 관리도 기본적으로 신경 써야 합니다. 외부에서 웹 서버 혹은 웹 서버에서 외부로 접근하기 위해서는 방화벽 포트를 열어줘야 합니다.&quot; data-og-host=&quot;sujspace.tistory.com&quot; data-og-source-url=&quot;https://sujspace.tistory.com/14&quot; data-og-url=&quot;https://sujspace.tistory.com/14&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/Ft7uY/hyTwpLCu6q/z3J2e6ybVTVNuMj3oDgsEk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/4v4NH/hyTwntvzTd/h37WL2XjCwZYF8OkOPgCh0/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/PvRYy/hyTwcFuRNU/0HljZGf2eC2cX7PYRtmItk/img.png?width=2418&amp;amp;height=1370&amp;amp;face=0_0_2418_1370&quot;&gt;&lt;a href=&quot;https://sujspace.tistory.com/14&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://sujspace.tistory.com/14&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/Ft7uY/hyTwpLCu6q/z3J2e6ybVTVNuMj3oDgsEk/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/4v4NH/hyTwntvzTd/h37WL2XjCwZYF8OkOPgCh0/img.png?width=800&amp;amp;height=800&amp;amp;face=0_0_800_800,https://scrap.kakaocdn.net/dn/PvRYy/hyTwcFuRNU/0HljZGf2eC2cX7PYRtmItk/img.png?width=2418&amp;amp;height=1370&amp;amp;face=0_0_2418_1370');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot; data-ke-size=&quot;size16&quot;&gt;카페24 방화벽 관리에서 포트 열기&lt;/p&gt;
&lt;p class=&quot;og-desc&quot; data-ke-size=&quot;size16&quot;&gt;카페24에서 웹 서버 호스팅 서비스를 이용하게되면 방화벽 관리도 기본적으로 신경 써야 합니다. 외부에서 웹 서버 혹은 웹 서버에서 외부로 접근하기 위해서는 방화벽 포트를 열어줘야 합니다.&lt;/p&gt;
&lt;p class=&quot;og-host&quot; data-ke-size=&quot;size16&quot;&gt;sujspace.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/Cloud</category>
      <category>가비아</category>
      <category>네임서버 변경</category>
      <category>도메인</category>
      <category>도메인 이전</category>
      <category>카페24</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/12</guid>
      <comments>https://sujspace.tistory.com/12#entry12comment</comments>
      <pubDate>Mon, 31 Jul 2023 18:23:09 +0900</pubDate>
    </item>
    <item>
      <title>서버사이드 렌더링 기술 비교 및 호환성</title>
      <link>https://sujspace.tistory.com/11</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;border: 5px solid #adb1f2; border-radius: 20px 20px; background-color: #ffffff; padding: 15px 30px; margin: 0;&quot;&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; top: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;background-color: #ffffff; color: #333333; text-align: start;&quot;&gt;서버사이드 렌더링 기술 비교 및 호환성 분석을 해보려고 합니다!&lt;span&gt;&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&lt;b&gt;서버사이드 렌더링&lt;/b&gt;&lt;span style=&quot;background-color: #ffffff; color: #333333; text-align: start;&quot;&gt;(Server-Side Rendering, SSR)은 웹 페이지의 HTML, CSS, JS 등을&lt;span&gt;&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&lt;b&gt;서버에서 미리 렌더링 하여&lt;/b&gt;&lt;span style=&quot;background-color: #ffffff; color: #333333; text-align: start;&quot;&gt; 클라이언트에게 전달하는 방식입니다. 이 포스트에서는 다양한&lt;span&gt;&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&lt;u&gt;&lt;b&gt;서버 사이드 렌더링 기술을 비교하고 호환성&lt;/b&gt;&lt;/u&gt;&lt;span style=&quot;background-color: #ffffff; color: #333333; text-align: start;&quot;&gt;에 대해 살펴보겠습니다.&lt;/span&gt;&lt;/p&gt;
&lt;div style=&quot;width: 90%; height: 12px; background-color: #ffffff; display: block; position: relative; bottom: -26px; margin: 0 auto;&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;/div&gt;
&lt;p style=&quot;color: #333333; text-align: start;&quot; data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;color: #333333; text-align: start;&quot; data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;서버사이드 렌더링 기술 비교 및 호환성.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/cduPzu/btspxaDli3z/Yn0f7ukfW2GhpgpBDkZdJK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/cduPzu/btspxaDli3z/Yn0f7ukfW2GhpgpBDkZdJK/img.png&quot; data-alt=&quot;서버사이드 렌더링 기술 비교 및 호환성&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/cduPzu/btspxaDli3z/Yn0f7ukfW2GhpgpBDkZdJK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FcduPzu%2FbtspxaDli3z%2FYn0f7ukfW2GhpgpBDkZdJK%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; loading=&quot;lazy&quot; width=&quot;1080&quot; height=&quot;1080&quot; data-filename=&quot;서버사이드 렌더링 기술 비교 및 호환성.png&quot; data-origin-width=&quot;1080&quot; data-origin-height=&quot;1080&quot;/&gt;&lt;/span&gt;&lt;figcaption&gt;서버사이드 렌더링 기술 비교 및 호환성&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;div style=&quot;padding: 15px 20px; background-color: #f4f4f4; border-radius: 0px 0px; border: 1px solid #d9d9d9; line-height: 1.8;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;목차&lt;/b&gt;&lt;/p&gt;
&lt;ol id=&quot;toc&quot; style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;&lt;/ol&gt;
&lt;script type=&quot;text/javascript&quot;&gt; $(function(){  $(&quot;#toc&quot;).toc({content: &quot;.tt_article_useless_p_margin&quot;, headings: &quot;h3&quot;}); });&lt;/script&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;JSP&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;JSP(Java Server Pages)는 Java 기반의 서버 사이드 렌더링 기술로, HTML 문서 내에 자바 코드를 삽입하여 동적 웹 페이지를 생성할 수 있습니다. 주로 Java 및 Apache Tomcat과 같은 서블릿 컨테이너에서 실행되며, 원활한 자바 라이브러리 통합이 가능합니다. 호환성 면에서 다양한 웹 서버 및 브라우저와 잘 작동하며, 강력한 자바 프레임워크로 인해 보안 및 확장성이 훌륭합니다. 하지만 최근 웹 개발 트렌드 변화로 인해 인기도가 다소 저하되고 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;ASP.NET&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Razor ASP.NET은 마이크로소프트에서 개발한 웹 프레임워크로, 요즘은 주로 ASP.NET Core를 사용합니다. Razor는 이 프레임워크에서 제공하는 뷰 엔진으로 HTML과 서버 코드(C#)를 혼합하여 작성할 수 있습니다. 호환성 측면에서는 윈도우, 리눅스, macOS 등에서 사용 가능하며, 대부분의 브라우저에서 호환됩니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Thymeleaf&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Java 기반의 웹 애플리케이션에서 사용되는 템플릿 엔진 중 하나인 Thymeleaf는 표준형 HTML 문법을 사용해 난이도가 낮고, 시각적으로 명확한 구조를 가지고 있습니다. 서버 사이드 렌더링뿐만 아니라 클라이언트 사이드 렌더링과의 호환성도 갖추고 있어 자바 애플리케이션을 개발할 때 가장 인기 있는 선택 중 하나입니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;PHP&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;PHP는 웹 데브옵스에 익숙한 서버 사이드 렌더링 기술 중 하나로, 워드프레스와 같은 CMS(Content Management System)에서 주로 사용됩니다. 호환성 면에서 거의 모든 웹 서버와 브라우저에서 동작하며, 다양한 오픈소스 프로젝트를 통해 커스터마이징이 가능합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Ruby on Rails&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Ruby on Rails는 루비 언어로 작성된 웹 애플리케이션 프레임워크입니다. 서버사이드 렌더링을 위해 ERB(Embedded Ruby)라는 템플릿 엔진을 사용합니다. 호환성 측면에서는 루비가 지원되는 대부분의 OS에서 동작하며, 모던 웹 브라우저와의 호환성도 좋습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Express.js와 EJS&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Express.js는 Node.js에서 가장 인기 있는 웹 프레임워크이며, EJS(Embedded JavaScript)는 Express.js에서 사용 가능한 템플릿 엔진입니다. 이 조합을 이용해 서버사이드 렌더링 애플리케이션을 구현할 수 있으며, 모던 웹 애플리케이션 개발에 필요한 다양한 기능이 이미 포함되어 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Flask와 Jinja2&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Flask는 파이썬을 기반으로 하는 가볍고 유연한 웹 프레임워크입니다. Flask에서는 Jinja2라는 템플릿 엔진을 사용해 서버사이드 렌더링을 구현할 수 있습니다. Jinja2는 HTM과 파이썬 코드를 유기적으로 결합할 수 있도록 설계되었습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Django&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Django(장고) 또한 파이썬 기반의 웹 프레임워크로, ORM(Object-Relational Mapping)과 같은 다양한 기능을 갖추고 있습니다. Django에서는 자체 템플릿 엔진을 사용해 서버사이드 렌더링이 가능하며, 데이터베이스와 통합되어 효율적인 웹 애플리케이션 개발이 가능합니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;Freemarker&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;Freemarker는 Java 서버환경에서 사용되는 오픈소스 템플릿 엔진입니다. Spring 프레임워크와 호환성이 좋으며, 깔끔한 문법이 특징입니다. Freemarker를 사용하면 복잡하지 않은 환경에서도 Java 기반 웹 애플리케이션의 서버사이드 렌더링을 구현할 수 있습니다. 이러한 다양한 SSR 기술들 중에서도 팀의 기술 스택, 적용 대상 프로젝트, 성능 및 유지보수 요구사항 등을 고려하여 가장 적합한 기술을 선택하시길 권장드립니다. 그렇게 함으로써 웹 애플리케이션의 전체적인 성능 및 사용자 경험을 최적화할 수 있습니다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #56e1e9 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;예제 코드&lt;/b&gt;&lt;/h3&gt;
&lt;pre id=&quot;code_1690720457689&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;&amp;lt;!DOCTYPE html&amp;gt;
&amp;lt;html&amp;gt;
  &amp;lt;body&amp;gt;
    &amp;lt;!-- Flask와 Jinja2 --&amp;gt;
    &amp;lt;p&amp;gt;페이지에 오신 것을 환영합니다, {{ name }}님! 오늘은 {{ now.strftime('%m/%d/%Y') }}입니다. &amp;lt;/p&amp;gt;

    &amp;lt;!-- Django --&amp;gt;
    &amp;lt;p&amp;gt;페이지에 오신 것을 환영합니다, {{ name }}님! 오늘은 {{ now|date:'m/d/Y' }}입니다. &amp;lt;/p&amp;gt;

    &amp;lt;!-- ASP.NET Razor --&amp;gt;
    &amp;lt;p&amp;gt;페이지에 오신 것을 환영합니다, @Model.Name님! 오늘은 @DateTime.Now.ToString(&quot;MM/dd/yyyy&quot;)입니다. &amp;lt;/p&amp;gt;

    &amp;lt;!-- Thymeleaf --&amp;gt;
    &amp;lt;p&amp;gt;페이지에 오신 것을 환영합니다, &amp;lt;span th:text=&quot;${name}&quot;&amp;gt;Name&amp;lt;/span&amp;gt;님! 오늘은 &amp;lt;span th:text=&quot;${#dates.format(now, 'MM/dd/yyyy')}&quot;&amp;gt;Today&amp;lt;/span&amp;gt;입니다. &amp;lt;/p&amp;gt;

    &amp;lt;!-- PHP --&amp;gt;
    &amp;lt;p&amp;gt;페이지에 오신 것을 환영합니다, &amp;lt;?php echo $name; ?&amp;gt;님! 오늘은 &amp;lt;?php echo date('m/d/Y'); ?&amp;gt;입니다. &amp;lt;/p&amp;gt;

    &amp;lt;!-- JSP --&amp;gt;
    &amp;lt;p&amp;gt;페이지에 오신 것을 환영합니다, &amp;lt;%= request.getAttribute(&quot;name&quot;) %&amp;gt;님! 오늘은 &amp;lt;%= new java.text.SimpleDateFormat(&quot;MM/dd/yyyy&quot;).format(new java.util.Date()) %&amp;gt;입니다. &amp;lt;/p&amp;gt;
  &amp;lt;/body&amp;gt;
&amp;lt;/html&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 style=&quot;padding: 0.4em 1em 0.4em 0.5em; background: #FAFAFA; margin: 0.5em 0em; color: #000000; border-left: #3beb38 10px solid;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;서버 사이드 렌더링(SSR) 기술은 다양한 프레임워크와 언어로 구현되어 있습니다. 각 기술마다 특징과 장단점이 있으므로, 각 프로젝트의 성격과 요구사항에 맞추어 적절한 SSR 기술을 선택하는 것이 중요합니다. 그리고 웹 개발 분야에서는 기술 트렌드가 빠르게 변화하니 꾸준한 학습과 주의 깊은 관찰이 필요하다는 것을 알아주세요!&lt;/p&gt;
&lt;figure contenteditable=&quot;false&quot; data-ke-type=&quot;emoticon&quot; data-ke-align=&quot;alignCenter&quot; data-emoticon-type=&quot;face&quot; data-emoticon-name=&quot;071&quot; data-emoticon-isanimation=&quot;false&quot; data-emoticon-src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot;&gt;&lt;img src=&quot;https://t1.daumcdn.net/keditor/emoticon/face/large/071.png&quot; width=&quot;80&quot; /&gt;&lt;/figure&gt;</description>
      <category>개발/프로그래밍</category>
      <category>SSR</category>
      <category>렌더링</category>
      <category>서버사이드</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/11</guid>
      <comments>https://sujspace.tistory.com/11#entry11comment</comments>
      <pubDate>Sun, 30 Jul 2023 22:22:03 +0900</pubDate>
    </item>
    <item>
      <title>GPT API를 활용한 카카오 챗봇 만들기</title>
      <link>https://sujspace.tistory.com/5</link>
      <description>&lt;h4 style=&quot;border-left: 10px solid #181818; letter-spacing: -1px; padding: 0px 0px 0px 7px; margin: 5px 0px;&quot; data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-size: 21px; font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #181818;&quot;&gt;&lt;b&gt;준비물&lt;/b&gt;&lt;/span&gt;&lt;span style=&quot;font-size: 21px; font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #181818;&quot;&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;ol style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;
&lt;li&gt;부계정 안드로이드폰(알뜰 유심칩 추가로 사서 공기계에 넣어서 사용중)&lt;/li&gt;
&lt;li&gt;메신저봇R 앱 설치&lt;a href=&quot;https://play.google.com/store/apps/details?id=com.xfl.msgbot&amp;amp;hl=ko&amp;amp;gl=US&amp;amp;pli=1&quot;&gt;(링크)&lt;/a&gt; 사용 방법&lt;a title=&quot;링크&quot; href=&quot;https://violet.develope.kr/entry/%EB%A9%94%EC%8B%A0%EC%A0%80%EB%B4%87-%EA%B0%80%EC%9D%B4%EB%93%9C&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;(링크)&lt;/a&gt;&lt;/li&gt;
&lt;/ol&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 style=&quot;border-left: 10px solid #181818; letter-spacing: -1px; padding: 0px 0px 0px 7px; margin: 5px 0px;&quot; data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-size: 21px; font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #181818;&quot;&gt;&lt;b&gt;과정&lt;/b&gt;&lt;/span&gt;&lt;span style=&quot;font-size: 21px; font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #181818;&quot;&gt;&lt;b&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;ol style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;
&lt;li&gt;Open-ai 홈페이지에서 회원 가입 후 API KEY를 발급받는다.&lt;/li&gt;
&lt;li&gt;안드로이드폰에서 메신저봇R을 설치하고, 사용 방법을 참고하여 스크립트를 생성한다.&lt;/li&gt;
&lt;li&gt;스크립트 생성 후 소스 수정하기에서 아래에 코드를 복사하고 넣어준다.&lt;/li&gt;
&lt;li&gt;1번 항목에서 발급받은 KEY 값을 코드안에 있는 your token에 넣어주고 재실행한다.&lt;/li&gt;
&lt;li&gt;부계정 카카오톡을 친구 추가 후 사용한다.&amp;nbsp;&lt;/li&gt;
&lt;/ol&gt;
&lt;h4 style=&quot;border-left: 10px solid #181818; letter-spacing: -1px; padding: 0px 0px 0px 7px; margin: 5px 0px;&quot; data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-size: 21px; font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #181818;&quot;&gt;&lt;b&gt;코드&lt;/b&gt;&lt;/span&gt;&lt;span style=&quot;font-size: 21px; font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #181818;&quot;&gt;&lt;b&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;pre id=&quot;code_1679637251342&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;const scriptName = &quot;GPT&quot;;
/**
 * (string) room
 * (string) sender
 * (boolean) isGroupChat
 * (void) replier.reply(message)
 * (boolean) replier.reply(room, message, hideErrorToast = false) // 전송 성공시 true, 실패시 false 반환
 * (string) imageDB.getProfileBase64()
 * (string) packageName
 */
function response(room, msg, sender, isGroupChat, replier, imageDB, packageName) {
	if (msg.startsWith(&quot;!챗 &quot;)) {
		cmd = msg.substr(3);

		replier.reply(&quot;[답변] \n&quot; + getResponse(cmd));
	} 
}


function getResponse(msg) {
	let json;
	let result;
	try {

		json = JSON.parse(org.jsoup.Jsoup.connect(&quot;https://api.openai.com/v1/completions&quot;)
			.header(&quot;Authorization&quot;, &quot;Bearer &quot; + &quot;your token&quot;) // Open ai 토큰값
			.header(&quot;Content-Type&quot;, &quot;application/json&quot;)
			.requestBody(JSON.stringify({&quot;model&quot;: &quot;text-davinci-003&quot;, &quot;prompt&quot;: msg, &quot;temperature&quot;: 0, &quot;max_tokens&quot;: 1024, &quot;top_p&quot;: 1, &quot;frequency_penalty&quot;: 0.0, &quot;presence_penalty&quot;: 0.0}))
			.method(org.jsoup.Connection.Method.POST)
			.ignoreContentType(true)
			.execute().body());

		result = json.choices[0].text.replace(/\n/g, &quot;&quot;);
	} catch(e){
		result = e;
	}
	return result;

}

//아래 4개의 메소드는 액티비티 화면을 수정할때 사용됩니다.
function onCreate(savedInstanceState, activity) {
	var textView = new android.widget.TextView(activity);
	textView.setText(&quot;Hello, World!&quot;);
	textView.setTextColor(android.graphics.Color.DKGRAY);
	activity.setContentView(textView);
}

function onStart(activity) {}

function onResume(activity) {}

function onPause(activity) {}

function onStop(activity) {}&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 style=&quot;border-left: 10px solid #10C800; letter-spacing: -1px; padding: 0px 0px 0px 7px; margin: 5px 0px;&quot; data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-size: 21px; font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #10c800;&quot;&gt;&lt;b&gt;결과&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li&gt;&quot;!챗 &quot; 뒤에 질문을 보내면 GPT가 답변해준다.&lt;/li&gt;
&lt;li&gt;이러한 애플리케이션으로 활용하는 것은 Chat GPT가 아닌 GPT-3.5 기반의 API입니다.&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-03-24 오후 3.00.42.png&quot; data-origin-width=&quot;352&quot; data-origin-height=&quot;128&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/RZTlu/btr5NKjVdcq/f2jgh4YspqTAtR1PPOxXJ0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/RZTlu/btr5NKjVdcq/f2jgh4YspqTAtR1PPOxXJ0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/RZTlu/btr5NKjVdcq/f2jgh4YspqTAtR1PPOxXJ0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FRZTlu%2Fbtr5NKjVdcq%2Ff2jgh4YspqTAtR1PPOxXJ0%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; loading=&quot;lazy&quot; width=&quot;352&quot; height=&quot;128&quot; data-filename=&quot;스크린샷 2023-03-24 오후 3.00.42.png&quot; data-origin-width=&quot;352&quot; data-origin-height=&quot;128&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/카카오 챗봇</category>
      <category>GPT</category>
      <category>챗봇</category>
      <category>카카오봇</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/5</guid>
      <comments>https://sujspace.tistory.com/5#entry5comment</comments>
      <pubDate>Fri, 24 Mar 2023 15:02:20 +0900</pubDate>
    </item>
    <item>
      <title>SSH 접속 에러 WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!</title>
      <link>https://sujspace.tistory.com/4</link>
      <description>&lt;h4 style=&quot;border-left: 10px solid #ff3d00; letter-spacing: -1px; padding: 0px 0px 0px 7px; margin: 5px 0px;&quot; data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-size: 21px; font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #ff3d00;&quot;&gt;&lt;b&gt;원인&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;div data-ke-type=&quot;moreLess&quot; data-text-more=&quot;더보기&quot; data-text-less=&quot;닫기&quot;&gt;&lt;a class=&quot;btn-toggle-moreless&quot;&gt;더보기&lt;/a&gt;
&lt;div class=&quot;moreless-content&quot;&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@&lt;br /&gt;@&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;WARNING:&amp;nbsp;REMOTE&amp;nbsp;HOST&amp;nbsp;IDENTIFICATION&amp;nbsp;HAS&amp;nbsp;CHANGED!&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;@&lt;br /&gt;@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@&lt;br /&gt;IT&amp;nbsp;IS&amp;nbsp;POSSIBLE&amp;nbsp;THAT&amp;nbsp;SOMEONE&amp;nbsp;IS&amp;nbsp;DOING&amp;nbsp;SOMETHING&amp;nbsp;NASTY!&lt;br /&gt;Someone&amp;nbsp;could&amp;nbsp;be&amp;nbsp;eavesdropping&amp;nbsp;on&amp;nbsp;you&amp;nbsp;right&amp;nbsp;now&amp;nbsp;(man-in-the-middle&amp;nbsp;attack)!&lt;br /&gt;It&amp;nbsp;is&amp;nbsp;also&amp;nbsp;possible&amp;nbsp;that&amp;nbsp;a&amp;nbsp;host&amp;nbsp;key&amp;nbsp;has&amp;nbsp;just&amp;nbsp;been&amp;nbsp;changed.&lt;br /&gt;The&amp;nbsp;fingerprint&amp;nbsp;for&amp;nbsp;the&amp;nbsp;ED25519&amp;nbsp;key&amp;nbsp;sent&amp;nbsp;by&amp;nbsp;the&amp;nbsp;remote&amp;nbsp;host&amp;nbsp;is&lt;br /&gt;SHA256:------------------------------------------------.&lt;br /&gt;Please&amp;nbsp;contact&amp;nbsp;your&amp;nbsp;system&amp;nbsp;administrator.&lt;br /&gt;Add&amp;nbsp;correct&amp;nbsp;host&amp;nbsp;key&amp;nbsp;in&amp;nbsp;/Users/suj/.ssh/known_hosts&amp;nbsp;to&amp;nbsp;get&amp;nbsp;rid&amp;nbsp;of&amp;nbsp;this&amp;nbsp;message.&lt;br /&gt;Offending&amp;nbsp;ED25519&amp;nbsp;key&amp;nbsp;in&amp;nbsp;/Users/suj/.ssh/known_hosts:122&lt;br /&gt;Host key for 192.123.12.1 has changed and you have requested strict checking.&lt;br /&gt;Host&amp;nbsp;key&amp;nbsp;verification&amp;nbsp;failed.&lt;/p&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;원격 호스트 식별 정보가 변경되어 등록되어있던 KEY값과 달라 접속할 수 없는 상황이다.&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 style=&quot;border-left: 10px solid #10C800; letter-spacing: -1px; padding: 0px 0px 0px 7px; margin: 5px 0px;&quot; data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-size: 21px; font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #10c800;&quot;&gt;&lt;b&gt;해결&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;pre id=&quot;code_1678766106491&quot; class=&quot;bash&quot; data-ke-language=&quot;bash&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;ssh-keygen -R &amp;lt;IP&amp;gt;&lt;/code&gt;&lt;/pre&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 style=&quot;border-left: 10px solid #5e4d79; letter-spacing: -1px; padding: 0px 0px 0px 7px; margin: 5px 0px;&quot; data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-size: 21px; font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #5e4d79;&quot;&gt;&lt;b&gt;실행 결과 &lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-origin-width=&quot;454&quot; data-origin-height=&quot;90&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/rxxTz/btr3QwtX7hH/rBPLnIYamxXeF4R4f7H9o1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/rxxTz/btr3QwtX7hH/rBPLnIYamxXeF4R4f7H9o1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/rxxTz/btr3QwtX7hH/rBPLnIYamxXeF4R4f7H9o1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FrxxTz%2Fbtr3QwtX7hH%2FrBPLnIYamxXeF4R4f7H9o1%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; loading=&quot;lazy&quot; width=&quot;454&quot; height=&quot;90&quot; data-origin-width=&quot;454&quot; data-origin-height=&quot;90&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;</description>
      <category>개발/Linux</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/4</guid>
      <comments>https://sujspace.tistory.com/4#entry4comment</comments>
      <pubDate>Tue, 14 Mar 2023 13:00:14 +0900</pubDate>
    </item>
    <item>
      <title>아마존 AWS Cloud 계정 삭제 방법</title>
      <link>https://sujspace.tistory.com/2</link>
      <description>&lt;p data-ke-size=&quot;size16&quot;&gt;더 이상 사용하지않는 계정을 삭제하려고 합니다.&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size16&quot;&gt;1. AWS 콘솔에서 계정을 로그인을 한다.&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size16&quot;&gt;&lt;a title=&quot;아마존 로그인 페이지&quot; href=&quot;https://aws.amazon.com/marketplace/management/signin&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;아마존 로그인 페이지로 이동&lt;/a&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size16&quot;&gt;2.오른쪽 자신의 아이디를 누른 후 아래의 화면에서 &lt;b&gt;'계정'&lt;/b&gt; 버튼을 누른다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-02-22 오후 2.34.00.png&quot; data-origin-width=&quot;297&quot; data-origin-height=&quot;417&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/cqLHut/btr0nM8t9Mk/ZBkWApMZBWCczV1IZIik5K/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/cqLHut/btr0nM8t9Mk/ZBkWApMZBWCczV1IZIik5K/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/cqLHut/btr0nM8t9Mk/ZBkWApMZBWCczV1IZIik5K/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FcqLHut%2Fbtr0nM8t9Mk%2FZBkWApMZBWCczV1IZIik5K%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; loading=&quot;lazy&quot; width=&quot;297&quot; height=&quot;417&quot; data-filename=&quot;스크린샷 2023-02-22 오후 2.34.00.png&quot; data-origin-width=&quot;297&quot; data-origin-height=&quot;417&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size16&quot;&gt;3. 제일 아래로 스크롤해서 내리면 &lt;b&gt;계정 해지&lt;/b&gt; 탭이 나온다. 모드 체크 후 &lt;b&gt;계정 해지 버튼&lt;/b&gt;을 누르면 계정 해지 요청이 완료된다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-ke-mobileStyle=&quot;widthOrigin&quot; data-filename=&quot;스크린샷 2023-02-22 오후 2.36.22.png&quot; data-origin-width=&quot;1155&quot; data-origin-height=&quot;389&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/dGkPwh/btr0nDKEDt5/0tVXdrYlx7AEeQUbS3Ksc0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/dGkPwh/btr0nDKEDt5/0tVXdrYlx7AEeQUbS3Ksc0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/dGkPwh/btr0nDKEDt5/0tVXdrYlx7AEeQUbS3Ksc0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FdGkPwh%2Fbtr0nDKEDt5%2F0tVXdrYlx7AEeQUbS3Ksc0%2Fimg.png&quot; onerror=&quot;this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';&quot; loading=&quot;lazy&quot; width=&quot;1155&quot; height=&quot;389&quot; data-filename=&quot;스크린샷 2023-02-22 오후 2.36.22.png&quot; data-origin-width=&quot;1155&quot; data-origin-height=&quot;389&quot;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>개발/Cloud</category>
      <category>AWS</category>
      <author>suj-space</author>
      <guid isPermaLink="true">https://sujspace.tistory.com/2</guid>
      <comments>https://sujspace.tistory.com/2#entry2comment</comments>
      <pubDate>Wed, 22 Feb 2023 14:41:32 +0900</pubDate>
    </item>
  </channel>
</rss>