<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
    <channel>
        <title>dev_ing.log</title>
        <link>https://velog.io/</link>
        <description>으잉?</description>
        <lastBuildDate>Wed, 29 Apr 2026 05:24:19 GMT</lastBuildDate>
        <docs>https://validator.w3.org/feed/docs/rss2.html</docs>
        <generator>https://github.com/jpmonette/feed</generator>
        <image>
            <title>dev_ing.log</title>
            <url>https://velog.velcdn.com/images/dev_ing/profile/d88380c9-4e34-41e9-95b3-e787dbeb4685/image.JPG</url>
            <link>https://velog.io/</link>
        </image>
        <copyright>Copyright (C) 2019. dev_ing.log. All rights reserved.</copyright>
        <atom:link href="https://v2.velog.io/rss/dev_ing" rel="self" type="application/rss+xml"/>
        <item>
            <title><![CDATA[어포던스 원리: 웹 및 디지털 디자인에서의 적용]]></title>
            <link>https://velog.io/@dev_ing/%EC%96%B4%ED%8F%AC%EB%8D%98%EC%8A%A4-%EC%9B%90%EB%A6%AC-%EC%9B%B9-%EB%B0%8F-%EB%94%94%EC%A7%80%ED%84%B8-%EB%94%94%EC%9E%90%EC%9D%B8%EC%97%90%EC%84%9C%EC%9D%98-%EC%A0%81%EC%9A%A9</link>
            <guid>https://velog.io/@dev_ing/%EC%96%B4%ED%8F%AC%EB%8D%98%EC%8A%A4-%EC%9B%90%EB%A6%AC-%EC%9B%B9-%EB%B0%8F-%EB%94%94%EC%A7%80%ED%84%B8-%EB%94%94%EC%9E%90%EC%9D%B8%EC%97%90%EC%84%9C%EC%9D%98-%EC%A0%81%EC%9A%A9</guid>
            <pubDate>Wed, 29 Apr 2026 05:24:19 GMT</pubDate>
            <description><![CDATA[<blockquote>
<p>원본글 : <a href="https://www.adviva.it/news/affordance-webdesign/">https://www.adviva.it/news/affordance-webdesign/</a></p>
</blockquote>
<p>어포던스(Affordance)는 사용자가 특정 대상이나 인터페이스를 보았을 때, 그것이 어떻게 사용될 수 있는지를 직관적으로 이해하게 만드는 속성을 의미한다. 디지털 디자인에서는 이 개념이 특히 중요하며, 사용자와 인터페이스 간 상호작용의 핵심 기반이 된다.
<img src="https://velog.velcdn.com/images/dev_ing/post/f0ba62c3-d158-4e39-9029-027ee2949948/image.png" alt=""></p>
<h4 id="디지털-디자인에서의-어포던스"><strong>디지털 디자인에서의 어포던스</strong></h4>
<p>디지털 환경에서의 어포던스는 물리적 대상과 달리 직접적인 촉각 정보가 제한되기 때문에, 시각적 요소와 상징 체계에 크게 의존한다. 버튼, 아이콘, 색상, 그림자, 애니메이션 등은 사용자가 어떤 행동을 취할 수 있는지를 암시하는 역할을 한다.
즉, 사용자는 인터페이스를 “설명 없이도” 이해해야 하며, 디자인은 이러한 직관적 사용 가능성을 지원해야 한다.
<br><br></p>
<h4 id="어포던스가-사용자-경험에-미치는-영향"><strong>어포던스가 사용자 경험에 미치는 영향</strong></h4>
<p>어포던스는 사용자 경험(UX)에 직접적인 영향을 미친다.
명확한 어포던스는 사용자의 인지 부담을 줄이고, 빠르고 정확한 인터랙션을 가능하게 한다. 반대로 어포던스가 부족하거나 모호하면 사용자는 혼란을 느끼고, 잘못된 행동을 하거나 기능을 인식하지 못할 수 있다.
예를 들어, 버튼처럼 보이지 않는 요소는 클릭 가능함에도 불구하고 사용되지 않을 수 있다.
<br><br></p>
<h4 id="깁슨과-노먼의-이론"><strong>깁슨과 노먼의 이론</strong></h4>
<p>어포던스 개념은 제임스 J. 깁슨(James J. Gibson)에 의해 처음 제시되었다. 
그는 어포던스를 <strong>환경이 제공하는 “행동 가능성”</strong> 으로 정의하였다.</p>
<p>이후 도널드 노먼(Donald Norman)은 이 개념을 디자인 분야로 확장하면서,
<strong>사용자가 실제로 “인지하는 어포던스(perceived affordance)”를 강조</strong>하였다.</p>
<p>즉, 중요한 것은 <strong>실제 기능이 아니라,사용자가 그것을 어떻게 해석하고 이해하느냐</strong>이다.</p>
<p><br><br></p>
<h4 id="어포던스를-고려한-디자인"><strong>어포던스를 고려한 디자인</strong></h4>
<p>어포던스를 효과적으로 설계하기 위해서는 다음과 같은 요소들이 고려되어야 한다:
    •    시각적 단서(색상, 대비, 형태)
    •    일관된 인터페이스 패턴
    •    사용자 기대에 부합하는 상호작용 방식
    •    명확한 피드백 제공
특히 모바일 환경에서는 터치 기반 인터랙션이기 때문에,
작은 시각적 요소 하나가 행동을 유도하는 결정적 요소가 된다.
<br><br></p>
<h4 id="터치스크린-환경에서의-어포던스"><strong>터치스크린 환경에서의 어포던스</strong></h4>
<p>터치스크린의 발전은 어포던스 개념을 더욱 중요하게 만들었다.
물리적 버튼이 사라지면서, 모든 상호작용은 화면 위의 시각적 표현에 의존하게 되었기 때문이다.
이로 인해 디자이너는 다음을 해결해야 한다:
    •    무엇이 눌릴 수 있는지
    •    무엇이 스크롤 가능한지
    •    무엇이 단순 정보인지
이러한 구분을 명확히 하지 않으면 사용성 문제가 발생한다.
<br><br></p>
<h4 id="어포던스의-유형"><strong>어포던스의 유형</strong></h4>
<p>어포던스는 여러 형태로 구분될 수 있으며, 대표적으로 다음과 같다:
    •    지각된 어포던스 (Perceived): 사용자가 인지하는 가능성
    •    실제 어포던스 (Real): 실제로 가능한 행동
    •    숨겨진 어포던스 (Hidden): 학습을 통해서만 알 수 있는 기능
    •    잘못된 어포던스 (False): 가능해 보이지만 실제로는 불가능한 경우
<br><br></p>
<h4 id="좋은-어포던스를-설계하는-방법"><strong>좋은 어포던스를 설계하는 방법</strong></h4>
<p>효과적인 어포던스를 보장하기 위해서는:
    •    명확한 시각적 계층 구조를 설계하고
    •    인터랙션 가능 요소를 강조하며
    •    사용자 기대와 일치하는 패턴을 유지하고
    •    피드백을 즉각적으로 제공해야 한다
결국 좋은 어포던스는 “<strong>설명 없이도 사용 가능한 인터페이스</strong>”를 만드는 데 있다.
<br><br></p>
<h4 id="시각적-언어와-어포던스"><strong>시각적 언어와 어포던스</strong></h4>
<p>어포던스는 단순한 기능 요소가 아니라,
디자인의 시각적 언어와 깊이 연결되어 있다.
아이콘, 색상, 형태, 공간 배치 등은 모두
사용자에게 행동을 유도하는 기호(sign)로 작용하며,
이는 정보 디자인과 기호학적 해석의 중요한 영역이 된다.</p>
]]></description>
        </item>
        <item>
            <title><![CDATA[사진 빛 반사 지우는 방법 포토샵]]></title>
            <link>https://velog.io/@dev_ing/%EC%82%AC%EC%A7%84-%EB%B9%9B-%EB%B0%98%EC%82%AC-%EC%A7%80%EC%9A%B0%EB%8A%94-%EB%B0%A9%EB%B2%95-%ED%8F%AC%ED%86%A0%EC%83%B5</link>
            <guid>https://velog.io/@dev_ing/%EC%82%AC%EC%A7%84-%EB%B9%9B-%EB%B0%98%EC%82%AC-%EC%A7%80%EC%9A%B0%EB%8A%94-%EB%B0%A9%EB%B2%95-%ED%8F%AC%ED%86%A0%EC%83%B5</guid>
            <pubDate>Mon, 03 Nov 2025 01:02:28 GMT</pubDate>
            <description><![CDATA[<p>필터 &gt; 카메라 로우 &gt; 지우개 (선택) &gt; 방해요소 제거 하단 <strong>반사</strong> 적용 (체크)</p>
]]></description>
        </item>
        <item>
            <title><![CDATA[지식이란 무엇인가]]></title>
            <link>https://velog.io/@dev_ing/%EC%A7%80%EC%8B%9D%EC%9D%B4%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80</link>
            <guid>https://velog.io/@dev_ing/%EC%A7%80%EC%8B%9D%EC%9D%B4%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80</guid>
            <pubDate>Wed, 10 Sep 2025 08:32:04 GMT</pubDate>
            <description><![CDATA[<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>정보에서 지혜까지의 변화 과정</title>
    <style>
        body {
            font-family: 'Arial', sans-serif;
            background:white;
            margin: 0;
            padding: 20px;
            min-height: 100vh;
        }

<pre><code>    .container {
        max-width: 1200px;
        margin: 0 auto;
        background: rgba(255, 255, 255, 0.95);
        border-radius: 20px;
        padding: 40px;
        box-shadow: 0 20px 40px rgba(0,0,0,0.1);
    }

    h1 {
        text-align: center;
        color: #333;
        margin-bottom: 40px;
        font-size: 28px;
    }

    .flow-container {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 30px;
    }

    .stage {
        background: white;
        border-radius: 15px;
        padding: 25px;
        width: 100%;
        max-width: 800px;
        box-shadow: 0 10px 25px rgba(0,0,0,0.1);
        border-left: 6px solid;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        position: relative;
    }

    .stage:hover {
        transform: translateY(-5px);
        box-shadow: 0 15px 35px rgba(0,0,0,0.15);
    }

    .stage-data {
        border-left-color: #ff6b6b;
        background: linear-gradient(135deg, #fff5f5 0%, #fff 100%);
    }

    .stage-information {
        border-left-color: #4ecdc4;
        background: linear-gradient(135deg, #f0fdfc 0%, #fff 100%);
    }

    .stage-knowledge {
        border-left-color: #45b7d1;
        background: linear-gradient(135deg, #f0f9ff 0%, #fff 100%);
    }

    .stage-wisdom {
        border-left-color: #f7b731;
        background: linear-gradient(135deg, #fffbf0 0%, #fff 100%);
    }

    .stage-title {
        font-size: 24px;
        font-weight: bold;
        margin-bottom: 15px;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .stage-icon {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        font-size: 20px;
        font-weight: bold;
    }

    .icon-data { background: #ff6b6b; }
    .icon-information { background: #4ecdc4; }
    .icon-knowledge { background: #45b7d1; }
    .icon-wisdom { background: #f7b731; }

    .stage-content {
        font-size: 16px;
        line-height: 1.6;
        color: #555;
    }

    .characteristics {
        margin-top: 15px;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: 10px;
    }

    .characteristic {
        background: rgba(255,255,255,0.7);
        padding: 10px 15px;
        border-radius: 8px;
        font-size: 14px;
        border: 1px solid rgba(0,0,0,0.1);
    }

    .arrow {
        font-size: 30px;
        color: #666;
        margin: 10px 0;
        animation: bounce 2s infinite;
    }

    @keyframes bounce {
        0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
        40% { transform: translateY(-10px); }
        60% { transform: translateY(-5px); }
    }

    .process-flow {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 40px 0;
        flex-wrap: wrap;
        gap: 20px;
    }

    .process-step {
        flex: 1;
        min-width: 200px;
        text-align: center;
        padding: 20px;
        background: white;
        border-radius: 10px;
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    }

    .process-arrow {
        font-size: 24px;
        color: #666;
        margin: 0 10px;
    }

    .highlight {
        background: linear-gradient(120deg, #a8edea 0%, #fed6e3 100%);
        padding: 20px;
        border-radius: 10px;
        margin-top: 30px;
        border: 2px dashed #666;
    }

    .highlight h3 {
        margin-top: 0;
        color: #333;
    }
&lt;/style&gt;</code></pre></head>
<body>
    <div class="container">
        <h1>📊 데이터에서 지혜까지의 변화 과정</h1>

<pre><code>    &lt;div class=&quot;flow-container&quot;&gt;
        &lt;div class=&quot;stage stage-data&quot;&gt;
            &lt;div class=&quot;stage-title&quot;&gt;
                &lt;div class=&quot;stage-icon icon-data&quot;&gt;📊&lt;/div&gt;
                데이터 (Data)
            &lt;/div&gt;
            &lt;div class=&quot;stage-content&quot;&gt;
                &lt;strong&gt;정보로서 완전한 형태와 의미를 갖추지 못한 모습&lt;/strong&gt;
                &lt;div class=&quot;characteristics&quot;&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 원시 상태의 사실들&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 아직 가공되지 않은 형태&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 단순한 기록이나 측정값&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 맥락이 부족한 상태&lt;/div&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;

        &lt;div class=&quot;arrow&quot;&gt;⬇️&lt;/div&gt;

        &lt;div class=&quot;stage stage-information&quot;&gt;
            &lt;div class=&quot;stage-title&quot;&gt;
                &lt;div class=&quot;stage-icon icon-information&quot;&gt;📋&lt;/div&gt;
                정보 (Information)
            &lt;/div&gt;
            &lt;div class=&quot;stage-content&quot;&gt;
                &lt;strong&gt;목적에 따라 의미와 가치를 지니며 생산자와 사용자의 관점에 따라 다양하게 정의&lt;/strong&gt;
                &lt;div class=&quot;characteristics&quot;&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 데이터가 처리되어 의미를 가짐&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 특정 목적을 위해 조직화됨&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 사용자에게 유용한 형태&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 맥락과 함께 제공됨&lt;/div&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;

        &lt;div class=&quot;arrow&quot;&gt;⬇️&lt;/div&gt;

        &lt;div class=&quot;stage stage-knowledge&quot;&gt;
            &lt;div class=&quot;stage-title&quot;&gt;
                &lt;div class=&quot;stage-icon icon-knowledge&quot;&gt;🧠&lt;/div&gt;
                지식 (Knowledge)
            &lt;/div&gt;
            &lt;div class=&quot;stage-content&quot;&gt;
                &lt;strong&gt;정보가 축적되어 개인화 과정을 통해 축적된 갑으로써 지식으로 전환&lt;/strong&gt;
                &lt;div class=&quot;characteristics&quot;&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 우리가 생활을 영위하면서 인위적으로 습득&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 고도의 논리적 상식&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 개인의 경험과 결합&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 체계화된 정보의 집합&lt;/div&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;

        &lt;div class=&quot;arrow&quot;&gt;⬇️&lt;/div&gt;

        &lt;div class=&quot;stage stage-wisdom&quot;&gt;
            &lt;div class=&quot;stage-title&quot;&gt;
                &lt;div class=&quot;stage-icon icon-wisdom&quot;&gt;💎&lt;/div&gt;
                지혜 (Wisdom)
            &lt;/div&gt;
            &lt;div class=&quot;stage-content&quot;&gt;
                &lt;strong&gt;지식보다도 상위 개념인 지혜: 정신적 작용이 필요&lt;/strong&gt;
                &lt;div class=&quot;characteristics&quot;&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 공극적으로 쉽게 영위하는 데 필요한 지식과 지혜&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 깊은 이해와 통찰력&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 올바른 판단력&lt;/div&gt;
                    &lt;div class=&quot;characteristic&quot;&gt;🔸 실생활에 적용 가능한 형태&lt;/div&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;

    &lt;div class=&quot;highlight&quot;&gt;
        &lt;h3&gt;🎯 핵심 포인트&lt;/h3&gt;
        &lt;p&gt;&lt;strong&gt;변화 과정:&lt;/strong&gt; 데이터 → 정보 → 지식 → 지혜&lt;/p&gt;
        &lt;p&gt;&lt;strong&gt;각 단계의 특징:&lt;/strong&gt;&lt;/p&gt;
        &lt;ul&gt;
            &lt;li&gt;&lt;strong&gt;데이터:&lt;/strong&gt; 가공되지 않은 원시 상태&lt;/li&gt;
            &lt;li&gt;&lt;strong&gt;정보:&lt;/strong&gt; 목적과 의미를 가진 가공된 데이터&lt;/li&gt;
            &lt;li&gt;&lt;strong&gt;지식:&lt;/strong&gt; 축적되고 체계화된 정보&lt;/li&gt;
            &lt;li&gt;&lt;strong&gt;지혜:&lt;/strong&gt; 지식을 바탕으로 한 깊은 이해와 판단력&lt;/li&gt;
        &lt;/ul&gt;
    &lt;/div&gt;

    &lt;div class=&quot;process-flow&quot;&gt;
        &lt;div class=&quot;process-step&quot;&gt;
            &lt;h4&gt;🔄 처리&lt;/h4&gt;
            &lt;p&gt;데이터를 가공하여 의미 부여&lt;/p&gt;
        &lt;/div&gt;
        &lt;div class=&quot;process-arrow&quot;&gt;➡️&lt;/div&gt;
        &lt;div class=&quot;process-step&quot;&gt;
            &lt;h4&gt;🎯 목적화&lt;/h4&gt;
            &lt;p&gt;특정 용도에 맞게 조직화&lt;/p&gt;
        &lt;/div&gt;
        &lt;div class=&quot;process-arrow&quot;&gt;➡️&lt;/div&gt;
        &lt;div class=&quot;process-step&quot;&gt;
            &lt;h4&gt;📚 축적&lt;/h4&gt;
            &lt;p&gt;경험과 학습을 통한 체계화&lt;/p&gt;
        &lt;/div&gt;
        &lt;div class=&quot;process-arrow&quot;&gt;➡️&lt;/div&gt;
        &lt;div class=&quot;process-step&quot;&gt;
            &lt;h4&gt;💡 통찰&lt;/h4&gt;
            &lt;p&gt;깊은 이해를 통한 지혜 획득&lt;/p&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;</code></pre></body>
</html>]]></description>
        </item>
        <item>
            <title><![CDATA[개인정보 보호법 개정 (2023.03.07ver)]]></title>
            <link>https://velog.io/@dev_ing/%EA%B0%9C%EC%9D%B8%EC%A0%95%EB%B3%B4-%EB%B3%B4%ED%98%B8%EB%B2%95-%EA%B0%9C%EC%A0%95-2023.03.07ver</link>
            <guid>https://velog.io/@dev_ing/%EA%B0%9C%EC%9D%B8%EC%A0%95%EB%B3%B4-%EB%B3%B4%ED%98%B8%EB%B2%95-%EA%B0%9C%EC%A0%95-2023.03.07ver</guid>
            <pubDate>Tue, 07 Mar 2023 14:59:36 GMT</pubDate>
            <description><![CDATA[<p><img src="https://velog.velcdn.com/images/dev_ing/post/26323c85-40eb-4651-9ca7-5a339937ab96/image.jpeg" alt=""><img src="https://velog.velcdn.com/images/dev_ing/post/a989f9d2-98e8-4578-a41f-6f2ee554095c/image.jpeg" alt=""></p>
<p>휴면처리 폐지
개인정보보호법 제39조의6(유효기간제), 이용자와 기업의 불편 해소를 위해 삭제됨
기존에는 1년 이상 이용하지 아니하는 이용자의 개인정보에 대해 조치를 취해야한다고 규정되어 있었고, 이때문에 휴먼 계정이라는 제도가 유지되었음
해당 내용이 삭제되었으므로 휴먼 계정도 불필요함</p>
<p>개인정보보호법 위반 행위에 대한 경제적 처벌 강화
처벌 강화하고 개인정보 동의 절차 간소화 시킴</p>
<p>개인정보 전송요구권 신설 예정
금융기관에서 사용하고 있는 마이데이터같이, 개인정보를 제3자에게 전송해달라고 할 수 있는 권리임</p>
<p>관련 참조 : <a href="https://www.pipc.go.kr/np/cop/bbs/selectBoardArticle.do?bbsId=BS074&amp;mCode=C020010000&amp;nttId=8674">https://www.pipc.go.kr/np/cop/bbs/selectBoardArticle.do?bbsId=BS074&amp;mCode=C020010000&amp;nttId=8674</a></p>
]]></description>
        </item>
        <item>
            <title><![CDATA[r]]></title>
            <link>https://velog.io/@dev_ing/r</link>
            <guid>https://velog.io/@dev_ing/r</guid>
            <pubDate>Wed, 08 Feb 2023 07:40:57 GMT</pubDate>
            <description><![CDATA[<p><img src="https://velog.velcdn.com/images/dev_ing/post/1505f27b-ee89-43b2-95e5-7de9c47ae06e/image.png" alt="">
<img src="https://velog.velcdn.com/images/dev_ing/post/51dd1975-f120-4d91-b1f4-6890abf66a72/image.jpg" alt="">
<img src="https://velog.velcdn.com/images/dev_ing/post/970ebbeb-7cec-44eb-9e78-3c41065516e6/image.png" alt="">
<img src="https://velog.velcdn.com/images/dev_ing/post/406efc30-3d79-42d8-bc55-7e160283589f/image.png" alt="">
<img src="https://velog.velcdn.com/images/dev_ing/post/85dddfcf-c060-4bb2-9a11-f3839fc74fa2/image.png" alt=""></p>
<p><img src="https://velog.velcdn.com/images/dev_ing/post/aa41e128-ec60-441e-8286-14c63830013a/image.png" alt=""></p>
<p><img src="https://velog.velcdn.com/images/dev_ing/post/dba8bff4-7781-4243-af41-b525f4813574/image.png" alt=""></p>
]]></description>
        </item>
        <item>
            <title><![CDATA[for문]]></title>
            <link>https://velog.io/@dev_ing/for%EB%AC%B8</link>
            <guid>https://velog.io/@dev_ing/for%EB%AC%B8</guid>
            <pubDate>Mon, 30 Jan 2023 02:48:11 GMT</pubDate>
            <description><![CDATA[<p><img src="https://velog.velcdn.com/images/dev_ing/post/c252954e-f5ae-4cf0-950c-0c7c273798ae/image.png" alt=""> <img src="https://velog.velcdn.com/images/dev_ing/post/c9a81a5e-67d0-4268-99ea-d1327a36f623/image.png" alt=""></p>
<p>①초기식이 제일 먼저 실행 </p>
<p>그런 뒤 ②조건식을 평가해서 참이면 
③실행문을 실행시키고 거짓이면 for문을 종료 </p>
<p>만약 실행문이 실행되었다면 내부의 ③실행문을 모두 실행시키고 ④증감식을 실행 시킨 뒤 다시 ②조건식을 평가함</p>
]]></description>
        </item>
        <item>
            <title><![CDATA[구글 메터리얼 아이콘 사이즈 변경 ]]></title>
            <link>https://velog.io/@dev_ing/%EA%B5%AC%EA%B8%80-%EB%A9%94%ED%84%B0%EB%A6%AC%EC%96%BC-%EC%95%84%EC%9D%B4%EC%BD%98-%EC%82%AC%EC%9D%B4%EC%A6%88-%EB%B3%80%EA%B2%BD</link>
            <guid>https://velog.io/@dev_ing/%EA%B5%AC%EA%B8%80-%EB%A9%94%ED%84%B0%EB%A6%AC%EC%96%BC-%EC%95%84%EC%9D%B4%EC%BD%98-%EC%82%AC%EC%9D%B4%EC%A6%88-%EB%B3%80%EA%B2%BD</guid>
            <pubDate>Wed, 25 Jan 2023 08:14:07 GMT</pubDate>
            <description><![CDATA[<p>▼<a href="https://fonts.google.com/icons?selected=Material+Icons">구글 메테리얼 아이콘</a>에서 가져온 아이콘 사이즈 변경 방법 ▼</p>
<hr>
<pre><code>*.material-icons{
    font-size: 48px;
}</code></pre><hr>
<p><img src="https://velog.velcdn.com/images/dev_ing/post/193970c6-aafc-4b24-bee8-d36aad544d18/image.png" alt=""></p>
<p>출처 : <a href="https://stackoverflow.com/questions/55395192/resizing-google-material-icons-font-size">https://stackoverflow.com/questions/55395192/resizing-google-material-icons-font-size</a></p>
]]></description>
        </item>
        <item>
            <title><![CDATA[브레드 크럼즈(Breadcrumbs)]]></title>
            <link>https://velog.io/@dev_ing/%EB%B8%8C%EB%A0%88%EB%93%9C-%ED%81%AC%EB%9F%BC%EC%A6%88Breadcrumbs</link>
            <guid>https://velog.io/@dev_ing/%EB%B8%8C%EB%A0%88%EB%93%9C-%ED%81%AC%EB%9F%BC%EC%A6%88Breadcrumbs</guid>
            <pubDate>Thu, 19 Jan 2023 01:12:24 GMT</pubDate>
            <description><![CDATA[<p>번역하면 &#39;빵 부스러기&#39; 혹은 &#39;빵가루&#39;라는 의미로 헨젤과 그레텔에서 따온 용어이다.</p>
<p>사이트의 전체 구조를 한눈에 볼 수 있어 사용자가 현 위치에 대한 맥락을 쉽게 알 수 있어 사용되곤 함. </p>
<p>홈(Home)부터 상위 카테고리(2Depth), 하위 카테고리(3Depth), 현 위치 순으로 정보를 보여주며 클릭 시 해당 페이지로 쉽게 이동 가능하여 서비스 내 이탈률을 줄여주기도 함.</p>
<p>사용자가 어떤 경로로 해당 페이지로 들어오게 되었는지 그 경로(내비게이션)를 보여주는 것이 바로 브레드 크럼즈이다.</p>
<p><img src="https://velog.velcdn.com/images/dev_ing/post/c8b25ed4-c11a-4256-b234-bf70aed40407/image.jpg" alt=""></p>
]]></description>
        </item>
        <item>
            <title><![CDATA[미디어 쿼리 크롬에서 확인 방법]]></title>
            <link>https://velog.io/@dev_ing/%EB%AF%B8%EB%94%94%EC%96%B4-%EC%BF%BC%EB%A6%AC-%ED%81%AC%EB%A1%AC%EC%97%90%EC%84%9C-%ED%99%95%EC%9D%B8-%EB%B0%A9%EB%B2%95</link>
            <guid>https://velog.io/@dev_ing/%EB%AF%B8%EB%94%94%EC%96%B4-%EC%BF%BC%EB%A6%AC-%ED%81%AC%EB%A1%AC%EC%97%90%EC%84%9C-%ED%99%95%EC%9D%B8-%EB%B0%A9%EB%B2%95</guid>
            <pubDate>Mon, 19 Dec 2022 01:32:23 GMT</pubDate>
            <description><![CDATA[<p>Media Query Viewer
Sometimes we think it&#39;s hard to test it, but Chrome/Edge DevTools has a hidden gem to deal and handle easily with those breakpoints. I will show you how to activate this superpower.</p>
<p>Open Chrome/Edge DevTools
Enable Mobile view
Ensure select &quot;Responsive&quot; on the device list.
Select &quot;show media queries&quot;
<img src="https://velog.velcdn.com/images/dev_ing/post/9a250d30-3550-4651-bd3c-838d4393593e/image.gif" alt=""></p>
<p>출처 : <a href="https://dev.to/equiman/how-to-test-media-queries-with-chrome-5d8c">https://dev.to/equiman/how-to-test-media-queries-with-chrome-5d8c</a></p>
]]></description>
        </item>
        <item>
            <title><![CDATA[웹 개발 스터디 일지 #08_01]]></title>
            <link>https://velog.io/@dev_ing/%EC%9B%B9-%EA%B0%9C%EB%B0%9C-%EC%8A%A4%ED%84%B0%EB%94%94-%EC%9D%BC%EC%A7%80-01</link>
            <guid>https://velog.io/@dev_ing/%EC%9B%B9-%EA%B0%9C%EB%B0%9C-%EC%8A%A4%ED%84%B0%EB%94%94-%EC%9D%BC%EC%A7%80-01</guid>
            <pubDate>Mon, 01 Aug 2022 15:51:36 GMT</pubDate>
            <description><![CDATA[<h4 id="새롭게-배운점">&lt;새롭게 배운점&gt;</h4>
<ol>
<li>운영체제의 구분에 대해 명확하게 이해할 수 있었다. </li>
</ol>
<ul>
<li>서버(server)와 클라이언트(client)의 차이
서버는 요청을 받고 서비스를 제공해주는 쪽이고 클라이언트는 요청을 하는쪽이였다.
가게로 예를 들자면 가게 주인은 서버고 손님은 클라이언트인 것이다.</li>
</ul>
<ol start="2">
<li><p>서버용 운영체제가 있다는 점을 알게되었다. </p>
<ul>
<li>윈도우 계열과 유닉스 계열이 있다고 하는데 유닉스 계열에는 솔라리스와 레드헷, 페도라가 있다고 한다. </li>
</ul>
</li>
<li><p>터미널과 쉘에 대해 알게되었다. </p>
</li>
</ol>
<ul>
<li>터미널은 콘솔상에서 실행하여 명령어를 입력하기 위한 환경이라고 하고 쉘은 터미널에 탑제된 명령어 해석기라고 한다. </li>
<li>쉘에는 유닉스 계열과 윈도우 계열이 있는데 
유닉스 계열에는 c, bash,zsh쉘이 있고
윈도우 계열에는 powershell과 많이 들어봤던 cmd(명령프롬프트)가 있었다. </li>
</ul>
<ol start="4">
<li><p>파일 확장자 부분을 배우며 압축 파일 확장자에 zip외에도 여러가지가 있다는 점을 알게되었다.</p>
<ul>
<li>7z, rar, tar.gz</li>
</ul>
</li>
<li><p>디렉토리에는 절대경로와 상대경로가 있다는 점을 배웠다. </p>
</li>
</ol>
<ul>
<li>절대경로는 최초의 시작점부터 경유한 경로를 전부 입력하는 방식이고</li>
<li>상대경로는 현재 위치하고있는 폴더를 기준으로 특정 파일이나 폴더의 위치를 설명하는 방식이다.</li>
</ul>
<ol start="6">
<li>터미널 기본 명령어에 대해 알게되었다. </li>
</ol>
<ul>
<li>mac과 window가 단어가 비슷하면서 다르다.
누가 다르게 만들었을까 😑
이 부분은 아직 정리할 만큼 이해하지 못해서 주말에 추가로 정리해보려고 한다.</li>
</ul>
<hr>
터미널을 이용하여 xcode설치하는법을 알게되었다.
좀 전에 혼자 mac os 에서 해보았는데 두번의 시도 끝에 성공하였다.

<p><img src="https://velog.velcdn.com/images/dev_ing/post/43eef6ae-d6c0-44b4-9367-5ae8567a735f/image.png" alt=""></p>
<h4 id="실패-이유">&lt;실패 이유&gt;</h4>
<p>첫번째 시도는 select--install이라고 적어서 실패였다.</p>
<h4 id="깨달은-점">&lt;깨달은 점&gt;</h4>
<p>select과 -- 사이에 띄어쓰기를 했어야 했다는걸 깨달았고 두번째 시도만에 성공하였다.</p>
<hr>
틀린부분이 있다면 아무나 알려주세요
😎댓글 환영😎]]></description>
        </item>
        <item>
            <title><![CDATA[list-style-type (-)하이픈 넣기]]></title>
            <link>https://velog.io/@dev_ing/list-style-type-%ED%95%98%EC%9D%B4%ED%94%88-%EB%84%A3%EA%B8%B0</link>
            <guid>https://velog.io/@dev_ing/list-style-type-%ED%95%98%EC%9D%B4%ED%94%88-%EB%84%A3%EA%B8%B0</guid>
            <pubDate>Sun, 17 Jul 2022 03:41:59 GMT</pubDate>
            <description><![CDATA[<p>*<em>참조 블로그 *</em>
리스트 스타일 : <a href="https://hi098123.tistory.com/280">https://hi098123.tistory.com/280</a>
유니코드 변환 : <a href="https://hi098123.tistory.com/118">https://hi098123.tistory.com/118</a></p>
<hr>
스타일 부분을 이렇게 작성하면 심볼을 바꿀 수 있음

<p>li {
.... list-style-type:&quot;<strong>\2b50\fe0f\20</strong>&quot;;
.... }</p>
<p>=&gt; \2b50\fe0f\20는 유니코드로 변환한 ⭐️모양이다.</p>
<pre><code>&lt;style&gt;
    li{list-style-type:&quot;\2b50\fe0f\20&quot;;}
&lt;/style&gt;</code></pre><style>
    li{list-style-type:"\2b50\fe0f\20";}
</style>

<li>테스트 문자01</li>
<li>테스트 문자02</li>


<p>유니코드로 이모지나 (-)하이픈 등을 나타낼수 있음.</p>
]]></description>
        </item>
    </channel>
</rss>