<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
    <channel>
        <title>e_juhee.log</title>
        <link>https://velog.io/</link>
        <description>🍓e-juhee.tistory.com 👈🏻 이사중</description>
        <lastBuildDate>Sat, 10 Jun 2023 15:38:23 GMT</lastBuildDate>
        <docs>https://validator.w3.org/feed/docs/rss2.html</docs>
        <generator>https://github.com/jpmonette/feed</generator>
        <image>
            <title>e_juhee.log</title>
            <url>https://images.velog.io/images/e_juhee/profile/45b0d9c8-4de6-4255-a7ab-414fa2829f0b/social.jpeg</url>
            <link>https://velog.io/</link>
        </image>
        <copyright>Copyright (C) 2019. e_juhee.log. All rights reserved.</copyright>
        <atom:link href="https://v2.velog.io/rss/e_juhee" rel="self" type="application/rss+xml"/>
        <item>
            <title><![CDATA[[Kakao map] 지도]]></title>
            <link>https://velog.io/@e_juhee/Kakao-map-%EC%A7%80%EB%8F%84</link>
            <guid>https://velog.io/@e_juhee/Kakao-map-%EC%A7%80%EB%8F%84</guid>
            <pubDate>Sat, 10 Jun 2023 15:38:23 GMT</pubDate>
            <description><![CDATA[<p>각각의 서비스가 제공해주는 오픈 api가 있다.</p>
<ul>
<li><p><a href="https://developers.naver.com/main/">[네이버 개발자 센터]</a></p>
</li>
<li><p><a href="https://developers.kakao.com/">[Kakao Developers]</a></p>
</li>
<li><p><a href="https://developers.google.com/">[Google Developers]</a></p>
</li>
<li><p><a href="https://developers.facebook.com/?locale=ko_KR">[Facebook for Developers]</a></p>
</li>
</ul>
<blockquote>
<h4 id="지도-api-선택-tip">지도 API 선택 tip</h4>
<p>하루에 API를 무료로 요청할 수 있는 횟수에 제한이 있다.
구글은 횟수 제한이 낮아서 카카오를 더 선호하고, 해외 지도도 필요할 경우에 구글맵을 사용한다.
지도를 보여주는 것뿐만 아니라 다른 기능도 필요할 경우, 제공하는 기능에 따라서 네이버 혹은 카카오를 선택한다.
카카오는 카카오 네비 연동이 가능하다.</p>
</blockquote>
<hr>
<h2 id="kakao-map-이용-방법">Kakao map 이용 방법</h2>
<p><a href="https://apis.map.kakao.com/web/guide/">[kakaomap API guide]</a></p>
<ol>
<li>카카오 개발자사이트 (<a href="https://developers.kakao.com">https://developers.kakao.com</a>) 접속</li>
<li>개발자 등록 및 앱 생성</li>
<li>웹 플랫폼 추가: 앱 선택 – [플랫폼] – [Web 플랫폼 등록] – 사이트 도메인 등록</li>
<li>사이트 도메인 등록: [웹] 플랫폼을 선택하고, [사이트 도메인] 을 등록합니다. (예: <a href="http://localhost:8080">http://localhost:8080</a>)</li>
<li>페이지 상단의 [JavaScript 키]를 지도 API의 appkey로 사용합니다.</li>
<li>앱을 실행합니다.</li>
</ol>
<h4 id="1-내-애플리케이션--애플리케이션-추가하기">1. 내 애플리케이션 &gt; 애플리케이션 추가하기</h4>
<p>다른 서비스에서는 내 앱이라고 적혀있는 경우도 있다.
각 애플리케이션을 프로젝트의 폴더라고 생각하면 된다.</p>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/400c0bd8-d438-4c82-9495-4020b21acb6e/image.png" alt=""></p>
<h4 id="2-생성한-앱-선택--플랫폼-설정하기--web">2. 생성한 앱 선택 &gt; 플랫폼 설정하기 &gt; Web</h4>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/f4adadd3-2e9a-455e-8072-23f1dfe3d577/image.png" alt=""></p>
<p>⭐️배포 시 도메인 변경을 잊지 말자⭐️
<img src="https://velog.velcdn.com/images/e_juhee/post/9e6dd776-f695-4632-8553-152253e75886/image.png" alt=""></p>
<p>등록 완료
<img src="https://velog.velcdn.com/images/e_juhee/post/914adaf0-2136-4abb-baee-aa8b9bee045b/image.png" alt=""></p>
<p>가이드에 나와있는 순서대로 진행하면 된다.</p>
<h4 id="3-내-애플리케이션--생성한-앱-선택--앱-키의-js-키-복사">3. 내 애플리케이션 &gt; 생성한 앱 선택 &gt; 앱 키의 JS 키 복사</h4>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/22556d1b-61a3-4525-872f-be5823c52b8c/image.png" alt=""></p>
<h4 id="4-return에-지도를-추가할-jsx-생성">4. return에 지도를 추가할 jsx 생성</h4>
<pre><code class="language-js">&lt;div id=&quot;map&quot; style={{width:500, height:400}}&gt;&lt;/div&gt;</code></pre>
<h4 id="5-return에-script-추가">5. return에 script 추가</h4>
<p>script 태그를 사용하기 위해 &#39;next/head&#39;의 Head를 import 받아서 그 안에 넣는다.</p>
<p>3에서 복사한 앱 키를 <code>발급받은 APP KEY를 넣으시면 됩니다.</code> 부분에 넣는다.</p>
<pre><code class="language-js">import Head from &#39;next/head&#39;

&lt;Head&gt;
        &lt;script type=&quot;text/javascript&quot; src=&quot;//dapi.kakao.com/v2/maps/sdk.js?appkey=92958565365b230a39d7a23849c34582&quot;&gt;&lt;/script&gt;
&lt;/Head&gt;</code></pre>
<h4 id="6-지도를-띄우는-코드-작성">6. 지도를 띄우는 코드 작성</h4>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/39d6ebcc-dc63-476d-8999-1e937c475986/image.png" alt="">
이 코드를 가져와서 react에서 사용할 수 있게 수정한다.</p>
<p>declare를 추가하고
kakao를 찾을 수 있게 window.kakao로 변경</p>
<pre><code class="language-js">declare const window: typeof globalThis &amp; {
    kakao:any;
}</code></pre>
<pre><code class="language-js">useEffect(() =&gt; {
    // map이 만들어진 이후에 실행
    const container = document.getElementById(&quot;map&quot;); // 지도를 담을 영역의 DOM 레퍼런스
    const options = {
      // 지도를 생성할 때 필요한 기본 옵션
      center: new window.kakao.maps.LatLng(33.450701, 126.570667), // 지도의 중심좌표.
      level: 3, // 지도의 레벨(확대, 축소 정도)
    };

    const map = new window.kakao.maps.Map(container, options); // 지도 생성 및 객체 리턴 : 담아도 되고 안 담아도 된다.
  }, []);</code></pre>
<h4 id="끗">끗!</h4>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/8ed70c4a-8eab-4b7a-8277-e4da8f96cc02/image.png" alt=""></p>
<hr>
<h2 id="routing--routed">routing &amp; routed</h2>
<p>지도가 있는 화면에 엔터를 눌러서 진입할 때와 버튼을 눌러서 진입할 때의 차이</p>
<blockquote>
<p>🚨 Error!
<img src="https://velog.velcdn.com/images/e_juhee/post/977c1e1b-a5c0-4bcf-9354-288fcdbacee0/image.png" alt=""></p>
</blockquote>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/7bc4aba9-2c46-436e-adbe-93d1a0b8ae52/image.png" alt=""></p>
<blockquote>
</blockquote>
<ul>
<li>다른 페이지에서 카카오맵이 있는 링크로 버튼을 눌러서 이동하면 maps를 찾을 수 없다는 오류가 나온다.</li>
<li>a태그로 진입하면 잘 나온다.</li>
<li>카카오맵이 있는 url에서 새로고침을 하면 잘 나온다!</li>
</ul>
<p>Client side Rendering / Single Page Application</p>
<h3 id="multi-page-application">Multi Page Application</h3>
<p>a태그(anchor 태그)로 페이지 이동
브라우저에서 주소를 입력해서 접속하면 프론트엔드 서버에 접속하고 html,css,js를 받아와서 브라우저에 화면이 그려진다.
브라우저에서 a태그를 통해 다른 페이지로 이동하면 마찬가지로 프론트엔드에 접속해서 다른 페이지에 대한 html,css,js를 받아와서 화면이 그려진다.
새로고침을 했을 때도 동일하다.
속도가 느리다는 단점이 있다.</p>
<h3 id="single-page-application">Single Page Application</h3>
<p>react, angular, vue는 Single Page Application이라고 부른다.
Singlt Page Application
브라우저에서 주소를 입력해서 들어오면, 프론트 서버에 접속해서 html, css, js를 받아올 때 한 페이지만 받아오는 것이 아니라
전체 페이지를 다 받아서 온다.
페이지 이동 시 html, css, js를 다시 받아오는 것이 아니라 처음에 받아온 것에서 이동한다.(Client Side Rendering: 서버에 가지 않고, 브라우저에서 화면을 변경)
거대한 한 페이지 안에서 이동한다고 해서 Single Page Application
페이지를 매번 새로 받아오는 과정이 없기 때문에 속도가 매우 빠르다.</p>
<ul>
<li>router는 react에서 제공해주는 페이지 이동으로, Single Page Application에서 Client Side Rendering을 하게 된다.</li>
<li>a태그는 페이지를 새로 다운받아온다.</li>
</ul>
<h3 id="client-side-rendering">Client Side Rendering</h3>
<p>router.push 말고 태그를 클릭해서 이동하는 방법 
(-&gt; 얘도 로드되기 전에 실행되므로 kakao를 찾지 못한다는 에러가 뜬다.)</p>
<pre><code class="language-js">import Link from &#39;next/link&#39;

return(
  &lt;Link href=&quot;/29-03-kakao-map-routed&quot;&gt;
      &lt;a&gt;Link: 맵으로 이동하기&lt;/a&gt;
  &lt;/Link&gt;
  )</code></pre>
<h3 id="routerpush-vs-link"><code>router.push</code> VS <code>&lt;Link&gt;</code></h3>
<p><code>&lt;Link&gt;</code>가 더 좋다!
태그들만의 기능이 있다.
Link 태그는 a 태그로 바뀌어서 움직여야 한다.
a태그를 쓰면 Client Side Rendering이 안된다. 페이지를 새로 다운받아서 준다.
CSR을 원하면 router.push나 Link 태그를 사용해야 한다.</p>
<h4 id="시맨틱-태그">시맨틱 태그</h4>
<p>Link 태그를 사용할 때는 안에 a태그로 감싸준다. 
(가짜 a태그이다. 그럼 왜해? -&gt; 
검색 봇이 다른 사이트를 돌아다니면서 접속해서 html, css, js를 다운로드 받아서 분석을 한다. 어떤 사이트인지 분석을 하는데, 검색봇과 소통을 하는 창구가 태그이다. 눈으로 볼 때는 똑같지만, 검색봇이 볼 때는 h1과 div를 다르게 인식한다. 태그의 의미는 중요하다. css를 활용하면 똑같이 보여줄 수 있지만, 태그로 의미를 부여하는 것이 매우 중요하다.)
a 태그가 붙어있으면 페이지 이동이라는 것을 검색봇이 인식할 수 있다.</p>
<p>router.push는 링크를 사용할 수 없을 때 사용한다. 예를 들면 게시물 작성 후 상세 화면으로 이동할 경우!</p>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/e0ad1ef7-da30-4257-9c6f-85dfd25cc682/image.gif" alt=""></p>
<p>CSR은 처음에만 서버에서 받아오고 그 이후에는 서버에서 받아오지 않는다. 빠르다.
CSR이 아닌 경우에는 매번 서버에서 받아와서 느리다.</p>
<blockquote>
<h4 id="💡-why">💡 Why?</h4>
<p>위 경우에서 script를 받아오기 전에 페이지가 이미 존재하고, useEffect가 실행되어버리기 때문에 kakao를 찾지 못하는 것이다.</p>
</blockquote>
<h4 id="해결-방법-1-script-자체를-미리-다운-받아놓기❌">해결 방법 1. <del>script 자체를 미리 다운 받아놓기</del>❌</h4>
<p><code>_app.tsx</code>에 script를 받는다.
<img src="https://velog.velcdn.com/images/e_juhee/post/90b583ea-8652-41ea-b87c-737ab0e49e44/image.png" alt="">
당연히 좋은 방법은 아니다. 맵을 사용하지 않는 페이지에서도 카카오맵을 다운받기 때문에 비효율적이다.</p>
<h4 id="해결-방법-2-다운로드-받을-때까지-기다리기-👍🏻">해결 방법 2. 다운로드 받을 때까지 기다리기 👍🏻</h4>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/7ffa5e67-6d29-40b1-b822-af065f44e2f0/image.png" alt=""></p>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/51c93c45-3bcd-49dc-b8fc-ef28c3828050/image.png" alt="">
key 뒤에 <code>&amp;autoload=false</code> 추가한다
쿼리스트링: 주소로 객체를 보낼 때
객체의 키가 두개인 형태로 전송된다.</p>
<pre><code class="language-js">import { useEffect } from &quot;react&quot;;

declare const window: typeof globalThis &amp; {
  kakao: any;
};

export default function KakaoMapPage() {
  useEffect(() =&gt; {
    const script = document.createElement(&quot;script&quot;); // &lt;script&gt;&lt;/script&gt;
    script.src =
      &quot;//dapi.kakao.com/v2/maps/sdk.js?appkey=92958565365b230a39d7a23849c34582&amp;autoload=false&quot;; // 카카오맵이 로드되면 실행
    document.head.appendChild(script); // header에 script를 자식으로 추가한다.

    // script가 로드되면 실행
    script.onload = () =&gt; {
       // kakaomap이 로드되면 실행
      window.kakao.maps.load(function () {
        const container = document.getElementById(&quot;map&quot;); 
        const options = {
          center: new window.kakao.maps.LatLng(33.450701, 126.570667), 
          level: 3,
        };
        const map = new window.kakao.maps.Map(container, options);
      });
    };
  }, []);

  return (
    &lt;&gt;
      &lt;div id=&quot;map&quot; style={{ width: 500, height: 400 }}&gt;&lt;/div&gt;
    &lt;/&gt;
  );
}</code></pre>
]]></description>
        </item>
        <item>
            <title><![CDATA[[python] 백준 17835 :: 면접보는 승범이네 (dijkstra)]]></title>
            <link>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-17835-%EB%A9%B4%EC%A0%91%EB%B3%B4%EB%8A%94-%EC%8A%B9%EB%B2%94%EC%9D%B4%EB%84%A4-dijkstra</link>
            <guid>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-17835-%EB%A9%B4%EC%A0%91%EB%B3%B4%EB%8A%94-%EC%8A%B9%EB%B2%94%EC%9D%B4%EB%84%A4-dijkstra</guid>
            <pubDate>Sun, 07 May 2023 18:20:30 GMT</pubDate>
            <description><![CDATA[<h2 id="🔗-백준-17835--면접보는-승범이네-dijkstra"><a href="https://e-juhee.tistory.com/entry/python-%EB%B0%B1%EC%A4%80-17835-%EB%A9%B4%EC%A0%91%EB%B3%B4%EB%8A%94-%EC%8A%B9%EB%B2%94%EC%9D%B4%EB%84%A4-dijkstra">🔗 백준 17835 :: 면접보는 승범이네 (dijkstra)</a></h2>
]]></description>
        </item>
        <item>
            <title><![CDATA[[KAIST 정글] 8주차 회고]]></title>
            <link>https://velog.io/@e_juhee/KAIST-%EC%A0%95%EA%B8%80-8%EC%A3%BC%EC%B0%A8-%ED%9A%8C%EA%B3%A0</link>
            <guid>https://velog.io/@e_juhee/KAIST-%EC%A0%95%EA%B8%80-8%EC%A3%BC%EC%B0%A8-%ED%9A%8C%EA%B3%A0</guid>
            <pubDate>Tue, 25 Apr 2023 18:40:25 GMT</pubDate>
            <description><![CDATA[<h1 id="kaist-정글-8주차-회고-httpse-juheetistorycomentrykaist-eca095eab880-8eca3bcecb0a8-ed9a8ceab3a0">[KAIST 정글 8주차 회고] (<a href="https://e-juhee.tistory.com/entry/KAIST-%EC%A0%95%EA%B8%80-8%EC%A3%BC%EC%B0%A8-%ED%9A%8C%EA%B3%A0">https://e-juhee.tistory.com/entry/KAIST-%EC%A0%95%EA%B8%80-8%EC%A3%BC%EC%B0%A8-%ED%9A%8C%EA%B3%A0</a>)</h1>
]]></description>
        </item>
        <item>
            <title><![CDATA[[Pintos-KAIST] Project 1 :: Priority Donation]]></title>
            <link>https://velog.io/@e_juhee/Pintos-KAIST-Project-1-Priority-Donation</link>
            <guid>https://velog.io/@e_juhee/Pintos-KAIST-Project-1-Priority-Donation</guid>
            <pubDate>Tue, 25 Apr 2023 16:43:18 GMT</pubDate>
            <description><![CDATA[<h1 id="priority-donation-구현하기"><a href="https://e-juhee.tistory.com/entry/Pintos-KAIST-Project-1-Priority-Donation">Priority Donation 구현하기</a></h1>
]]></description>
        </item>
        <item>
            <title><![CDATA[[Pintos-KAIST] Project 1 :: Priority Scheduling]]></title>
            <link>https://velog.io/@e_juhee/Pintos-KAIST-Project-1-Priority-Scheduling</link>
            <guid>https://velog.io/@e_juhee/Pintos-KAIST-Project-1-Priority-Scheduling</guid>
            <pubDate>Tue, 25 Apr 2023 14:46:38 GMT</pubDate>
            <description><![CDATA[<h1 id="priority-scheduling-구현하기"><a href="https://e-juhee.tistory.com/entry/Pintos-KAIST-Project-1-Priority-Scheduling">Priority Scheduling 구현하기</a></h1>
]]></description>
        </item>
        <item>
            <title><![CDATA[[Pintos-KAIST] Project 1 :: Alarm Clock (Sleep-Awake 방식의 Alarm Clock 구현하기)]]></title>
            <link>https://velog.io/@e_juhee/pintos-kaist-PROJECT1-Alarm-Clock-Sleep-Awake-%EB%B0%A9%EC%8B%9D%EC%9D%98-Alarm-Clock-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0</link>
            <guid>https://velog.io/@e_juhee/pintos-kaist-PROJECT1-Alarm-Clock-Sleep-Awake-%EB%B0%A9%EC%8B%9D%EC%9D%98-Alarm-Clock-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0</guid>
            <pubDate>Tue, 25 Apr 2023 12:20:28 GMT</pubDate>
            <description><![CDATA[<h1 id="alarm-clock-구현하기"><a href="https://e-juhee.tistory.com/entry/pintos-kaist-PROJECT1-Alarm-Clock-Sleep-Awake-%EB%B0%A9%EC%8B%9D%EC%9C%BC%EB%A1%9C-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0">Alarm Clock 구현하기</a></h1>
]]></description>
        </item>
        <item>
            <title><![CDATA[[c언어] Proxy Lab :: Proxy Server 구현하기 (Sequential proxy, Concurrent proxy, Caching)]]></title>
            <link>https://velog.io/@e_juhee/C%EC%96%B8%EC%96%B4-Proxy-Lab-Proxy-Server-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0-Sequential-proxy-Concurrent-proxy-Caching</link>
            <guid>https://velog.io/@e_juhee/C%EC%96%B8%EC%96%B4-Proxy-Lab-Proxy-Server-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0-Sequential-proxy-Concurrent-proxy-Caching</guid>
            <pubDate>Thu, 20 Apr 2023 14:18:25 GMT</pubDate>
            <description><![CDATA[<h1 id="🔎-proxy-lab"><a href="https://e-juhee.tistory.com/entry/C%EC%96%B8%EC%96%B4-Proxy-Lab-Proxy-Server-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0-Sequential-proxy-Concurrent-proxy-Caching">🔎 Proxy Lab</a></h1>
]]></description>
        </item>
        <item>
            <title><![CDATA[[c언어] Malloc Lab :: 동적 할당기 구현하기 (Implicit List, Explicit List, Segregated List, Buddy System)]]></title>
            <link>https://velog.io/@e_juhee/c%EC%96%B8%EC%96%B4-Malloc-Lab-%EB%8F%99%EC%A0%81-%ED%95%A0%EB%8B%B9%EA%B8%B0-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0-Implicit-List-Explicit-List-Segregated-List-Buddy-System</link>
            <guid>https://velog.io/@e_juhee/c%EC%96%B8%EC%96%B4-Malloc-Lab-%EB%8F%99%EC%A0%81-%ED%95%A0%EB%8B%B9%EA%B8%B0-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0-Implicit-List-Explicit-List-Segregated-List-Buddy-System</guid>
            <pubDate>Wed, 12 Apr 2023 17:32:10 GMT</pubDate>
            <description><![CDATA[<h1 id="🔎-malloc-lab-구현하기"><a href="https://e-juhee.tistory.com/entry/c%EC%96%B8%EC%96%B4-Malloc-Lab-%EB%8F%99%EC%A0%81-%ED%95%A0%EB%8B%B9%EA%B8%B0-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0-Implicit-List-Explicit-List-Segregated-List-Buddy-System">🔎 Malloc Lab 구현하기</a></h1>
]]></description>
        </item>
        <item>
            <title><![CDATA[[c언어] Red-Black Tree 구현하기]]></title>
            <link>https://velog.io/@e_juhee/c%EC%96%B8%EC%96%B4-Red-Black-Tree-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0</link>
            <guid>https://velog.io/@e_juhee/c%EC%96%B8%EC%96%B4-Red-Black-Tree-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0</guid>
            <pubDate>Wed, 05 Apr 2023 16:19:12 GMT</pubDate>
            <description><![CDATA[<h1 id="🔎-red-black-tree-구현하기"><a href="https://e-juhee.tistory.com/entry/c%EC%96%B8%EC%96%B4-Red-Black-Tree-%EA%B5%AC%ED%98%84%ED%95%98%EA%B8%B0">🔎 Red-Black Tree 구현하기</a></h1>
]]></description>
        </item>
        <item>
            <title><![CDATA[Why Is Code Review Necessary?]]></title>
            <link>https://velog.io/@e_juhee/Code-Review</link>
            <guid>https://velog.io/@e_juhee/Code-Review</guid>
            <pubDate>Tue, 04 Apr 2023 07:03:48 GMT</pubDate>
            <description><![CDATA[<h2 id="1-google이-일하는-방식">1. Google이 일하는 방식</h2>
<h3 id="1-test-driven-development">1) Test Driven Development</h3>
<ul>
<li><p>테스트가 기본이다.</p>
</li>
<li><p>구현해야 할 요구사항과 구현체를 분리해서 구현하기 전에 테스트를 먼저 작성한다.</p>
</li>
<li><p>엣지 케이스, 코너 케이스 등을 생각해서 테스트를 작성한다.</p>
</li>
<li><p>테스트를 먼저 작성하는 이유: 코딩을 먼저 하면 내 코드에 맞는 테스트만 떠올리게 되기 때문에, 테스트를 먼저 작성하고 코딩을 한다.</p>
</li>
<li><p>테스트는 실행 가능한 문서라고 하는데, 
comment는 테스트해볼 수도 없고 내 코드와 맞는지 확인할 수 없는 반면, 테스트는 코드와 동기화가 될 수 밖에 없기 때문이다.</p>
</li>
<li><p>구글은 테스트가 없으면 커밋조차 할 수 없다.</p>
</li>
</ul>
<h3 id="2-short-iterations">2) Short iterations</h3>
<ul>
<li>자잘하게 빨리 빨리 많이 커밋을 해놔야 문제가 생겼을 때 파악하기 쉽다.</li>
</ul>
<h3 id="3-pair-programming">3) Pair programming</h3>
<ul>
<li><p>제일 빠르게 배우는 것은 선배 어깨 너머로 배우는 것이다.</p>
</li>
<li><p>나란히 앉아서 컴퓨터 한 대로 코딩하면 굉장히 빠르게 배울 수 있다.</p>
</li>
</ul>
<h3 id="4-code-review">4) Code review</h3>
<ul>
<li>이것이 오늘의 주제 🌟</li>
</ul>
<br/>

<h2 id="2-코드리뷰란">2. 코드리뷰란?</h2>
<ul>
<li><p>소프트웨어 개발 흐름에서 꼭 필요한 한 단계이다. <em>선택 사항이 아니다. 필쑤!</em></p>
</li>
<li><p>동료로부터 코드에 대해 피드백을 받는 것이다.</p>
</li>
<li><p>❌ 소프트웨어 설계에 대한 고민 혹은 요구사항/기능에 대한 계획이 아니다.</p>
</li>
</ul>
<br/>

<h2 id="3-code-review-workflow">3. Code Review Workflow</h2>
<h4 id="step-1-a-software-engineer-swe-implements-a-clchange-list">Step 1: A software engineer (SWE) implements a CL(change list).</h4>
<p>소프트웨어 엔지니어(SWE)가 CL(Change List)를 만든다.</p>
<h4 id="step-2-the-cl-owner-sends-the-cl-to-hisher-colleagues-for-comments">Step 2: The CL owner sends the CL to his/her colleagues for comments.</h4>
<p>동료들에게 CL을 보낸다.</p>
<h4 id="step-3-the-designated-colleagues-leave-comments-on-the-received-cl">Step 3: The designated colleagues leave comments on the received CL.</h4>
<p>지목 받은 동료가 코멘트를 남긴다.
(최근 구글에서는 적합한 리뷰어를 추천해주는 봇을 활용하기도 한다.)</p>
<h4 id="step-4-the-cl-owner-changes-hisher-cl-based-on-the-received-comments-and-iterates-steps-2--3-until-the-owner-gets-lgtm-looks-good-to-me">Step 4: The CL owner changes his/her CL based on the received comments and iterates Steps 2 &amp; 3 until the owner gets LGTM (Looks Good To Me).</h4>
<p>CL 오너가 LGTM이 될 때까지 수정한다.
LGTM: <code>내가 보기엔 좋아보여요.👍</code> 라는 의미이다.</p>
<h4 id="step-5-when-all-reviewers-say-lgtm-the-cl-owner-submits-the-cl-to-the-repository">Step 5: When all reviewers say LGTM, the CL owner submits the CL to the repository.</h4>
<p>리뷰는 적어도 두명이 해준다. 리뷰어 모두가 LGTM이 될 때 넘어가는 것이다.</p>
<br/>


<h2 id="4-why-is-code-review-necessary">4. Why Is Code Review Necessary?</h2>
<ul>
<li><p>나의 CL을 이해하기 쉽게 만든다.</p>
</li>
<li><p>내 동료가 내 코드를 이해할 수 있어야 한다. (한 달 후에 내가 내 코드를 보고도 기억이 안 나서 동료의 입장이 될 수도 있다. 🫣)</p>
</li>
<li><p>내 CL에 동료가 남긴 의견으로부터 tips &amp; lessons를 배울 수 있다.</p>
</li>
<li><p>숙련된 개발자로부터 코딩 스타일과 팁을 배울 수 있다.</p>
</li>
<li><p>팀이 공통된 코딩 스타일을 공유할 수 있다.</p>
</li>
<li><p>결함을 줄일 수 있다.</p>
</li>
<li><p>Coding Decision에 대한 개발 역사를 보관할 수 있다.</p>
</li>
<li><p>코드 리뷰를 하면 해당 기능에 대해 알고 있는 사람이 한두명 더 있게 되는 것이다. (공석 대비 가능)</p>
</li>
<li><p>동료의 의견은 코드 설계와 결정 사항을 이해하는 데 매우 큰 도움이 된다.</p>
</li>
<li><p>새로 온 개발자는 committed logs와 의견으로부터 코드의 구조와 결정 사항을 이해할 수 있다.</p>
</li>
<li><p>내 코드에 일관적인 코딩 스타일을 유지할 수 있다.</p>
</li>
<li><p>새로 온 개발자가 기존의 코딩 스타일을 따를 수 있도록 도와준다.</p>
</li>
<li><p>일관적인 코딩 스타일은 이후에 코드를 refactoring하거나 디버깅할 때 큰 도움이 된다.</p>
</li>
</ul>
<br/>

<h2 id="5-possible-downsides-of-code-review">5. Possible Downsides of Code Review</h2>
<ul>
<li><p>거칠고 무례한 의견 때문에 SWE가 위축될 수 있다. 👉 건설적인 피드백을 해야 한다.</p>
</li>
<li><p>리뷰가 늦어지면 개발 기간이 늦어진다.</p>
</li>
<li><p>코드 리뷰를 제대로 하려면 시간이 걸린다.</p>
</li>
<li><p>경험이 부족한 개발자의 잘못된 CL을 리뷰하느라 숙련된 개발자의 시간이 허비될 수 있다.</p>
</li>
<li><p>코드 리뷰를 위해서는 어느정도 숙련된 개발자가 필요하다.</p>
</li>
</ul>
<p>But, 숙련된 개발자도 코드리뷰를 통해 자신의 생각을 말로 바꾸면서 많이 배우게 된다.</p>
<br/>

<h2 id="6-code-reviews-are-cultural">6. Code Reviews Are Cultural</h2>
<ul>
<li><p>동료를 존중해야 한다.</p>
</li>
<li><p>건설적인 피드백을 해야 한다.</p>
</li>
<li><p>코드리뷰를 하면 코드가 건강해지고 확장 가능한 코드가 된다. 
(코드가 투명해질 수밖에 없다. 리뷰어가 이해하지 못하면 LGTM를 하지 않으니까!)</p>
</li>
<li><p>타 팀 간 코드리뷰를 하게 되면 같이 일하게 되어 협력이 늘어난다.</p>
</li>
<li><p>코드의 표준이 점점 올라간다. (수준 격차가 좁혀진다.)</p>
</li>
<li><p>코드 리뷰는 팀워크다.</p>
</li>
</ul>
<br/>

<h2 id="7-style-guide">7. Style Guide</h2>
<h3 id="1-google-style-guide-goal">1) Google Style Guide Goal</h3>
<p>구글 코딩 가이드라인의 목표</p>
<ul>
<li><p>코딩 가이드라인을 지켜야 한다. (예외는 있다.)</p>
</li>
<li><p>해당 언어의 전문가(readability)와 프로젝트 오너(ownership)는 반드시 포함하여 코드리뷰를 해야 한다.</p>
</li>
<li><p>코드 리뷰는 작성자를 위한 것이 아니라 읽는 사람을 위한 것이다.</p>
</li>
<li><p>이미 있는 코드의 룰에 맞춰야 한다.</p>
</li>
<li><p>새로운 기능은 테스트가 충분하지 않아 잘못됐을 가능성도 있고, 해당 기능을 모르는 사람도 있으니 욕심을 버리고 기본에 충실하는 것이 좋다.</p>
</li>
<li><p>코드 리뷰의 피드백으로 인하여 속도가 느려진다면, 속도(최적화)를 우선시한다.</p>
</li>
</ul>
<br/>

<h3 id="2-how-to-enforce-the-style-guide">2) How to Enforce the Style Guide</h3>
<p>스타일 가이드를 적용하는 방법</p>
<ul>
<li><p>코드리뷰를 하면서 리뷰어가 확인한다.</p>
</li>
<li><p>사람 대신 도구가 확인한다.</p>
</li>
</ul>
<br/>

<h3 id="3rules">3)Rules</h3>
<h4 id="general-naming-rule--변수명">General Naming Rule : 변수명</h4>
<ul>
<li><p>이해하기 쉽게 짓는다.</p>
</li>
<li><p>약어를 사용하지 않는다.</p>
</li>
</ul>
<h4 id="조건문">조건문</h4>
<ul>
<li>조건문 괄호 사이에 빈 칸을 추가해라 하지 말아라 등의 기준은 나름의 유행이 있다. 종종 바뀐다. <em>기계에게 맡기자</em></li>
</ul>
<h4 id="함수🌟">함수🌟</h4>
<ul>
<li><p>아주 중요하다. 함수는 작게 짜라! <em>한 번에 한 놈만 패라!</em></p>
</li>
<li><p>하는 일이 무엇인지 명확해야 하고 이름에서 드러나야 한다.</p>
</li>
<li><p>잘게 쪼개야 디버깅할 때도 편하다.</p>
</li>
</ul>
<h4 id="요약">요약</h4>
<ul>
<li><p>모두 따르지 않아도 된다. 중요한 것은 팀에서는 일관된 스타일이 있는 것이 좋다.</p>
</li>
<li><p>가이드라인은 시간이 갈수록 발전할 수 있고, 언제나 예외가 있을 수 있다.</p>
</li>
</ul>
<br/>

<h2 id="8-testing">8. Testing</h2>
<h3 id="1-why-is-testing-so-important">1) Why Is Testing So Important?</h3>
<h4 id="testing-rocks-debug-sucks">Testing Rocks! Debug Sucks!</h4>
<ul>
<li><p>디버깅은 보통 문제를 찾는 데 시간이 굉장히 오래 걸린다.</p>
</li>
<li><p>테스팅은 새로 작성한 코드에서도 결함을 검출할 수 있다.</p>
</li>
<li><p>유지보수 부담을 줄인다.</p>
</li>
</ul>
<h4 id="project-scalability">Project Scalability</h4>
<ul>
<li><p>새로 온 개발자도 테스트 코드를 잘 작성해서 프로젝트에 기여할 수 있다.</p>
</li>
<li><p>동료나 외부 기여자에게서 도움을 받기에 가장 적합하다.</p>
</li>
</ul>
<br/>


<h3 id="2-testing-types">2) Testing Types</h3>
<h4 id="unit-testing">Unit Testing</h4>
<ul>
<li><p>제일 많이 한다.</p>
</li>
<li><p>단위 하나(함수 하나씩) 테스트하는 것</p>
</li>
</ul>
<h4 id="integration-testing">Integration Testing</h4>
<ul>
<li><p>함수가 어디서 쓰이느냐에 따라 다를 수 있기 때문에 Unit Testing만으로는 충분하지 않다.</p>
</li>
<li><p>내가 짠 함수는 내가 가정한 상황에서만 쓰이는 것이 보장되지 않는다. 
어디서든 쓰일 수 있으므로 전체 Integration에서 테스팅해봐야 한다.</p>
</li>
</ul>
<h4 id="regression-testing">Regression Testing</h4>
<ul>
<li>과거에 예상했던 동작을 새 코드도 유지하는지 확인한다.</li>
</ul>
<h4 id="end-to-end-e2e-testing">End-to-End (E2E) Testing</h4>
<br/>

<h2 id="9-code-refactoring">9. Code Refactoring</h2>
<ul>
<li><p>Refactoring은 SW의 동작을 바꾸지 않으면서 내부 구조를 개선하는 것이다. 
즉, 코드의 구조를 잘 정해진 규정대로 수정하는 기술이다.</p>
</li>
<li><p>SW를 더 이해하기 쉽게 만들고 수정하는 비용을 줄인다.</p>
</li>
<li><p>꽤 오랫동안 숙련된 개발자들 사이에 전해 내려오는 노하우로, 정돈되지 않고 일관적이지 않다.</p>
</li>
<li><p>Refactoring is an overhead activity.</p>
</li>
</ul>
<br/>

<h3 id="why-refactor">Why Refactor?</h3>
<ul>
<li><p>Refactoring이 없으면 프로그램의 설계는 낡아진다.(항상 새로운 것이 나오니까!)</p>
</li>
<li><p>설계가 좋지 않은 코드는 보통 같은 일을 하는데 코드가 길고, 같은 일을 여러 곳에서 한다.</p>
</li>
<li><p>코드가 이해하기 쉬워진다.</p>
</li>
<li><p>결함을 검출할 수 있다.</p>
</li>
<li><p>프로그램 속도가 향상된다.(프로그램에 대해 더 잘 이해하기 때문)</p>
</li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[MacOS에서 Ubuntu 개발 환경 설치하기 (AWS, VSC)]]></title>
            <link>https://velog.io/@e_juhee/MacOS%EC%97%90%EC%84%9C-Ubuntu-%EA%B0%9C%EB%B0%9C-%ED%99%98%EA%B2%BD-%EC%84%A4%EC%B9%98%ED%95%98%EA%B8%B0-AWS-VSC</link>
            <guid>https://velog.io/@e_juhee/MacOS%EC%97%90%EC%84%9C-Ubuntu-%EA%B0%9C%EB%B0%9C-%ED%99%98%EA%B2%BD-%EC%84%A4%EC%B9%98%ED%95%98%EA%B8%B0-AWS-VSC</guid>
            <pubDate>Fri, 31 Mar 2023 04:03:49 GMT</pubDate>
            <description><![CDATA[<h2 id="macos에서-ubuntu-개발-환경-설치하기"><a href="https://e-juhee.tistory.com/entry/MacOS%EC%97%90%EC%84%9C-Ubuntu-%EA%B0%9C%EB%B0%9C-%ED%99%98%EA%B2%BD-%EC%84%A4%EC%B9%98%ED%95%98%EA%B8%B0-AWS-VSC">MacOS에서 Ubuntu 개발 환경 설치하기</a></h2>
]]></description>
        </item>
        <item>
            <title><![CDATA[[python] 백준 2098 :: 외판원 순회 (DP, 비트마스킹)]]></title>
            <link>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-2098-%EC%99%B8%ED%8C%90%EC%9B%90-%EC%88%9C%ED%9A%8C-DP-%EB%B9%84%ED%8A%B8%EB%A7%88%EC%8A%A4%ED%82%B9-lso2bk58</link>
            <guid>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-2098-%EC%99%B8%ED%8C%90%EC%9B%90-%EC%88%9C%ED%9A%8C-DP-%EB%B9%84%ED%8A%B8%EB%A7%88%EC%8A%A4%ED%82%B9-lso2bk58</guid>
            <pubDate>Mon, 27 Mar 2023 17:30:59 GMT</pubDate>
            <description><![CDATA[<h2 id="🔗-백준-2098--외판원-순회-dp-비트마스킹"><a href="https://e-juhee.tistory.com/entry/python-%EB%B0%B1%EC%A4%80-2098-%EC%99%B8%ED%8C%90%EC%9B%90-%EC%88%9C%ED%9A%8C-DP-%EB%B9%84%ED%8A%B8%EB%A7%88%EC%8A%A4%ED%82%B9">🔗 백준 2098 :: 외판원 순회 (DP, 비트마스킹)</a></h2>
]]></description>
        </item>
        <item>
            <title><![CDATA[[python] 백준 11049 :: 행렬 곱셈 순서 (DP)]]></title>
            <link>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-11049-%ED%96%89%EB%A0%AC-%EA%B3%B1%EC%85%88-%EC%88%9C%EC%84%9C-DP</link>
            <guid>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-11049-%ED%96%89%EB%A0%AC-%EA%B3%B1%EC%85%88-%EC%88%9C%EC%84%9C-DP</guid>
            <pubDate>Mon, 27 Mar 2023 13:53:09 GMT</pubDate>
            <description><![CDATA[<h2 id="🔗-백준-11049--행렬-곱셈-순서-dp"><a href="https://e-juhee.tistory.com/entry/python-%EB%B0%B1%EC%A4%80-11049-%ED%96%89%EB%A0%AC-%EA%B3%B1%EC%85%88-%EC%88%9C%EC%84%9C-DP">🔗 백준 11049 :: 행렬 곱셈 순서 (DP)</a></h2>
]]></description>
        </item>
        <item>
            <title><![CDATA[[python] 백준 3055 :: 탈출 (BFS)]]></title>
            <link>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-3055-%ED%83%88%EC%B6%9C-BFS</link>
            <guid>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-3055-%ED%83%88%EC%B6%9C-BFS</guid>
            <pubDate>Tue, 21 Mar 2023 05:19:51 GMT</pubDate>
            <description><![CDATA[<h2 id="🔗-백준-3055--탈출-bfs"><a href="https://e-juhee.tistory.com/entry/python-%EB%B0%B1%EC%A4%80-3055-%ED%83%88%EC%B6%9C-BFS">🔗 백준 3055 :: 탈출 (BFS)</a></h2>
]]></description>
        </item>
        <item>
            <title><![CDATA[[python] 백준 2617 :: 구슬찾기 (DFS)]]></title>
            <link>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-2617-%EA%B5%AC%EC%8A%AC%EC%B0%BE%EA%B8%B0</link>
            <guid>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-2617-%EA%B5%AC%EC%8A%AC%EC%B0%BE%EA%B8%B0</guid>
            <pubDate>Mon, 20 Mar 2023 17:08:23 GMT</pubDate>
            <description><![CDATA[<h2 id="🔗-백준-2617--구슬찾기-dfs"><a href="https://e-juhee.tistory.com/entry/python-%EB%B0%B1%EC%A4%80-2617-%EA%B5%AC%EC%8A%AC%EC%B0%BE%EA%B8%B0-DSF">🔗 백준 2617 :: 구슬찾기 (DFS)</a></h2>
]]></description>
        </item>
        <item>
            <title><![CDATA[[python] 백준 2573 :: 빙산 (DFS)]]></title>
            <link>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-2573-%EB%B9%99%EC%82%B0-DFS</link>
            <guid>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-2573-%EB%B9%99%EC%82%B0-DFS</guid>
            <pubDate>Mon, 20 Mar 2023 06:14:29 GMT</pubDate>
            <description><![CDATA[<h2 id="🔗-백준-2573--빙산-dfs"><a href="https://e-juhee.tistory.com/entry/python-%EB%B0%B1%EC%A4%80-2573-%EB%B9%99%EC%82%B0-DFS?category=1097015">🔗 백준 2573 :: 빙산 (DFS)</a></h2>
]]></description>
        </item>
        <item>
            <title><![CDATA[[python] 백준 21606 :: 아침 산책 (DFS)]]></title>
            <link>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-21606-%EC%95%84%EC%B9%A8-%EC%82%B0%EC%B1%85-DFS</link>
            <guid>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-21606-%EC%95%84%EC%B9%A8-%EC%82%B0%EC%B1%85-DFS</guid>
            <pubDate>Sun, 19 Mar 2023 13:00:40 GMT</pubDate>
            <description><![CDATA[<h2 id="🔗-백준-21606--아침-산책-dfs"><a href="https://e-juhee.tistory.com/entry/python-%EB%B0%B1%EC%A4%80-21606-%EC%95%84%EC%B9%A8-%EC%82%B0%EC%B1%85-DFS?category=1097015">🔗 백준 21606 :: 아침 산책 (DFS)</a></h2>
]]></description>
        </item>
        <item>
            <title><![CDATA[[python] 백준 1707 :: 이분 그래프]]></title>
            <link>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-1707-%EC%9D%B4%EB%B6%84-%EA%B7%B8%EB%9E%98%ED%94%84</link>
            <guid>https://velog.io/@e_juhee/python-%EB%B0%B1%EC%A4%80-1707-%EC%9D%B4%EB%B6%84-%EA%B7%B8%EB%9E%98%ED%94%84</guid>
            <pubDate>Sat, 18 Mar 2023 12:38:36 GMT</pubDate>
            <description><![CDATA[<h2 id="🔗-백준-1707--이분-그래프"><a href="https://e-juhee.tistory.com/entry/python-%EB%B0%B1%EC%A4%80-1707-%EC%9D%B4%EB%B6%84-%EA%B7%B8%EB%9E%98%ED%94%84?category=1097015">🔗 백준 1707 :: 이분 그래프</a></h2>
]]></description>
        </item>
        <item>
            <title><![CDATA[[C언어] C언어 기초 :: main 함수, 메모리 크기, 자료형, 상수, 조건문, 반복문, 입출력, 사용자 정의 함수]]></title>
            <link>https://velog.io/@e_juhee/C%EC%96%B8%EC%96%B4-C%EC%96%B8%EC%96%B4-%EA%B8%B0%EC%B4%88-main-%ED%95%A8%EC%88%98-%EB%A9%94%EB%AA%A8%EB%A6%AC-%ED%81%AC%EA%B8%B0-%EC%9E%90%EB%A3%8C%ED%98%95-%EC%83%81%EC%88%98-%EC%A1%B0%EA%B1%B4%EB%AC%B8-%EB%B0%98%EB%B3%B5%EB%AC%B8-%EC%9E%85%EC%B6%9C%EB%A0%A5-%EC%82%AC%EC%9A%A9%EC%9E%90-%EC%A0%95%EC%9D%98-%ED%95%A8%EC%88%98</link>
            <guid>https://velog.io/@e_juhee/C%EC%96%B8%EC%96%B4-C%EC%96%B8%EC%96%B4-%EA%B8%B0%EC%B4%88-main-%ED%95%A8%EC%88%98-%EB%A9%94%EB%AA%A8%EB%A6%AC-%ED%81%AC%EA%B8%B0-%EC%9E%90%EB%A3%8C%ED%98%95-%EC%83%81%EC%88%98-%EC%A1%B0%EA%B1%B4%EB%AC%B8-%EB%B0%98%EB%B3%B5%EB%AC%B8-%EC%9E%85%EC%B6%9C%EB%A0%A5-%EC%82%AC%EC%9A%A9%EC%9E%90-%EC%A0%95%EC%9D%98-%ED%95%A8%EC%88%98</guid>
            <pubDate>Fri, 17 Mar 2023 13:48:32 GMT</pubDate>
            <description><![CDATA[<h1 id="hello-c-😀">hello, C..! 😀</h1>
<ul>
<li><p>C언어는 메모리 주소에 직접 접근할 수 있다는 점에서 강력한 언어가 되며 다양한 운영체제 및 언어들의 기본이 되고 있다.</p>
</li>
<li><p>고급 언어에 속하면서도 거의 어셈블리어 취급을 받고 있다 ㅋㅎ ㅜ,,</p>
</li>
</ul>
<br/>

<p>C언어의 기초가 되는 부분들을 훑어보자 📖</p>
<h2 id="1-main-함수-작성하기">1. main 함수 작성하기</h2>
<pre><code class="language-c">#include &lt;stdio.h&gt;

int main(void)
{
    printf(&quot;hello world\n&quot;);
    return 0; // main 함수의 반환값을 int로 정했으니, 함수를 종료할 때 정수를 반환해줘야 한다.
}</code></pre>
<ul>
<li><p>main 함수는 프로그램이 실행될 때 가장 첫번째로 실행되는 부분이다.</p>
</li>
<li><p><code>int main(void)</code>와 <code>return 0</code>을 약속처럼 동일하게 쓴다.</p>
</li>
</ul>
<br/>

<h4 id="stdioh-라이브러리">&lt;stdio.h&gt; 라이브러리</h4>
<ul>
<li><p><code>printf</code> 같은 함수를 사용하려면 이 라이브러리를 추가해줘야 한다.</p>
</li>
<li><p>standard input output header file을 의미하는 stdio.h를 추가해야 <code>printf, scanf</code>같은 입력 출력 함수를 사용할 수 있다.</p>
</li>
</ul>
<br/>

<h4 id="return">return</h4>
<ul>
<li><code>main</code> 앞에 작성한 <code>int</code>가 main 함수의 반환값이다. 
함수를 종료할 때 정수를 반환해줘야 한다.</li>
</ul>
<br/>

<h2 id="2-메모리-크기-확인하기">2. 메모리 크기 확인하기</h2>
<ul>
<li><p><code>sizeof</code>를 사용하면 변수가 차지하는 메모리 크기 리턴해준다.</p>
<pre><code class="language-c">  printf(&quot;변수 x의 메모리 크기는 %d입니다.&quot; , sizeof(x)); // 변수 x의 메모리 크기는 4입니다.</code></pre>
</li>
<li><p>int와 float는 4바이트를 차지하고, double은 8바이트를 차지한다.</p>
</li>
<li><p>실수 <code>123456789.123456789</code>를 float과 double 변수에 담으면 출력 결과가 다르다.
👉 <code>float</code>는 4바이트를 차지해 표현 가능한 범위가 작아서 쓰레기 값이 들어가 있고,
👉 <code>double</code>은 8바이트를 차지해서, 값을 제대로 출력해주고 있다!</p>
</li>
</ul>
<pre><code class="language-c">    float y = 123456789.123456789;
    double z = 123456789.123456789;
    printf(&quot;y = %.2f\n&quot;, y); // y = 123456792.00
    printf(&quot;z = %.2f\n&quot;, z); // z = 123456789.12</code></pre>
<h4 id="overflow">overflow</h4>
<ul>
<li>int형이 가질 수 있는 제일 큰 값 <code>INT_MAX</code>에 1을 더하면 최솟값이 되어버린다.<pre><code class="language-c">  int x = INT_MAX; // C언어에서 int형이 가질 수 있는 제일 큰 값.약 20억
  printf(&quot;int형의 최댓값 x는 %d입니다.\n&quot;, x); // int형의 최댓값 x는 2147483647입니다.
  printf(&quot;x+1은 %d입니다.\n&quot;, x+1); // x+1은 -2147483648입니다. -&gt; 최솟값이 되었다.</code></pre>
</li>
</ul>
<br/>

<h2 id="3-data-types">3. Data Types</h2>
<h3 id="자료형의-종류">자료형의 종류</h3>
<ul>
<li>사용자 정의 자료형 User defined</li>
<li>파생 자료형 Derivied</li>
<li>원시 자료형 Primitive</li>
</ul>
<p>이 중에서 원시 자료형을 알아보자!</p>
<p>원시 자료형에는 <code>char, int, float, double, void</code> 이렇게 다섯가지가 있다.</p>
<h4 id="char">char</h4>
<ul>
<li>char는 문자를 표현한다.</li>
<li>string 자료형은 따로 없다, string을 나타내려면 char 배열을 써야 한다.</li>
</ul>
<pre><code class="language-c">    char x = &#39;A&#39;;
    printf(&quot;%c&quot;, x); // A</code></pre>
<ul>
<li>내부적으로는 숫자(아스키 코드)로 구성되기 때문에 숫자를 넣으면 그에 해당하는 문자를 출력할 수 있다.</li>
</ul>
<pre><code class="language-c">    char y = 65;
    printf(&quot;%c&quot;, y); // A</code></pre>
<ul>
<li>int로 변수를 만들어놓고, 출력할 때 <code>%c</code>를 적어주면 아스키코드에 해당하는 문자로 출력된다.</li>
</ul>
<pre><code class="language-c">    int z = 65;
    printf(&quot;%c&quot;, z); // A</code></pre>
<ul>
<li>반대로 char로 선언하고 <code>%d</code>로 출력하면 정수형으로 출력된다.</li>
</ul>
<pre><code class="language-c">    char a = &#39;B&#39;;
    printf(&quot;%d&quot;, a); // 66</code></pre>
<br/>

<h4 id="int">int</h4>
<ul>
<li><code>%d</code>는 10진수, <code>%o</code>는 8진수, <code>%x</code>는 16진수로 출력한다.</li>
</ul>
<pre><code class="language-python">    int num = 100;
    printf(&quot;10진수: %d\n&quot;, num); // 10진수: 100
    printf(&quot;8진수: %o\n&quot;, num); // 8진수: 144
    printf(&quot;16진수: %x\n&quot;, num); // 16진수: 64</code></pre>
<br/>

<h4 id="void">void</h4>
<ul>
<li>자료형 자체가 없다는 의미이다.</li>
</ul>
<br/>

<h2 id="4-상수-선언">4. 상수 선언</h2>
<pre><code class="language-c">#define MONTHS 12</code></pre>
<ul>
<li><p><code>#define 상수이름 값</code>으로 상수를 선언할 수 있다.</p>
</li>
<li><p>이름은 MONTHS, 값은 12인 상수가 선언된다.</p>
</li>
</ul>
<br/>

<h2 id="5-조건-연산자">5. 조건 연산자</h2>
<ul>
<li><p><code>조건 ? True일 때 : 거짓일 때;</code></p>
</li>
<li><p>JavaScript의 삼항 연산자와 똑같다. 반가워!!!!!!🥺</p>
</li>
</ul>
<pre><code class="language-c">    int x = 50, y = 30;

    int absoluteX = (x &gt; 0) ? x : -x;  
    printf(&quot;절댓값 : %d\n&quot;, absoluteX); // 절댓값 : 50

    int max = (x &gt; y) ? x : y;  
    printf(&quot;최댓값 : %d\n&quot;, max); // 최댓값 : 50

    int min = (x &lt; y) ? x : y;  
    printf(&quot;최솟값 : %d\n&quot;, min); // 최솟값 : 30</code></pre>
<br/>

<h2 id="6-math-라이브러리">6. math 라이브러리</h2>
<ul>
<li><code>pow(), abs()</code> 등을 쓰려면 라이브러리를 먼저 불러주자</li>
</ul>
<pre><code class="language-c">#include &lt;math.h&gt;</code></pre>
<ul>
<li><code>pow()</code> 예시<pre><code class="language-c">  double x = pow(2.0, 20.0); // 2의 20제곱
  printf(&quot;2의 20 제곱은 %.0f&quot;, x); // 2의 20 제곱은 1048576</code></pre>
</li>
</ul>
<br/>

<h2 id="7-조건문">7. 조건문</h2>
<ul>
<li><p><code>if ~ else if ~ else</code></p>
</li>
<li><p>조건문도 JS랑 똑같다 ㅋㅎㅋㅎ굿굿</p>
</li>
</ul>
<pre><code class="language-c">    int score = 85;

    if(score &gt;= 90)
    {
        printf(&quot;A&quot;);
    }
    else if(score &gt;= 80)
    {
        printf(&quot;B&quot;);
    }
    else
    {
        printf(&quot;C&quot;);
    }</code></pre>
<ul>
<li>한 줄은 중괄호 안 써도 됨</li>
</ul>
<pre><code class="language-c">    if(score &gt;= 90)
        printf(&quot;A&quot;);</code></pre>
<br/>

<h2 id="8-반복문">8. 반복문</h2>
<h4 id="while문">while문</h4>
<pre><code class="language-c">    int i = 1, sum = 0;
    while(i &lt;= 1000)
    {
        sum = sum + i;
        i++;
    }</code></pre>
<h4 id="for문">for문</h4>
<ul>
<li><p><code>for(;;)</code>, <code>while(1)</code> 는 무한루프!</p>
</li>
<li><p><code>break</code> 사용 가능</p>
</li>
</ul>
<pre><code class="language-c">#include &lt;stdio.h&gt;
#define N 10

int main(void)
{
    int i, j;
    for(i = 0; i &lt; N; i++)
    {
        for(j = 0; j &lt; N; j++)
        {
            printf(&quot;🥰&quot;);
                            // 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰
                            // 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰
                            // 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰
                            // 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰
                            // 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰
                            // 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰
                            // 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰
                            // 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰
                            // 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰
                            // 🥰🥰🥰🥰🥰🥰🥰🥰🥰🥰
        }
        printf(&quot;\n&quot;);
    }
    return 0;
}</code></pre>
<br/>

<h2 id="9-입력-받기">9. 입력 받기</h2>
<ul>
<li><p><code>scanf(&quot;자료형&quot;, &amp;변수명);</code></p>
</li>
<li><p><code>scanf</code>로 입력을 받을 수 있다.
입력 받을 때에도 <code>%d</code>, <code>%c</code> 등 데이터 타입을 지정해준다!</p>
</li>
<li><p><code>&amp;</code>는 메모리 주소를 의미한다.</p>
</li>
</ul>
<pre><code class="language-c">    char o;
    int x, y;
    while(1)
    {
        printf(&quot;수식을 입력하세요.&quot;);
        scanf(&quot;%d %c %d&quot;, &amp;x, &amp;o, &amp;y); // 사용자가 입력한 값이 순서대로 들어간다.
        if(o == &#39;+&#39;)
        {
            printf(&quot;%d %c %d = %d\n&quot;, x, o, y, x+y); // 3 + 5 = 8
        }
    }</code></pre>
<h4 id="입력-받을-때-주의할-점--c언어의-버퍼-처리">입력 받을 때 주의할 점 :: C언어의 버퍼 처리</h4>
<ul>
<li><p>scanf() 함수를 쓸 때 형식 지정자를 <code>%c</code>로 하면, 엔터도 하나의 공백 문자로서 인식한다.</p>
</li>
<li><p>하나의 값만 입력받는다는 의미로 <code>getchar();</code>를 추가해서 엔터를 처리해줘야 한다.</p>
</li>
</ul>
<br/>

<h2 id="10-사용자-정의-함수">10. 사용자 정의 함수</h2>
<pre><code class="language-c">반환형태 함수명(매개변수)
{
    실행
}</code></pre>
<ul>
<li><p>반환값이 없으면 반환형태에 <code>void</code>를 적으면 된다.</p>
</li>
<li><p>main 함수 밖에 변수를 선언하면 전역 변수로 사용할 수 있다.</p>
</li>
</ul>
<pre><code class="language-c">// 전역 변수: main 함수 밖에 선언
int hour;
int minute;
int minuteAdd;

void counter()
{
    minute += minuteAdd;
    hour += minute / 60;
    minute %= 60;
    hour %= 24;
}</code></pre>
]]></description>
        </item>
        <item>
            <title><![CDATA[[C언어] MacOS - VSC에 C언어 개발 환경 구축하기]]></title>
            <link>https://velog.io/@e_juhee/C%EC%96%B8%EC%96%B4-MacOS-VSC%EC%97%90-C%EC%96%B8%EC%96%B4-%EA%B0%9C%EB%B0%9C-%ED%99%98%EA%B2%BD-%EA%B5%AC%EC%B6%95%ED%95%98%EA%B8%B0</link>
            <guid>https://velog.io/@e_juhee/C%EC%96%B8%EC%96%B4-MacOS-VSC%EC%97%90-C%EC%96%B8%EC%96%B4-%EA%B0%9C%EB%B0%9C-%ED%99%98%EA%B2%BD-%EA%B5%AC%EC%B6%95%ED%95%98%EA%B8%B0</guid>
            <pubDate>Fri, 17 Mar 2023 11:27:59 GMT</pubDate>
            <description><![CDATA[<h2 id="c언어-개발-환경-설정하기">C언어 개발 환경 설정하기</h2>
<h3 id="1-확장-프로그램-설치">1. 확장 프로그램 설치</h3>
<ul>
<li>VSC에서 확장 프로그램 <code>C/C++</code>이랑 <code>Code Runner</code> 이 두개를 설치해준다.</li>
</ul>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/1a36c797-d62f-4888-9de8-e54967d1fd04/image.png" alt=""></p>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/4f28a33e-80b2-49f5-9312-9b773fc829c5/image.png" alt=""></p>
<br/>

<h3 id="2-설정-변경">2. 설정 변경</h3>
<ul>
<li><code>Code &gt; 기본 설정 &gt; 설정</code> 으로 들어간다.</li>
</ul>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/d3aafeec-5d17-4ead-a4f3-d6d37f8e1ab3/image.png" alt=""></p>
<ul>
<li><p><code>run in terminal</code> 검색</p>
</li>
<li><p>왼쪽에서 <code>Run Code configuration</code> 클릭</p>
</li>
<li><p><code>Code-runner: Run in Terminal</code>에 체크한다.</p>
</li>
</ul>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/61c0a228-813e-4cfe-b4a9-ea8d6941f0be/image.png" alt=""></p>
<br/>

<h3 id="3-파일-실행">3. 파일 실행</h3>
<ul>
<li><code>hello.c</code> 파일을 만들어줬다.</li>
</ul>
<pre><code class="language-c">#include &lt;stdio.h&gt;

int main(void)
{
    printf(&quot;hello world\n&quot;);
    return 0;
}</code></pre>
<ul>
<li><p>오른쪽 위에 있는 ▶️ (Run Code) 버튼 누르면 실행 완료~!</p>
</li>
<li><p>터미널에 <code>hello world</code>가 출력되었다.</p>
</li>
</ul>
<p><img src="https://velog.velcdn.com/images/e_juhee/post/60517be0-03ec-4f95-bbdb-d239ca3aad4e/image.png" alt=""></p>
]]></description>
        </item>
    </channel>
</rss>