<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0">
  <channel>
    <title>Code in</title>
    <link>https://codeinleonis.tistory.com/</link>
    <description></description>
    <language>ko</language>
    <pubDate>Tue, 16 Jun 2026 07:20:19 +0900</pubDate>
    <generator>TISTORY</generator>
    <ttl>100</ttl>
    <managingEditor>heyhmin</managingEditor>
    <item>
      <title>아이랑 프로젝트 (2) GPT3, Magenta js로 사용하기</title>
      <link>https://codeinleonis.tistory.com/46</link>
      <description>&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;프로젝트 소개&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;아이랑 프로젝트는 AI의 창작능력과 관련한 산학 프로젝트이다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;AI의 발전에 따라 그 창작능력에 대한 연구가 많은 곳에서 진행되어왔다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;과연 AI는 인간과 비슷한 창작능력을 가질 수 있을까?&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;우리 팀에서는 이에 대한 해답으로 아이랑 프로젝트, AI로 동요 작사작곡하기 를 진행하고 있다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;작사&lt;/b&gt;에는 가장 성능이 좋다고 판단한&lt;b&gt; GPT-3&lt;/b&gt;를 사용하였고,&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;작곡&lt;/b&gt;에는 구글의 &lt;b&gt;Magenta&lt;/b&gt; 프로젝트의 chord-pitches-improv를 사용하였다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;Magenta&lt;/b&gt;는 LSTM(RNN)을 사용한다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Cell-state가 있고, 이를 반복적으로 업데이트 하는 것이다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;GPT-3&lt;/b&gt;는 In-context learning을 하는 meta learning을 진행하였다. &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;zero-shot, one-shot, few-shot의 방식을 확인했다고 한다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;zero-shot : Task-description + prompt&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;one-shot : Task-description + example + prompt&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;few-shot : Task-description + examples + prompts&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;708&quot; data-origin-height=&quot;613&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/czjd6w/btq4XFdMkn7/OOju1mB8P7xSdIWbshdJn1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/czjd6w/btq4XFdMkn7/OOju1mB8P7xSdIWbshdJn1/img.png&quot; data-alt=&quot;해당 Figure는 GPT-3 논문에서 확인할 수 있다.&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/czjd6w/btq4XFdMkn7/OOju1mB8P7xSdIWbshdJn1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fczjd6w%2Fbtq4XFdMkn7%2FOOju1mB8P7xSdIWbshdJn1%2Fimg.png&quot; data-origin-width=&quot;708&quot; data-origin-height=&quot;613&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;figcaption&gt;해당 Figure는 GPT-3 논문에서 확인할 수 있다.&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;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;현재 진행상황&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;지난 학기와 겨울방학까지 작사, 작곡에 대한 연구를 마무리하였다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;작사의 경우 Few shot learning을 사용하기 위해 prompt에 theme 문장과 예시들을 사용하기로 하였다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;( task description + examples + prompt )&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;작사의 &lt;b&gt;validation&lt;/b&gt;을 위해서는 &lt;b&gt;표절률&lt;/b&gt;을 사용하기로 하였다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이 때, 표절률을 낮추기 위해서 &lt;b&gt;frequency penalty&lt;/b&gt;를 주기로 하였다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;frequency penalty는 반복되는 단어가 나오는 것에 대한 패널티(부정적인 값)을 부과하여 표절을 방지하는 것이다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;패널티는 가능한 단어들의 숫자를 줄이기 때문에 &lt;b&gt;temperature를 높이는 것과 유사한 효과&lt;/b&gt;를 보인다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;하여 temperature를 0.5 정도로 낮추기로 하였다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;583&quot; data-origin-height=&quot;281&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bjd3ma/btq4YNoCKdQ/EvHYQBCXQIWV6WBXGxUsc1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bjd3ma/btq4YNoCKdQ/EvHYQBCXQIWV6WBXGxUsc1/img.png&quot; data-alt=&quot;frequencyPenalty와 temperature를 확인할 수 있다.&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bjd3ma/btq4YNoCKdQ/EvHYQBCXQIWV6WBXGxUsc1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fbjd3ma%2Fbtq4YNoCKdQ%2FEvHYQBCXQIWV6WBXGxUsc1%2Fimg.png&quot; data-origin-width=&quot;583&quot; data-origin-height=&quot;281&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;figcaption&gt;frequencyPenalty와 temperature를 확인할 수 있다.&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&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;829&quot; data-origin-height=&quot;227&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bDT3ls/btq4WWtKRgl/79voOnihk6WdIipSp493a0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bDT3ls/btq4WWtKRgl/79voOnihk6WdIipSp493a0/img.png&quot; data-alt=&quot;프로젝트에서 작사 연구를 하며 얻은 GPT-3의 동요 작사 결과이다.&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bDT3ls/btq4WWtKRgl/79voOnihk6WdIipSp493a0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbDT3ls%2Fbtq4WWtKRgl%2F79voOnihk6WdIipSp493a0%2Fimg.png&quot; data-origin-width=&quot;829&quot; data-origin-height=&quot;227&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;figcaption&gt;프로젝트에서 작사 연구를 하며 얻은 GPT-3의 동요 작사 결과이다.&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;blockquote data-ke-style=&quot;style1&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;꽃이 피어오면 &lt;br /&gt;흰눈이 내리는 봄빛처럼 &lt;br /&gt;너를 사랑해&lt;br /&gt;&lt;br /&gt;피어나는 봄빛이 &lt;br /&gt;사람들을 사로잡아 &lt;br /&gt;웃음꽃이 피고&amp;nbsp;있어요&lt;br /&gt;&lt;br /&gt;아침이 오면 꽃이 피어오고 뻗은 꽃은 &lt;br /&gt;언제나 이렇게 아침을 축하하고 싶어&lt;br /&gt;&lt;br /&gt;꽃이 움직여 봄빛이 나는 아침에 &lt;br /&gt;꽃이 들어와 웃고 있는 아침 &lt;br /&gt;봄꽃이 피는 밤 햇살이 가득한 아침에&lt;br /&gt;&lt;br /&gt;구름에 사는 봄빛이 &lt;br /&gt;흘러내리는 골짜기에 &lt;br /&gt;꽃이 피어오르고&lt;br /&gt;&lt;br /&gt;꽃이 소리쳐 노래하는&amp;nbsp;밤 &lt;br /&gt;하늘 위에 피는 별처럼 &lt;br /&gt;미소를 걸고 있는 꽃망울 &lt;br /&gt;&lt;br /&gt;내게 전해요&lt;/b&gt;&lt;/span&gt;&lt;/blockquote&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: black; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;작사 결과물은 정말 놀랍다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: black; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;굉장히 시적이고 아름다운 문장들을 AI, GPT-3가 생성할 수 있음을 알 수 있다.&lt;/span&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;span style=&quot;color: black; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;작곡에 대한 연구는 다른 분들이 진행해주셨고, &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: black; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;최종적으로 chord-pitches-improv를 사용하고 16 stepe per chord, 기존 동요들의 chords을 사용하기로 하였다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: black; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&amp;nbsp;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; width=&quot;602&quot; height=&quot;707&quot; data-origin-width=&quot;783&quot; data-origin-height=&quot;919&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/rFFDv/btq4XxUBCAJ/NSQK8aGkRKymxycVqhFAbk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/rFFDv/btq4XxUBCAJ/NSQK8aGkRKymxycVqhFAbk/img.png&quot; data-alt=&quot;작곡 결과물의 악보 변환 이미지 1&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/rFFDv/btq4XxUBCAJ/NSQK8aGkRKymxycVqhFAbk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FrFFDv%2Fbtq4XxUBCAJ%2FNSQK8aGkRKymxycVqhFAbk%2Fimg.png&quot; width=&quot;602&quot; height=&quot;707&quot; data-origin-width=&quot;783&quot; data-origin-height=&quot;919&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;figcaption&gt;작곡 결과물의 악보 변환 이미지 1&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;figure class=&quot;imageblock alignCenter&quot; width=&quot;602&quot; height=&quot;448&quot; data-origin-width=&quot;776&quot; data-origin-height=&quot;578&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/LPCLW/btq4X6CiENH/vKbcgSk2kdAAOU7yieKkck/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/LPCLW/btq4X6CiENH/vKbcgSk2kdAAOU7yieKkck/img.png&quot; data-alt=&quot;작곡 결과물의 악보 변환 이미지 2&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/LPCLW/btq4X6CiENH/vKbcgSk2kdAAOU7yieKkck/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FLPCLW%2Fbtq4X6CiENH%2FvKbcgSk2kdAAOU7yieKkck%2Fimg.png&quot; width=&quot;602&quot; height=&quot;448&quot; data-origin-width=&quot;776&quot; data-origin-height=&quot;578&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;figcaption&gt;작곡 결과물의 악보 변환 이미지 2&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;figure class=&quot;imageblock alignCenter&quot; width=&quot;602&quot; height=&quot;269&quot; data-origin-width=&quot;757&quot; data-origin-height=&quot;339&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/l07kE/btq4XgSTzDm/ZCoJan7opRCPkxzkUB8cm0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/l07kE/btq4XgSTzDm/ZCoJan7opRCPkxzkUB8cm0/img.png&quot; data-alt=&quot;작곡 결과물의 악보 변환 이미지 3&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/l07kE/btq4XgSTzDm/ZCoJan7opRCPkxzkUB8cm0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fl07kE%2Fbtq4XgSTzDm%2FZCoJan7opRCPkxzkUB8cm0%2Fimg.png&quot; width=&quot;602&quot; height=&quot;269&quot; data-origin-width=&quot;757&quot; data-origin-height=&quot;339&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;figcaption&gt;작곡 결과물의 악보 변환 이미지 3&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;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;처음에는 작사와 작곡의 연동을 진행하고자 했다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이를 위해 각각의 결과들을 비교하였고, 작곡의 steps과 작사의 max_tokens의 연관성을 파악하였다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;: steps / 5 * 3 = max_tokens&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;완전히 일치하지는 않지만 해당 수식을 적용하면 적절한 길이를 얻어 연동을 진행할 수 있다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;실제 구현 시에는 각각을 연동하지 않고 따로 보여주기로 하였다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;기술내용&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이번 학기에 주로 진행한 웹페이지에 기능 구현을 하는 방법에 대해 설명하고자 한다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;GPT-3는 웹페이지에 어떻게 구현할 수 있을까?&lt;/b&gt;&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이는 openAI 웹페이지의 &lt;b&gt;document&lt;/b&gt;를 보면 알 수 있다. (developer-quickstart/community-libraries)&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Javascript/Node를 사용하는 것을 미리 구현해 놓은 것들이 있으니 이를 사용하여 쉽게 진행할 수 있다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;참고로 구현되어 있는 것들을 사용하지 않아도, &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;GPT-3 url에 complete(response)를 요청하면 되는 것이기 때문에 쉽게 GPT-3를 사용할 수 있다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;우리는 &lt;span style=&quot;color: #032f62;&quot;&gt;openai-api를 사용하기로 했다.&lt;/span&gt;&lt;/span&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: #032f62; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;진행 순서는 다음과 같다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;&lt;span style=&quot;color: #032f62;&quot;&gt;[서버]&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span style=&quot;color: #032f62;&quot;&gt;1. API_KEY ( openAI에 신청하여 받을 수 있다 ) 를 입력하여 연결을 진행한다.&amp;nbsp;&lt;/span&gt;&lt;span style=&quot;color: #032f62;&quot;&gt;&lt;/span&gt;&lt;span style=&quot;color: #032f62;&quot;&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: #032f62; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;2. 자바스크립트의 async를 사용하여 GPT-3의 결과값을 받는다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: #032f62; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;3. 결과값의 불필요한 단어들을 삭제한다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: #032f62; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;4. 최종 결과를 시간데이터를 제목에 담고 있는 파일로 저장한다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: #032f62; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;5. 원하는 파일(들)을 가상 주소로 보내서 출력한다.&lt;/span&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: #032f62; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이 때, 미리 동요와 관련된 prompts를 정리하여 2번에 사용하였다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;&lt;span style=&quot;color: #032f62;&quot;&gt;[프론트]&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: #032f62; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;1. 원하는 파일(들)을 가상 주소에서 받아온다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span style=&quot;color: #032f62;&quot;&gt;2. 적절한 div에 출력한다.&lt;/span&gt;&lt;span style=&quot;color: #032f62;&quot;&gt;&lt;/span&gt;&lt;span style=&quot;color: #032f62;&quot;&gt;&lt;/span&gt;&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;Magenta는 웹페이지에 어떻게 구현할 수 있을까?&lt;/b&gt;&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;일단 마젠타 공식페이지의 블로그 글들을 읽자.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;a href=&quot;https://magenta.tensorflow.org/js-announce&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;https://magenta.tensorflow.org/js-announce&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;우리가 이미 연구한 방식을 적절히 응용할 수 있는 코드 펜을 사용하기로 했다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&quot;Mindless Improv&quot;를 직접 에러없이 사용한 다음, 해당 코드들을 우리가 원하는 방식으로 바꾼다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;로컬에서 실행이 잘 되지 않아 다른 깃허브를 참고하여 많은 api들을 추가로 사용하였다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;실행방법&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;GPT3 - 코드 설명, 결과&lt;/b&gt;&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;[서버]&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;먼저, GPT-3을 저장할 폴더를 만들어보자&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;375&quot; data-origin-height=&quot;371&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/nhrRD/btq4XcJPEIf/ZOeXscZhMLN6onuRNgKOhk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/nhrRD/btq4XcJPEIf/ZOeXscZhMLN6onuRNgKOhk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/nhrRD/btq4XcJPEIf/ZOeXscZhMLN6onuRNgKOhk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FnhrRD%2Fbtq4XcJPEIf%2FZOeXscZhMLN6onuRNgKOhk%2Fimg.png&quot; data-origin-width=&quot;375&quot; data-origin-height=&quot;371&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이처럼 openai라는 이름의 폴더를 만들었다.&amp;nbsp;&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;가장 쉬운 prompts set을 만들어 보자.&amp;nbsp;prompt.js 파일을 openai 폴더 내부에 생성한다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;theme 문장을 입력하고, 동요 가사들을 키워드인 input과 세부가사 output으로 나누어 입력한다.&lt;/span&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-origin-width=&quot;451&quot; data-origin-height=&quot;136&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/brhAgl/btq4X6CgIAb/fmUyquc6Lar9ga4cKTVQ1K/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/brhAgl/btq4X6CgIAb/fmUyquc6Lar9ga4cKTVQ1K/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/brhAgl/btq4X6CgIAb/fmUyquc6Lar9ga4cKTVQ1K/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbrhAgl%2Fbtq4X6CgIAb%2FfmUyquc6Lar9ga4cKTVQ1K%2Fimg.png&quot; data-origin-width=&quot;451&quot; data-origin-height=&quot;136&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;매번 다른 prompts를 사용할 수 있도록 random 함수도 사용한다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;392&quot; data-origin-height=&quot;67&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/nnGjh/btq4WLy0xlj/pSepwMoskLizV1QHGUUSU1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/nnGjh/btq4WLy0xlj/pSepwMoskLizV1QHGUUSU1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/nnGjh/btq4WLy0xlj/pSepwMoskLizV1QHGUUSU1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FnnGjh%2Fbtq4WLy0xlj%2FpSepwMoskLizV1QHGUUSU1%2Fimg.png&quot; data-origin-width=&quot;392&quot; data-origin-height=&quot;67&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&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;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;export 를 사용하여 최종 prompts를 받을 수 있는 함수를 다른 파일에서 사용할 수 있도록 한다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;329&quot; data-origin-height=&quot;103&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/qD45Y/btq4YOnzMOi/jZRDyoD58SVUgI52AzL2w1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/qD45Y/btq4YOnzMOi/jZRDyoD58SVUgI52AzL2w1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/qD45Y/btq4YOnzMOi/jZRDyoD58SVUgI52AzL2w1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FqD45Y%2Fbtq4YOnzMOi%2FjZRDyoD58SVUgI52AzL2w1%2Fimg.png&quot; data-origin-width=&quot;329&quot; data-origin-height=&quot;103&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;prompt.js&lt;/b&gt; 전체 코드는 깃허브에서 확인할 수 있다!&lt;/span&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;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;다음으로 &lt;b&gt;get.lyrics.js&lt;/b&gt; 파일을 생성한다. 이 파일에서는 실제 결과물 얻어 저장할 것이다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;저장을 위해 미리 lyricResult 폴더를 만든다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;450&quot; data-origin-height=&quot;190&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/brjuIR/btq4XDtxr6J/KKwscN5vrkzT68wKiIX011/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/brjuIR/btq4XDtxr6J/KKwscN5vrkzT68wKiIX011/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/brjuIR/btq4XDtxr6J/KKwscN5vrkzT68wKiIX011/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbrjuIR%2Fbtq4XDtxr6J%2FKKwscN5vrkzT68wKiIX011%2Fimg.png&quot; data-origin-width=&quot;450&quot; data-origin-height=&quot;190&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;get.lyrics.js에서는&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;파일저장을 위한 fs, prompts를 받아오는 selectedPrompts, AI결과를 받아오는 apenai-api가 필요하다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;320&quot; data-origin-height=&quot;132&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/oH8Nt/btq41k0uOSL/mv4cc1xPhBkx2i0OEJ7xd0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/oH8Nt/btq41k0uOSL/mv4cc1xPhBkx2i0OEJ7xd0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/oH8Nt/btq41k0uOSL/mv4cc1xPhBkx2i0OEJ7xd0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FoH8Nt%2Fbtq41k0uOSL%2Fmv4cc1xPhBkx2i0OEJ7xd0%2Fimg.png&quot; data-origin-width=&quot;320&quot; data-origin-height=&quot;132&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이후 API KEY를 입력하도록 한다. (openAI 홈페이지 에서 확인할 수 있다.)&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;API KEY를 사용하여 OpenAI를 생성한다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;321&quot; data-origin-height=&quot;24&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/eoFbxX/btq4YOVo5ZS/BkXZMiRSfeWFFpohktyV1k/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/eoFbxX/btq4YOVo5ZS/BkXZMiRSfeWFFpohktyV1k/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/eoFbxX/btq4YOVo5ZS/BkXZMiRSfeWFFpohktyV1k/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FeoFbxX%2Fbtq4YOVo5ZS%2FBkXZMiRSfeWFFpohktyV1k%2Fimg.png&quot; data-origin-width=&quot;321&quot; data-origin-height=&quot;24&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;GPT-3에 결과물을 요청한다! 미리 연구한 파라미터들과 함께 prompt를 넘겨준다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;350&quot; data-origin-height=&quot;182&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/cllE8M/btq4XciPfIo/qgEuBjt5ck8gIKihp2qF2k/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/cllE8M/btq4XciPfIo/qgEuBjt5ck8gIKihp2qF2k/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/cllE8M/btq4XciPfIo/qgEuBjt5ck8gIKihp2qF2k/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FcllE8M%2Fbtq4XciPfIo%2FqgEuBjt5ck8gIKihp2qF2k%2Fimg.png&quot; data-origin-width=&quot;350&quot; data-origin-height=&quot;182&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;생성된 결과물을 저장한다. 저장하기 전에 결과물에 들어있는 불필요한 값들을 제거해준다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;695&quot; data-origin-height=&quot;340&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/clOBlH/btq4WKUqETE/A8Bq68tsNJrddKpMeJmSa0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/clOBlH/btq4WKUqETE/A8Bq68tsNJrddKpMeJmSa0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/clOBlH/btq4WKUqETE/A8Bq68tsNJrddKpMeJmSa0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FclOBlH%2Fbtq4WKUqETE%2FA8Bq68tsNJrddKpMeJmSa0%2Fimg.png&quot; data-origin-width=&quot;695&quot; data-origin-height=&quot;340&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;파일을 생성할 때 파일 이름으로 날짜와 시간값을 사용한다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;424&quot; data-origin-height=&quot;224&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/ogDl4/btq4ZQZEqV5/sX2jlNGSbdctJ9D6gmljPK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/ogDl4/btq4ZQZEqV5/sX2jlNGSbdctJ9D6gmljPK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/ogDl4/btq4ZQZEqV5/sX2jlNGSbdctJ9D6gmljPK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FogDl4%2Fbtq4ZQZEqV5%2FsX2jlNGSbdctJ9D6gmljPK%2Fimg.png&quot; data-origin-width=&quot;424&quot; data-origin-height=&quot;224&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Max token 값은 180 ~ 220으로 하였다. 한글 기준으로 대략 3 token이 1개의 글자를 생성한다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;349&quot; data-origin-height=&quot;78&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/eojqjI/btq4Xcb2qs8/fK35hqKhFexd7omlKGCO9k/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/eojqjI/btq4Xcb2qs8/fK35hqKhFexd7omlKGCO9k/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/eojqjI/btq4Xcb2qs8/fK35hqKhFexd7omlKGCO9k/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FeojqjI%2Fbtq4Xcb2qs8%2FfK35hqKhFexd7omlKGCO9k%2Fimg.png&quot; data-origin-width=&quot;349&quot; data-origin-height=&quot;78&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이후에는 필요하면 export를 사용하여 결과물을 넘겨줄 수 있다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;하지만 파일 저장을 했으니 파일을 읽어보자.&lt;/span&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;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;read.file.js&lt;/b&gt;를 생성한다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;파일을 읽기 위해 path, fs를 불러온다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;241&quot; data-origin-height=&quot;70&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/cXrRIo/btq4Y6uTIed/Vd9CeBg7gakT2suyplLAGk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/cXrRIo/btq4Y6uTIed/Vd9CeBg7gakT2suyplLAGk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/cXrRIo/btq4Y6uTIed/Vd9CeBg7gakT2suyplLAGk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FcXrRIo%2Fbtq4Y6uTIed%2FVd9CeBg7gakT2suyplLAGk%2Fimg.png&quot; data-origin-width=&quot;241&quot; data-origin-height=&quot;70&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;경로를 미리 설정한다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;그리고 해당 폴더에 있는 파일들의 이름을 모두 읽어온다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;가장 최근에 생성된 파일의 이름은 쉽게 얻을 수 있다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;431&quot; data-origin-height=&quot;80&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/dFD9cO/btq4XXlcdgA/EjimSuPfW8KjZw6H6D1sPk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/dFD9cO/btq4XXlcdgA/EjimSuPfW8KjZw6H6D1sPk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/dFD9cO/btq4XXlcdgA/EjimSuPfW8KjZw6H6D1sPk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FdFD9cO%2Fbtq4XXlcdgA%2FEjimSuPfW8KjZw6H6D1sPk%2Fimg.png&quot; data-origin-width=&quot;431&quot; data-origin-height=&quot;80&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;각 파일들의 내용을 저장한다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;630&quot; data-origin-height=&quot;121&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/ybWXs/btq4YOgO3fo/QRvvuztahYpkQwUstRJQH1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/ybWXs/btq4YOgO3fo/QRvvuztahYpkQwUstRJQH1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/ybWXs/btq4YOgO3fo/QRvvuztahYpkQwUstRJQH1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FybWXs%2Fbtq4YOgO3fo%2FQRvvuztahYpkQwUstRJQH1%2Fimg.png&quot; data-origin-width=&quot;630&quot; data-origin-height=&quot;121&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;파일들의 이름과 내용을 합쳐서 반환해보자.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;309&quot; data-origin-height=&quot;178&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/PWAd9/btq4XXZMsYx/q8EPnAMINN5XP3KZ2fYa9k/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/PWAd9/btq4XXZMsYx/q8EPnAMINN5XP3KZ2fYa9k/img.png&quot; data-alt=&quot;lyric 구조를 먼저 생성한다.&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/PWAd9/btq4XXZMsYx/q8EPnAMINN5XP3KZ2fYa9k/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FPWAd9%2Fbtq4XXZMsYx%2Fq8EPnAMINN5XP3KZ2fYa9k%2Fimg.png&quot; data-origin-width=&quot;309&quot; data-origin-height=&quot;178&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;figcaption&gt;lyric 구조를 먼저 생성한다.&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;475&quot; data-origin-height=&quot;100&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/pdVdH/btq4WWgdL3P/k2ZR6i5sjyMORPy32kAuck/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/pdVdH/btq4WWgdL3P/k2ZR6i5sjyMORPy32kAuck/img.png&quot; data-alt=&quot;각 파일들의 이름과 내용을 함께 저장한다.&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/pdVdH/btq4WWgdL3P/k2ZR6i5sjyMORPy32kAuck/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FpdVdH%2Fbtq4WWgdL3P%2Fk2ZR6i5sjyMORPy32kAuck%2Fimg.png&quot; data-origin-width=&quot;475&quot; data-origin-height=&quot;100&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&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;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;export 할 때 모든 variables를 반환할 수 있지만, 구현 방법에 따라 몇 가지만 사용할 가능성이 높다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;714&quot; data-origin-height=&quot;22&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/DBaBK/btq4YJzX5Wv/skRLFhdrWdLkrRn6K2nmBK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/DBaBK/btq4YJzX5Wv/skRLFhdrWdLkrRn6K2nmBK/img.png&quot; data-alt=&quot;모든 variables를 반환한다. 주로 allLyric, recentLyric을 사용할 것이기 때문에 그 외의 것들은 제외하여도 좋다.&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/DBaBK/btq4YJzX5Wv/skRLFhdrWdLkrRn6K2nmBK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FDBaBK%2Fbtq4YJzX5Wv%2FskRLFhdrWdLkrRn6K2nmBK%2Fimg.png&quot; data-origin-width=&quot;714&quot; data-origin-height=&quot;22&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;figcaption&gt;모든 variables를 반환한다. 주로 allLyric, recentLyric을 사용할 것이기 때문에 그 외의 것들은 제외하여도 좋다.&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이후 라우팅을 진행할 때 각 값을 전달할 수 있다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;305&quot; data-origin-height=&quot;63&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/XFZHZ/btq40QZv5L3/Nt10Eedbbr4ApWQbcw7rK0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/XFZHZ/btq40QZv5L3/Nt10Eedbbr4ApWQbcw7rK0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/XFZHZ/btq40QZv5L3/Nt10Eedbbr4ApWQbcw7rK0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FXFZHZ%2Fbtq40QZv5L3%2FNt10Eedbbr4ApWQbcw7rK0%2Fimg.png&quot; data-origin-width=&quot;305&quot; data-origin-height=&quot;63&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&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;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;[프론트]&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이제 API_URL에서 전달된 allLyric 혹은 recentLyric을 읽어보자.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;249&quot; data-origin-height=&quot;64&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/c4pmDM/btq4Y5iujpU/aevUwBTN4gk8N5gYiNxGaK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/c4pmDM/btq4Y5iujpU/aevUwBTN4gk8N5gYiNxGaK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/c4pmDM/btq4Y5iujpU/aevUwBTN4gk8N5gYiNxGaK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fc4pmDM%2Fbtq4Y5iujpU%2FaevUwBTN4gk8N5gYiNxGaK%2Fimg.png&quot; data-origin-width=&quot;249&quot; data-origin-height=&quot;64&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이처럼 리액트에서 axios를 사용하여 /api/test/all에 출력된 allLyric 혹은 recentLyric을 읽을 수 있다.&lt;/span&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;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;하나의 가사 파일을 읽을 때는 title, content로 받을 수 있고 &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;여러 가사 파일들을 읽을 때는 list와 loading boolean 값을 사용해야 한다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;255&quot; data-origin-height=&quot;280&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/FukUe/btq4Yr0tjZy/YMQh89lBljG0kDmgJhrDj1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/FukUe/btq4Yr0tjZy/YMQh89lBljG0kDmgJhrDj1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/FukUe/btq4Yr0tjZy/YMQh89lBljG0kDmgJhrDj1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FFukUe%2Fbtq4Yr0tjZy%2FYMQh89lBljG0kDmgJhrDj1%2Fimg.png&quot; data-origin-width=&quot;255&quot; data-origin-height=&quot;280&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;읽은 값으로 setState를 진행한다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;313&quot; data-origin-height=&quot;44&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bpY2MH/btq4X7unQtB/XytwLnJpvFH5xnISqNflUk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bpY2MH/btq4X7unQtB/XytwLnJpvFH5xnISqNflUk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bpY2MH/btq4X7unQtB/XytwLnJpvFH5xnISqNflUk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbpY2MH%2Fbtq4X7unQtB%2FXytwLnJpvFH5xnISqNflUk%2Fimg.png&quot; data-origin-width=&quot;313&quot; data-origin-height=&quot;44&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&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-origin-width=&quot;304&quot; data-origin-height=&quot;262&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/ADza1/btq4XcXnP3l/BP2GWKneiJKB8IuZKilsD0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/ADza1/btq4XcXnP3l/BP2GWKneiJKB8IuZKilsD0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/ADza1/btq4XcXnP3l/BP2GWKneiJKB8IuZKilsD0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FADza1%2Fbtq4XcXnP3l%2FBP2GWKneiJKB8IuZKilsD0%2Fimg.png&quot; data-origin-width=&quot;304&quot; data-origin-height=&quot;262&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;사용할 때는 각각 다음처럼 사용할 수 있다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;273&quot; data-origin-height=&quot;305&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/U18TQ/btq4Xbc84He/kqGLE4p8v7bREzT6OUTaIk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/U18TQ/btq4Xbc84He/kqGLE4p8v7bREzT6OUTaIk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/U18TQ/btq4Xbc84He/kqGLE4p8v7bREzT6OUTaIk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FU18TQ%2Fbtq4Xbc84He%2FkqGLE4p8v7bREzT6OUTaIk%2Fimg.png&quot; data-origin-width=&quot;273&quot; data-origin-height=&quot;305&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이러한 방식을 잘 활용할 수 있는 웹페이지를 디자인하여 사용해보자!&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;현재 우리 프로젝트는 웹 UI를 더 수정해야 한다...&lt;/span&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;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;Magenta - 코드 설명, 결과&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;앞서 소개한 마젠타 블로그와 깃허브의 script 목록을 사용하여 기본 구조를 갖춘다.&amp;nbsp;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;343&quot; data-origin-height=&quot;186&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/dJCx3Z/btq4YJUfXpx/KJ1AOSKqkBIjeKPBsKHo8K/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/dJCx3Z/btq4YJUfXpx/KJ1AOSKqkBIjeKPBsKHo8K/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/dJCx3Z/btq4YJUfXpx/KJ1AOSKqkBIjeKPBsKHo8K/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FdJCx3Z%2Fbtq4YJUfXpx%2FKJ1AOSKqkBIjeKPBsKHo8K%2Fimg.png&quot; data-origin-width=&quot;343&quot; data-origin-height=&quot;186&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;동요 코드들을 정리한다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;253&quot; data-origin-height=&quot;144&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/EfwAt/btq4Y6uUqbP/vGPCSRjM33FXKoKwq8dPi1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/EfwAt/btq4Y6uUqbP/vGPCSRjM33FXKoKwq8dPi1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/EfwAt/btq4Y6uUqbP/vGPCSRjM33FXKoKwq8dPi1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FEfwAt%2Fbtq4Y6uUqbP%2FvGPCSRjM33FXKoKwq8dPi1%2Fimg.png&quot; data-origin-width=&quot;253&quot; data-origin-height=&quot;144&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;랜덤하게 chords를 받을 수 있도록 랜덤 함수를 만들어 놓는다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;382&quot; data-origin-height=&quot;69&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bJLnaH/btq41lZpIcX/YfKtpZxJMzpItJNxOo2U41/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bJLnaH/btq41lZpIcX/YfKtpZxJMzpItJNxOo2U41/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bJLnaH/btq41lZpIcX/YfKtpZxJMzpItJNxOo2U41/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbJLnaH%2Fbtq41lZpIcX%2FYfKtpZxJMzpItJNxOo2U41%2Fimg.png&quot; data-origin-width=&quot;382&quot; data-origin-height=&quot;69&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;버튼을 누를때마다 chords를 갱신할 수 있도록 한다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;377&quot; data-origin-height=&quot;204&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/cYEbE6/btq40QkT9Eu/xOPYzetP9lnKWxdfneje90/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/cYEbE6/btq40QkT9Eu/xOPYzetP9lnKWxdfneje90/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/cYEbE6/btq40QkT9Eu/xOPYzetP9lnKWxdfneje90/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FcYEbE6%2Fbtq40QkT9Eu%2FxOPYzetP9lnKWxdfneje90%2Fimg.png&quot; data-origin-width=&quot;377&quot; data-origin-height=&quot;204&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;선택된 코드 구성을 따를 수 있도록 for문을 돌린다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;472&quot; data-origin-height=&quot;227&quot; data-ke-mobilestyle=&quot;widthOrigin&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/RiAkZ/btq4WK1eF5C/nL3Y6mEGc6rhepYXcGMxN0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/RiAkZ/btq4WK1eF5C/nL3Y6mEGc6rhepYXcGMxN0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/RiAkZ/btq4WK1eF5C/nL3Y6mEGc6rhepYXcGMxN0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FRiAkZ%2Fbtq4WK1eF5C%2FnL3Y6mEGc6rhepYXcGMxN0%2Fimg.png&quot; data-origin-width=&quot;472&quot; data-origin-height=&quot;227&quot; data-ke-mobilestyle=&quot;widthOrigin&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이렇게 하면 미리 정의한 동요 코드들과 같게 구성된 AI의 작곡 내용을 들을 수 있다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;현재 상태로 웹페이지의 기능 구현을 마무리할 경우, 저장이 안되는 것이 아쉬울 것이다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;하여 현재 기능 구현이 대략적으로 완료되었으나&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;더 사용자 친화적으로 하고자 결과물 저장 및 악기 변경을 진행하고 있다.&lt;/span&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;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;관련 깃허브 소개 - 실행방법, 결과&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;앞서 Magenta와 관련되어 언급했던 참고한 깃허브이다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;a href=&quot;https://github.com/loganstillings/MelodyGenerator&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;https://github.com/loganstillings/MelodyGenerator&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;깃 클론을 한 다음, npm install, start를 진행하여 사용할 수 있다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;실행하면 피아노가 나오고, 건반을 꾹 누르고 있으면 AI가 생성한 곡을 들을 수 있다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이외에도 마젠타에서 제공하는 web demo들을 사용할 수 있는데, npm serve를 사용해야 할 수 도 있다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;package.json의 scripts를 잘 확인하고 실행하자.&lt;/span&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;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;마무리&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;동요 작사작곡이라는 주제이기 때문에 작사의 Prompt, 작곡의 chords를 동요 데이터에서 가져왔다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;편안한 코드chord 진행의 곡들을 들으면서, &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;그리고 시적인 작사 결과를 확인하면서 프로젝트를 할 수 있어서 좋다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;주제를 정말 잘 정한 것 같다.&lt;/span&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;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;프로젝트가 잘 마무리 되었으면 좋겠다.&lt;/span&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;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;관련 깃허브&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;1. &lt;a href=&quot;https://github.com/heyhmin/airangwebtest1&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;https://github.com/heyhmin/airangwebtest1&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;2. &lt;a href=&quot;https://github.com/heyhmin/chordpitchesusingtest&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;https://github.com/heyhmin/chordpitchesusingtest&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;3. &lt;a href=&quot;https://github.com/danbom/AIrang&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;https://github.com/danbom/AIrang&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;</description>
      <category>프로젝트_AI랑</category>
      <author>heyhmin</author>
      <guid isPermaLink="true">https://codeinleonis.tistory.com/46</guid>
      <comments>https://codeinleonis.tistory.com/46#entry46comment</comments>
      <pubDate>Sat, 15 May 2021 15:31:32 +0900</pubDate>
    </item>
    <item>
      <title>프로젝트 - AI랑, 아이랑 : AI 동요 창작 서비스 (1)</title>
      <link>https://codeinleonis.tistory.com/45</link>
      <description>&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;&lt;i&gt;AI 동요 창작 서비스 개발 프로젝트를 이번 9월에 기획, 진행하고 있습니다.&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;&lt;i&gt;'프로젝트 AI랑'에서는 비기술적인 내용이, '작사 AI 팀'에서는 기술적인 내용이 작성되어 있습니다.&lt;/i&gt;&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;h2 data-ke-size=&quot;size26&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #f89009;&quot;&gt;&lt;b&gt;AI랑 [아이랑] : AI 동요 창작 서비스&lt;/b&gt;&lt;/span&gt;&lt;/h2&gt;
&lt;hr contenteditable=&quot;false&quot; data-ke-type=&quot;horizontalRule&quot; data-ke-style=&quot;style5&quot; /&gt;&lt;hr contenteditable=&quot;false&quot; data-ke-type=&quot;horizontalRule&quot; data-ke-style=&quot;style6&quot; /&gt;
&lt;h3 data-ke-size=&quot;size23&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #1b711d;&quot;&gt;&lt;b&gt;프로젝트 AI랑&lt;/b&gt;&lt;/span&gt;&lt;/h3&gt;
&lt;hr contenteditable=&quot;false&quot; data-ke-type=&quot;horizontalRule&quot; data-ke-style=&quot;style5&quot; /&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;1. 프로젝트의 주제 선정 이유&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #f89009;&quot;&gt;&lt;b&gt;문제 정의&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: #000000; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;AI가 예술분야의 창작에 진입하였지만 아직 작곡, 작사에 대한 AI 활용은 부족하여 AI 창작 이후 사람의 편집을 거치는 형태입니다. &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;color: #000000; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;또한, 동요의 경우는 K-POP등의 장르와 다르게 그 생산 주체가 보다 한정되어 있다는 문제점이 있습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;따라서 AI가 동요를 작곡, 작사하는 프로그램을 개발하고자 합니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size16&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;작사/작곡으로 팀을 나누어서 동시에 진행하고 있습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;hr contenteditable=&quot;false&quot; data-ke-type=&quot;horizontalRule&quot; data-ke-style=&quot;style5&quot; /&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;2. 진행 내용&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #f89009;&quot;&gt;&lt;b&gt;9월&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;지도교수님과의 면담 이후, 동요 창작 AI라는 &lt;b&gt;주제를 선정&lt;/b&gt;하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;주제를 선정하고 다시 지도교수님과 면담을 통해 각자 세부적으로 자료조사할 내용을 선정하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;주제와 관련된 자료 조사 + 발표&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;- 작곡 AI SW&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;- 작곡 Open SW, Data Set&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;- 작곡 AI 논문&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;- 작사 AI 논문&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #f89009;&quot;&gt;&lt;b&gt;10월&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;팀원마다 하나의 자료조사 주제를 가지고 계속해서 자료조사를 진행하였고, 각자 30분 가량의 발표를 준비하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;더해서 현존하는 작곡 AI 서비스를 사용하여 팀원들이 각각 노래를 한 곡 씩 창작하여 공유할 수 있도록 하였습니다.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;웹 프론트 플로우를 볼 수 있는 디자인, 프로토 타입을 &lt;span style=&quot;color: #006dd7;&quot;&gt;&lt;b&gt;Adobe XD&lt;/b&gt;&lt;/span&gt;를 사용하여 제작하였습니다.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;멘토님과의 1차 멘토링을 진행하였습니다.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;중간 발표와 사업계획서 작성을 진행하였습니다.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;지도교수님과의 면담 시간에 팀원들이 각각 30분씩 &lt;b&gt;발표를 진행&lt;/b&gt;하였습니다.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;진행한 발표의 세부 주제는 9월에 적혀 있는 것과 같습니다.&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #f89009;&quot;&gt;&lt;span&gt;&lt;b&gt;11월&lt;/b&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;팀을 작사 AI, 작곡 AI로 나누어서 진행하였습니다. 저는 작사 AI 팀입니다.&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;멘토님과의 2차 멘토링을 진행하였습니다. 멘토링을 통해 프로젝트의 계획과 방향성을 점검할 수 있었습니다.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;&lt;span&gt;작사 AI 팀&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;동요 Data Set을 수집하였습니다. 우선 구글 검색을 통해 동요 165곡의 가사를 수집하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이후 파랑새 창작 동요회, 한국 동요 작곡가 협회의 홈페이지를 통해 공개된 창작 동요 약 200곡의 가사를 수집하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;데이터 셋 수집 과정에서 동요 가사의 응집성 등을 위해서는 키워드가 필요하다는 것을 알게 되었습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;또한, 작사를 진행할 때 KoGPT-2를 사용하려고 하고 있는데, 해당 알고리즘에도 시작하는 메인 키워드가 주어져야 합니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이를 위해 수집한 동요 가사 데이터 셋에서의 핵심 키워드를 추출하고자 KRWordRank를 사용하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;추출된 핵심 키워드들 중, 명사들을 키워드로 선정하였습니다.&amp;nbsp;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;선정된 명사 키워드들을 자연, 가족, 동물, 계절 및 시간, 사람, 감정 및 감각의 메인 키워드로 분류하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;각각의 메인 키워드로 분류된 세부 키워드들 중 그 수가 적은 것들은 직접 키워드를 일부 추가하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #f89009;&quot;&gt;&lt;b&gt;12월 ~ 6월&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;12월에는 기말발표와 보고서, 깃허브, 영상, 시제품 제출이 진행될 예정입니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;1월에는 작사 작곡 AI 1차 개발, 피드백, 2차 개발이 진행됩니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;2월에는 작사 작곡 AI 개발 완료, 각각을 연동하는 과정이 진행됩니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;3월~5월에는 웹페이지 구현이 진행됩니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;6월에는 결과물에 대한 피드백과 수정이 진행됩니다.&lt;/span&gt;&lt;/p&gt;
&lt;hr contenteditable=&quot;false&quot; data-ke-type=&quot;horizontalRule&quot; data-ke-style=&quot;style5&quot; /&gt;&lt;hr contenteditable=&quot;false&quot; data-ke-type=&quot;horizontalRule&quot; data-ke-style=&quot;style6&quot; /&gt;
&lt;h3 data-ke-size=&quot;size23&quot;&gt;&lt;span style=&quot;color: #1b711d; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;작사 AI 팀&lt;/b&gt;&lt;/span&gt;&lt;/h3&gt;
&lt;hr contenteditable=&quot;false&quot; data-ke-type=&quot;horizontalRule&quot; data-ke-style=&quot;style5&quot; /&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;&lt;span style=&quot;letter-spacing: 0px;&quot;&gt;1. Data Set&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; letter-spacing: 0px;&quot;&gt;작사 AI 팀에서는 먼저 동요 가사 Data Set을 수집하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; letter-spacing: 0px;&quot;&gt;검색을 통해 찾은 동요 가사 165곡에 더해서, 파랑새 창작 동요회에 존재하는 약 300개의 동요 가사들 중 100개의 곡을 데이터 셋으로 추가하였습니다. 파랑새 창작 동요회 웹페이지에 공개된 동요 음반 중, 우선 100곡을 수집하였습니다. &lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; letter-spacing: 0px;&quot;&gt;이후 추가적으로 확보하고자 합니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; letter-spacing: 0px;&quot;&gt;* 파랑새 창작 동요회 : &lt;a href=&quot;http://www.prs.or.kr/&quot;&gt;http://www.prs.or.kr/&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1606886131041&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;website&quot; data-og-title=&quot;::: 파랑새창작동요회 :::&quot; data-og-description=&quot;&quot; data-og-host=&quot;www.prs.or.kr&quot; data-og-source-url=&quot;http://www.prs.or.kr/&quot; data-og-url=&quot;http://www.prs.or.kr/&quot; data-og-image=&quot;&quot;&gt;&lt;a href=&quot;http://www.prs.or.kr/&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;http://www.prs.or.kr/&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;&gt;::: 파랑새창작동요회 :::&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;www.prs.or.kr&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;hr contenteditable=&quot;false&quot; data-ke-type=&quot;horizontalRule&quot; data-ke-style=&quot;style5&quot; /&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;2. KRWordRank - 가사 Data Set의 핵심 키워드 추출&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #f89009;&quot;&gt;&lt;b&gt;KRWordRank&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;KRWordRank는 한국어 문장에서 단어들을 추출하고, 단어의 중요도를 점수로 표시합니다.&amp;nbsp;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;PageRank와 비슷한 graph ranking 알고리즘인, HITS algorithm을 이용하여 단어를 추출합니다. &lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #f89009;&quot;&gt;&lt;b&gt;HITS algorithm&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Hyperlink-Induced Topic Search Algorithm입니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Jon Kleinberg가 개발한 웹페이지 검색 엔진의 랭킹 알고리즘으로, 웹 페이지를 평가하는 링크 분석 알고리즘입니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;a good hub represents a page that pointed to many other pages, while a good authority represents a page that is linked by many different hubs.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;좋은 허브는 다른 많은 페이지를 가리키는 페이지를 나타내고, 좋은 권위는 많은 다른 허브로 연결된 페이지를 나타냅니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이처럼 HITS는 허브와Hub 권위Authority를 사용하여 웹페이지 사이의 재귀적인 관계를 정의합니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;따라서 HITS 알고리즘에서는 각 페이지에 대해 2가지 점수를 할당합니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;its authority, which estimates the value of the content of the page, and its hub value, which estimates the value of its links to other pages.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;페이지 컨텐츠의 가치를 추정하는 점수와 다른 페이지에 대한 링크의 가치를 추정하는 점수입니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-filename=&quot;gfg-hits.PNG&quot; data-origin-width=&quot;894&quot; data-origin-height=&quot;452&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/kS9t8/btqONaBkM4N/pThwnA3cDlOud425x8Pn50/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/kS9t8/btqONaBkM4N/pThwnA3cDlOud425x8Pn50/img.png&quot; data-alt=&quot;GeeksforGeeks의 HITS Algorithm 설명에 나오는 Algorithm 화면 캡쳐입니다.&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/kS9t8/btqONaBkM4N/pThwnA3cDlOud425x8Pn50/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FkS9t8%2FbtqONaBkM4N%2FpThwnA3cDlOud425x8Pn50%2Fimg.png&quot; data-filename=&quot;gfg-hits.PNG&quot; data-origin-width=&quot;894&quot; data-origin-height=&quot;452&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;figcaption&gt;GeeksforGeeks의 HITS Algorithm 설명에 나오는 Algorithm 화면 캡쳐입니다.&lt;/figcaption&gt;
&lt;/figure&gt;
&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;위의 알고리즘처럼,&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;허브 점수는 권위 점수들의 합이 되고, 권위 점수는 허브 점수들의 합이 됩니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;color: #f89009; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;KRWordRank의 사용&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;KRWordRank를 사용하여 데이터 셋 중 빈출도가 높은 키워드를 추출하여 메인/세부 키워드를 선정했습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Colab을 사용하여 진행하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;먼저 구글 드라이브에 업로드한 동요 가사 Data Set 사용을 위해 구글 드라이브와 코랩을 연결합니다.&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1606888444761&quot; class=&quot;python&quot; data-ke-language=&quot;python&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;from google.colab import drive
drive.mount(&quot;/content/drive&quot;)&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;파일을 읽고, 잘 읽혔는지 확인하기 위해 출력하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1606888506418&quot; class=&quot;python&quot; data-ke-language=&quot;python&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;txt_path = '/content/drive/MyDrive/C_Study/20201117lyrics_HM.txt'
file1 = open(txt_path, &quot;r&quot;)

file1.name
file1.mode
FileContent = file1.read()
FileContent&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;KR WordRank 사용을 위해 krwordrank를 설치하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1606888541498&quot; class=&quot;python&quot; data-ke-language=&quot;python&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;pip install krwordrank&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이후 import를 진행하고, 읽은 파일의 개행문자 등을 기준으로 분리하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1606889369796&quot; class=&quot;python&quot; data-ke-language=&quot;python&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;def get_texts_scores(fname):
    with codecs.open(fname, encoding='utf-8') as f:
        docs = [doc.lower().replace('\n', '\t').replace('\r', '').split('\t') for doc in f]
        docs = [doc for doc in docs if len(doc) == 2]

        if not docs:
            print(&quot;not docs&quot;)
            return [], []

        texts, scores = zip(*docs)
        return list(texts), list(scores)

texts, scores = get_texts_scores(txt_path)
texts&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;span style=&quot;color: #333333;&quot;&gt;&lt;i&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;개행문자가 '\n'라고만 알고 있었는데 그 뒤에 '\r'이 같이 붙는 경우도 있다는 것을 새롭게 알게되어 해당 부분을 처리해야 했습니다.&lt;/span&gt;&lt;/i&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;위의 코드를 실행한 후에는 texts에 문장들이 담기게 됩니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;다음으로 단어들을 추출하는 과정을 거치게 됩니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;저는 krwordrank.word를 KRWordRank로 가져왔기 때문에 KRWordRank로 실행합니다.&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1606889551734&quot; class=&quot;python&quot; data-ke-language=&quot;python&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;wordrank_extractor = KRWordRank(
    min_count = 5, # 단어의 최소 출현 빈도수 (그래프 생성 시)
    max_length = 10, # 단어의 최대 길이
    verbose = True
    )

beta = 0.85    # PageRank의 decaying factor beta
max_iter = 10

keywords, rank, graph = wordrank_extractor.extract(texts, beta, max_iter)

stopwords = {'나의', '어디', '너무', '정말', '있어'}
passwords = {word:score for word, score in sorted(
    keywords.items(), key=lambda x:-x[1])[:300] if not (word in stopwords)}

from krwordrank.word import summarize_with_keywords

keywords = summarize_with_keywords(texts, min_count=5, max_length=10,
    beta=0.85, max_iter=10, stopwords=stopwords, verbose=True)
keywords = summarize_with_keywords(texts) # with default arguments&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;KRWordRank에 passwords를 사용할 수 도 있지만, summarize_with_keywords 함수처럼 진행할 수 도 있습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이후 점수가 높은 순서대로 출력할 수 있습니다. 아래의 코드에서는 30개만 출력하였으나 실제 키워드 추출과정에서는 100개의 단어들을 출력하여 사용하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1606889854384&quot; class=&quot;python&quot; data-ke-language=&quot;python&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;for word, r in sorted(keywords.items(), key=lambda x:x[1], reverse=True)[:30]:
    print('%8s:\t%.4f' % (word, r))&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #f89009;&quot;&gt;&lt;b&gt;WordCloud&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;결과물을 보다 시각화하기 위해서는 wordcloud를 사용할 수 있습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;wordcloud를 설치한 다음,&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1606890006218&quot; class=&quot;python&quot; data-ke-language=&quot;python&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;pip install wordcloud&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;한글을 출력하기 위해 한글을 지원하는 폰트를 준비하고, 그림을 그립니다.&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1606890148863&quot; class=&quot;python&quot; data-ke-language=&quot;python&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;from wordcloud import WordCloud

# Set your font path
font_path = '/content/drive/MyDrive/NotoSansCJKkr-Black.otf'

krwordrank_cloud = WordCloud(
    font_path = font_path,
    width = 800,
    height = 800,
    background_color=&quot;white&quot;
)

krwordrank_cloud = krwordrank_cloud.generate_from_frequencies(passwords)

%matplotlib inline
import matplotlib.pyplot as plt

fig = plt.figure(figsize=(10, 10))
plt.imshow(krwordrank_cloud, interpolation=&quot;bilinear&quot;)
plt.show()&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;코드를 통해 그려진 그림은 아래와 같습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-filename=&quot;wordrank.png&quot; data-origin-width=&quot;583&quot; data-origin-height=&quot;578&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/U1iSO/btqOUlIjLM8/Po3KoNvCIQgKyOPlRUBXlK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/U1iSO/btqOUlIjLM8/Po3KoNvCIQgKyOPlRUBXlK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/U1iSO/btqOUlIjLM8/Po3KoNvCIQgKyOPlRUBXlK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FU1iSO%2FbtqOUlIjLM8%2FPo3KoNvCIQgKyOPlRUBXlK%2Fimg.png&quot; data-filename=&quot;wordrank.png&quot; data-origin-width=&quot;583&quot; data-origin-height=&quot;578&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;그림에 나와있듯이, &lt;span style=&quot;color: #333333;&quot;&gt;가장 점수가 높은 단어들은 '우리', '마음', '친구', '하늘', '아기'였습니다.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;그리고 출력한 점수가 높은 단어들에는 명사와 형용사 등이 섞여 있었습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;그래서 우선은 단어들 중 명사들을 모아서 메인 키워드/세부 키워드를 나누었습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;명사&lt;/b&gt; &lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;: 하늘/아빠/엄마/사랑/바람/바다/마음/친구/아기/노래/펭귄/소리/얼굴/나무/세상/선생님/아침/꼬마/향기/동물/동네/나라/아이/기쁨/인사/나미/다람쥐/동그라미&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;메인 키워드로 분류 후, 세부 키워드에 임의로 몇가지를 추가하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;메인 키워드 : 세부 키워드&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;1. 자연 : &lt;span style=&quot;color: #000000;&quot;&gt;해, 달, 별, 바람, 바다, 나무, 산, 계곡, 풀, 꽃, 비, 햇빛, 구름, 해변, 모래, 언덕&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;2. 가족 : &lt;span style=&quot;color: #000000;&quot;&gt;아빠, 엄마, 가족, 동생, 할머니, 할아버지, 언니, 오빠, 누나, 형, 삼촌, 이모&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;3. 동물 : &lt;span style=&quot;color: #000000;&quot;&gt;펭귄, 다람쥐, 곰, 강아지, 고양이, 상어, 돌고래, 호랑이, 토끼&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;4. 계절, 시간 : &lt;span style=&quot;color: #000000;&quot;&gt;봄, 여름, 가을, 겨울, 아침, 낮, 저녁, 밤, 이른 새벽&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;5, 사람 : &lt;span style=&quot;color: #000000;&quot;&gt;친구, 선생님, 꼬마, 아이, 아기, 이웃, 경비아저씨&lt;/span&gt;&lt;/span&gt;&lt;span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;6. 감정, 감각 : &lt;span style=&quot;color: #000000;&quot;&gt;기쁨, 즐거움, 맛, 향기, 따뜻함, 부드러움, 밝음, 신남, 맛있는, 즐거운, 추운&lt;/span&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;hr contenteditable=&quot;false&quot; data-ke-type=&quot;horizontalRule&quot; data-ke-style=&quot;style5&quot; /&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;3. KoGPT-2 - 한국어 자연어 생성&lt;/span&gt;&lt;/b&gt;&lt;/h4&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;color: #f89009;&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;KoGPT2&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;KoGPT2는 OpenAI GPT-2모델의 한국어 성능의 한계를 보완하기 위해 만들어졌습니다.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;GPT-2 base 모델이며, Fused GELU (Gaussian Error Linear Unit) 를 기반으로 10% 이상의 학습 속도를 향상 시켰습니다.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;KoGPT2를 설치한 다음&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1606890893388&quot; class=&quot;python&quot; data-ke-language=&quot;python&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;git clone https://github.com/SKT-AI/KoGPT2.git
cd KoGPT2
pip install -r requirements.txt
pip install .&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;문장의 시작을 주었을 때 해당 문장을 AI가 완성시키는 것을 확인할 수 있습니다.&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1606893293370&quot; class=&quot;python&quot; data-ke-language=&quot;python&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;import torch
from kogpt2.pytorch_kogpt2 import get_pytorch_kogpt2_model
from gluonnlp.data import SentencepieceTokenizer
from kogpt2.utils import get_tokenizer

tok_path = get_tokenizer()
model, vocab = get_pytorch_kogpt2_model()
tok = SentencepieceTokenizer(tok_path,  num_best=0, alpha=0)
sent = '2019년 한해를 보내며,'
toked = tok(sent)
while 1:
  input_ids = torch.tensor([vocab[vocab.bos_token],]  + vocab[toked]).unsqueeze(0)
  pred = model(input_ids)[0]
  gen = vocab.to_tokens(torch.argmax(pred, axis=-1).squeeze().tolist())[-1]
  if gen == '&amp;lt;/s&amp;gt;':
      break
  sent += gen.replace('▁', ' ')
  toked = tok(sent)
sent&lt;/code&gt;&lt;/pre&gt;
&lt;blockquote data-ke-style=&quot;style2&quot;&gt;'&lt;b&gt;2019년 한해를 보내며,&lt;/b&gt; 새해에는 더 많은 사람들이 새해에 이루고자 하는 소망과 희망을 되새겨보는 시간이 되었으면 좋겠다.'&lt;/blockquote&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;하지만,&lt;/b&gt; &lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;CSV 형식의 Dataset을 받도록 변경된 Version2로 작업을 진행하려면 현재 txt로 된 데이터 셋을 변경해주어야 하기 때문에,&amp;nbsp; Version 1.1을 이용하였습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;Version 에러를 고치기 위해서 requirements.txt의 transformers를 2.4.1로 고정해야 했습니다.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span&gt;main을 통해 모델을 학습시키는 것까지는 에러가 더 생기지 않았지만, Generator를 통해 작사를 진행하는 것에서 EOError가 발생하였습니다. 현재는 해당 에러가 생기는 이유를 찾고 수정하려고 하는 중입니다.&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;참고: HITS Algorithm Wikipedia, GeeksforGeeks&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;* KR WordRank -&amp;nbsp;&lt;a href=&quot;https://github.com/lovit/KR-WordRank&quot;&gt;github.com/lovit/KR-WordRank&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1606888302010&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;object&quot; data-og-title=&quot;lovit/KR-WordRank&quot; data-og-description=&quot;비지도학습 방법으로 한국어 텍스트에서 단어/키워드를 자동으로 추출하는 라이브러리입니다. Contribute to lovit/KR-WordRank development by creating an account on GitHub.&quot; data-og-host=&quot;github.com&quot; data-og-source-url=&quot;https://github.com/lovit/KR-WordRank&quot; data-og-url=&quot;https://github.com/lovit/KR-WordRank&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/bpM2xW/hyIneaaR1R/JxnlIqhpS7wrmDtd7JUlO1/img.jpg?width=400&amp;amp;height=400&amp;amp;face=0_0_400_400&quot;&gt;&lt;a href=&quot;https://github.com/lovit/KR-WordRank&quot; data-source-url=&quot;https://github.com/lovit/KR-WordRank&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/bpM2xW/hyIneaaR1R/JxnlIqhpS7wrmDtd7JUlO1/img.jpg?width=400&amp;amp;height=400&amp;amp;face=0_0_400_400');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;lovit/KR-WordRank&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;비지도학습 방법으로 한국어 텍스트에서 단어/키워드를 자동으로 추출하는 라이브러리입니다. Contribute to lovit/KR-WordRank development by creating an account on GitHub.&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;github.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;* KRWordRank Reference: &amp;nbsp;Kim, H. J., Cho, S., &amp;amp; Kang, P. (2014). KR-WordRank: An Unsupervised Korean Word Extraction Method Based on WordRank. Journal of Korean Institute of Industrial Engineers, 40(1), 18-33&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;* KoGPT2 - &lt;a href=&quot;https://github.com/SKT-AI/KoGPT2&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;github.com/SKT-AI/KoGPT2&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1606890651339&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;object&quot; data-og-title=&quot;SKT-AI/KoGPT2&quot; data-og-description=&quot;Korean GPT-2 pretrained cased (KoGPT2). Contribute to SKT-AI/KoGPT2 development by creating an account on GitHub.&quot; data-og-host=&quot;github.com&quot; data-og-source-url=&quot;https://github.com/SKT-AI/KoGPT2&quot; data-og-url=&quot;https://github.com/SKT-AI/KoGPT2&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/cLxVhx/hyIp5rsG1O/DeIKbdNmKmkMWo7kkarwrk/img.png?width=344&amp;amp;height=344&amp;amp;face=0_0_344_344&quot;&gt;&lt;a href=&quot;https://github.com/SKT-AI/KoGPT2&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://github.com/SKT-AI/KoGPT2&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/cLxVhx/hyIp5rsG1O/DeIKbdNmKmkMWo7kkarwrk/img.png?width=344&amp;amp;height=344&amp;amp;face=0_0_344_344');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;SKT-AI/KoGPT2&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;Korean GPT-2 pretrained cased (KoGPT2). Contribute to SKT-AI/KoGPT2 development by creating an account on GitHub.&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;github.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;* 가사 쓰는 모델 : &lt;a href=&quot;https://github.com/gyunggyung/KoGPT2-FineTuning&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;github.com/gyunggyung/KoGPT2-FineTuning&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1606891711975&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;object&quot; data-og-title=&quot;gyunggyung/KoGPT2-FineTuning&quot; data-og-description=&quot;  Korean GPT-2, KoGPT2 FineTuning cased. 한국어 가사 데이터 학습   - gyunggyung/KoGPT2-FineTuning&quot; data-og-host=&quot;github.com&quot; data-og-source-url=&quot;https://github.com/gyunggyung/KoGPT2-FineTuning&quot; data-og-url=&quot;https://github.com/gyunggyung/KoGPT2-FineTuning&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/EGHip/hyIqixApSC/ExLnTdW09Tyaz9jL3zkcxK/img.jpg?width=400&amp;amp;height=400&amp;amp;face=0_0_400_400,https://scrap.kakaocdn.net/dn/nvcJH/hyIqbkTWtH/kuD6Y02spkyNL4P8K4f1A0/img.png?width=1522&amp;amp;height=1193&amp;amp;face=0_0_1522_1193,https://scrap.kakaocdn.net/dn/bfsddR/hyIrrsUSXX/hOKTsN8e4tkKKbNrK5EhF1/img.jpg?width=988&amp;amp;height=596&amp;amp;face=0_0_988_596&quot;&gt;&lt;a href=&quot;https://github.com/gyunggyung/KoGPT2-FineTuning&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://github.com/gyunggyung/KoGPT2-FineTuning&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/EGHip/hyIqixApSC/ExLnTdW09Tyaz9jL3zkcxK/img.jpg?width=400&amp;amp;height=400&amp;amp;face=0_0_400_400,https://scrap.kakaocdn.net/dn/nvcJH/hyIqbkTWtH/kuD6Y02spkyNL4P8K4f1A0/img.png?width=1522&amp;amp;height=1193&amp;amp;face=0_0_1522_1193,https://scrap.kakaocdn.net/dn/bfsddR/hyIrrsUSXX/hOKTsN8e4tkKKbNrK5EhF1/img.jpg?width=988&amp;amp;height=596&amp;amp;face=0_0_988_596');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;gyunggyung/KoGPT2-FineTuning&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;  Korean GPT-2, KoGPT2 FineTuning cased. 한국어 가사 데이터 학습   - gyunggyung/KoGPT2-FineTuning&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;github.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>프로젝트_AI랑</category>
      <author>heyhmin</author>
      <guid isPermaLink="true">https://codeinleonis.tistory.com/45</guid>
      <comments>https://codeinleonis.tistory.com/45#entry45comment</comments>
      <pubDate>Fri, 27 Nov 2020 13:50:53 +0900</pubDate>
    </item>
    <item>
      <title>[프로그래머스] 2020 카카오 인턴십 키패드 누르기</title>
      <link>https://codeinleonis.tistory.com/44</link>
      <description>&lt;p&gt;DSC 활동을 하면서, 알고리즘 스터디를 통해 문제 풀이를 지속하게 되었다.&amp;nbsp;&lt;/p&gt;
&lt;p&gt;URL: &lt;a href=&quot;https://programmers.co.kr/learn/courses/30/lessons/67256&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;programmers.co.kr/learn/courses/30/lessons/67256&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1605551995166&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;website&quot; data-og-title=&quot;코딩테스트 연습 - 키패드 누르기&quot; data-og-description=&quot;[1, 3, 4, 5, 8, 2, 1, 4, 5, 9, 5] &amp;quot;right&amp;quot; &amp;quot;LRLLLRLLRRL&amp;quot; [7, 0, 8, 2, 8, 3, 1, 5, 7, 6, 2] &amp;quot;left&amp;quot; &amp;quot;LRLLRRLLLRR&amp;quot; [1, 2, 3, 4, 5, 6, 7, 8, 9, 0] &amp;quot;right&amp;quot; &amp;quot;LLRLLRLLRL&amp;quot;&quot; data-og-host=&quot;programmers.co.kr&quot; data-og-source-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/67256&quot; data-og-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/67256&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/bhtIHb/hyIg20Wqwx/ZMHvhtmrkrLT4uM9OXTS60/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/xsfti/hyIfqPULdd/KgDJWG3kkl54PY5KI9PfV0/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/MiCtm/hyIftTroma/gfxLBfpcH7fJyejAyKdB50/img.png?width=1000&amp;amp;height=1000&amp;amp;face=0_0_1000_1000&quot;&gt;&lt;a href=&quot;https://programmers.co.kr/learn/courses/30/lessons/67256&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/67256&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/bhtIHb/hyIg20Wqwx/ZMHvhtmrkrLT4uM9OXTS60/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/xsfti/hyIfqPULdd/KgDJWG3kkl54PY5KI9PfV0/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/MiCtm/hyIftTroma/gfxLBfpcH7fJyejAyKdB50/img.png?width=1000&amp;amp;height=1000&amp;amp;face=0_0_1000_1000');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;코딩테스트 연습 - 키패드 누르기&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;[1, 3, 4, 5, 8, 2, 1, 4, 5, 9, 5] &quot;right&quot; &quot;LRLLLRLLRRL&quot; [7, 0, 8, 2, 8, 3, 1, 5, 7, 6, 2] &quot;left&quot; &quot;LRLLRRLLLRR&quot; [1, 2, 3, 4, 5, 6, 7, 8, 9, 0] &quot;right&quot; &quot;LLRLLRLLRL&quot;&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;programmers.co.kr&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;[카카오 인턴] 키패드 누르기&lt;/p&gt;
&lt;p&gt;문제 설명&lt;/p&gt;
&lt;p&gt;스마트폰 전화 키패드의 각 칸에 다음과 같이 숫자들이 적혀 있습니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;0&quot; data-origin-height=&quot;0&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/MAAT1/btqNtiANh2B/bk72uAsD1k5slGklwKyajK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/MAAT1/btqNtiANh2B/bk72uAsD1k5slGklwKyajK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/MAAT1/btqNtiANh2B/bk72uAsD1k5slGklwKyajK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FMAAT1%2FbtqNtiANh2B%2Fbk72uAsD1k5slGklwKyajK%2Fimg.png&quot; data-origin-width=&quot;0&quot; data-origin-height=&quot;0&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p&gt;이 전화 키패드에서 왼손과 오른손의 엄지손가락만을 이용해서 숫자만을 입력하려고 합니다.&lt;br /&gt;맨 처음 왼손 엄지손가락은&lt;span&gt;&amp;nbsp;&lt;/span&gt;*&lt;span&gt;&amp;nbsp;&lt;/span&gt;키패드에 오른손 엄지손가락은&lt;span&gt;&amp;nbsp;&lt;/span&gt;#&lt;span&gt;&amp;nbsp;&lt;/span&gt;키패드 위치에서 시작하며, 엄지손가락을 사용하는 규칙은 다음과 같습니다.&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;엄지손가락은 상하좌우 4가지 방향으로만 이동할 수 있으며 키패드 이동 한 칸은 거리로 1에 해당합니다.&lt;/li&gt;
&lt;li&gt;왼쪽 열의 3개의 숫자&lt;span&gt;&amp;nbsp;&lt;/span&gt;1,&lt;span&gt;&amp;nbsp;&lt;/span&gt;4,&lt;span&gt;&amp;nbsp;&lt;/span&gt;7을 입력할 때는 왼손 엄지손가락을 사용합니다.&lt;/li&gt;
&lt;li&gt;오른쪽 열의 3개의 숫자&lt;span&gt;&amp;nbsp;&lt;/span&gt;3,&lt;span&gt;&amp;nbsp;&lt;/span&gt;6,&lt;span&gt;&amp;nbsp;&lt;/span&gt;9를 입력할 때는 오른손 엄지손가락을 사용합니다.&lt;/li&gt;
&lt;li&gt;가운데 열의 4개의 숫자&lt;span&gt;&amp;nbsp;&lt;/span&gt;2,&lt;span&gt;&amp;nbsp;&lt;/span&gt;5,&lt;span&gt;&amp;nbsp;&lt;/span&gt;8,&lt;span&gt;&amp;nbsp;&lt;/span&gt;0을 입력할 때는 두 엄지손가락의 현재 키패드의 위치에서 더 가까운 엄지손가락을 사용합니다.&lt;br /&gt;4-1. 만약 두 엄지손가락의 거리가 같다면, 오른손잡이는 오른손 엄지손가락, 왼손잡이는 왼손 엄지손가락을 사용합니다.&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;순서대로 누를 번호가 담긴 배열 numbers, 왼손잡이인지 오른손잡이인 지를 나타내는 문자열 hand가 매개변수로 주어질 때, 각 번호를 누른 엄지손가락이 왼손인 지 오른손인 지를 나타내는 연속된 문자열 형태로 return 하도록 solution 함수를 완성해주세요.&lt;/p&gt;
&lt;p&gt;&lt;b&gt;[제한사항]&lt;/b&gt;&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;numbers 배열의 크기는 1 이상 1,000 이하입니다.&lt;/li&gt;
&lt;li&gt;numbers 배열 원소의 값은 0 이상 9 이하인 정수입니다.&lt;/li&gt;
&lt;li&gt;hand는&lt;span&gt;&amp;nbsp;&lt;/span&gt;&quot;left&quot;&lt;span&gt;&amp;nbsp;&lt;/span&gt;또는&lt;span&gt;&amp;nbsp;&lt;/span&gt;&quot;right&quot;&lt;span&gt;&amp;nbsp;&lt;/span&gt;입니다.
&lt;ul&gt;
&lt;li&gt;&quot;left&quot;는 왼손잡이,&lt;span&gt;&amp;nbsp;&lt;/span&gt;&quot;right&quot;는 오른손잡이를 의미합니다.&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;왼손 엄지손가락을 사용한 경우는&lt;span&gt;&amp;nbsp;&lt;/span&gt;L, 오른손 엄지손가락을 사용한 경우는&lt;span&gt;&amp;nbsp;&lt;/span&gt;R을 순서대로 이어붙여 문자열 형태로 return 해주세요.&lt;/li&gt;
&lt;/ul&gt;
&lt;hr style=&quot;box-sizing: content-box; height: 0px; overflow: visible; margin: 1.5rem 0px; border-width: 0.0625rem 0px 0px; border-color: #172334; border-image: initial; border-style: solid initial initial initial;&quot; /&gt;
&lt;p&gt;&lt;b&gt;입출력 예&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;numbershandresult&lt;/p&gt;
&lt;table style=&quot;border-collapse: collapse; width: 100%;&quot; border=&quot;1&quot;&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;[1, 3, 4, 5, 8, 2, 1, 4, 5, 9, 5]&lt;/td&gt;
&lt;td&gt;&quot;right&quot;&lt;/td&gt;
&lt;td&gt;&quot;LRLLLRLLRRL&quot;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;[7, 0, 8, 2, 8, 3, 1, 5, 7, 6, 2]&lt;/td&gt;
&lt;td&gt;&quot;left&quot;&lt;/td&gt;
&lt;td&gt;&quot;LRLLRRLLLRR&quot;&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;[1, 2, 3, 4, 5, 6, 7, 8, 9, 0]&lt;/td&gt;
&lt;td&gt;&quot;right&quot;&lt;/td&gt;
&lt;td&gt;&quot;LLRLLRLLRL&quot;&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;&lt;b&gt;입출력 예에 대한 설명&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;&lt;b&gt;입출력 예 #1&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;순서대로 눌러야 할 번호가 [1, 3, 4, 5, 8, 2, 1, 4, 5, 9, 5]이고, 오른손잡이입니다.&lt;/p&gt;
&lt;p&gt;왼손 위치오른손 위치눌러야 할 숫자사용한 손설명&lt;/p&gt;
&lt;table style=&quot;border-collapse: collapse; width: 100%;&quot; border=&quot;1&quot;&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;*&lt;/td&gt;
&lt;td&gt;#&lt;/td&gt;
&lt;td&gt;1&lt;/td&gt;
&lt;td&gt;L&lt;/td&gt;
&lt;td&gt;1은 왼손으로 누릅니다.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;1&lt;/td&gt;
&lt;td&gt;#&lt;/td&gt;
&lt;td&gt;3&lt;/td&gt;
&lt;td&gt;R&lt;/td&gt;
&lt;td&gt;3은 오른손으로 누릅니다.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;1&lt;/td&gt;
&lt;td&gt;3&lt;/td&gt;
&lt;td&gt;4&lt;/td&gt;
&lt;td&gt;L&lt;/td&gt;
&lt;td&gt;4는 왼손으로 누릅니다.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;4&lt;/td&gt;
&lt;td&gt;3&lt;/td&gt;
&lt;td&gt;5&lt;/td&gt;
&lt;td&gt;L&lt;/td&gt;
&lt;td&gt;왼손 거리는 1, 오른손 거리는 2이므로 왼손으로 5를 누릅니다.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;5&lt;/td&gt;
&lt;td&gt;3&lt;/td&gt;
&lt;td&gt;8&lt;/td&gt;
&lt;td&gt;L&lt;/td&gt;
&lt;td&gt;왼손 거리는 1, 오른손 거리는 3이므로 왼손으로 8을 누릅니다.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;8&lt;/td&gt;
&lt;td&gt;3&lt;/td&gt;
&lt;td&gt;2&lt;/td&gt;
&lt;td&gt;R&lt;/td&gt;
&lt;td&gt;왼손 거리는 2, 오른손 거리는 1이므로 오른손으로 2를 누릅니다.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;8&lt;/td&gt;
&lt;td&gt;2&lt;/td&gt;
&lt;td&gt;1&lt;/td&gt;
&lt;td&gt;L&lt;/td&gt;
&lt;td&gt;1은 왼손으로 누릅니다.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;1&lt;/td&gt;
&lt;td&gt;2&lt;/td&gt;
&lt;td&gt;4&lt;/td&gt;
&lt;td&gt;L&lt;/td&gt;
&lt;td&gt;4는 왼손으로 누릅니다.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;4&lt;/td&gt;
&lt;td&gt;2&lt;/td&gt;
&lt;td&gt;5&lt;/td&gt;
&lt;td&gt;R&lt;/td&gt;
&lt;td&gt;왼손 거리와 오른손 거리가 1로 같으므로, 오른손으로 5를 누릅니다.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;4&lt;/td&gt;
&lt;td&gt;5&lt;/td&gt;
&lt;td&gt;9&lt;/td&gt;
&lt;td&gt;R&lt;/td&gt;
&lt;td&gt;9는 오른손으로 누릅니다.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;4&lt;/td&gt;
&lt;td&gt;9&lt;/td&gt;
&lt;td&gt;5&lt;/td&gt;
&lt;td&gt;L&lt;/td&gt;
&lt;td&gt;왼손 거리는 1, 오른손 거리는 2이므로 왼손으로 5를 누릅니다.&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;5&lt;/td&gt;
&lt;td&gt;9&lt;/td&gt;
&lt;td&gt;-&lt;/td&gt;
&lt;td&gt;-&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;따라서&lt;span&gt;&amp;nbsp;&lt;/span&gt;&quot;LRLLLRLLRRL&quot;를 return 합니다.&lt;/p&gt;
&lt;p&gt;&lt;b&gt;입출력 예 #2&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;왼손잡이가 [7, 0, 8, 2, 8, 3, 1, 5, 7, 6, 2]를 순서대로 누르면 사용한 손은&lt;span&gt;&amp;nbsp;&lt;/span&gt;&quot;LRLLRRLLLRR&quot;이 됩니다.&lt;/p&gt;
&lt;p&gt;&lt;b&gt;입출력 예 #3&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;오른손잡이가 [1, 2, 3, 4, 5, 6, 7, 8, 9, 0]를 순서대로 누르면 사용한 손은&lt;span&gt;&amp;nbsp;&lt;/span&gt;&quot;LLRLLRLLRL&quot;이 됩니다.&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;h2 data-ke-size=&quot;size26&quot;&gt;&lt;span style=&quot;color: #1b711d;&quot;&gt;&lt;b&gt;[문제 풀이]&lt;/b&gt;&lt;/span&gt;&lt;/h2&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;이번 문제에서 핵심은 각각의 위치를 어떻게 비교할 것인지 이다.&lt;/p&gt;
&lt;p&gt;1. 각각의 위치 비교&lt;/p&gt;
&lt;p&gt;위치 비교가 필요한 입력값은 키패드의 가운데 숫자들(2, 5, 8, 0)이다.&amp;nbsp;&lt;/p&gt;
&lt;p&gt;따라서 해당 숫자들을 처리할 경우에만 위치를 비교하면 된다.&lt;/p&gt;
&lt;p&gt;위치를 비교할 때는 좌표계를 떠올리면 풀이하기가 편하다.&lt;/p&gt;
&lt;p&gt;1, 2, 3의 숫자를 같은 행으로 하기 위해서는 num - 1을 3으로 나누었을 때의 몫을 떠올릴 수 있다.&lt;/p&gt;
&lt;p&gt;비슷한 맥락으로 같은 열으로 하기 위해서는 num - 1을 3으로 나누었을 때의 나머지를 떠올릴 수 있다.&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;이러한 점을 이용하여 거리 계산을 해준다.&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;이후 해당 거리 계산 값을 이용하여 answer 문자열에 R, L 값을 더해주면 된다.&lt;/p&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&gt;소스코드&lt;/p&gt;
&lt;pre id=&quot;code_1605552403530&quot; class=&quot;java&quot; data-ke-language=&quot;java&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;class Solution {
    public String solution(int[] numbers, String hand) {
        String answer = &quot;&quot;;
        int current = 0;
        int rposition = 12;
        int lposition = 10;
        int rdistance = 0;
        int ldistance = 0;
        while(current &amp;lt; numbers.length){
            int num = numbers[current++];
            // ((num-1) / 3, (num-1) % 3)
            if(num == 0 || num%3 == 2){
                if(num == 0) num = 11;
                rdistance = Math.abs((num-1)/3 - (rposition-1)/3) + Math.abs((num-1)%3 - (rposition-1)%3);
                ldistance = Math.abs((num-1)/3 - (lposition-1)/3) + Math.abs((num-1)%3 - (lposition-1)%3);
            }
            switch(num%3){
                case 0 : answer +=&quot;R&quot;; 
                        rposition = num;
                        break;
                case 1 : answer +=&quot;L&quot;; 
                        lposition = num;
                        break;
                case 2 : if(rdistance &amp;lt; ldistance) {
                            answer +=&quot;R&quot;; 
                            rposition = num;
                        } else if (ldistance &amp;lt; rdistance){
                            answer +=&quot;L&quot;; 
                            lposition = num;
                        } else{
                            if(hand.equals(&quot;right&quot;)) {
                                answer +=&quot;R&quot;; 
                                rposition = num;
                            } else {
                                answer +=&quot;L&quot;; 
                                lposition = num;
                            }           
                        }
                        break;
                default : System.out.print(&quot;error&quot;); break;
            }
        }
        return answer;
    }
}&lt;/code&gt;&lt;/pre&gt;
&lt;/div&gt;
&lt;/div&gt;
&lt;p&gt;방법 1. 숫자의 범위를 12까지 늘려서 수식으로 계산한다.&lt;/p&gt;
&lt;p&gt;방법 2. 각 숫자마다 [n, n]으로 할당해서 계산한다.&lt;/p&gt;
&lt;p&gt;방법 3. 모든 숫자에 행, 열 값을 따로 저장하여 사용하여 계산한다.&lt;/p&gt;</description>
      <category>알고리즘 스터디_문제풀이</category>
      <category>2020 카카오 인턴십</category>
      <category>ABS</category>
      <category>answer</category>
      <category>equals</category>
      <category>Java</category>
      <category>Math</category>
      <category>거리 계산</category>
      <category>좌표계</category>
      <category>키패드 누르기</category>
      <category>프로그래머스</category>
      <author>heyhmin</author>
      <guid isPermaLink="true">https://codeinleonis.tistory.com/44</guid>
      <comments>https://codeinleonis.tistory.com/44#entry44comment</comments>
      <pubDate>Tue, 17 Nov 2020 03:48:17 +0900</pubDate>
    </item>
    <item>
      <title>프로그래머스 해시 - 위장 with Kotiln</title>
      <link>https://codeinleonis.tistory.com/43</link>
      <description>&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;** 중간에 Intelli J Kotlin을 업데이트하고 나서 에러가 났었는데&lt;/span&gt;&lt;/p&gt;
&lt;blockquote style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot; data-ke-style=&quot;style3&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;에러 내용: Kotlin: [Internal Error] java.rmi.UnmarshalException: ~~~&lt;/span&gt;&lt;/blockquote&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Build -&amp;gt; Rebuild Project 하고 나서 에러가 해결됐어요!&amp;nbsp;&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;프로그래머스 해시부분 위장 문제입니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-filename=&quot;pro01.PNG&quot; data-origin-width=&quot;801&quot; data-origin-height=&quot;830&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/MXLWQ/btqHscfmHLq/kxoP2B0QMxszkQvFhFAzk1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/MXLWQ/btqHscfmHLq/kxoP2B0QMxszkQvFhFAzk1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/MXLWQ/btqHscfmHLq/kxoP2B0QMxszkQvFhFAzk1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FMXLWQ%2FbtqHscfmHLq%2FkxoP2B0QMxszkQvFhFAzk1%2Fimg.png&quot; data-filename=&quot;pro01.PNG&quot; data-origin-width=&quot;801&quot; data-origin-height=&quot;830&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;IntelliJ에서의 풀이입니다. Hash를 쓰려고 노력했습니다!&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;실제로 HashMap을 출력하면 다음 처럼 출력됩니다.&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt; {-1290360528=1,&amp;nbsp;-1115211921=2}&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;{3135069=3}&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;pre id=&quot;code_1598787918305&quot; class=&quot;kotlin&quot; data-ke-language=&quot;kotlin&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;val clothes: Array&amp;lt;Array&amp;lt;String&amp;gt;&amp;gt; = arrayOf(
    arrayOf(&quot;yellow_hat&quot;, &quot;headgear&quot;), arrayOf(&quot;blue_sunglasses&quot;, &quot;eyewear&quot;),
    arrayOf(&quot;green_turban&quot;, &quot;headgear&quot;)
)
val clothes2: Array&amp;lt;Array&amp;lt;String&amp;gt;&amp;gt; = arrayOf(
    arrayOf(&quot;crow_mask&quot;, &quot;face&quot;), arrayOf(&quot;blue_sunglasses&quot;, &quot;face&quot;),
    arrayOf(&quot;smoky_makeup&quot;, &quot;face&quot;)
)

fun solution(clothes: Array&amp;lt;Array&amp;lt;String&amp;gt;&amp;gt;): Int {
    var answer = 1
    val kindOf = HashMap&amp;lt;Int, Int&amp;gt;()
    clothes.forEach {
        val kindHash: Int = it[1].hashCode()
        if (kindOf.containsKey(kindHash)) {
            val value = kindOf[kindHash]!!.plus(1)
            // !!.은 Not Null 표시입니다.
            kindOf[kindHash] = value
        } else kindOf[kindHash] = 1
    }
    kindOf.values.forEach {
        answer *= (it + 1)
    }
    return answer - 1
}

fun main() {
    println(solution(clothes)) // 5
    println(solution(clothes2)) // 3
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;URL: &lt;a href=&quot;https://programmers.co.kr/learn/courses/30/lessons/42578&quot;&gt;https://programmers.co.kr/learn/courses/30/lessons/42578&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1598787935329&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;website&quot; data-og-title=&quot;코딩테스트 연습 - 위장&quot; data-og-description=&quot;&quot; data-og-host=&quot;programmers.co.kr&quot; data-og-source-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/42578&quot; data-og-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/42578&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/Hohip/hyHlhq9XNK/yY4wiDoWs6cL214uaFsOFk/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/bmByXK/hyHbCjC0OC/cD6za0ms0yslG59qdQ16k1/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626&quot;&gt;&lt;a href=&quot;https://programmers.co.kr/learn/courses/30/lessons/42578&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/42578&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/Hohip/hyHlhq9XNK/yY4wiDoWs6cL214uaFsOFk/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/bmByXK/hyHbCjC0OC/cD6za0ms0yslG59qdQ16k1/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;코딩테스트 연습 - 위장&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;programmers.co.kr&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;다른 분 풀이입니다! gropuBy와 map, reduce, minus를 사용해서 풀이할 수 있습니다.&lt;/p&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&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;다른 분 풀이인데 Kotlin에 대해 더 배우기 좋아서 나중에 보려고 저장합니다...&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1598787785568&quot; class=&quot;kotlin&quot; data-ke-language=&quot;kotlin&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;class Solution {
    fun solution(clothes: Array&amp;lt;Array&amp;lt;String&amp;gt;&amp;gt;) = clothes
        .groupBy { it[1] }.values   // group by type of clothes, keep only names of clothes
        .map { it.size + 1 }        // number of things to wear in a group (including wearing nothing)
        .reduce(Int::times)         // combine
        .minus(1)                   // remove the case where the spy wears nothing
}&lt;/code&gt;&lt;/pre&gt;
&lt;/div&gt;
&lt;/div&gt;</description>
      <category>알고리즘 스터디_문제풀이</category>
      <category>containsKey</category>
      <category>hashcode</category>
      <category>HashMap</category>
      <category>Kotlin</category>
      <category>NOT NULL</category>
      <category>Plus</category>
      <category>programmers</category>
      <category>코틀린</category>
      <category>프로그래머스</category>
      <category>해시코드</category>
      <author>heyhmin</author>
      <guid isPermaLink="true">https://codeinleonis.tistory.com/43</guid>
      <comments>https://codeinleonis.tistory.com/43#entry43comment</comments>
      <pubDate>Sun, 30 Aug 2020 20:50:35 +0900</pubDate>
    </item>
    <item>
      <title>프로그래머스 깊이/너비 우선 탐색 여행경로 with Kotlin</title>
      <link>https://codeinleonis.tistory.com/42</link>
      <description>&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;프로그래머스 깊이/너비 우선 탐색 여행경로 문제입니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-filename=&quot;pro여행경로.PNG&quot; data-origin-width=&quot;706&quot; data-origin-height=&quot;828&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/we47C/btqHxcMsmSY/XXZcDubPR0F1u4CbAQVzy1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/we47C/btqHxcMsmSY/XXZcDubPR0F1u4CbAQVzy1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/we47C/btqHxcMsmSY/XXZcDubPR0F1u4CbAQVzy1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fwe47C%2FbtqHxcMsmSY%2FXXZcDubPR0F1u4CbAQVzy1%2Fimg.png&quot; data-filename=&quot;pro여행경로.PNG&quot; data-origin-width=&quot;706&quot; data-origin-height=&quot;828&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;프로그래머스에서의 풀이입니다.&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1598778740592&quot; class=&quot;kotlin&quot; data-ke-language=&quot;kotlin&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;import java.util.Stack

class Solution {
    val path: MutableList&amp;lt;String&amp;gt; = mutableListOf()
	val stack: Stack&amp;lt;String&amp;gt; = Stack()
	fun solution(tickets: Array&amp;lt;Array&amp;lt;String&amp;gt;&amp;gt;): Array&amp;lt;String&amp;gt; {
    	tickets.sortWith(compareBy({ it[0] }, { it[1] }))
    	val usedTicket = BooleanArray(tickets.size) { false }
    	for (i in tickets.indices) {
        	if (tickets[i][0] == &quot;ICN&quot;) {
            	usedTicket[i] = true
            	stack.push(&quot;ICN&quot;)
            	stack.push(tickets[i][1])
            	visit(tickets, 1, usedTicket)
            	//reset
            	while(!stack.isEmpty())
                	stack.pop()
            	for(k in usedTicket.indices)
                	usedTicket[k] = false
            	if(!path.isEmpty()) break
        	}
    	}
    	print(path.toTypedArray().contentToString())
    	return path.toTypedArray()
	}

    fun visit(tickets: Array&amp;lt;Array&amp;lt;String&amp;gt;&amp;gt;, cnt: Int, usedTicket: BooleanArray) {
        if (cnt &amp;gt;= tickets.size &amp;amp;&amp;amp; tickets.size &amp;lt; stack.size) {
            val tmpstack = Stack&amp;lt;String&amp;gt;()
            while (!stack.isEmpty())
                tmpstack.push(stack.pop())
            var tmpCnt = cnt
            while (!tmpstack.isEmpty() &amp;amp;&amp;amp; tmpCnt &amp;gt;= 0){
                print(tmpCnt)
                tmpCnt--
                path.add(tmpstack.pop())
            }
            return
        }else{
            val next = stack.peek()
            for (i in tickets.indices){
                if (usedTicket[i]) continue
                if (tickets[i][0] == next){
                    usedTicket[i] = true
                    stack.add(tickets[i][1])
                    visit(tickets, cnt+1, usedTicket)
                    if (!stack.isEmpty()) stack.pop()
                    usedTicket[i] = false
                }
            }
        }
    }
}&lt;/code&gt;&lt;/pre&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;URL: &lt;a href=&quot;https://programmers.co.kr/learn/courses/30/lessons/43164#&quot;&gt;https://programmers.co.kr/learn/courses/30/lessons/43164#&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1598778603502&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;website&quot; data-og-title=&quot;코딩테스트 연습 - 여행경로&quot; data-og-description=&quot;[[ICN, SFO], [ICN, ATL], [SFO, ATL], [ATL, ICN], [ATL,SFO]] [ICN, ATL, ICN, SFO, ATL, SFO]&quot; data-og-host=&quot;programmers.co.kr&quot; data-og-source-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/43164#&quot; data-og-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/43164&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/ygADx/hyHk6JSdix/YmIq5PuNz55pyucdA3Z3X0/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/bsMCCI/hyHk2tWV04/pi26BZKKddDCCctOR3kbxk/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626&quot;&gt;&lt;a href=&quot;https://programmers.co.kr/learn/courses/30/lessons/43164#&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/43164#&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/ygADx/hyHk6JSdix/YmIq5PuNz55pyucdA3Z3X0/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/bsMCCI/hyHk2tWV04/pi26BZKKddDCCctOR3kbxk/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;코딩테스트 연습 - 여행경로&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;[[ICN, SFO], [ICN, ATL], [SFO, ATL], [ATL, ICN], [ATL,SFO]] [ICN, ATL, ICN, SFO, ATL, SFO]&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;programmers.co.kr&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>알고리즘 스터디_문제풀이</category>
      <category>2D Array</category>
      <category>2D sort</category>
      <category>compareby</category>
      <category>contentToString</category>
      <category>Kotlin</category>
      <category>mutablelist</category>
      <category>POP</category>
      <category>programmers</category>
      <category>Stack</category>
      <category>totypedarray</category>
      <author>heyhmin</author>
      <guid isPermaLink="true">https://codeinleonis.tistory.com/42</guid>
      <comments>https://codeinleonis.tistory.com/42#entry42comment</comments>
      <pubDate>Sun, 30 Aug 2020 18:20:41 +0900</pubDate>
    </item>
    <item>
      <title>그래프, 인접 행렬, 인접 리스트</title>
      <link>https://codeinleonis.tistory.com/41</link>
      <description>&lt;h3 style=&quot;text-align: center;&quot; data-ke-size=&quot;size23&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;Graph&lt;/b&gt; 그래프는 &lt;b&gt;Vertices&lt;/b&gt; 정점과 이들을 연결하는 &lt;b&gt;Edge&lt;/b&gt; 간선으로 이루어집니다.&lt;/span&gt;&lt;/h3&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;정점 u, v를 연결하는 &lt;b&gt;간선은 (u, v)&lt;/b&gt;로 표현됩니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;정점은 Vertex, Node로 부를 수 있습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;무방향에서는 (u, v)와 (v, u)가 동일합니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;두 정점을 가장 적은 수의 Edge로 연결하는 경로를 Shortest Path라고 합니다.&lt;/span&gt;&lt;/li&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;어떤 정점에서 시작하여 다시 자신에게 돌아오는 경로가 있을 경우 이를 Cycle이라고 합니다.&lt;/span&gt;&lt;/li&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;각 간선 Edge마다 가중치 Weight 가 존재하는 경우에는 가중 그래프 Weighted Graph라고 부릅니다.&lt;/span&gt;&lt;/li&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;가중 그래프에서는 가중치의 합이 가장 적은 경로를 Shortest Path라고 합니다.&lt;/span&gt;&lt;/li&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;방향이 있는 그래프는 방향 그래프 Directed Graph라고 합니다. &lt;/span&gt;&lt;/li&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;방향이 있는데 사이클이 없는 경우는 방향성 비순환 그래프 Directed Acyclic Graph, DAG라고 합니다. &lt;/span&gt;&lt;/li&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;또한 가중치가 있을 때는 가중 방향 그래프 Weighted Directed Graph라고 합니다.&lt;/span&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;그래프를 볼 때는 정점과 간선들을 묶어서 집합으로 생각하는 게 좋습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;정점 집합을 V, 간선 집합을 E로 나타냅니다.&lt;/span&gt;&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h2 data-ke-size=&quot;size26&quot;&gt;&lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;표현 방법&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h2&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Edge Lists 간선 리스트&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;blockquote data-ke-size=&quot;size18&quot; data-ke-style=&quot;style3&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;[ [0,1], [0,6], [0,8], [1,4], [1,6], [1,9], [2,4], [2,6], [3,4], [3,5], [3,8], [4,5], [4,9], [7,8], [7,9] ]&lt;/span&gt;&lt;/blockquote&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;가중치가 있다면 3번째 요소를 추가할 수 있습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;간선 리스트는 간단하지만 그래프에 특정 간선이 있는지를 알기 위해서는 리스트를 모두 검색해야 합니다.&amp;nbsp;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;인접 행렬&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;0&quot; data-origin-height=&quot;0&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/XRqth/btqHA4fTPo5/IqyTePpXdkktkFWcl2PHJ0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/XRqth/btqHA4fTPo5/IqyTePpXdkktkFWcl2PHJ0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/XRqth/btqHA4fTPo5/IqyTePpXdkktkFWcl2PHJ0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FXRqth%2FbtqHA4fTPo5%2FIqyTePpXdkktkFWcl2PHJ0%2Fimg.png&quot; data-origin-width=&quot;0&quot; data-origin-height=&quot;0&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;인접 행렬은 0과 1로 이루어진 V x V 행렬입니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;간선 Edge ( i, j ) 가 있을 경우에만 ( i, j )의 값이 1이 됩니다. &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;가중치가 있다면 1이 아닌 가중치 값을 저장할 수 있습니다.&amp;nbsp;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Edge의 존재 여부를 일정 시간 내에 파악할 수 있지만, Edge의 수가 적은 희소 그래프일 경우 공간이 낭비됩니다. &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;그리고 어떤 정점이 다른 정점 i와 인접해 있는지 알기 위해서는 i 정점과 인접한 정점들의 수가 적더라도 i 행의 모든 V 항목을 찾아봐야 합니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;무방향 그래프에서 인접 행렬은 대칭이기 때문에 ( i, j ) = ( j, i )입니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;인접 리스트&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;0&quot; data-origin-height=&quot;0&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bddq7n/btqHEeIXfmM/iDh6AwRgUeKVjMG8xFuTq0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bddq7n/btqHEeIXfmM/iDh6AwRgUeKVjMG8xFuTq0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bddq7n/btqHEeIXfmM/iDh6AwRgUeKVjMG8xFuTq0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fbddq7n%2FbtqHEeIXfmM%2FiDh6AwRgUeKVjMG8xFuTq0%2Fimg.png&quot; data-origin-width=&quot;0&quot; data-origin-height=&quot;0&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;인접 리스트는 인접 행렬과 간선 리스트가 합쳐진 형태입니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;각 정점 i에 그 정점과 인접한 정점을 저장합니다. 총 V개의 배열을 가집니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;정점을 저장할 때 순서대로 나열할 필요는 없지만 오름차순으로 나타내는 게 편리한 경우가 많습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이러한 그래프는 탐색할 때 너비 우선 탐색 BFS, 깊이 우선 탐색 DFS, 다익스트라 Dijkstra, 플로이드 Floyd Washall 등의 기법을 사용할 수 있습니다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;BFS는 큐, DFS는 스택, 다익스트라는 최소 힙, 플로이드는 3중 for문으로 구현 가능합니다.&lt;/span&gt;&lt;/p&gt;</description>
      <category>알고리즘 스터디_개념정리</category>
      <category>Edge</category>
      <category>graph</category>
      <category>Node</category>
      <category>VERTEX</category>
      <category>간선</category>
      <category>그래프</category>
      <category>노드</category>
      <category>인접 리스트</category>
      <category>인접 행렬</category>
      <category>정점</category>
      <author>heyhmin</author>
      <guid isPermaLink="true">https://codeinleonis.tistory.com/41</guid>
      <comments>https://codeinleonis.tistory.com/41#entry41comment</comments>
      <pubDate>Sun, 30 Aug 2020 17:44:34 +0900</pubDate>
    </item>
    <item>
      <title>이진 탐색 Binary Search</title>
      <link>https://codeinleonis.tistory.com/40</link>
      <description>&lt;h3 data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이진&amp;nbsp;탐색&amp;nbsp;Binary&amp;nbsp;Search&lt;/span&gt;&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이진 탐색은 한번 비교를 할 때마다 탐색 범위가 절반으로 줄어든다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;정렬된 배열&lt;/b&gt;을&amp;nbsp;전제로 탐색한다.&amp;nbsp;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;table style=&quot;border-collapse: collapse; width: 0%; height: 20px;&quot; border=&quot;1&quot; data-ke-style=&quot;style13&quot;&gt;
&lt;tbody&gt;
&lt;tr style=&quot;height: 20px;&quot;&gt;
&lt;td style=&quot;width: 10%; text-align: center; height: 20px;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;1&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;/td&gt;
&lt;td style=&quot;width: 10%; text-align: center; height: 20px;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;3&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;/td&gt;
&lt;td style=&quot;width: 10%; text-align: center; height: 20px;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;5&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;/td&gt;
&lt;td style=&quot;width: 10%; text-align: center; height: 20px;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;7&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;/td&gt;
&lt;td style=&quot;width: 10%; text-align: center; height: 20px;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;9&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;/td&gt;
&lt;td style=&quot;width: 10%; text-align: center; height: 20px;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;11&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;/td&gt;
&lt;td style=&quot;width: 10%; text-align: center; height: 20px;&quot;&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;13&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;위와 같은 정렬된 배열에서 Binary Search 이진 탐색을 적용하여&lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt; 9&lt;/b&gt;&lt;/span&gt; 를 탐색하는 경우를 생각할 수 있다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;ol style=&quot;list-style-type: decimal;&quot; data-ke-list-type=&quot;decimal&quot;&gt;
&lt;li&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;정렬된 배열의 중앙 요소를 선택한다. &lt;/span&gt;&lt;/p&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&amp;lt; 7 선택 &amp;gt;&lt;/span&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;선택된 값과 찾고자 하는 값을 비교하여 왼쪽 혹은 오른쪽 중 어느 방향으로 탐색을 진행할지를 정한다. &lt;/span&gt;&lt;/p&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&amp;lt; 7이 9보다 작기 때문에 7을 기준으로 오른쪽의 값들을 탐색한다. &amp;gt;&lt;/span&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;위의 과정을 반복한다.&lt;/span&gt;&lt;/p&gt;
&lt;ul style=&quot;list-style-type: disc;&quot; data-ke-list-type=&quot;disc&quot;&gt;
&lt;li&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&amp;lt; 11 선택 &amp;gt;&lt;/span&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&amp;lt; 11이 9보다 크기 때문에 11을 기준으로 왼쪽의 값들을 탐색한다. &amp;gt;&lt;/span&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;남은 탐색 값은 9가 남고, 찾고자 하는 값과 일치하므로 탐색을 끝마친다.&lt;/span&gt;&lt;/p&gt;
&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이진 탐색 성능&lt;/span&gt;&lt;/b&gt;&lt;/h3&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;0&quot; data-origin-height=&quot;0&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bCkqPL/btqHsbndRTZ/BV3ReUhF1utIiGSkMYR7nK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bCkqPL/btqHsbndRTZ/BV3ReUhF1utIiGSkMYR7nK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bCkqPL/btqHsbndRTZ/BV3ReUhF1utIiGSkMYR7nK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbCkqPL%2FbtqHsbndRTZ%2FBV3ReUhF1utIiGSkMYR7nK%2Fimg.png&quot; data-origin-width=&quot;0&quot; data-origin-height=&quot;0&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p style=&quot;text-align: right;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;i&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;데이터 집합의 크기 n&lt;/span&gt;&lt;/b&gt;&lt;/i&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: right;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;i&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;반복 횟수 k&lt;/span&gt;&lt;/b&gt;&lt;/i&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;i&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;데이터 집합의 크기 n 을 2로 몇 번 나누어야 1이 되는지, 해당 k값을 확인할 수 있다.&amp;nbsp;&lt;/span&gt;&lt;/b&gt;&lt;/i&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 data-ke-size=&quot;size23&quot;&gt;&amp;nbsp;&lt;/h3&gt;
&lt;h3 data-ke-size=&quot;size23&quot;&gt;&amp;nbsp;&lt;/h3&gt;
&lt;h3 data-ke-size=&quot;size23&quot;&gt;&amp;nbsp;&lt;/h3&gt;
&lt;h3 data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;탐색 과정&lt;/span&gt;&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;탐색하고자 하는 범위를 정의하기 위해 변수&lt;b&gt;&lt;span style=&quot;color: #009a87;&quot;&gt; left&lt;/span&gt;와 &lt;span style=&quot;color: #009a87;&quot;&gt;right&lt;/span&gt;, &lt;span style=&quot;color: #8a3db6;&quot;&gt;mid&lt;/span&gt;&lt;/b&gt;를 사용한다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;처음에 &lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;left&lt;/b&gt;&lt;/span&gt;는 &lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;0&lt;/b&gt;&lt;/span&gt;, &lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;right&lt;/b&gt;&lt;/span&gt;는 &lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;last index&lt;/b&gt;&lt;/span&gt;, &lt;b&gt;&lt;span style=&quot;color: #8a3db6;&quot;&gt;mid&lt;/span&gt;&lt;/b&gt;는 &lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt;( left + right ) / 2 &lt;/b&gt;&lt;/span&gt;로 설정한다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;right &amp;lt; left&lt;/b&gt;&lt;/span&gt;가 되는 순간 &lt;b&gt;탐색이 종료&lt;/b&gt;되며, 그 전에 해당 값을 찾으면 종료된다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt;mid&lt;/b&gt;&lt;/span&gt;값과 찾고자 하는 값 &lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt;answer&lt;/b&gt;&lt;/span&gt; 을 비교하여 &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt;mid &amp;lt; &lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt;answer&lt;/b&gt;&lt;/span&gt;&lt;span style=&quot;color: #333333;&quot;&gt;&lt;span&gt;&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;이면&lt;b&gt;&lt;span style=&quot;color: #009a87;&quot;&gt; left&lt;/span&gt; = &lt;span style=&quot;color: #8a3db6;&quot;&gt;mid&lt;/span&gt; + 1&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt;&lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt;answer&lt;/b&gt;&lt;/span&gt;&lt;span style=&quot;color: #333333;&quot;&gt;&lt;span&gt;&amp;nbsp;&lt;/span&gt;&lt;/span&gt;&amp;lt; mid&lt;/b&gt;&lt;/span&gt; 이면 &lt;b&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;right&lt;/span&gt; = &lt;span style=&quot;color: #8a3db6;&quot;&gt;mid&lt;/span&gt; - 1&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>알고리즘 스터디_개념정리</category>
      <category>binary</category>
      <category>binary search</category>
      <category>search</category>
      <category>개념 정리</category>
      <category>데이터 탐색</category>
      <category>알고리즘</category>
      <category>이분 탐색</category>
      <category>이진 탐색</category>
      <category>정렬된 배열</category>
      <category>탐색 알고리즘</category>
      <author>heyhmin</author>
      <guid isPermaLink="true">https://codeinleonis.tistory.com/40</guid>
      <comments>https://codeinleonis.tistory.com/40#entry40comment</comments>
      <pubDate>Sun, 30 Aug 2020 17:02:48 +0900</pubDate>
    </item>
    <item>
      <title>해시 알고리즘</title>
      <link>https://codeinleonis.tistory.com/39</link>
      <description>&lt;h4 style=&quot;text-align: center;&quot; data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR'; color: #8a3db6;&quot;&gt;&lt;b&gt;해시 함수&lt;/b&gt;는 어떤 길이의 데이터를 입력해도 정해진 길이의 결괏값을 준다.&lt;/span&gt;&lt;/h4&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&amp;nbsp;&lt;/h4&gt;
&lt;p&gt;&lt;span style=&quot;&quot;&gt;데이터를 저장하는 방식으로 볼 때, 해시 함수에는 다양한 방식이 있다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Direct-address tables&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Direct-address tables는 크기가 U인 테이블 T를 생성하고 key K를 slot K에 저장하는 방식이다. &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이때 중복되는 key는 없다고 가정한다. 전체 크기가 U인 곳에서 actual key K가 존재한다고 생각한다. 해당되는 데이터를 table에 저장하고 필요한 key값과 그에 해당하는 data를 확인하는 자료구조이다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;해당 방식은 &lt;b&gt;수행 시간이 매우 짧다&lt;/b&gt;는 장점이 있다. key값을 알고 있으면 table에서 바로 data를 찾을 수 있기 때문이다. 하지만 공간 복잡도 측면에서는 실제 사용 공간이 적어 &lt;b&gt;공간이 낭비될 수 있다&lt;/b&gt;.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;또한, &lt;b&gt;Hashing&lt;/b&gt;은 key k를 저장할 때 slot k가 아니라, slot h(k)에 저장하는 것을 의미한다. 이때 h(k)를 k의 해쉬값이라고 하고 h()를 해쉬 함수라고 한다. 이 경우, 값들은 동일한 hash값을 가질 수 있게 되고 충돌 문제가 일어날 수 있게 된다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Chaining&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이러한 충돌이 있을 경우, 대부분 중복되는 key가 있을 경우 해당 slot을 연결리스트로 저장하여 중복이 일어나더라도 충돌 문제가 일어나지 않도록 한다.&amp;nbsp;&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-filename=&quot;blob&quot; data-origin-width=&quot;660&quot; data-origin-height=&quot;256&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/AJeep/btqHxOrqgpb/UT0eTvuM8QbkG6afcquvbk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/AJeep/btqHxOrqgpb/UT0eTvuM8QbkG6afcquvbk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/AJeep/btqHxOrqgpb/UT0eTvuM8QbkG6afcquvbk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FAJeep%2FbtqHxOrqgpb%2FUT0eTvuM8QbkG6afcquvbk%2Fimg.png&quot; data-filename=&quot;blob&quot; data-origin-width=&quot;660&quot; data-origin-height=&quot;256&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;하지만 이런 경우, 하나의 slot에 아주 긴 리스트가 생겨나서 시간 복잡도 측면에서 문제가 생길 수 있다. 그러니 가능하면 최대한 중복 값을 방지하고 해시값이 전체에 걸쳐서 &lt;b&gt;균등하게 발생하도록&lt;/b&gt; 하는 해시 함수를 사용해야 한다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;대표적인 해시 함수는 나머지 값을 h(k)로 하는 것이다. 즉, key를 m이라는 수로 나누고 그 나머지로 h(k)의 결괏값을 만드는 것이다. 이때 보다 효율적이기 위해서는 m은 2의 제곱수가 아니어야 하고 &lt;b&gt;소수&lt;/b&gt;로 지정하는 것이 좋다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;** key -&amp;gt; hash function -&amp;gt; hash value &lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;즉, &lt;span style=&quot;color: #f89009;&quot;&gt;&lt;b&gt;HashFunction( Key ) = HashValue&lt;/b&gt; &lt;/span&gt;이다.&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;나눗셈 법의 경우 &lt;span style=&quot;color: #f89009;&quot;&gt;&lt;b&gt;Hash Value = Key % m이다.&lt;/b&gt;&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;해시 함수는 &lt;b&gt;언제나 동일한 해시값을 리턴&lt;/b&gt;한다. 이러한 해시는 보안 분야에서도 자주 사용된다. 키와 해시값 사이에 직접적인 연관이 없기 때문에 해시값만으로는 그 키값을 &lt;b&gt;온전히 복원하기 어렵기 때문&lt;/b&gt;이다. 또한 해시함수는 길이가 서로 다른 입력 데이터에 대해 일정한 길이의 출력을 만들 수 있기 때문에&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt; 데이터 축약의 기능&lt;/b&gt;&lt;/span&gt;도 있다. &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Open Addressing&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;보다 균등하게 해시값들에 데이터를 저장하기 위해서, 해시값의 주소가 아닌 다른 주소에 데이터를 저장할 수 있도록 하여 보다 균일하게 분포되도록 하는 방법도 있다. 해당 방법은 만약 해당 해시값으로 이미 저장된 데이터가 있다면, 그다음 해시값으로 변경하여 데이터를 저장하는 것이다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-origin-width=&quot;0&quot; data-origin-height=&quot;0&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/csl9iF/btqHwh8tkNQ/rL7XxXfCrWfrNfiyHQ3ZqK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/csl9iF/btqHwh8tkNQ/rL7XxXfCrWfrNfiyHQ3ZqK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/csl9iF/btqHwh8tkNQ/rL7XxXfCrWfrNfiyHQ3ZqK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fcsl9iF%2FbtqHwh8tkNQ%2FrL7XxXfCrWfrNfiyHQ3ZqK%2Fimg.png&quot; data-origin-width=&quot;0&quot; data-origin-height=&quot;0&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;7이 m이라고 할 때, 50과 85의 해시값은 모두 1이다. 하지만 이미 50이 저장된 상태이므로 85의 해시값을 그보다 1이 큰 곳에 저장한다. 데이터가 균일하게 분포되지만 그 구조상 해시 충돌 문제가 발생할 수 있다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Double Hashing&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이중 해싱은 탐사할 &lt;b&gt;해시값의 규칙성을 제거&lt;/b&gt;하여 clustering을 방지한다. 2개의 해시함수를 사용한다. 하나는 최초의 해시값을 얻을 때, 또 다른 하나는 해시 충돌이 일어났을 때 탐사 이동폭을 얻기 위해 사용한다. 만약 최초 해시값이 같더라도 탐사 이동폭이 달라진다. 마찬가지로 탐사 이동폭이 같더라도 최초 해시값이 달라져서 primary, secondary clustering을 모두 완화할 수 있다. &lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;예시로&lt;/b&gt;, 해당 방법에서 &lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;h1()은 m1&lt;/b&gt;&lt;/span&gt;, &lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt;h2()는 m2&lt;/b&gt;&lt;/span&gt;를 사용한다고 하자&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;m1&lt;/b&gt;&lt;/span&gt;와 &lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt;m2&lt;/b&gt;&lt;/span&gt;는 &lt;b&gt;서로소&lt;/b&gt;이어야만 한다. &lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;( 서로소 realatively prime - 3, 5처럼 공약수가 1 뿐인 경우 )&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;최초의 해시값&lt;/b&gt;을 h1으로 얻으면 ( h1의 제수, &lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;m1은 3&lt;/b&gt;&lt;/span&gt;이다 )&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;키가 3일 경우 &lt;b&gt;h1(3) = 0&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;키가 6일 경우 &lt;b&gt;h1(6) = 0&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;color: #333333; font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;키가 11일 경우 &lt;b&gt;h1(11) = 2&lt;/b&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;&lt;b&gt;해시 충돌&lt;/b&gt;이 일어나서 h2를 사용하면 &lt;span style=&quot;color: #333333;&quot;&gt;( h2의 제수, &lt;span style=&quot;color: #8a3db6;&quot;&gt;&lt;b&gt;m2은 5&lt;/b&gt;&lt;/span&gt;이다 )&lt;/span&gt;&lt;/span&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;h2(3) = 3&lt;/span&gt;&lt;/b&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;h2(6) = 1&lt;/span&gt;&lt;/b&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;h2(11) = 1&lt;/span&gt;&lt;/b&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;b&gt;이처럼, 두 해시값이 다르기 때문에 clustering을 완화할 수 있다.&lt;/b&gt;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;이번 예시는&lt;b&gt;나눗셈 법, division method를&lt;/b&gt; 사용하였다. &lt;i&gt;&lt;b&gt;간단하면서도 빠른 연산&lt;/b&gt;&lt;/i&gt;이 가능하다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h3 data-ke-size=&quot;size23&quot;&gt;&amp;nbsp;&lt;/h3&gt;
&lt;h3 data-ke-size=&quot;size23&quot;&gt;&amp;nbsp;&lt;/h3&gt;
&lt;h3 data-ke-size=&quot;size23&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;나눗셈 법 이외에도 다양한 해시 함수 방법이 있다.&lt;/span&gt;&lt;/b&gt;&lt;/h3&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;multiplication method&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;숫자 key k이고&amp;nbsp; A는 0과 1 사이의 실수이다. 이때 m은 그 값이 크게 중요하지 않지만 보통 2의 제곱수로 한다. 나눗셈 법에 비해서는 느리지만 2진수 연산에 최적화된 컴퓨터 구조를 고려한 해시함수이다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-filename=&quot;hash2.PNG&quot; data-origin-width=&quot;196&quot; data-origin-height=&quot;35&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/b32tym/btqHEeWudp2/uCNgloQ5PDNljrDd6jo4W1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/b32tym/btqHEeWudp2/uCNgloQ5PDNljrDd6jo4W1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/b32tym/btqHEeWudp2/uCNgloQ5PDNljrDd6jo4W1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fb32tym%2FbtqHEeWudp2%2FuCNgloQ5PDNljrDd6jo4W1%2Fimg.png&quot; data-filename=&quot;hash2.PNG&quot; data-origin-width=&quot;196&quot; data-origin-height=&quot;35&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;h4 data-ke-size=&quot;size20&quot;&gt;&lt;span style=&quot;color: #009a87;&quot;&gt;&lt;b&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;Universal Hashing&lt;/span&gt;&lt;/b&gt;&lt;/span&gt;&lt;/h4&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;다수의 해시함수를 만들고, 해시함수들의 집합 H에서 무작위로 해시함수를 선택하여 해시값을 만든다. H에서 무작위로 뽑은 해시함수가 주어졌을 때 임의의 키값을 임의의 해시값에 매핑할 확률을 1/m으로 만드는 것을 목적으로 한다.&lt;/span&gt;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;ul style=&quot;list-style-type: circle;&quot; data-ke-list-type=&quot;circle&quot;&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;해시 테이블의 크기 m을 소수로 정한다.&lt;/span&gt;&lt;/li&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;키값을 k0부터 kr까지 총 r+1개로 쪼갠다.&lt;/span&gt;&lt;/li&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;0부터 m-1 사이의 정수 가운데 하나를 무작위로 뽑는다. (r+1)만큼 반복해서 뽑으며 a = [a0, a1, ... , ar]로 저장한다. &lt;/span&gt;&lt;/li&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;해시 함수는 다음과 같다.&lt;/span&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-filename=&quot;hash3.PNG&quot; data-origin-width=&quot;190&quot; data-origin-height=&quot;27&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/MRFST/btqHApkoUrd/Rk1K9h2pbcSCoaPKLCnYI0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/MRFST/btqHApkoUrd/Rk1K9h2pbcSCoaPKLCnYI0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/MRFST/btqHApkoUrd/Rk1K9h2pbcSCoaPKLCnYI0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FMRFST%2FbtqHApkoUrd%2FRk1K9h2pbcSCoaPKLCnYI0%2Fimg.png&quot; data-filename=&quot;hash3.PNG&quot; data-origin-width=&quot;190&quot; data-origin-height=&quot;27&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;ul style=&quot;list-style-type: circle;&quot; data-ke-list-type=&quot;circle&quot;&gt;
&lt;li data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;a와 해시함수의 집합 H의 요소 수는 다음과 같다.&lt;/span&gt;&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-filename=&quot;hash4.PNG&quot; data-origin-width=&quot;37&quot; data-origin-height=&quot;18&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/dVYrlj/btqHvK3C4Pn/Znv8GLHHjfjOGeykCFO5D1/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/dVYrlj/btqHvK3C4Pn/Znv8GLHHjfjOGeykCFO5D1/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/dVYrlj/btqHvK3C4Pn/Znv8GLHHjfjOGeykCFO5D1/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FdVYrlj%2FbtqHvK3C4Pn%2FZnv8GLHHjfjOGeykCFO5D1%2Fimg.png&quot; data-filename=&quot;hash4.PNG&quot; data-origin-width=&quot;37&quot; data-origin-height=&quot;18&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;
&lt;p data-ke-size=&quot;size18&quot;&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>알고리즘 스터디_개념정리</category>
      <category>division method</category>
      <category>hash</category>
      <category>Hashing</category>
      <category>이중 해싱</category>
      <category>체이닝</category>
      <category>해쉬 알고리즘</category>
      <category>해쉬 함수</category>
      <category>해시 알고리즘</category>
      <category>해시 충돌</category>
      <category>해시 함수</category>
      <author>heyhmin</author>
      <guid isPermaLink="true">https://codeinleonis.tistory.com/39</guid>
      <comments>https://codeinleonis.tistory.com/39#entry39comment</comments>
      <pubDate>Sun, 30 Aug 2020 16:37:16 +0900</pubDate>
    </item>
    <item>
      <title>프로그래머스 깊이/너비 우선 탐색 단어 변환 with Kotlin</title>
      <link>https://codeinleonis.tistory.com/36</link>
      <description>&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;프로그래머스 깊이/너비 우선 탐색 단어 변환 문제입니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-filename=&quot;pr02.PNG&quot; data-origin-width=&quot;733&quot; data-origin-height=&quot;740&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/bnr5la/btqHhQQgtpC/oI8jITz3DMaRkO9ARDUDOk/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/bnr5la/btqHhQQgtpC/oI8jITz3DMaRkO9ARDUDOk/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/bnr5la/btqHhQQgtpC/oI8jITz3DMaRkO9ARDUDOk/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fbnr5la%2FbtqHhQQgtpC%2FoI8jITz3DMaRkO9ARDUDOk%2Fimg.png&quot; data-filename=&quot;pr02.PNG&quot; data-origin-width=&quot;733&quot; data-origin-height=&quot;740&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;IntelliJ에서의 풀이입니다.&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1598422223957&quot; class=&quot;kotlin&quot; data-ke-language=&quot;kotlin&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;import java.util.*

val begin = &quot;hit&quot;
val target = &quot;cog&quot;
val words = arrayOf(&quot;hot&quot;, &quot;dot&quot;, &quot;dog&quot;, &quot;lot&quot;, &quot;log&quot;, &quot;cog&quot;)
fun solution(begin: String, target: String, words: Array&amp;lt;String&amp;gt;): Int {
    var answer = 0
    if (!words.contains(target)) return 0
    val que:Queue&amp;lt;String&amp;gt; = LinkedList&amp;lt;String&amp;gt;()
    words.forEach { que.add(it) }
    var curstr: String = begin
    var quep: String = que.poll()
    var cnt: Int
    while (curstr != target){
        cnt = 0
        for (i in curstr.indices){
            if (curstr[i] != target[i]) cnt++
        }
        if (cnt == 1){
            curstr = quep
            return answer+1
        }
        cnt = 0
        for (i in curstr.indices){
            if (curstr[i] != quep[i]) cnt++
        }
        if (cnt == 1){
            curstr = quep
            answer++
        }
        if (!que.isEmpty()) quep = que.poll()
    }
    return answer
}

fun main() {
    println(solution(begin, target, words)) //4
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;URL: &lt;a href=&quot;https://programmers.co.kr/learn/courses/30/lessons/43162&quot;&gt;https://programmers.co.kr/learn/courses/30/lessons/43163&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1598422215005&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;website&quot; data-og-title=&quot;코딩테스트 연습 - 네트워크&quot; data-og-description=&quot;네트워크란 컴퓨터 상호 간에 정보를 교환할 수 있도록 연결된 형태를 의미합니다. 예를 들어, 컴퓨터 A와 컴퓨터 B가 직접적으로 연결되어있고, 컴퓨터 B와 컴퓨터 C가 직접적으로 연결되어 있��&quot; data-og-host=&quot;programmers.co.kr&quot; data-og-source-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/43162&quot; data-og-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/43162&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/bIwSAW/hyHiar48Vk/9YwcvFltD5zUC1XAItZ9a0/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/A1Usb/hyHik2wSe9/OnWPpXKAOumWBXmPFfzKKk/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/cEcHHx/hyHgIDYBoB/KUa68SA4rlAMwZ4BiDgX40/img.png?width=714&amp;amp;height=622&amp;amp;face=0_0_714_622&quot;&gt;&lt;a href=&quot;https://programmers.co.kr/learn/courses/30/lessons/43162&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/43162&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/bIwSAW/hyHiar48Vk/9YwcvFltD5zUC1XAItZ9a0/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/A1Usb/hyHik2wSe9/OnWPpXKAOumWBXmPFfzKKk/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/cEcHHx/hyHgIDYBoB/KUa68SA4rlAMwZ4BiDgX40/img.png?width=714&amp;amp;height=622&amp;amp;face=0_0_714_622');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;코딩테스트 연습 - 네트워크&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;네트워크란 컴퓨터 상호 간에 정보를 교환할 수 있도록 연결된 형태를 의미합니다. 예를 들어, 컴퓨터 A와 컴퓨터 B가 직접적으로 연결되어있고, 컴퓨터 B와 컴퓨터 C가 직접적으로 연결되어 있��&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;programmers.co.kr&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;</description>
      <category>알고리즘 스터디_문제풀이</category>
      <category>contains</category>
      <category>indices</category>
      <category>isempty</category>
      <category>Kotlin</category>
      <category>Poll</category>
      <category>programmers</category>
      <category>Queue</category>
      <category>string</category>
      <category>코틀린</category>
      <category>프로그래머스</category>
      <author>heyhmin</author>
      <guid isPermaLink="true">https://codeinleonis.tistory.com/36</guid>
      <comments>https://codeinleonis.tistory.com/36#entry36comment</comments>
      <pubDate>Wed, 26 Aug 2020 16:19:29 +0900</pubDate>
    </item>
    <item>
      <title>프로그래머스 깊이/너비 우선 탐색 네트워크 with Kotlin</title>
      <link>https://codeinleonis.tistory.com/35</link>
      <description>&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;프로그래머스 깊이/너비 우선 탐색 네트워크 문제입니다.&lt;/span&gt;&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-filename=&quot;pr01.PNG&quot; data-origin-width=&quot;736&quot; data-origin-height=&quot;628&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/QGlTJ/btqHes3RJsj/izyVsV938DWUtck7nrE3f0/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/QGlTJ/btqHes3RJsj/izyVsV938DWUtck7nrE3f0/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/QGlTJ/btqHes3RJsj/izyVsV938DWUtck7nrE3f0/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FQGlTJ%2FbtqHes3RJsj%2FizyVsV938DWUtck7nrE3f0%2Fimg.png&quot; data-filename=&quot;pr01.PNG&quot; data-origin-width=&quot;736&quot; data-origin-height=&quot;628&quot; data-ke-mobilestyle=&quot;widthContent&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;/&gt;&lt;/span&gt;&lt;/figure&gt;
&lt;/p&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;IntelliJ에서의 풀이입니다.&lt;/span&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1598422223957&quot; class=&quot;kotlin&quot; data-ke-language=&quot;kotlin&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;val n = 3
val computers = arrayOf(intArrayOf(1, 1, 0), intArrayOf(1, 1, 0), intArrayOf(0, 0, 1))
val computers2 = arrayOf(intArrayOf(1, 1, 0), intArrayOf(1, 1, 1), intArrayOf(0, 1, 1))
fun solution(n: Int, computers: Array&amp;lt;IntArray&amp;gt;): Int {
    var answer = 0
    val visited = Array&amp;lt;BooleanArray&amp;gt;(n) { BooleanArray(n){false} }
    for (i in 0 until n){
        if (!visited[i][i]){
            network(computers, i, n, visited)
            answer++
        }
    }
    return answer
}
fun network(computers: Array&amp;lt;IntArray&amp;gt;, i: Int, n: Int, visited: Array&amp;lt;BooleanArray&amp;gt;){
    for (j in 0 until n){
        if (computers[i][j] == 1 &amp;amp;&amp;amp; !visited[i][j]){
            visited[i][j] = true
            visited[j][i] = true
            network(computers, j, n, visited)
        }
    }
}

fun main() {
    //println(solution(n, computers)) //2
    println(solution(n, computers2)) //1
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p style=&quot;text-align: center;&quot; data-ke-size=&quot;size18&quot;&gt;&lt;span style=&quot;font-family: 'Noto Sans Demilight', 'Noto Sans KR';&quot;&gt;URL: &lt;a href=&quot;https://programmers.co.kr/learn/courses/30/lessons/43162&quot;&gt;https://programmers.co.kr/learn/courses/30/lessons/43162&lt;/a&gt;&lt;/span&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1598422215005&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;website&quot; data-og-title=&quot;코딩테스트 연습 - 네트워크&quot; data-og-description=&quot;네트워크란 컴퓨터 상호 간에 정보를 교환할 수 있도록 연결된 형태를 의미합니다. 예를 들어, 컴퓨터 A와 컴퓨터 B가 직접적으로 연결되어있고, 컴퓨터 B와 컴퓨터 C가 직접적으로 연결되어 있��&quot; data-og-host=&quot;programmers.co.kr&quot; data-og-source-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/43162&quot; data-og-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/43162&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/bIwSAW/hyHiar48Vk/9YwcvFltD5zUC1XAItZ9a0/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/A1Usb/hyHik2wSe9/OnWPpXKAOumWBXmPFfzKKk/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/cEcHHx/hyHgIDYBoB/KUa68SA4rlAMwZ4BiDgX40/img.png?width=714&amp;amp;height=622&amp;amp;face=0_0_714_622&quot;&gt;&lt;a href=&quot;https://programmers.co.kr/learn/courses/30/lessons/43162&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://programmers.co.kr/learn/courses/30/lessons/43162&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/bIwSAW/hyHiar48Vk/9YwcvFltD5zUC1XAItZ9a0/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/A1Usb/hyHik2wSe9/OnWPpXKAOumWBXmPFfzKKk/img.jpg?width=626&amp;amp;height=626&amp;amp;face=0_0_626_626,https://scrap.kakaocdn.net/dn/cEcHHx/hyHgIDYBoB/KUa68SA4rlAMwZ4BiDgX40/img.png?width=714&amp;amp;height=622&amp;amp;face=0_0_714_622');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;코딩테스트 연습 - 네트워크&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;네트워크란 컴퓨터 상호 간에 정보를 교환할 수 있도록 연결된 형태를 의미합니다. 예를 들어, 컴퓨터 A와 컴퓨터 B가 직접적으로 연결되어있고, 컴퓨터 B와 컴퓨터 C가 직접적으로 연결되어 있��&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;programmers.co.kr&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;</description>
      <category>알고리즘 스터디_문제풀이</category>
      <category>2D Array</category>
      <category>2D initialize</category>
      <category>array</category>
      <category>booleanarray</category>
      <category>intarray</category>
      <category>Kotlin</category>
      <category>programmers</category>
      <category>네트워크</category>
      <category>코틀린</category>
      <category>프로그래머스</category>
      <author>heyhmin</author>
      <guid isPermaLink="true">https://codeinleonis.tistory.com/35</guid>
      <comments>https://codeinleonis.tistory.com/35#entry35comment</comments>
      <pubDate>Wed, 26 Aug 2020 15:12:09 +0900</pubDate>
    </item>
  </channel>
</rss>