<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0">
  <channel>
    <title>As i wish</title>
    <link>https://eomtttttt-develop.tistory.com/</link>
    <description>좋아하는 것들 살면서 느끼는점들</description>
    <language>ko</language>
    <pubDate>Mon, 13 Apr 2026 16:43:38 +0900</pubDate>
    <generator>TISTORY</generator>
    <ttl>100</ttl>
    <managingEditor>어면태</managingEditor>
    <image>
      <title>As i wish</title>
      <url>https://tistory1.daumcdn.net/tistory/2862723/attach/15b6da1356c84361a8641d23123f195d</url>
      <link>https://eomtttttt-develop.tistory.com</link>
    </image>
    <item>
      <title>가전제품 구매기</title>
      <link>https://eomtttttt-develop.tistory.com/249</link>
      <description>&lt;p&gt;결혼 준비를 하면서 가전제품을 구매해야 하는 시기가 왔다. 뭐 일단은 여러가지 (생각하면 끝도 없을 정도로 많은데...) 기본적인 것 부터 구매 하기로 하였다.&lt;/p&gt;
&lt;p&gt;나의 대표님께서는 (예비 신부님) 항상 합리적인 소비를 지향하고 있기에 가전 제품 구매도 따라다니느라 쉽지가 않았다. 먼저 우리가 이번에 구매하기로 한 제품은 냉장고 + 스타일러 + 건조기 + 세탁기 였다. 일단 백색 가전은 LG란 말이 있어서 처음에 강남 신세계 백화점 가서 상담을 받았다.&lt;/p&gt;
&lt;p&gt;하지만 가격이 너무 (ㅎㄷㄷ..) 무슨 할인, 어떤 할인, 포인트 적립 등 다양한 해택들이 있었지만 기억에는 잘 나지가 않는다. 그러면서 자연스럽게 많은 검색을 하게 되었다.&lt;/p&gt;
&lt;p&gt;그렇게 우리의 가전제품 구매기 여정이 시작 되었다.&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;
&lt;p&gt;학여울역 LG 베스트 샾&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;장안중앙 LG 베스트 샾&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;영등포 현대 백화점 LG&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;p&gt;삼성역 현대 백화점 LG&lt;/p&gt;
&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;&lt;b&gt;1. 학여울역 LG 베스트 샾&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;자연스럽게 가까운 동네인 학여울역 LG 베스트 샾을 방문하였다. 대략적인 견적은 기억이 나진 않지만 백화점 보다는 비싼던것 같다. 그리고 백화점은 백화점 포인트를 주었는데 LG 베스트 샾에서는 백화점 포인트가 아닌 카드 포인트를 받았던것 같다. 그리고 무슨 보험(?) 같은걸 들면 거의 반값이 되었는데, 부모님들에게 여쭤본 결과 그건 좋지는 않은것 같아서 자연스럽게 패스하였다.&lt;/p&gt;
&lt;p&gt;&lt;b&gt;2. 장안중앙 LG 베스트 샾&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;그러고 나와서 대표님 (일전에도 말했지만 나의 예비 신부다) 의 엄청난 검색 능력으로 강동구 어딘가에 LG 베스트 샾을 향했다. 거기서 어떤 실장(?) 님이 싸게 해준다고 해서 갔는데, 역시 인터넷에서 유명한 만큼 상담이 가득 차 있어서 동일한 조건으로 다른분께 상담을 받았다. 하지만 만족스럽지는 못했다. 강남 신세계랑 비교 했을 때에도 그 차이를 잘 모르겠고 인터넷에서 받은 견적과도 차이가 났다. 그래도 일단 학여울역 보단 싸게 견적을 받아서 킵해두기로 하고 다시 대표님이 엄청난 검색을 하였다.&lt;/p&gt;
&lt;p&gt;&lt;b&gt;3. 영등포 현대 백화점 LG&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;검색 결과 새로 오픈하는 오픈특가로 할인을 받으면 제일 싸다는 것을 알게 되었다. 그리고 우리가 검색하는 시점에 새로 오픈하는 곳이 두군데 있었는데 영등포 현백이랑 삼성역 현백이였다.&lt;/p&gt;
&lt;p&gt;하지만 이미 시간을 6시를 향해가고 우리는 결정을 할 수 밖에 없었다. 그래서 그나마 가까운 삼성역 현백으로 향했다. 따라서 영등포 현백은 패스(...)&lt;/p&gt;
&lt;p&gt;&lt;b&gt;4. 삼성역 현대 백화점 LG&lt;/b&gt;&lt;/p&gt;
&lt;p&gt;삼성역 현백 LG 샾에 도착하니 역시 오픈특가를 진행하고 있었는데 사람이 엄청 많았다. 우리는 그리고 이미 지칠대로 지쳐있었다. 그러나 역시 가격은 만족스러운 견적을 받았고 (대신 현대백화점 카드를 만들어야 하지만, 어쩌면 당연한 거일 수도) 페이백 형식으로 싸게 받을 수 있었다.&lt;/p&gt;
&lt;p&gt;일단 이날은 우리는 건조기 + 세탁기 + 스타일러 이렇게 세가지 품목을 구매했었는데, 다음주가 되어서 우리는 같은 현대 백화점 LG로 가서 냉장고 까지 구매해버렸다 (후하하) 그러고 건조기 + 세탁기를 두개가 1등급으로 바꾸고 (제발 1등급 해택 받게 해주세요...) 냉장고 까지 구매하면서 좋은 가격으로 가전을 구매할 수 있었다. 오픈 특가다 보니 사은품도 몇개 챙겨 받고 (뭐 내가 다 들고 갔지만, 이럴려고 남편은 따라가나보다..) 무슨말을 했는지 기억은 안나지만 그래도 고생한 보람만큼 좋은 가격에 가전을 구매한것 같다.&lt;/p&gt;
&lt;p&gt;결혼 준비는 정말 힘들다. 특히 돈도 많이 들고 발품도 많이 팔러 다녀야하는데, 이런 오픈 특가를 잘 이용하면 좋을것 같다. 또한 역시 아는것이 힘이다.&lt;/p&gt;
&lt;p&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;4FB3694C-DEB4-4459-A65A-D9D3FB0C0DF5.jpeg&quot; data-origin-width=&quot;320&quot; data-origin-height=&quot;320&quot; data-ke-mobilestyle=&quot;widthContent&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/blxRMq/btqFONmGQKG/sCD2pANCKVd6PJSSxx6jRK/img.jpg&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/blxRMq/btqFONmGQKG/sCD2pANCKVd6PJSSxx6jRK/img.jpg&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/blxRMq/btqFONmGQKG/sCD2pANCKVd6PJSSxx6jRK/img.jpg&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FblxRMq%2FbtqFONmGQKG%2FsCD2pANCKVd6PJSSxx6jRK%2Fimg.jpg&quot; data-filename=&quot;4FB3694C-DEB4-4459-A65A-D9D3FB0C0DF5.jpeg&quot; data-origin-width=&quot;320&quot; data-origin-height=&quot;320&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;</description>
      <category>Wedding</category>
      <author>어면태</author>
      <guid isPermaLink="true">https://eomtttttt-develop.tistory.com/249</guid>
      <comments>https://eomtttttt-develop.tistory.com/249#entry249comment</comments>
      <pubDate>Sun, 19 Jul 2020 23:34:28 +0900</pubDate>
    </item>
    <item>
      <title>git commit  대소문자 구분</title>
      <link>https://eomtttttt-develop.tistory.com/248</link>
      <description>&lt;p&gt;&lt;a href=&quot;https://velog.io/@eomttt/git-commit-%EC%8B%9C-%EB%8C%80%EC%86%8C%EB%AC%B8%EC%9E%90-%EA%B5%AC%EB%B6%84&quot;&gt;https://velog.io/@eomttt/git-commit-%EC%8B%9C-%EB%8C%80%EC%86%8C%EB%AC%B8%EC%9E%90-%EA%B5%AC%EB%B6%84&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1588045430658&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;git commit 시 대소문자 구분&quot; data-og-description=&quot;git commit 시 대소문자 구분이 안된다.예를 들어 a.png 가 있다고 가정하자. 이를 A.png 라고 바꾸어도 원격저장소에서는 a.png 로 그대로 저장된다. 대소문자 구분을 못하는 것이다. ㅠㅠ따라서 다음과 같은 절차가 필요하다.$ git mv --force&quot; data-og-host=&quot;velog.io&quot; data-og-source-url=&quot;https://velog.io/@eomttt/git-commit-%EC%8B%9C-%EB%8C%80%EC%86%8C%EB%AC%B8%EC%9E%90-%EA%B5%AC%EB%B6%84&quot; data-og-url=&quot;https://velog.io/@eomttt/git-commit-시-대소문자-구분&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/b2gs5m/hyFPGN4D1Y/xkk3Unzf48rhkuOQ9q9KkK/img.png?width=399&amp;amp;height=331&amp;amp;face=0_0_399_331,https://scrap.kakaocdn.net/dn/b4HULT/hyFQ3nlYli/OHzCJDQkgvcrfJ1V6eIQn1/img.png?width=399&amp;amp;height=331&amp;amp;face=0_0_399_331,https://scrap.kakaocdn.net/dn/g5Pi1/hyFPL2U5Sn/SU92CP2LYCvh3Gsp4AScrk/img.png?width=399&amp;amp;height=331&amp;amp;face=0_0_399_331&quot;&gt;&lt;a href=&quot;https://velog.io/@eomttt/git-commit-%EC%8B%9C-%EB%8C%80%EC%86%8C%EB%AC%B8%EC%9E%90-%EA%B5%AC%EB%B6%84&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://velog.io/@eomttt/git-commit-%EC%8B%9C-%EB%8C%80%EC%86%8C%EB%AC%B8%EC%9E%90-%EA%B5%AC%EB%B6%84&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/b2gs5m/hyFPGN4D1Y/xkk3Unzf48rhkuOQ9q9KkK/img.png?width=399&amp;amp;height=331&amp;amp;face=0_0_399_331,https://scrap.kakaocdn.net/dn/b4HULT/hyFQ3nlYli/OHzCJDQkgvcrfJ1V6eIQn1/img.png?width=399&amp;amp;height=331&amp;amp;face=0_0_399_331,https://scrap.kakaocdn.net/dn/g5Pi1/hyFPL2U5Sn/SU92CP2LYCvh3Gsp4AScrk/img.png?width=399&amp;amp;height=331&amp;amp;face=0_0_399_331');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;git commit 시 대소문자 구분&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;git commit 시 대소문자 구분이 안된다.예를 들어 a.png 가 있다고 가정하자. 이를 A.png 라고 바꾸어도 원격저장소에서는 a.png 로 그대로 저장된다. 대소문자 구분을 못하는 것이다. ㅠㅠ따라서 다음과 같은 절차가 필요하다.$ git mv --force&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;velog.io&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>Git</category>
      <category>commit</category>
      <category>git</category>
      <category>uppercase</category>
      <category>대소문자</category>
      <author>어면태</author>
      <guid isPermaLink="true">https://eomtttttt-develop.tistory.com/248</guid>
      <comments>https://eomtttttt-develop.tistory.com/248#entry248comment</comments>
      <pubDate>Tue, 28 Apr 2020 12:44:11 +0900</pubDate>
    </item>
    <item>
      <title>RIDI 입사자 과제 회고</title>
      <link>https://eomtttttt-develop.tistory.com/247</link>
      <description>&lt;p&gt;&lt;a href=&quot;https://velog.io/@eomttt/RIDI-%EC%9E%85%EC%82%AC%EC%9E%90-%EA%B3%BC%EC%A0%9C-%ED%9A%8C%EA%B3%A0&quot;&gt;https://velog.io/@eomttt/RIDI-%EC%9E%85%EC%82%AC%EC%9E%90-%EA%B3%BC%EC%A0%9C-%ED%9A%8C%EA%B3%A0&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1586847751328&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;RIDI 입사자 과제 회고&quot; data-og-description=&quot;3/16 일에 새로운 회사인 RIDI에 입사하게 되었다.새로운 환경에 적응하는 일은 늘 어려운 일이다. 특히 나 같은 경우는 먼저 다가가서 친해지는 성격도 아니고 은근히 내성적이기 때문에 약간 새로운 환경을 두려워하기도 한다.무튼 그러나 회사는 회사기 때문에 최대한 빠&quot; data-og-host=&quot;velog.io&quot; data-og-source-url=&quot;https://velog.io/@eomttt/RIDI-%EC%9E%85%EC%82%AC%EC%9E%90-%EA%B3%BC%EC%A0%9C-%ED%9A%8C%EA%B3%A0&quot; data-og-url=&quot;https://velog.io/@eomttt/RIDI-입사자-과제-회고&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/biwfq7/hyFFkqNyMm/izLZW6hsBdCGWyKSJkbEe0/img.png?width=1400&amp;amp;height=770&amp;amp;face=0_0_1400_770,https://scrap.kakaocdn.net/dn/dzWLjq/hyFGjqhhDI/mlOKQWKFdOQHznP2TwwPz1/img.png?width=1400&amp;amp;height=770&amp;amp;face=0_0_1400_770,https://scrap.kakaocdn.net/dn/bBbh4Y/hyFGl2G3FT/FZLy3UNgTs3PCnUxgeTnXk/img.png?width=1400&amp;amp;height=770&amp;amp;face=0_0_1400_770&quot;&gt;&lt;a href=&quot;https://velog.io/@eomttt/RIDI-%EC%9E%85%EC%82%AC%EC%9E%90-%EA%B3%BC%EC%A0%9C-%ED%9A%8C%EA%B3%A0&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://velog.io/@eomttt/RIDI-%EC%9E%85%EC%82%AC%EC%9E%90-%EA%B3%BC%EC%A0%9C-%ED%9A%8C%EA%B3%A0&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/biwfq7/hyFFkqNyMm/izLZW6hsBdCGWyKSJkbEe0/img.png?width=1400&amp;amp;height=770&amp;amp;face=0_0_1400_770,https://scrap.kakaocdn.net/dn/dzWLjq/hyFGjqhhDI/mlOKQWKFdOQHznP2TwwPz1/img.png?width=1400&amp;amp;height=770&amp;amp;face=0_0_1400_770,https://scrap.kakaocdn.net/dn/bBbh4Y/hyFGl2G3FT/FZLy3UNgTs3PCnUxgeTnXk/img.png?width=1400&amp;amp;height=770&amp;amp;face=0_0_1400_770');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;RIDI 입사자 과제 회고&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;3/16 일에 새로운 회사인 RIDI에 입사하게 되었다.새로운 환경에 적응하는 일은 늘 어려운 일이다. 특히 나 같은 경우는 먼저 다가가서 친해지는 성격도 아니고 은근히 내성적이기 때문에 약간 새로운 환경을 두려워하기도 한다.무튼 그러나 회사는 회사기 때문에 최대한 빠&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;velog.io&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>Develope</category>
      <category>epub</category>
      <category>Express</category>
      <category>graphQL</category>
      <category>Next</category>
      <category>REACT</category>
      <category>ridi</category>
      <category>viewer</category>
      <category>리디</category>
      <author>어면태</author>
      <guid isPermaLink="true">https://eomtttttt-develop.tistory.com/247</guid>
      <comments>https://eomtttttt-develop.tistory.com/247#entry247comment</comments>
      <pubDate>Tue, 14 Apr 2020 16:02:58 +0900</pubDate>
    </item>
    <item>
      <title>[GraphQL] API를 통해서 영화 정보 가져오기</title>
      <link>https://eomtttttt-develop.tistory.com/246</link>
      <description>&lt;h1&gt;&lt;a href=&quot;https://velog.io/@eomttt/GraphQL-%EB%A1%9C-%EC%98%81%ED%99%94-%EC%A0%95%EB%B3%B4-%EA%B0%80%EC%A0%B8%EC%98%A4%EA%B8%B0&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;GraphQL 로 영화 정보 가져오기&lt;/a&gt;&lt;/h1&gt;
&lt;figure id=&quot;og_1583560910321&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;GraphQL 로 영화 정보 가져오기&quot; data-og-description=&quot;지난 번에 AWS Lambda를 이용하여 간단한 API 만들기 포스팅을 했었는데 이를 바탕으로 GraphQL를 이용하여 각 API 불러서 서비스를 완성해 보겠습니다. &amp;gt; - AWS Lambda를 이용한 API 개발 원래는 GraphQL 프로젝트 자체를 AWS Lam&quot; data-og-host=&quot;velog.io&quot; data-og-source-url=&quot;https://velog.io/@eomttt/GraphQL-%EB%A1%9C-%EC%98%81%ED%99%94-%EC%A0%95%EB%B3%B4-%EA%B0%80%EC%A0%B8%EC%98%A4%EA%B8%B0&quot; data-og-url=&quot;https://velog.io/@eomttt/GraphQL-로-영화-정보-가져오기&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/cHwzaQ/hyFbYgRypU/KOH8E0PesUITZ3YJbTfTrK/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/qAsJ1/hyFbSnqJPZ/BeZW73KiT1A3Eniezkjg1K/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/htt3X/hyFbPxsRKl/nKp7MmJ7dD6oIHKLAKcMLk/img.png?width=1024&amp;amp;height=881&amp;amp;face=0_0_1024_881&quot;&gt;&lt;a href=&quot;https://velog.io/@eomttt/GraphQL-%EB%A1%9C-%EC%98%81%ED%99%94-%EC%A0%95%EB%B3%B4-%EA%B0%80%EC%A0%B8%EC%98%A4%EA%B8%B0&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://velog.io/@eomttt/GraphQL-%EB%A1%9C-%EC%98%81%ED%99%94-%EC%A0%95%EB%B3%B4-%EA%B0%80%EC%A0%B8%EC%98%A4%EA%B8%B0&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/cHwzaQ/hyFbYgRypU/KOH8E0PesUITZ3YJbTfTrK/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/qAsJ1/hyFbSnqJPZ/BeZW73KiT1A3Eniezkjg1K/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/htt3X/hyFbPxsRKl/nKp7MmJ7dD6oIHKLAKcMLk/img.png?width=1024&amp;amp;height=881&amp;amp;face=0_0_1024_881');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;GraphQL 로 영화 정보 가져오기&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;지난 번에 AWS Lambda를 이용하여 간단한 API 만들기 포스팅을 했었는데 이를 바탕으로 GraphQL를 이용하여 각 API 불러서 서비스를 완성해 보겠습니다. &amp;gt; - AWS Lambda를 이용한 API 개발 원래는 GraphQL 프로젝트 자체를 AWS Lam&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;velog.io&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>GraphQL</category>
      <category>development</category>
      <category>graphQL</category>
      <category>JavaScript</category>
      <category>nodejs</category>
      <category>REACT</category>
      <category>velog</category>
      <author>어면태</author>
      <guid isPermaLink="true">https://eomtttttt-develop.tistory.com/246</guid>
      <comments>https://eomtttttt-develop.tistory.com/246#entry246comment</comments>
      <pubDate>Sat, 7 Mar 2020 15:02:34 +0900</pubDate>
    </item>
    <item>
      <title>[JavaScript] The Observers</title>
      <link>https://eomtttttt-develop.tistory.com/245</link>
      <description>&lt;p&gt;&lt;a href=&quot;https://velog.io/@eomttt/JavaScript-Observers&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;JavaScript: The Observers&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1583457213810&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;JavaScript: Observers&quot; data-og-description=&quot;의존성 패키지 없이도 자바스크립트 기본 내장 옵저버를 소개한 글이 있어서 가져와봤습니다.JS: The Observers이 글에서 소개하고 있는 옵저버는 총 5지인데요.IntersercionObserver: 루트 영역(뷰포트) 와 대상 객체의 겹침을 감시ResizeObs&quot; data-og-host=&quot;velog.io&quot; data-og-source-url=&quot;https://velog.io/@eomttt/JavaScript-Observers&quot; data-og-url=&quot;https://velog.io/@eomttt/JavaScript-Observers&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/bpAa9X/hyFaxc8UZ6/u4xjdL6D48WErDYbTVAo71/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498,https://scrap.kakaocdn.net/dn/bLrrQ6/hyFaDLdTbn/01Vvz15cMkYcRW1KFvnGL1/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498,https://scrap.kakaocdn.net/dn/bFA1kF/hyFasXd2qF/FkcKi0EJj7a30RNObuNVmk/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498&quot;&gt;&lt;a href=&quot;https://velog.io/@eomttt/JavaScript-Observers&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://velog.io/@eomttt/JavaScript-Observers&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/bpAa9X/hyFaxc8UZ6/u4xjdL6D48WErDYbTVAo71/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498,https://scrap.kakaocdn.net/dn/bLrrQ6/hyFaDLdTbn/01Vvz15cMkYcRW1KFvnGL1/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498,https://scrap.kakaocdn.net/dn/bFA1kF/hyFasXd2qF/FkcKi0EJj7a30RNObuNVmk/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;JavaScript: Observers&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;의존성 패키지 없이도 자바스크립트 기본 내장 옵저버를 소개한 글이 있어서 가져와봤습니다.JS: The Observers이 글에서 소개하고 있는 옵저버는 총 5지인데요.IntersercionObserver: 루트 영역(뷰포트) 와 대상 객체의 겹침을 감시ResizeObs&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;velog.io&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>JavaScript</category>
      <category>development</category>
      <category>frontend</category>
      <category>JavaScript</category>
      <category>observers</category>
      <category>개발</category>
      <category>개발자</category>
      <category>자바스크립트</category>
      <author>어면태</author>
      <guid isPermaLink="true">https://eomtttttt-develop.tistory.com/245</guid>
      <comments>https://eomtttttt-develop.tistory.com/245#entry245comment</comments>
      <pubDate>Fri, 6 Mar 2020 10:13:56 +0900</pubDate>
    </item>
    <item>
      <title>AWS Lambda 로 가벼운 API 만들기</title>
      <link>https://eomtttttt-develop.tistory.com/244</link>
      <description>&lt;p&gt;&lt;a href=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-1&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;AWS Lambda 로 가벼운 API 만들기 - 1&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1583311387937&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;AWS Lambda 로 가벼운 API 만들기 - 1&quot; data-og-description=&quot;이번 포스팅은 간단한 node 프로젝트를 AWS Lambda로 실행 한 뒤, 가벼운 API 가 되도록 만들어 보겠습니다.사실 현재 영화정보를 가져오는 간단한 토이프로젝트를 진행 중인데 사용 스펙은 다음과 같습니다.Node JS \- puppeteer \- graph&quot; data-og-host=&quot;velog.io&quot; data-og-source-url=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-1&quot; data-og-url=&quot;https://velog.io/@eomttt/AWS-Lambda-로-가벼운-API-만들기-1&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/upwtZ/hyFaGTYUx5/ngOl1KoTXXrd9Appjfjk4k/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/bVGUYr/hyFaustLys/nrndwpl8341OakukxLu4s0/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/gdupq/hyFaEPowkq/Y5vuvQ2GV8b2kaQjqF9g0k/img.png?width=1024&amp;amp;height=434&amp;amp;face=0_0_1024_434&quot;&gt;&lt;a href=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-1&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-1&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/upwtZ/hyFaGTYUx5/ngOl1KoTXXrd9Appjfjk4k/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/bVGUYr/hyFaustLys/nrndwpl8341OakukxLu4s0/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/gdupq/hyFaEPowkq/Y5vuvQ2GV8b2kaQjqF9g0k/img.png?width=1024&amp;amp;height=434&amp;amp;face=0_0_1024_434');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;AWS Lambda 로 가벼운 API 만들기 - 1&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;이번 포스팅은 간단한 node 프로젝트를 AWS Lambda로 실행 한 뒤, 가벼운 API 가 되도록 만들어 보겠습니다.사실 현재 영화정보를 가져오는 간단한 토이프로젝트를 진행 중인데 사용 스펙은 다음과 같습니다.Node JS \- puppeteer \- graph&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;velog.io&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&lt;a href=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-2&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;AWS Lambda 로 가벼운 API 만들기 - 2&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1583311376878&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;AWS Lambda 로 가벼운 API 만들기 - 2&quot; data-og-description=&quot;지난 포스팅에 이어서 계속해서 작성해보겠습니다.AWS Lambda로 가벼운 API 만들기 - 1위 포스팅에서 test 오브젝트를 만들고 이를 바탕으로 Lambda 함수를 실행시키고 log 까지 확인을 해보았습니다.그러면 이를 사용하기 위한 외부 접근이 가능한 API를&quot; data-og-host=&quot;velog.io&quot; data-og-source-url=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-2&quot; data-og-url=&quot;https://velog.io/@eomttt/AWS-Lambda-로-가벼운-API-만들기-2&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/dD2lpA/hyE9pfgw7r/tL0jkbjqIJWASCeJ5vAR0K/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/cHWYho/hyFaGsT2Fm/YkkudEjRi5hbvpYH1nmLe1/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/Uf1NK/hyE89Q0OzC/w3LkODiMU9XTgiMEfD42B1/img.png?width=805&amp;amp;height=872&amp;amp;face=0_0_805_872&quot;&gt;&lt;a href=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-2&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-2&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/dD2lpA/hyE9pfgw7r/tL0jkbjqIJWASCeJ5vAR0K/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/cHWYho/hyFaGsT2Fm/YkkudEjRi5hbvpYH1nmLe1/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/Uf1NK/hyE89Q0OzC/w3LkODiMU9XTgiMEfD42B1/img.png?width=805&amp;amp;height=872&amp;amp;face=0_0_805_872');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;AWS Lambda 로 가벼운 API 만들기 - 2&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;지난 포스팅에 이어서 계속해서 작성해보겠습니다.AWS Lambda로 가벼운 API 만들기 - 1위 포스팅에서 test 오브젝트를 만들고 이를 바탕으로 Lambda 함수를 실행시키고 log 까지 확인을 해보았습니다.그러면 이를 사용하기 위한 외부 접근이 가능한 API를&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;velog.io&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&lt;a href=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-3&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;AWS Lambda 로 가벼운 API 만들기 - 3&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1583311365574&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;AWS Lambda 로 가벼운 API 만들기 - 3&quot; data-og-description=&quot;node 프로젝트를 바탕으로 가벼운 (하지만 가볍지는 않은) API 를 만들고 있습니다.AWS Lambda 로 가벼운 API 만들기 - 1AWS Lambda 로 가벼운 API 만들기 - 2앞서 2가지 시리즈는 Lambda내에 함수 코드를 통하여 테스트를 진행했었는데 이&quot; data-og-host=&quot;velog.io&quot; data-og-source-url=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-3&quot; data-og-url=&quot;https://velog.io/@eomttt/AWS-Lambda-로-가벼운-API-만들기-3&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/b6PLO7/hyFaxCJqp3/2rL1FlHefPH9rnzYrV3Hdk/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/GiJvT/hyFazAxQZx/wzIVDedqZttEk52WoEWks0/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/bPdUDa/hyFasuE5ku/P8r7v9VBhBTYFLwC5Ihgqk/img.png?width=1024&amp;amp;height=524&amp;amp;face=0_0_1024_524&quot;&gt;&lt;a href=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-3&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://velog.io/@eomttt/AWS-Lambda-%EB%A1%9C-%EA%B0%80%EB%B2%BC%EC%9A%B4-API-%EB%A7%8C%EB%93%A4%EA%B8%B0-3&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/b6PLO7/hyFaxCJqp3/2rL1FlHefPH9rnzYrV3Hdk/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/GiJvT/hyFazAxQZx/wzIVDedqZttEk52WoEWks0/img.png?width=534&amp;amp;height=422&amp;amp;face=0_0_534_422,https://scrap.kakaocdn.net/dn/bPdUDa/hyFasuE5ku/P8r7v9VBhBTYFLwC5Ihgqk/img.png?width=1024&amp;amp;height=524&amp;amp;face=0_0_1024_524');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;AWS Lambda 로 가벼운 API 만들기 - 3&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;node 프로젝트를 바탕으로 가벼운 (하지만 가볍지는 않은) API 를 만들고 있습니다.AWS Lambda 로 가벼운 API 만들기 - 1AWS Lambda 로 가벼운 API 만들기 - 2앞서 2가지 시리즈는 Lambda내에 함수 코드를 통하여 테스트를 진행했었는데 이&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;velog.io&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>Node JS</category>
      <category>API</category>
      <category>apigateway</category>
      <category>aws</category>
      <category>development</category>
      <category>gateway</category>
      <category>JavaScript</category>
      <category>lambda</category>
      <category>Node</category>
      <category>nodejs</category>
      <author>어면태</author>
      <guid isPermaLink="true">https://eomtttttt-develop.tistory.com/244</guid>
      <comments>https://eomtttttt-develop.tistory.com/244#entry244comment</comments>
      <pubDate>Wed, 4 Mar 2020 17:43:42 +0900</pubDate>
    </item>
    <item>
      <title>[JavaScript] for...in, for...of 차이</title>
      <link>https://eomtttttt-develop.tistory.com/243</link>
      <description>&lt;p&gt;&lt;a href=&quot;https://velog.io/@eomttt/for-...in-for-...of-%EC%B0%A8%EC%9D%B4&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;for...in,&amp;nbsp;for...of&amp;nbsp;차이&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1583200323761&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;for ...in, for ...of 차이&quot; data-og-description=&quot;자주 헷갈리는게 있어서 한번 포스팅해봅니다.바로 반복문 중에 ES6 부터 추가 된for ...infor ...of입니다.둘다 반복문으로 사용 되는데요 하나는 객체를 탐색하고 나머지 하나는 배열 요소를 탐색합니다.위처럼 객체의 프로퍼티가 나오는것을 확인해 볼 수 있습니다&quot; data-og-host=&quot;velog.io&quot; data-og-source-url=&quot;https://velog.io/@eomttt/for-...in-for-...of-%EC%B0%A8%EC%9D%B4&quot; data-og-url=&quot;https://velog.io/@eomttt/for-...in-for-...of-차이&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/blWrcV/hyE9cexjHJ/XVDPkH2K39F3cb70jkepo1/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498,https://scrap.kakaocdn.net/dn/cstvde/hyE89ozKJk/dX8KKO1dZi4ChYaKwzMRu1/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498,https://scrap.kakaocdn.net/dn/bjEBQU/hyE7MV4fU4/vzk7mpLvPTWlzIwHwtKQFk/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498&quot;&gt;&lt;a href=&quot;https://velog.io/@eomttt/for-...in-for-...of-차이&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://velog.io/@eomttt/for-...in-for-...of-%EC%B0%A8%EC%9D%B4&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/blWrcV/hyE9cexjHJ/XVDPkH2K39F3cb70jkepo1/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498,https://scrap.kakaocdn.net/dn/cstvde/hyE89ozKJk/dX8KKO1dZi4ChYaKwzMRu1/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498,https://scrap.kakaocdn.net/dn/bjEBQU/hyE7MV4fU4/vzk7mpLvPTWlzIwHwtKQFk/img.png?width=748&amp;amp;height=498&amp;amp;face=0_0_748_498');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;for ...in, for ...of 차이&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;자주 헷갈리는게 있어서 한번 포스팅해봅니다.바로 반복문 중에 ES6 부터 추가 된for ...infor ...of입니다.둘다 반복문으로 사용 되는데요 하나는 객체를 탐색하고 나머지 하나는 배열 요소를 탐색합니다.위처럼 객체의 프로퍼티가 나오는것을 확인해 볼 수 있습니다&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;velog.io&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>JavaScript</category>
      <category>ES6</category>
      <category>FOR</category>
      <category>JavaScript</category>
      <category>js</category>
      <category>반목문</category>
      <author>어면태</author>
      <guid isPermaLink="true">https://eomtttttt-develop.tistory.com/243</guid>
      <comments>https://eomtttttt-develop.tistory.com/243#entry243comment</comments>
      <pubDate>Tue, 3 Mar 2020 10:52:28 +0900</pubDate>
    </item>
    <item>
      <title>[JavaScript] 무한 스크롤링 사용</title>
      <link>https://eomtttttt-develop.tistory.com/241</link>
      <description>&lt;p&gt;&lt;a href=&quot;https://velog.io/@eomttt/%EB%AC%B4%ED%95%9C-%EC%8A%A4%ED%81%AC%EB%A1%A4%EB%A7%81-Interaction-Observer-%ED%8D%BC%EC%98%B4&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;Velog 무한 스크롤링 사용&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1583040389459&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;무한 스크롤링 (Interaction Observer) - 퍼옴&quot; data-og-description=&quot;처음으로 velog에 글을 써보네요. 오늘은 글을 보던 중에 무한스크롤을 구현하는 법이 있어서 가져와봤습니다. 처음 글인데 퍼옴이라서 조금 아쉽긴 한데 그래도 좋은글이고 저장해 놓기 위함이니 제 개인적인 기억을 위함으로서는 좋은 포스팅이지 아닐까 싶습니다. Inter&quot; data-og-host=&quot;velog.io&quot; data-og-source-url=&quot;https://velog.io/@eomttt/%EB%AC%B4%ED%95%9C-%EC%8A%A4%ED%81%AC%EB%A1%A4%EB%A7%81-Interaction-Observer-%ED%8D%BC%EC%98%B4&quot; data-og-url=&quot;https://velog.io/@eomttt/무한-스크롤링-Interaction-Observer-퍼옴&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/blMOmA/hyE6Ag7aZ8/eaxWXav213gC9rk37Df83k/img.png?width=511&amp;amp;height=270&amp;amp;face=0_0_511_270,https://scrap.kakaocdn.net/dn/iYdIn/hyE7R2zAjb/HlsjMMRxJG4kQmskzOoPy0/img.png?width=511&amp;amp;height=270&amp;amp;face=0_0_511_270,https://scrap.kakaocdn.net/dn/e1HFJ/hyE7VcQmPF/A1QLRyGv1wLN2oLAoEgKm1/img.png?width=511&amp;amp;height=270&amp;amp;face=0_0_511_270&quot;&gt;&lt;a href=&quot;https://velog.io/@eomttt/무한-스크롤링-Interaction-Observer-퍼옴&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://velog.io/@eomttt/%EB%AC%B4%ED%95%9C-%EC%8A%A4%ED%81%AC%EB%A1%A4%EB%A7%81-Interaction-Observer-%ED%8D%BC%EC%98%B4&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/blMOmA/hyE6Ag7aZ8/eaxWXav213gC9rk37Df83k/img.png?width=511&amp;amp;height=270&amp;amp;face=0_0_511_270,https://scrap.kakaocdn.net/dn/iYdIn/hyE7R2zAjb/HlsjMMRxJG4kQmskzOoPy0/img.png?width=511&amp;amp;height=270&amp;amp;face=0_0_511_270,https://scrap.kakaocdn.net/dn/e1HFJ/hyE7VcQmPF/A1QLRyGv1wLN2oLAoEgKm1/img.png?width=511&amp;amp;height=270&amp;amp;face=0_0_511_270');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;무한 스크롤링 (Interaction Observer) - 퍼옴&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;처음으로 velog에 글을 써보네요. 오늘은 글을 보던 중에 무한스크롤을 구현하는 법이 있어서 가져와봤습니다. 처음 글인데 퍼옴이라서 조금 아쉽긴 한데 그래도 좋은글이고 저장해 놓기 위함이니 제 개인적인 기억을 위함으로서는 좋은 포스팅이지 아닐까 싶습니다. Inter&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;velog.io&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;</description>
      <category>JavaScript</category>
      <category>development</category>
      <category>infinitescroll</category>
      <category>interaction observer</category>
      <category>JavaScript</category>
      <category>REACT</category>
      <category>velog</category>
      <category>무한스크롤</category>
      <author>어면태</author>
      <guid isPermaLink="true">https://eomtttttt-develop.tistory.com/241</guid>
      <comments>https://eomtttttt-develop.tistory.com/241#entry241comment</comments>
      <pubDate>Sun, 1 Mar 2020 14:27:17 +0900</pubDate>
    </item>
    <item>
      <title>[공지] 블로그 이전</title>
      <link>https://eomtttttt-develop.tistory.com/240</link>
      <description>&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;이제 블로그 내용을 티스토리가 아닌 velog에 집중적으로 쓰려고 합니다.&lt;/p&gt;
&lt;p&gt;그렇다고 티스토리를 아얘 쓰진 않겠다는건 아니고,&lt;/p&gt;
&lt;p&gt;velog에서 글을 작성 후 링크만 올려놓는 형식으로 관리하려고 합니다.&lt;/p&gt;
&lt;p&gt;이유는 조금 더 개발적인 블로그로 변화하기 위함입니다.&lt;/p&gt;
&lt;p&gt;그렇기 때문에 그외에 영화나, 웨딩, 데일리, 저의 생각 개발 외적인 경우는 계속해서 티스토리에 글을 남겨볼까 합니다.&lt;/p&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;저의 개인적인 생각 입니다 ㅎㅎ&lt;/p&gt;
&lt;p&gt;&lt;a href=&quot;https://velog.io/@eomttt&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;&amp;nbsp;Velog @eomttt&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1583040271969&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;website&quot; data-og-title=&quot;eomttt (엄현태) - velog&quot; data-og-description=&quot;Velog 처음 접하기 Velog에 몇몇 글을 눈팅만 하다가 나도 한번 velog에 글을 남겨 봐야겠다는 생각을 하게 되었습니다.기존에 '티스토리'에 글을 많이 남기고 있었는데, 요즘 추세가 티스토리에는 글을 잘 안남기는것 같더라고요.그래서 저도 블로그을 옮겨 볼까 했었는데, 그동안 써왔던 약 1시간 전 &amp;middot; 0개의 댓글&quot; data-og-host=&quot;velog.io&quot; data-og-source-url=&quot;https://velog.io/@eomttt&quot; data-og-url=&quot;https://velog.io/@eomttt&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/bC6y8m/hyE7TF5uxm/PSb6nhBOhNbl5fqCLSgY1K/img.png?width=950&amp;amp;height=500&amp;amp;face=0_0_950_500,https://scrap.kakaocdn.net/dn/crkdxp/hyE7T69Q1r/SS57MJ29Vm1kWdaMXB23O1/img.png?width=768&amp;amp;height=283&amp;amp;face=0_0_768_283,https://scrap.kakaocdn.net/dn/bl5PJc/hyE6weFHYf/DHRjsgtfMunJyt830O63Bk/img.png?width=511&amp;amp;height=270&amp;amp;face=0_0_511_270&quot;&gt;&lt;a href=&quot;https://velog.io/@eomttt&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://velog.io/@eomttt&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/bC6y8m/hyE7TF5uxm/PSb6nhBOhNbl5fqCLSgY1K/img.png?width=950&amp;amp;height=500&amp;amp;face=0_0_950_500,https://scrap.kakaocdn.net/dn/crkdxp/hyE7T69Q1r/SS57MJ29Vm1kWdaMXB23O1/img.png?width=768&amp;amp;height=283&amp;amp;face=0_0_768_283,https://scrap.kakaocdn.net/dn/bl5PJc/hyE6weFHYf/DHRjsgtfMunJyt830O63Bk/img.png?width=511&amp;amp;height=270&amp;amp;face=0_0_511_270');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;eomttt (엄현태) - velog&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;Velog 처음 접하기 Velog에 몇몇 글을 눈팅만 하다가 나도 한번 velog에 글을 남겨 봐야겠다는 생각을 하게 되었습니다.기존에 '티스토리'에 글을 많이 남기고 있었는데, 요즘 추세가 티스토리에는 글을 잘 안남기는것 같더라고요.그래서 저도 블로그을 옮겨 볼까 했었는데, 그동안 써왔던 약 1시간 전 &amp;middot; 0개의 댓글&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;velog.io&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;velog도 많이 찾아주세요~~&lt;/p&gt;</description>
      <category>Daily</category>
      <category>velog</category>
      <category>나만공지</category>
      <category>나만의 공지</category>
      <category>블로그이전</category>
      <category>아무도안보는 공지</category>
      <author>어면태</author>
      <guid isPermaLink="true">https://eomtttttt-develop.tistory.com/240</guid>
      <comments>https://eomtttttt-develop.tistory.com/240#entry240comment</comments>
      <pubDate>Sun, 1 Mar 2020 14:25:18 +0900</pubDate>
    </item>
    <item>
      <title>[GraphQL] GraphQL 시작하기 - 5 (Api 연결)</title>
      <link>https://eomtttttt-develop.tistory.com/239</link>
      <description>&lt;p&gt;그래프 큐엘에 대한 강의를 듣고 실제 코딩 후 기록을 위해 블로그에 남기고 있는데요.&lt;/p&gt;
&lt;p&gt;&lt;a href=&quot;https://eomtttttt-develop.tistory.com/225&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;Graph QL - 1&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1582943250980&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;[GraphQL] GraphQL 시작하기&quot; data-og-description=&quot;2020년에는 새로운 것을 시작하기로 마음을 먹었었는데 그동안 아버지 홈페이지 리뉴얼 작업으로 인하여 React + MobX + Styled-Component + Firebase + AWS로 프로젝트를 구성하고 끝내느라 시작하지 못하였습니..&quot; data-og-host=&quot;eomtttttt-develop.tistory.com&quot; data-og-source-url=&quot;https://eomtttttt-develop.tistory.com/225&quot; data-og-url=&quot;https://eomtttttt-develop.tistory.com/225&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/s1DqG/hyE6vsA8ql/XpyjAdRAUS0K5ROmSYg3k0/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/jDt4v/hyE6FaUaea/6AtKgr5uFAPOdpHntIlbKk/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/sMZW5/hyE6yCQLso/KK5qDJSzIAkTs95qvkjCmK/img.jpg?width=846&amp;amp;height=692&amp;amp;face=0_0_846_692&quot;&gt;&lt;a href=&quot;https://eomtttttt-develop.tistory.com/225&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://eomtttttt-develop.tistory.com/225&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/s1DqG/hyE6vsA8ql/XpyjAdRAUS0K5ROmSYg3k0/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/jDt4v/hyE6FaUaea/6AtKgr5uFAPOdpHntIlbKk/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/sMZW5/hyE6yCQLso/KK5qDJSzIAkTs95qvkjCmK/img.jpg?width=846&amp;amp;height=692&amp;amp;face=0_0_846_692');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;[GraphQL] GraphQL 시작하기&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;2020년에는 새로운 것을 시작하기로 마음을 먹었었는데 그동안 아버지 홈페이지 리뉴얼 작업으로 인하여 React + MobX + Styled-Component + Firebase + AWS로 프로젝트를 구성하고 끝내느라 시작하지 못하였습니..&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;eomtttttt-develop.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&lt;a href=&quot;https://eomtttttt-develop.tistory.com/226&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;Graph QL - 2&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1582943230399&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;[GraphQL] GraphQL 시작하기 - 2 (Query with parameter)&quot; data-og-description=&quot;요즘 그래프 큐엘로 서버를 구축하고 있고 공부 중인데, 지난번에는 Query와 기본적인 개념에 대하여 포스팅했었습니다. 이번에는 복습 차원에서 parameter를 가진 Query를 만들 때에 어떻게 해주는지 포스팅해보..&quot; data-og-host=&quot;eomtttttt-develop.tistory.com&quot; data-og-source-url=&quot;https://eomtttttt-develop.tistory.com/226&quot; data-og-url=&quot;https://eomtttttt-develop.tistory.com/226&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/dreuVu/hyE6HmfMuQ/d0ng2wkMUGi8CfhsCsDnT1/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/iq1ws/hyE6zuZz93/Y1cPW4kNuqQNSrC14TCJC1/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/h50Rw/hyE6yJBIub/7LBfAcI0hN2k2KExpzgPIk/img.png?width=2014&amp;amp;height=1036&amp;amp;face=0_0_2014_1036&quot;&gt;&lt;a href=&quot;https://eomtttttt-develop.tistory.com/226&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://eomtttttt-develop.tistory.com/226&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/dreuVu/hyE6HmfMuQ/d0ng2wkMUGi8CfhsCsDnT1/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/iq1ws/hyE6zuZz93/Y1cPW4kNuqQNSrC14TCJC1/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/h50Rw/hyE6yJBIub/7LBfAcI0hN2k2KExpzgPIk/img.png?width=2014&amp;amp;height=1036&amp;amp;face=0_0_2014_1036');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;[GraphQL] GraphQL 시작하기 - 2 (Query with parameter)&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;요즘 그래프 큐엘로 서버를 구축하고 있고 공부 중인데, 지난번에는 Query와 기본적인 개념에 대하여 포스팅했었습니다. 이번에는 복습 차원에서 parameter를 가진 Query를 만들 때에 어떻게 해주는지 포스팅해보..&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;eomtttttt-develop.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&lt;a href=&quot;https://eomtttttt-develop.tistory.com/228&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;Graph QL - 3&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1582943211531&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;[GraphQL] GraphQL 시작하기 - 3 (Mutation)&quot; data-og-description=&quot;안녕하세요. 오늘은 GraphQL 에서 데이터를 Create 할 수 있는 Mutation 에 대하여 포스팅 해보겠습니다. 기존에는 Query를 통하여 데이터를 가져오는 방법을 했었는데, 전체 데이터를 가져오기도 하고 Parameter..&quot; data-og-host=&quot;eomtttttt-develop.tistory.com&quot; data-og-source-url=&quot;https://eomtttttt-develop.tistory.com/228&quot; data-og-url=&quot;https://eomtttttt-develop.tistory.com/228&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/bkhpzR/hyE6uArZCN/mTMrEZWmQiLgESMRDuZT40/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/nGq7y/hyE6y3VnQe/ulWgVJk1borUGSxomVnkd0/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/c1Bzo9/hyE6u8h3BV/QksSzChwmVVnKWHkv8kua1/img.jpg?width=846&amp;amp;height=692&amp;amp;face=0_0_846_692&quot;&gt;&lt;a href=&quot;https://eomtttttt-develop.tistory.com/228&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://eomtttttt-develop.tistory.com/228&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/bkhpzR/hyE6uArZCN/mTMrEZWmQiLgESMRDuZT40/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/nGq7y/hyE6y3VnQe/ulWgVJk1borUGSxomVnkd0/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/c1Bzo9/hyE6u8h3BV/QksSzChwmVVnKWHkv8kua1/img.jpg?width=846&amp;amp;height=692&amp;amp;face=0_0_846_692');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;[GraphQL] GraphQL 시작하기 - 3 (Mutation)&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;안녕하세요. 오늘은 GraphQL 에서 데이터를 Create 할 수 있는 Mutation 에 대하여 포스팅 해보겠습니다. 기존에는 Query를 통하여 데이터를 가져오는 방법을 했었는데, 전체 데이터를 가져오기도 하고 Parameter..&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;eomtttttt-develop.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&lt;a href=&quot;https://eomtttttt-develop.tistory.com/229&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot;&gt;Graph QL - 4&lt;/a&gt;&lt;/p&gt;
&lt;figure id=&quot;og_1582943194189&quot; contenteditable=&quot;false&quot; data-ke-type=&quot;opengraph&quot; data-og-type=&quot;article&quot; data-og-title=&quot;[GraphQL] GraphQL 시작하기 - 4 (Mutation - delete)&quot; data-og-description=&quot;안녕하세요. 지난 번에는 Mutation을 이용하여 Add 하는 법을 포스팅 했었죠. CRUD에서 Create부분 이죠. GraphQL - Mutation (Add) [GraphQL] GraphQL 시작하기 - 3 (Mutation) 안녕하세요. 오늘은 GraphQL 에서..&quot; data-og-host=&quot;eomtttttt-develop.tistory.com&quot; data-og-source-url=&quot;https://eomtttttt-develop.tistory.com/229&quot; data-og-url=&quot;https://eomtttttt-develop.tistory.com/229&quot; data-og-image=&quot;https://scrap.kakaocdn.net/dn/6fU3a/hyE6Hs0eNi/NNvYvPKpjCAWFVn1uOhKfK/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/kpsGX/hyE6GHDoRH/okUbnR1ypTCj3XpfRilvqK/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/iGGSJ/hyE6the3XB/Exxq6ZAVPMDEPw5He2KtLk/img.png?width=2458&amp;amp;height=1310&amp;amp;face=0_0_2458_1310&quot;&gt;&lt;a href=&quot;https://eomtttttt-develop.tistory.com/229&quot; target=&quot;_blank&quot; rel=&quot;noopener&quot; data-source-url=&quot;https://eomtttttt-develop.tistory.com/229&quot;&gt;
&lt;div class=&quot;og-image&quot; style=&quot;background-image: url('https://scrap.kakaocdn.net/dn/6fU3a/hyE6Hs0eNi/NNvYvPKpjCAWFVn1uOhKfK/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/kpsGX/hyE6GHDoRH/okUbnR1ypTCj3XpfRilvqK/img.png?width=610&amp;amp;height=450&amp;amp;face=0_0_610_450,https://scrap.kakaocdn.net/dn/iGGSJ/hyE6the3XB/Exxq6ZAVPMDEPw5He2KtLk/img.png?width=2458&amp;amp;height=1310&amp;amp;face=0_0_2458_1310');&quot;&gt;&amp;nbsp;&lt;/div&gt;
&lt;div class=&quot;og-text&quot;&gt;
&lt;p class=&quot;og-title&quot;&gt;[GraphQL] GraphQL 시작하기 - 4 (Mutation - delete)&lt;/p&gt;
&lt;p class=&quot;og-desc&quot;&gt;안녕하세요. 지난 번에는 Mutation을 이용하여 Add 하는 법을 포스팅 했었죠. CRUD에서 Create부분 이죠. GraphQL - Mutation (Add) [GraphQL] GraphQL 시작하기 - 3 (Mutation) 안녕하세요. 오늘은 GraphQL 에서..&lt;/p&gt;
&lt;p class=&quot;og-host&quot;&gt;eomtttttt-develop.tistory.com&lt;/p&gt;
&lt;/div&gt;
&lt;/a&gt;&lt;/figure&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;이렇게 1 ~ 4 까지 진행해보았고 기본적인 Query, Mutaion, resolvers, scheme 등에 대하여 포스팅 해봤습니다.&lt;/p&gt;
&lt;p&gt;오늘은 마지막 시리즈로 실제 API 에 연결해보겠습니다.&lt;/p&gt;
&lt;p&gt;제가 사용할 API 는 영화 정보를 가져오는&amp;nbsp; API인데요.&lt;/p&gt;
&lt;blockquote data-ke-style=&quot;style3&quot;&gt;&lt;span&gt;- https&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt;//yts-proxy.now.sh/list_movies.json&lt;br /&gt;&lt;/span&gt;&lt;span&gt;- https&lt;/span&gt;&lt;span&gt;:&lt;/span&gt;&lt;span&gt;//yts-proxy.now.sh/movie_details.json?movie_id={}&lt;/span&gt;&lt;/blockquote&gt;
&lt;p&gt;영화 리스트를 가져오는 API와 영화 상세 정보를 가져오는 API 두가지를 사용해 보겠습니다.&lt;/p&gt;
&lt;p&gt;먼저 스키마 부터 정의해보겠습니다.&lt;/p&gt;
&lt;p&gt;&lt;b&gt;graphql.scheme&lt;/b&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1582943455209&quot; class=&quot;javascript&quot; data-ke-language=&quot;javascript&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;type Query {
  people: [Person]!
  person(id: String!): Person!
  movies(limit: Int, rating: Float): [Movie]!
  movie(id: Int!): Movie!
}

type Mutation {
  addPerson(name: String!, age: Int!, gender: String!): Person!
  deletePerson(id: String!): Boolean!
}

type Person {
  id: String!
  name: String!
  age: Int!
  gender: String!
}

type Movie {
  id: Int!
  title: String!
  summary: String!
  rating: Float!
}&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;그 다음 이에 맞는 resolvers를 구현해보겠습니다.&lt;/p&gt;
&lt;p&gt;&lt;b&gt;resolvers.js&lt;/b&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1582943490343&quot; class=&quot;javascript&quot; data-ke-language=&quot;javascript&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;const { getPeople, getPerson, addPerson, deletePerson } = require('../dummy/people');
const { getMovies, getMovie } = require('../controller/test-movie.controller');

const resolvers = {
    Query: {
        people: () =&amp;gt; getPeople(),
        person: (_parent, { id }) =&amp;gt; getPerson(id),
        movies: (_parent, { limit, rating }) =&amp;gt; getMovies(limit, rating),
        movie: (_parent, { id }) =&amp;gt; getMovie(id),
    },
    Mutation: {
        addPerson: (_parent, { name, age, gender }) =&amp;gt; addPerson(name, age, gender),
        deletePerson: (_parent, { id }) =&amp;gt; deletePerson(id)
    }
}

module.exports.resolvers = resolvers;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;컨트롤러 모듈을 구현해 보겠습니다. 위에서는 test-movie.controller가 되겠죠?&lt;/p&gt;
&lt;p&gt;&lt;b&gt;test-movie.controller.js&lt;/b&gt;&lt;/p&gt;
&lt;pre id=&quot;code_1582943537871&quot; class=&quot;javascript&quot; data-ke-language=&quot;javascript&quot; data-ke-type=&quot;codeblock&quot;&gt;&lt;code&gt;const axios = require('axios');

const BASE_URL = &quot;https://yts-proxy.now.sh/&quot;;
const LIST_MOVIES_URL = `${BASE_URL}list_movies.json`;
const MOVIE_DETAILS_URL = `${BASE_URL}movie_details.json`;
const MOVIE_SUGGESTIONS_URL = `${BASE_URL}movie_suggestions.json`;

const getMovies = async (limit, rating) =&amp;gt; {
  const res = await axios.get(LIST_MOVIES_URL, {
    params: {
      limit,
      minimum_rating: rating,
    }
  });
  const { movies } = res.data.data;

  return movies
};

const getMovie = async (id) =&amp;gt; {
  const res = await axios.get(MOVIE_DETAILS_URL, {
    params: {
      movie_id: id,
    }
  });

  const { movie } = res.data.data;

  return {
    ...movie,
    summary: movie.description_full
  }
};

module.exports.getMovies = getMovies;
module.exports.getMovie = getMovie;&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&amp;nbsp;&lt;/p&gt;
&lt;p&gt;이런식으로 resolvers 에 맞는 함수들을 정의해주고 함수 안에서는 axios 모듈을 이용하여 api 콜을 진행하였습니다.&lt;/p&gt;
&lt;p&gt;&lt;figure class=&quot;imageblock alignCenter&quot; data-filename=&quot;스크린샷 2020-02-29 오전 11.36.31.png&quot; data-origin-width=&quot;2444&quot; data-origin-height=&quot;1174&quot;&gt;&lt;span data-url=&quot;https://blog.kakaocdn.net/dn/NdOTY/btqCl8OFI5S/oqfezp3ZCoLuBFORX7lKlK/img.png&quot; data-phocus=&quot;https://blog.kakaocdn.net/dn/NdOTY/btqCl8OFI5S/oqfezp3ZCoLuBFORX7lKlK/img.png&quot;&gt;&lt;img src=&quot;https://blog.kakaocdn.net/dn/NdOTY/btqCl8OFI5S/oqfezp3ZCoLuBFORX7lKlK/img.png&quot; srcset=&quot;https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&amp;fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FNdOTY%2FbtqCl8OFI5S%2Foqfezp3ZCoLuBFORX7lKlK%2Fimg.png&quot; data-filename=&quot;스크린샷 2020-02-29 오전 11.36.31.png&quot; data-origin-width=&quot;2444&quot; data-origin-height=&quot;1174&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;이런식으로 movies를 가져 올 수 있고 movie 상세를 가져올 수 있게 됩니다.&lt;/p&gt;
&lt;p&gt;여기서 주의할 점은 movie query를 날릴 때에 api 상에서는 summary라는 프로퍼티가 존재하지않습니다.&lt;/p&gt;
&lt;p&gt;따라서 컨트롤러 단에서 movie 에 description_full 을 summary 프로퍼티로 변경 해주어서 query가 원하는 값을 맞춰줘야 제대로 동작하게 됩니다.&lt;/p&gt;
&lt;p&gt;앞으로 저는 제가 실제 api를 만들어 볼 생각인데요. 현재 영화 정보를 가져오는 서비스를 제작 중에 있는데 이를 그래프큐엘로 구성해볼 생각입니다.&lt;/p&gt;
&lt;p&gt;각각의 정보들을 크롤링 할 생각이고 크롤링 한 모듈을 AWS Lambda에 올려서 api를 구성 한 뒤, 서버 쪽을 그래프큐엘로 구현하여 각 API를 콜해 볼 생각입니다. 이러한 방향성을 가지고 그래프큐엘 프로젝트를 진행해 볼 생각인데, 기회가 되면 포스팅도 이어가보도록 하겠습니다.&lt;/p&gt;
&lt;p&gt;정말 쉽고 빠르게 서버를 구축할 수 있는것 같고, REST API 를 구현하기 위한 여러가지 작업들이 많이 생략되어서 조금 더 클라이언트에 맞는 라이브러리? 가 되지 않을까 싶네요.&lt;/p&gt;
&lt;p&gt;조금 더 깊게 써보고 속도나 이런측면도 고민해 봐야겠네요.&lt;/p&gt;</description>
      <category>GraphQL</category>
      <category>develope</category>
      <category>development</category>
      <category>graphQL</category>
      <category>JavaScript</category>
      <category>nodejs</category>
      <category>개발자</category>
      <category>그래프큐엘</category>
      <category>노드</category>
      <category>코딩</category>
      <author>어면태</author>
      <guid isPermaLink="true">https://eomtttttt-develop.tistory.com/239</guid>
      <comments>https://eomtttttt-develop.tistory.com/239#entry239comment</comments>
      <pubDate>Sat, 29 Feb 2020 11:42:04 +0900</pubDate>
    </item>
  </channel>
</rss>