<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
    <channel>
        <title>Be a Moon_Developer</title>
        <link>https://velog.io/</link>
        <description>개발자가 돼서 소같이 일하고 싶은</description>
        <lastBuildDate>Tue, 29 Dec 2020 14:18:59 GMT</lastBuildDate>
        <docs>https://validator.w3.org/feed/docs/rss2.html</docs>
        <generator>https://github.com/jpmonette/feed</generator>
        <image>
            <title>Be a Moon_Developer</title>
            <url>https://images.velog.io/images/duck-moon9392/profile/2922772f-0d90-4897-839c-9b283af907b1/IMG_7379.jpeg</url>
            <link>https://velog.io/</link>
        </image>
        <copyright>Copyright (C) 2019. Be a Moon_Developer. All rights reserved.</copyright>
        <atom:link href="https://v2.velog.io/rss/duck-moon9392" rel="self" type="application/rss+xml"/>
        <item>
            <title><![CDATA[TIL_20.12.28]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.28</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.28</guid>
            <pubDate>Tue, 29 Dec 2020 14:18:59 GMT</pubDate>
            <description><![CDATA[<h3 id="🧐-오늘의-공부">🧐 오늘의 공부</h3>
<ul>
<li>Codestate pre-sprint-twittler 완성!! : ) </li>
</ul>
<hr>

<h3 id="🥳아주-행복한-9기-생활">🥳아주 행복한 9기 생활</h3>
<p> : 이번에 Twittler sprint도 Pair Programming으로 진행이 됐습니다. 비슷한 점이 많은 Pair 분과 시간이 어떻게 흐르는지도 모르게 VSCode보다가 완성했네요. </p>
<p>  지난 기수에는 다른 분께서 기능을 담당하고 뚝딱 가져오신 것이 구동되는 걸 보고 넘어갔는데 이번 기수에서는 Pair분과 기능을 하나씩 만들어 Bare Minimum Requirements를 통과했습니다. Mockup부터 기능 구현까지 정말 재밌는 과정이었습니다. </p>
<p>  다른 사람과 얘기하고 문제를 해결해나가는 쾌감이 엄청나네요. 현실 세계에서도 서포터처럼 독려하고 도움주는 재미가 쏠쏠하네요.. <strong>저로 인해 다른 분들이 힘을 얻을 수 있게 이후로도 꾸준히 공부하고 포기하지 않는 개발자가 되겠습니다.</strong></p>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.22]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.22-ei82ocet</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.22-ei82ocet</guid>
            <pubDate>Tue, 22 Dec 2020 15:32:49 GMT</pubDate>
            <description><![CDATA[<h3 id="--오늘의-공부">- 오늘의 공부</h3>
<p> : Pair Programming으로 Algorithm Basic Coplit 해결 
 : Pair분이 푼 문제 따로 정리 및 다시 풀기 </p>
 <hr>]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.21]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.22</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.22</guid>
            <pubDate>Tue, 22 Dec 2020 15:27:05 GMT</pubDate>
            <description><![CDATA[<h3 id="--오늘의-공부">- 오늘의 공부</h3>
<p>: Pair Progrmming으로 고차함수 Coplit 해결 </p>
<ul>
<li>동혁님 감사합니다🙇‍♂️ </li>
</ul>
<p>: Pair가 푼 문제들 다시 풀기 </p>
<hr>]]></description>
        </item>
        <item>
            <title><![CDATA[WIL_20.12.19 ~ 20]]></title>
            <link>https://velog.io/@duck-moon9392/WIL20.12.19-20</link>
            <guid>https://velog.io/@duck-moon9392/WIL20.12.19-20</guid>
            <pubDate>Tue, 22 Dec 2020 15:24:37 GMT</pubDate>
            <description><![CDATA[<blockquote>
<p>첫 WIL</p>
</blockquote>
<h3 id="--주말-공부">- 주말 공부</h3>
<p> : 배열 Coplit fibonacci 풀기 (12/19)
 : 고차함수 이해하기 </p>
<ul>
<li>일급 객채(first-class citizen)인 함수 </li>
<li>고차함수 Coplit ~ Q. 14까지 풀기 (12/20)</li>
</ul>
<hr>]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.18]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.18</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.18</guid>
            <pubDate>Tue, 22 Dec 2020 15:20:02 GMT</pubDate>
            <description><![CDATA[<blockquote>
<p>반성하는 의미로 작성하는 TIL </p>
</blockquote>
<h3 id="--오늘의-공부">- 오늘의 공부</h3>
<p> : Flex를 이용한 앱 웹 화면 구현하기 - 공부가 필요합니다..
 : Pair분과 Twittler 와이어프레임 설계 및 목업 구현 </p>
<ul>
<li>Figma를 유용하게 사용. 적절한 Tag와 naming / 다양한 CSS property 사용 </li>
</ul>
<hr>
* 성재님이 공유해주신 Flex site 

<p><a href="https://css-tricks.com/snippets/css/a-guide-to-flexbox/">https://css-tricks.com/snippets/css/a-guide-to-flexbox/</a> </p>
<ul>
<li><p>Our Twittler </p>
<p> <img src="https://images.velog.io/images/duck-moon9392/post/5cc89992-7a4e-4358-92cd-259912044d6e/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202020-12-23%20%E1%84%8B%E1%85%A9%E1%84%8C%E1%85%A5%E1%86%AB%2012.12.45.png" alt=""></p>
</li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.17]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.17</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.17</guid>
            <pubDate>Tue, 22 Dec 2020 15:08:48 GMT</pubDate>
            <description><![CDATA[<blockquote>
<p>아... 반성하는 의미로 작성하는 TIL </p>
</blockquote>
<h3 id="--오늘의-공부">- 오늘의 공부</h3>
<p> : Koans Code보면서 공부</p>
<ul>
<li>Closure, hoisting 
: CSS Selector </li>
<li>Checkpoint 문제를 보면서 헷갈리는 개념 Screenshot.. 토대로 블로깅 필요</li>
</ul>
<hr>

<ul>
<li>조금 흔들린 날... === 헤이해진 날...</li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[Javascript - 변수(variable)]]></title>
            <link>https://velog.io/@duck-moon9392/Javascript-variable%EB%B3%80%EC%88%98</link>
            <guid>https://velog.io/@duck-moon9392/Javascript-variable%EB%B3%80%EC%88%98</guid>
            <pubDate>Thu, 17 Dec 2020 04:51:34 GMT</pubDate>
            <description><![CDATA[<h3 id="프로그래밍이란">프로그래밍이란</h3>
<p>:  데이터를 처리하는 것입니다. </p>
<ul>
<li>Codestate에서 Pre과정은 javascript 언어를 사용하며 4주간 과정에서 배운 내용을 javascript 기준으로 작성할 예정입니다</li>
</ul>
<h3 id="변수">변수</h3>
<ul>
<li><p>변수는 데이터의 보관함이며, 변수를 사용해 데이터를 편리하게 저장하고 사용할 수 있습니다</p>
</li>
<li><p><strong>변수의 선언과 할당</strong></p>
<p><strong>* 선언</strong> : 새로운 변수 보관함 생성(지하철 물품 보관함 선택)</p>
<p>** * 할당** - 보관함에 값 저장(지정한 물품 보관함에 물건 넣기)
: 변수는 <code>let</code>을 사용해 선언을 해주며 <code>=</code>을 이용해 앞에서 선언해준 변수에 값을 할당(assignment)해줄 수 있습니다
: (중요) javascript에서 <code>=</code>는 우리가 수학에서 알고 있는 &#39;같다&#39;의 의미가 아닌 <strong>&#39;변수에 할당&#39;</strong>하는 것! (비교할때는 <code>===</code>를 사용하면 됩니다)</p>
<h4 id="code">Code</h4>
<p><img src="https://images.velog.io/images/duck-moon9392/post/e4811a59-bea6-4a11-9297-0f8490de8184/variable,%20assignment.jpg" alt=""></p>
</li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.16_Javascript Koans]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.16</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.16</guid>
            <pubDate>Thu, 17 Dec 2020 02:33:50 GMT</pubDate>
            <description><![CDATA[<h3 id="--오늘-공부한-것">- 오늘 공부한 것</h3>
<ul>
<li>Command Line</li>
<li>Git </li>
<li>배열 Coplit 진행률 24/25, 1문제 풂</li>
<li>객체 Coplit 진행률 21/21!, 1문제 풂</li>
<li>Codestates Pre Sprint -  Javascript Koans 
: CLI를 사용해 git clone하고 1~8 풀고 git add, commit, push. 과제 제출! </li>
</ul>
<hr>

<h3 id="--pre-course-sprint---javascript-koans">- Pre Course Sprint - Javascript Koans</h3>
<ul>
<li><p>개인적으로 가장 인상 깊고 재밌었던 Sprint. </p>
</li>
<li><p>Javascript 복습을 할 수 있고 내가 어떤 부분을 모르는지 확인할 수 있었습니다 </p>
</li>
<li><p>문제를 풀고 헷갈리는 부분, 이해가 완전하게 되지 않은 부분을 따로 주석으로 표시해뒀고 개인적인 시간에 정리하려고 합니다. </p>
</li>
</ul>
<hr>

<h3 id="--오늘-느낀-점-일기">- 오늘 느낀 점, 일기</h3>
<ul>
<li><p>지난 기수에서 koans 엄청 헤맸고 시간이 오래 걸렸던 거로 기억납니다.. commit comment를 &quot;Don&#39;t give up&quot;으로 적었었는데... 그 이후로 8기가 끝날 때까지 koans에 손을 안 댔네요.. </p>
</li>
<li><p>9기로 넘어올 때 정말 방황 많이 하고 정신 못 차리고 있었는데 동료분들이랑 같이 힘내서 과정을 잘 이어나가고 있습니다. 덕분에 koans 빨리 해결할 수 있었어요.</p>
</li>
<li><p>요즘 다른 분들 블로그 탐방을 많이 하고 있어요. 블로그 작성하는 게 나의 기록이기도 하지만 남이 봐준다면 보람이 있지 않을까 하고 둘러보는데 덕분에 제가 몰랐던 부분을 알게 되는 경우가 있어 좋은 활동이라고 생각해요. 이후에도 동료분들의 블로그 많이 찾아가겠습니다 : ) </p>
</li>
</ul>
<hr>

<h3 id="--">- +</h3>
<ul>
<li>동료분들과 같이 공부하고 싶어서 9기 Zoom에서 음악 틀고 같이 &#39;모각코&#39;했습니다. 오늘이 첫날이었고 이후에도 solo 시간일 때 들어가서 열심히 공부하겠습니다! </li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.15]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.15</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.15</guid>
            <pubDate>Tue, 15 Dec 2020 16:12:47 GMT</pubDate>
            <description><![CDATA[<h3 id="--오늘의-공부">- 오늘의 공부</h3>
<ul>
<li><p>객체 Coplit(Pair Programming) 20/21 완료.</p>
</li>
<li><p>Primitive / Reference / Scope / Closure </p>
</li>
<li><p>Checkpoint - Primitive / Reference / Scope / Closure</p>
<hr>
### - 객체 키 개수 세기 / Object.keys(obj).length ; 
```
제가 작성한 코드 

</li>
</ul>
<p>let testObj = {a : 1, b : 2, c : 3}</p>
<p>function countObjKey(obj){
  let count = 0 ;  // key 개수를 세기 위해 변수 선언, 0 할당 === 0개</p>
<p>  for(let key in obj){
    // for...in 문을 사용해 객체 순회
    count ++ ;
    // 객체를 순회 할 때마다 count 1씩 증가
    console.log(&quot;key는&quot;+key, &quot;count는 &quot; + count)
    // for...in이 돌아가는 것을 참고하기 위해 console.log 사용
    }</p>
<p>   return count;
}</p>
<p>// testObj를 전달 인자로 주어 함수 실행
countObjKey(testObj)
(출력)
key는 a, count는 1
key는 b, count는 2
key는 c, count는 3
&lt;- 3</p>
<pre><code>
&gt; 하지만 .... reference를 통해 쉽고 간단한 방법을 알게 됐다
return Object.keys(obj).length;
(출력)
&lt;- 3 

Object.keys() method는 object의 키를 새로운 배열에 넣어주는 method고  .length property를 사용해 길이를 return하게 되면 우리가 원하는 객체의 key가 몇 개인지 확인할 수 있게 됩니다.


&lt;hr&gt;


### - 배열 문제 풀이 
 - 중요한 시험에 출제돼 6시간?!.. 동안 헤매게 만든 것과 비슷한 문제가 나와 새로 알게 된 방법을 사용해 풀어보았다. Pair  분께 보여드리면서 설명하고 싶어 주석을 달게 됐다. 아직은 설명이 미숙하지만 잘다듬어 누구나 쉽게 이해할 수 있도록 programming하는 개발자가 되고 싶다 
</code></pre><p>function countLetter(str) {
  // 문제
  //  문자열을 입력받아 문자열을 구성하는 
  //  각 문자(letter)를 키로 갖는 객체를 리턴해야 합니다.
  //  각 키의 값은 해당 문자가 
  //  문자열에서 등장하는 횟수를 의미하는 number 타입의 값이어야 합니다.</p>
<p>  // 객체를 리턴해야하기 때문에 새로운 객체 선언, 빈 객체 할당
  let result = {};</p>
<p>  // 문자열을 하나씩 읽고 객체의 key로 생성
  for(let i = 0; i&lt;str.length; i++){ // 문자의 길이만큼 순회
    // 주의해야 할 점은 &#39;apple&#39; 예를 들면 &#39;p&#39;가 두 번 있어 
    // str[1] === &#39;p&#39;이고 str[2] === &#39;p&#39;이기 때문에 
    // 중복을 방지해줘야 한다 
    // obj 객체에 키가 있는지 확인하는 방법은
    // (key in obj)   !!  // obj에 key가 있으면 
    // true, obj key가 없으면 false</p>
<pre><code>if(!(str[i] in result)){
result[str[i]] = 1; 
// 여기서 value를 1로 준 것은 key의 value가 문자열에서 등장하는 횟수이기 때문에
// 첫 번째로 나온 문자라 value를 1로 주었습니다.

// 여기까지 ! 
// 우리는 for문과 if문을 통해 문자열의 첫 번째 글자에 대해 result 객체에 key와 value로 추가해줬고
// 이제는 str[i]와 똑같은 문자가 문자열 내에 있는지 확인하기 위해 
// for문을 한 번 더 만들어 실행합니다.
for(let j = i+1; j&lt;str.length; j++) {
  // j를 i + 1 로 선언해준 것은 i는 0부터 시작해 i가 아닌 i뒤 부터 중복되는 문자를 찾아야 하기 때문에 설정
  if(str[i] === str[j] ){
    result[str[i]]++
    // 똑같은 문자를 발견했을 시 str[i] key의 value 값 1씩 증가
  }
}

} </code></pre><p>  }</p>
<p>  return result;</p>
<p>}</p>
<p>```
끝!</p>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.14]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.14</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.14</guid>
            <pubDate>Tue, 15 Dec 2020 14:26:18 GMT</pubDate>
            <description><![CDATA[<h3 id="--오늘의-공부">- 오늘의 공부</h3>
<ul>
<li>배열 강의 듣고 문제 Pair Programming. </li>
<li>Coplit 진행 상황 : 23/25 </li>
<li>객체 강의 듣기</li>
</ul>
<h3 id="--forof-">- for...of ?!</h3>
<ul>
<li><p>배열 순회하기 좋은 방법인 for...of! 
: for...of 문은 iterable,  반복 가능한(.length property 사용이 가능한 것들) 것은 for...of를 사용해 순회 할 수 있습니다!! </p>
<ul>
<li><p>우리가 잘 알고 있는 순회 방법으로는 </p>
<pre><code>for 문을 사용
let testArr = [1,2,3];
for(let i = 0; i&lt;testArr.length; i++){
console.log(i)
}
(출력)  
1
2
3</code></pre></li>
<li><p>for...of 사용 예시</p>
<pre><code>let testArr = [1,2,3]
for(let el of testArr){
console.log(el)
}
(출력)
1
2
3</code></pre></li>
</ul>
<p>: 위의 두 예시를 살펴보면 똑같다는 것을 알 수 있고 문제를 풀면서 for..of가 for 문보다 작성하기 더 쉽고 편하다고 느꼈습니다. </p>
</li>
</ul>
<h3 id="-오늘-느낀-점">* 오늘 느낀 점</h3>
<ul>
<li><p>Pair분과 끊임없이 문제에 관해 얘기하면서 서로 알고 있는 지식을 나누는 과정이 재밌었고 정말 소중하고 감사했습니다. 온종일 Coplit 풀고 나서 빈 시간에 계산기 Sprint 같이 보자고 해주신 Full Pre 9기 구남규님 감사합니다 : ) </p>
<p>+ 지난 기수에서 멱살 잡고 가르쳐주신 Full Pre 8기 이동현 님께 감사 인사 드립니다.</p>
<pre><code>  덕분에 이제 for...in / for... of 잘 쓸 수 있습니다 : ) </code></pre></li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.11]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.11</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.11</guid>
            <pubDate>Fri, 11 Dec 2020 16:37:25 GMT</pubDate>
            <description><![CDATA[<h3 id="-오늘의-공부">* 오늘의 공부</h3>
<ul>
<li>Pair 분과 같이 Calculator Bare-minimum 만들어 제출 </li>
</ul>
<h3 id="-queryselector--textcontent-">* .querySelector() / .textContent !!</h3>
<ol>
<li><p>document.querySelector()
: javascript에서 document.querySelector()를 이용해 HTML에 있는 element를 불러올 수 있습니다.</p>
<p> HTML에 <span class="calculator__operator">+</span>이 있고 
 js에 let elOperator = document.querySelector(&#39;.calculator__operator&#39;)라고 작성한다면 </p>
<p> js에서 elOperator를 사용해 다양한 기능 설정 및 내용 수정을 가능하게 할 수 있습니다. </p>
<ol start="2">
<li>.textContent<br>: 오늘 가장 질문이 많았고 화면 출력에 필요한 중요한 property입니다.</li>
</ol>
<p>위의 예제를 그대로 사용해
개발자 도구에 elOperator을 입력하면 &#39;+&#39;가 아닌
<code>&lt;span class=&quot;calculator__operator&quot;&gt;+&lt;/span&gt;</code> , element 그대로 출력되는 것을 볼 수 있습니다. </p>
<p>우리가 이번 Sprint에서 필요했던 부분은 &#39;+&#39;을 수정하거나 값을 가져와야 했기 때문에 html에 출력된 값을 가져오려면 !!<code>elOperator.textContent</code> 라고 property를 사용하면 됩니다. 위 Code를 개발자 도구에 입력하면 element 그대로가 아닌 &#39;+&#39;가 출력되는 것을 볼 수 있습니다. 이를 가지고 새로운 값을 할당해주거나 변수에 저장해서 적재적소에 사용하면 거의 모든 문제를 해결할 수 있을 것 같습니다.</p>
</li>
</ol>
<h3 id="오늘-느낀-점-및-일기">오늘 느낀 점 및 일기</h3>
<ul>
<li>다른 동료분들께 도움이 되기 위해서 정확한 전달 능력과 더불어 내용 및 이론, 용어의 깔끔한 정리가 필요합니다. 정답은 블로깅이라고 생각합니다</li>
<li>지난 기수에서 TIL을 두 번 작성했나요????? 그래도 이번 기수 TIL은 오늘까지 5일 연속으로 작성했네요 :  ) / 앞으로도 TIL뿐만 아니라 배운 내용을 정리하는 글도 얼른 작성할 수 있도록 노력하겠습니다. 혹시나 제 블로그에 방문해서 긴 글을 읽으셨다면 소중한 댓글 부탁드립니다. 악플도 정말 감사하게 받겠습니다 : )</li>
</ul>
<ul>
<li>Codestate Full Pre 9기 동료분들 1주일 동안 정말 고생 많으셨고 이머시브에 가계신 25기분들도 힘내시길 바랍니다!</li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.10]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.10</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.10</guid>
            <pubDate>Fri, 11 Dec 2020 15:37:03 GMT</pubDate>
            <description><![CDATA[<blockquote>
<p>블로깅 재밌네요 : ) </p>
</blockquote>
<h3 id="-오늘의-주제--html-css">* 오늘의 주제 : HTML, CSS</h3>
<ul>
<li><p>HTML으로 Element를 적재적소에 배치하고 CSS로 style을 추가할 수 있으며 만든 결과물을 javascript를 이용해 기능을 추가할 수 있다.</p>
</li>
<li><p>HTML에서 ‘ML’은 markup language로 태그 등을 이용하여 문서나 데이터의 구조를 명기하는 언어의 한 가지이다.(위키백과 - &#39;HTML&#39;)</p>
</li>
<li><h5 id="html의-구조와-문법">HTML의 구조와 문법</h5>
<ul>
<li>opening tag, closing tag, self-closing tag ? 
: &lt;, &gt; 부등호 표시로 tag를 나타내며, 주요 태그는 <code>&lt;head&gt;, &lt;body&gt;, &lt;footer&gt;, &lt;p&gt;, &lt;img&gt;</code> 등이 있으며 기본적으로 태그는 &lt;/ ~~ &gt; 이처럼 /, 슬래시로 tag를 닫아주는 closing tag가 필요하다. 예외적으로 <code>&lt;img&gt;</code> tag는 closing tag가 필요 없는 self-closing tag이다. </li>
</ul>
</li>
<li><h5 id="자주-사용되는-html-요소element">자주 사용되는 HTML 요소(element)</h5>
<ul>
<li><p>div, span element
: <code>&lt;div&gt;</code> : division의 약자로 content 분할 요소입니다. <code>&lt;div&gt;</code>요소는 display 속성이 block이기 때문에 다음 요소(element)가 옆에 오지 않고 아래에 오게 됩니다.</p>
<p>:<code>&lt;span&gt;</code>은 구문 요소로 display 속성이 inline으로 양옆에 inline 속성의 요소들이 오면 줄을 바꾸지 않고 옆에 위치한다. 기본적으로 span의 크기(height, weight)는 content의 크기이다. </p>
<ul>
<li>ul, ol, li element
: <code>&lt;ul&gt;</code> : unordered list의 약자로 순서가 필요 없는 list를 만들 때 쓰는 요소이다. <code>&lt;ul&gt;</code> 태그만으로 list를 만들 수 없으며 <code>&lt;ul&gt;&lt;/ul&gt;</code> tag 안에 <code>&lt;li&gt;</code> element를 추가해 list를 추가해야 한다.</li>
</ul>
<p>: <code>&lt;ol&gt;</code> : Ordered list로 순서가 있는 list이다. 마찬가지로 혼자서 list를 만들 수 없고 tag 안에 <code>&lt;li&gt;</code> element를 사용해 list를 만들 수 있다.</p>
<p>:<code>&lt;li&gt;</code> : list의 약자로 방금 test 해봤는데 <code>&lt;ul&gt;</code>, <code>&lt;ol&gt;</code> tag와는 다르게 그 자체만으로 bullet이 표시되며 browser에 나타나게 된다. (<code>&lt;ul&gt;</code> tag 사용했을 때와 똑같이 나옴)</p>
</li>
<li><p>input!
: input type의 종류는 아주 많고 type마다 주어진 속성이 있기 때문에 다 외울 수는 없고 어떤 type이 있는지 mdn에서 찾아보고 들어가서 원하는 속성을 사용하면 된다.</p>
<p>기본적인 type에는 한 줄의 text를 작성할 수 있는 &lt;input type : “text”&gt;,&lt;input type : ”password”&gt; 는 우리가 비밀번호를 작성할 때 글자가 그대로 안 드러나게 하는 type이다. 또한 <code>&lt;input type = “checkbox”&gt;, &lt;input type=“radio”&gt;</code> 등이 있으니 다음에 HTML을 다룰 수 있는 새 블로그를 작성하려고 합니다 : )</p>
</li>
</ul>
</li>
</ul>
<ul>
<li><p>추가해서 CSS의 속성, border-box와 content-box의 차이 등을 배웠으니 블로그에 소개하는 글을 작성하도록 하겠습니다🤩</p>
<h4 id="-오늘-느낀-점">* 오늘 느낀 점</h4>
<ul>
<li>혼자 하는 과정일 때 단체 Zoom 방에 들어가서 다른 분들과 같이 공부하면서 스케줄을 잘 지키며 하루를 보내는게 좋겠다고 생각함</li>
<li>체력 관리를 잘해서 피곤하지 않게 몸 관리 잘하기 </li>
</ul>
</li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.09 ]]></title>
            <link>https://velog.io/@duck-moon9392/TIL201209pre3%EC%9D%BC%EC%B0%A8</link>
            <guid>https://velog.io/@duck-moon9392/TIL201209pre3%EC%9D%BC%EC%B0%A8</guid>
            <pubDate>Wed, 09 Dec 2020 16:34:12 GMT</pubDate>
            <description><![CDATA[<h3 id="-오늘의-공부">* 오늘의 공부</h3>
<ul>
<li><p>변수 블로깅... </p>
</li>
<li><p>반복문 문제 진행률 100% : )<br>: Pair Programming을 진행한 덕분에 고민했던 부분을 이해하게 됐고 문제도 해결함. &#39;소수&#39;를 찾는 방법 중 <code>Math.sqrt()</code>를 사용하는 방법이 있었는데 이 부분에 대해서 따로 시간을 갖고 이해할 예정. (-&gt; 블로깅 예정)</p>
<hr>
###  * 오늘의 느낀 점 </li>
<li><p>블로깅 작성하는 시간이 꽤 오래 걸리는 것 같습니다.. 하지만 오늘 Sprint review 참여하면서 느꼈고, 처음 javascript, Codestate에서 헤맸던 기억을 생각하며 교육 과정 중에 있는 분들, 그리고 누구나 쉽게 이해할 수 있도록 블로그를 작성하고 싶은 마음으로 정성을 다해 늦지 않게 작성해보려고 합니다. </p>
</li>
<li><p>첫 시작이 좋네요 : ) 3일 동안 긍정적인 동기분과 Pair Programming을 진행해서 좋았고, 남은 4주 과정도 서로 힘이 돼서 다음 단계로 같이 나아가고 싶습니다</p>
</li>
<li><p>다른 분들께도 도움이 되는 동료가 되고 싶네요. 끝 </p>
</li>
<li><p>내일은 이번 기수 처음으로 혼자 공부하는, 그리고 주제가 CSS인 만큼 좀 더 적극적으로 실습하면서 부족한 부분을 많이 채웠으면 좋겠습니다</p>
</li>
</ul>
<h3 id="과제">과제</h3>
<ul>
<li><p>변수(작성 중), 타입, 함수, 변수와 자료형, 조건문, 문자열, 반복문 Javascript 태그를 사용한 블로깅</p>
</li>
<li><p>공부 시간엔 공부만 : )</p>
</li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.08]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.08</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.08</guid>
            <pubDate>Wed, 09 Dec 2020 00:21:43 GMT</pubDate>
            <description><![CDATA[<h3 id="-오늘의-느낀점">* 오늘의 느낀점</h3>
<ol>
<li>Pair Programming하면서 이렇게 말을 많이 한 적은 처음..(+ Pair님께 감사드립니다)</li>
<li>확실히 기초적인 부분에서 생각하고 이해하는 부분은 처음 접했을때보다 빨라졌음.</li>
<li>Navigator 역할로 Pair Pragramming을 진행하고 있고 당일 배운 진도의 문제들을 다 풀었지만 블로그로 학습 목표를 중점으로 작성하면서 정리하는 시간이 필요하다고 생각함.</li>
</ol>
<hr>

<h3 id="-내일-숙제">* 내일 숙제</h3>
<ol>
<li>Pair분과 반복문까지 수월하게 잘마무리하기 </li>
<li>일찍 끝날 경우 배운 내용을 글로 정리하기 : ) </li>
</ol>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_20.12.07/ Full Pre 9기 시작]]></title>
            <link>https://velog.io/@duck-moon9392/TIL20.12.07</link>
            <guid>https://velog.io/@duck-moon9392/TIL20.12.07</guid>
            <pubDate>Mon, 07 Dec 2020 15:53:31 GMT</pubDate>
            <description><![CDATA[<p>하하.. 
Codestate Full Pre 9기로 다시 시작한 &#39;예비&#39;개발자 문정환입니다
8기에 노력이 많이 부족했다면 단점을 채워 한 달 뒤에 다음 단계로 나아가겠습니다 : ) </p>
<p>Codestate Full Pre 09기 첫 날입니다. 즐겁게즐겁게 </p>
<h3 id="오늘의-다짐">오늘의 다짐</h3>
<ul>
<li>늦더라도 그 주에는 주어진 과제 끝내기(안되면 Help Desk 물고 늘어지기)</li>
<li>TIL을 풍성하게 적진 못하더라도 매일 나의 노력을 보여주기 </li>
</ul>
<hr>

<h4 id="pair-progrmming할-때-나의-attitude">Pair Progrmming할 때 나의 Attitude</h4>
<ul>
<li>네비게이터로 진행 시 바로 해결하기 어려운 큰 문제들인 경우(예: 잘못된 방향, 잘못된 코드 해석), 미리 적어 두었다가 드라이버가 해당 코드 작성을 완료한 이후에 수정을 제안합니다. </li>
<li>작성하는 이유를 네비게이터와 공유합니다. 
: <strong><em>같이 일하고 싶은 개발자</em></strong>가 되기 위한 조건. </li>
</ul>
<hr>

<h4 id="변수--타입--함수">변수 / 타입 / 함수</h4>
<p>확실하게 변수, 타입, 함수를 공부할 수 있는 시간을 가졌습니다.</p>
<p>특히 함수는 </p>
<ul>
<li>코드의 묶음이며,</li>
<li>기능의 단위</li>
<li>구체적인 입력(Parameter, 인자)과 출력(return 혹은 console.log)간의 mapping</li>
<li>반드시 돌아온다!(return)</li>
</ul>
<p>는 위의 특성들을 한 번 더 이해하는 시간이었습니다.</p>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_2020.12.04]]></title>
            <link>https://velog.io/@duck-moon9392/TIL2020.12.04</link>
            <guid>https://velog.io/@duck-moon9392/TIL2020.12.04</guid>
            <pubDate>Fri, 04 Dec 2020 07:16:14 GMT</pubDate>
            <description><![CDATA[<h3 id="오늘의-주제">오늘의 주제</h3>
<ul>
<li><p>반복문
: 이중 for문을 이용한 문제 풀이가 어려워 수도코드 작성, 개발자 코드를 이용해 많은 시간을 할애함
: continue, break를 이해했지만 어떤 상황에 적절하게 사용하는 지 모르겠어서 조금 더 공부 필요</p>
</li>
<li><p>루프와 반복
: for...in, for...of에 대해서 mdn과 개발자 도구를 이용해 공부.</p>
</li>
</ul>
<h3 id="오늘의-느낀점">오늘의 느낀점</h3>
<ul>
<li>어제, 오늘 공부하면서 조금 더 노력하면 잘할 수 있겠다고 느낌</li>
<li>지금은 개념을 확인하는 단계지만 차근차근 공부해서 koans나 underbar에서 막히지 않게 메서드나 함수를 작성할 수 있는 내가 되고 싶다고 생각함</li>
</ul>
<h3 id="주말에-공부할-것">주말에 공부할 것</h3>
<ul>
<li>koans를 통해 부족한 부분 다시 확인 </li>
<li>고차함수, 알고리즘 문제 도전</li>
</ul>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL_2020.12.03]]></title>
            <link>https://velog.io/@duck-moon9392/TIL2020.12.03</link>
            <guid>https://velog.io/@duck-moon9392/TIL2020.12.03</guid>
            <pubDate>Thu, 03 Dec 2020 20:53:49 GMT</pubDate>
            <description><![CDATA[<ul>
<li>조건문, 문자열, 반복문 문제 풀이</li>
<li><a href="https://1linelayouts.glitch.me/" title="1linelayout">1linelayout</a> 을 통한 CSS 공부</li>
</ul>
<hr>

<h3 id="1-거듭제곱하는-방법세가지">1. 거듭제곱하는 방법(세가지)</h3>
<p>1 Math.pow(밑(제곱하려는 값), 지수)   &lt;<code>Math.pow(2,3) // 결과는 8</code>
2 제곱하려는 값 * 제곱하려는 값 <code>2 * 2  // 결과 4</code>
3 제곱하려는 값 ** 지수 <code>2 ** 3 // 결과 8</code></p>
<hr>


<h3 id="2-referenceerror-중-하나인-invalid-assignment-left-hand-side">2. ReferenceError 중 하나인 invalid assignment left-hand side</h3>
<p>할당이 잘못됐다는 표현이고 아마 연산자를 잘못 작성하면 볼 수 있는 오류입니다. javascript에서 &#39;=&#39;는 값을 변수에 할당할때 사용하고 &#39;===&#39; 는 비교연산 시 사용하는 연산자입니다</p>
<pre><code>let test === 0; (X)
let test = 0; (O)   // test라는 변수에 0을 할당하는 올바른 방법

2**3 = 8; (X) 
2**3 === 8; (O) // true, 올바른 비교 연산자의 사용 
</code></pre><p>오류가 났을땐 당황하지 않고 구글에 오류를 검색하면 stackoverflow나 mdn을 통해 해결할 수 있음.</p>
]]></description>
        </item>
        <item>
            <title><![CDATA[TIL, 2020.12.02 / 정규 표현식을 이용한 유효성 검사]]></title>
            <link>https://velog.io/@duck-moon9392/%EC%A0%95%EA%B7%9C%ED%91%9C%ED%98%84%EC%8B%9D-%EC%9C%A0%ED%9A%A8%EC%84%B1%EA%B2%80%EC%82%AC</link>
            <guid>https://velog.io/@duck-moon9392/%EC%A0%95%EA%B7%9C%ED%91%9C%ED%98%84%EC%8B%9D-%EC%9C%A0%ED%9A%A8%EC%84%B1%EA%B2%80%EC%82%AC</guid>
            <pubDate>Wed, 02 Dec 2020 18:33:48 GMT</pubDate>
            <description><![CDATA[<p>오늘은 정규 표현식(정규식)을 사용해 문자열을 검증(Validation)하는 방법을 공부했습니다
(주어진 문자열이 알파벳, 숫자, 특정 문자로 구성되어 있는지 검증, 또는 문자열의 길이 검증 가능)</p>
<h3 id="1-정규식-작성법">1. 정규식 작성법</h3>
<p> 처음과 끝을 &#39;/&#39;(forward slash)로 감싼 정규식</p>
<pre><code>정규식 예
const regEx01 = /abc/;
const regEx02 = /^[a-zA-Z0-9]+$/;
const regEx03 = /^[a-z]{6,10}$/;</code></pre><hr>
<h3 id="2-test--정규-표현식을-만족하는지-확인하는-메서드-boolean-값으로-return합니다">2. test() : 정규 표현식을 만족하는지 확인하는 메서드, boolean 값으로 return합니다.</h3>
<p><img src="https://images.velog.io/images/duck-moon9392/post/a0e7aea2-991f-4b2a-935b-cae9c26dae6d/%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202020-12-03%20%E1%84%8B%E1%85%A9%E1%84%8C%E1%85%A5%E1%86%AB%203.13.40.png" alt=""></p>
<p>정규식을 선언하고 test() 메서드의 인자로 검증할 문자열을 넣어 정규식에 부합한지 확인할 수 있습니다. </p>
<hr>
<h3 id="3-정규식의-특수문자">3. 정규식의 특수문자</h3>
<ol>
<li>[]: 문자셋(Character Set)입니다. 문자셋 안에 -(hyphen)을 이용해 범위를 정해줄 수 있습니다.
(점(.)과 별표(*)는 문자셋 안에서 특수문자가 아님)</li>
<li>^ : 입력의 시작, 문자열의 시작을 알려주는 특수문자</li>
<li>$ : 입력의 끝, 문자열의 끝을 알려주는 특수문자</li>
<li>+ : 앞의 표현식이 1회 이상 반복됨을 나타내는 특수문자, {1,}</li>
<li>* : 앞의 표현식이 0회 이상 반복됨을 나타내는 특수문자, {0,}</li>
<li>{n,m} : 앞의 표현식의 길이 검증할때 사용, 만약 m이 주어지지 않았을땐 무제한으로 취급</li>
</ol>
<hr>
<h3 id="4-예시">4. 예시</h3>
<pre><code>대상 : Id 유효성 검사(대, 소문자 알파벳, 숫자로 이루어져야하고 3글자 이상 8글자 이하)

const idValid = /^[a-zA-Z0-9]{3,8}$/;
const myId = &#39;20201202test&#39;;
const myId2 = &#39;1202test&#39;;

console.log(idValid.test(myId)) ;
// 결과값은 false, 길이가 8을 넘었기 때문에 false, 탈락
console.log(idValid.test(myId)) ;
// 결과값은 true, 통과 </code></pre><hr>
<p> 5.참고 
Google 검색 : js 알파벳 체크, only alphabet js, js verify alpha, js alphabet check...
Velog 사용법 : <a href="https://velog.io/@jinuku/Velog-%EA%B0%84%EB%8B%A8-%EC%82%AC%EC%9A%A9%EB%B2%95#velog-%EA%B8%B0%EB%B3%B8-%EA%B8%80-%EB%AC%B8%EB%B2%95">https://velog.io/@jinuku/Velog-%EA%B0%84%EB%8B%A8-%EC%82%AC%EC%9A%A9%EB%B2%95#velog-%EA%B8%B0%EB%B3%B8-%EA%B8%80-%EB%AC%B8%EB%B2%95</a> 
정규식 관련 : 
<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions">https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions</a> / <a href="https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/%EC%A0%95%EA%B7%9C%EC%8B%9D">https://developer.mozilla.org/ko/docs/Web/JavaScript/Guide/%EC%A0%95%EA%B7%9C%EC%8B%9D</a> / <a href="https://hamait.tistory.com/342">https://hamait.tistory.com/342</a> / 
<strong><a href="https://code.tutsplus.com/tutorials/8-regular-expressions-you-should-know--net-6149">https://code.tutsplus.com/tutorials/8-regular-expressions-you-should-know--net-6149</a></strong> (강추..)</p>
]]></description>
        </item>
        <item>
            <title><![CDATA[Pre Course 회고..]]></title>
            <link>https://velog.io/@duck-moon9392/Codestate-Full-Pre-8%EA%B8%B0-%ED%9A%8C%EA%B3%A0</link>
            <guid>https://velog.io/@duck-moon9392/Codestate-Full-Pre-8%EA%B8%B0-%ED%9A%8C%EA%B3%A0</guid>
            <pubDate>Mon, 30 Nov 2020 09:44:27 GMT</pubDate>
            <description><![CDATA[<p>지금 이 글을 쓰는 순간에도 마음이 좋지 않아 힘들지만, 개발자가 되고 싶고 더 발전하고 싶은 마음으로 힘을 내서 한 글자, 한 글자 정성을 다해 쓰려고 합니다</p>
<br>
 10.26~11.20

<ul>
<li><p>2020.10.26 시작으로 4주간 Pre Course 과정에 몸을 담았고 그 과정에서 배운 것들을 토대로 Pre Hiring Assessment(HA)를 진행했지만, 기술적인 부족함으로 인해 통과하지 못하고 기수 이동을 안내받았습니다</p>
</li>
<li><p>Pre Course에서 느낀 점: </p>
</li>
</ul>
<ol>
<li><p>매일 새로운 주제들을 접하고 동료와 같이 문제를 해결하는 것이 시간 가는지 모를 정도로 정말 재밌었습니다. 하지만 그 과정에서 잘 풀리지 않아 몇 시간씩 고민할 때도 있었고 소통이 원활하게 되지 않아 시간이 아깝다고 느껴질 때도 있었습니다. 그리고 심지어 계산기를 만드는 것은 완성하지 못한 채 Course의 마지막까지 해결하지 못했습니다. </p>
</li>
<li><p>하지만 제가 초반에 손도 못 대던 문제들이 많았었는데 4주가 지나고 나서 굉장히 빠르게 해결해나갔고 온종일 건드려도 완료하지 못했던 계산기도 동작하도록 코드를 수정했고 마지막 날씨 앱을 만드는 과정에서 코드를 이해하고 백지에서 하나씩 코드를 만드는 저를 보면서 얻은 것이 있었고 다른 것들도 할 수 있겠다는 자신감을 가질 수 있었습니다.</p>
</li>
</ol>
<ul>
<li><p>목표 : 좁은 시야 탈피, 내 진짜 목표 및 목적 생각하기. 8기 과정을 진행하는 동안 하루하루 주어진 것, 제출해야 하는 것에만 몰두해 내 진짜 목표와 목적을 놓치고 나태해지는 순간들이 자주 있었습니다. 제 목표는 직업 전환, 개발자로 취업하기, 떳떳한 개발자 되기 입니다. 다음 기수부터는 내 진짜 목표들을 생각하며 하루를 좀 더 목표에 맞게끔 설계하도록 노력하려고 합니다.   </p>
</li>
<li><p>개선 방법 : Bare Minimum부터 완벽하게 이해하려고 노력하기. 남에게 설명할 수 없는 것은 정확하게 모르는 것으로 생각하고 개념을 내 것으로 만드는 시간을 갖고 이해가 됐다면 블로그 작성 및 Pair와 대화로 문제를 해결해 나가고 reference를 참고하게 된다면 주석을 사용해 설명하며 내 것으로 만들고 이후에는 스스로 작성할 수 있을 정도로 공부함으로써 정말 내 무기가 되도록 노력하려고 합니다 / 또한, 풀지 못한 문제나 sprint를 해결하지 못했을 때는 시간을 내서 완벽하게 끝낼 수 있도록 노력하겠습니다.</p>
</li>
</ul>
<p>마지막으로, HA를 진행하면서 문제를 풀기 위해, 그리고 미처 완료하지 못한 문제와 sprint를 해결하기 위해 밤늦게까지 몰두하고 졸음과 싸웠던 내가 좋으면서 신기했고 지금까지 오는 과정 중에서 노력이 부족했음을 알게 됐습니다. 한 달 뒤의 나는 이 글을 보면서 흐뭇해하고 스스로 만족할 수 있길 바라고 그 과정에서 개발자로 조금 더 성장하길 바랍니다. </p>
]]></description>
        </item>
        <item>
            <title><![CDATA[오늘의 일기(TIL)]]></title>
            <link>https://velog.io/@duck-moon9392/%EC%98%A4%EB%8A%98%EC%9D%98-%EC%9D%BC%EA%B8%B0TIL</link>
            <guid>https://velog.io/@duck-moon9392/%EC%98%A4%EB%8A%98%EC%9D%98-%EC%9D%BC%EA%B8%B0TIL</guid>
            <pubDate>Wed, 28 Oct 2020 14:45:51 GMT</pubDate>
            <description><![CDATA[<p>오늘 느낀점 </p>
<ul>
<li><p>Pair review에서 개선할 점으로 문제를 풀 때 내가 검색한 것을 공유하지 않아 아쉬웠다고 남겨주셨다. 내가 잘못된 정보를 알려주면 안될 것 같아 먼저 검색해본 다음 얘길 했지만 그 부분이 불편하셨을 것 같다. 다음 Pair Programming에서는 문제에 관해 동료와 먼저 얘기나누고 접근 방법을 같이 찾아 푸는 방식으로 진행하면 어떨까 싶다</p>
</li>
<li><p>속이 좁아 남이 하는 말에 민감한 편이었는데 공식적인 &#39;Feedback&#39; 과정이 있어서 받아보고 나니 내 점수는 낮지만 기분이 좋았고 평가를 듣는 것 자체가 소중했다. 평가해준 내 동료에게 무한한 감사를 드리고 싶다. 
지금까지 코드스테이츠 과정 중 헌신하는 Staff?(표현이 맞나요??..) 분들의 Office Hour, Pair review 시간이 제일 인상 깊고 좋았다</p>
</li>
<li><p>-</p>
</li>
</ul>
<blockquote>
<p>[반복문]달성목표</p>
</blockquote>
<ul>
<li><p>반복문을 활용해 단순한 기능을 반복, 수행할 수 있는가(O)</p>
</li>
<li><p>for문을 사용해 반복적으로 코드를 실행 (O)</p>
</li>
<li><p>기본적인 for문을 응용해 다양한 for문 만들기(O)</p>
</li>
<li><p>for와 while의 차이(O)</p>
</li>
<li><p>반복문에 조건문을 응용하여 특정 조건에서만 코드를 실행</p>
</li>
<li><p>이중 포문이 무엇인지 이해하고 활용</p>
<p>for와 while을 사용해 불편하게 하나씩 Code를 작성하는 것보다 편리하게 원하는 값을 찾을 수 있었다.</p>
<pre><code>for(선언,조건식,증감문){

}

선언 및 초기화 //while에서는 for과 다르게 따로 초기화를 한다
while(조건식) {
 증감문
}</code></pre></li>
</ul>
<p>반복문은 문제를 자꾸 풀어보고 code를 작성해보면서 많이 익숙해져야할 필요가 있다고 느낀 하루였다</p>
<p>17:00 Sprint Review</p>
<p>!CRUD가 어떤 말인지 이제야 알게 됐다 
Create Read Update Delete</p>
<p>Create : 지금 우린 JS를 배우고 있기 때문에 
let을 이용한 선언으로 변수를 만들 수 있다</p>
<p>!!Read
reference나 다른 사람들이 작성하거나 질문한 것을 보면 word[n] 이렇게 작성한 것이 뭔지 몰라 당황하고 있었는데 인덱스 위치를 알 수 있는 방법이었다... </p>
<p>Update 
String() / Number()
let result = result + 1; for, while, if..else 등을 사용해 변수들을 Update </p>
<p>Delete 
result = &#39;&#39;;를 이용해 초기화 </p>
<p>19:00 Pair Review &amp; Sprint feedback</p>
]]></description>
        </item>
    </channel>
</rss>