프엔스쿨 0228 TIL

URL, IP, PORT 개념정리

	URL	IP	PORT
예시	www.naver.com	223.130.195.200	~.com:80
비유	이름	주소	문
	네이버본사	00시 00로 00단지	00호

www.naver.com에 들어가려고 시도했을 때

1. 클라이언트가 DNS에 해당 URL의 주소(IP) 요청한다
2. DNS가 해당 URL의 주소(IP)가 무엇인지 알려준다
3. 클라이언트 → 공유기나 스위치 → 라우터 → 각종 보안 및 네트워크 장비 → 서버(DB를 가지고있음) 의 과정을 거쳐 서버에 도달하고 이것이 클라이언트로 다시 돌아가서 보여진다

emmet 문법

실행 후 자동완성이 뜰때 탭하면 적용된다.

• 기본 태그 생성

	!
    기본탬플릿
    
	h1
    <h1></h1>
    
	h1{helloworld}
	<h1>helloworld</h1>
    
     h1+p
    <h1></h1>
    <p></p>
    
    h$*6
    <h1>helloworld</h1>
    <h2>helloworld</h2>
    <h3>helloworld</h3>
    <h4>helloworld</h4>
    <h5>helloworld</h5>
    <h6>helloworld</h6>

• 클래스와 ID

    p#hello
    <p id="hello"></p>

    p.hello
    <p class="hello"></p>

    p.hello#hello1 
    <p class="hello" id="hello1"></p>
    p.hello#hello2
    <!-- 해당 줄 아무 곳에 커서 두고 {opt 하고 화살표 아래위}하면 해당 줄을 아래위로 이동 !!  -->
    p.hello.hello2.hello3
    <p class="hello hello2 hello3"></p>

    <!-- 태그없이 클래스랑 아이디만 하면 div로 (웹접근성을 생각하면 div는 최대한 쓰지않기) -->
    .one
    <div class="one"></div>

    #one
    <div id="one"></div>

    <!-- 잘쓰지는 않음 -->
    a[href='https://www.naver.com']
    <a href="https://www.naver.com"></a>

• 테이블과 ul

	테이블안에서 (tr행 안에 td열이 6개있는) 행이 4개
    table>(tr>td*6)*4
    <table>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
    </table>

    ul>li*5
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>

    ul>li.item$*5
    <ul>
        <li class="item1"></li>
        <li class="item2"></li>
        <li class="item3"></li>
        <li class="item4"></li>
        <li class="item5"></li>
    </ul>

    사이에 들어갈 텍스트쓰고 진짜 탭!!!하면 그 다음 li사이로 넘어감!
    <ul>
        <li>ㅇㅇ</li>
        <li>ㅇㄴㅇ</li>
        <li>ㅇㄹ</li>
        <li>ㅇㄹ</li>
        <li></li>
    </ul>

• lorem (더미 텍스트)
  한글입숨에서 한글로도 가져올 수 있다.

    lorem
    Lorem ipsum dolor, sit amet consectetur adipisicing elit. Odit dolore, architecto consequuntur atque, exercitationem ut ea aut quibusdam impedit fugiat sit est. Accusantium earum maxime inventore tempore totam. Perferendis, amet.

    <!-- 5개단어 -->
    lorem5
    Lorem ipsum dolor sit amet.
    <!-- 3개문장 -->
    lorem*3 
    Lorem ipsum, dolor sit amet consectetur adipisicing elit. Doloremque nisi expedita dolores debitis autem sunt tempore reiciendis, nemo nesciunt in. Optio iure laboriosam maxime aliquid sequi architecto hic necessitatibus aperiam!
    Molestiae adipisci maxime exercitationem doloribus dicta magnam inventore ducimus quaerat modi dolorem eaque minus ipsam nobis impedit quia dolore nam animi et quo quos, porro at non itaque. Deleniti, ad.
    Repellendus odit libero maxime in asperiores excepturi vero voluptas. Similique, pariatur ducimus. Aut culpa fugiat ipsum sint voluptates magni et iusto provident rem, tenetur architecto, alias, natus dignissimos sequi recusandae?

VSC 단축키

• 동시 수정 : Ctrl + Alt + 방향키(상, 하), Alt + Click, Alt + Shift + Drag, Alt + Shift + i
• 한 줄 삭제 : Shift + Del
• 동시 선택 : Ctrl + D (2번 입력, Ctrl + Shift + D와 같은 역할)
• 들여쓰기 / 내어쓰기 : Ctrl + [ / Ctrl + ], tab, shift + tab
• Terminal : `Ctrl + Shift + `` (백틱, 틸트, 템플릿리터럴)
• Settings : Ctrl + , (오른쪽 상단에 Settings.json file open으로 좀 더 다양한 커스터마이징 가능)
• Sidebar : Ctrl + B

GitHub 기초 명령어

기본적으로 받아오고(pull) 추가하고(add.) 올리고(commit) 보내는(push) 과정 ! !

1. 맨처음에 지금 이 폴더에 넣기
git clone [repo링크] . 

2. 당겨서 가져오기 (혼자하는 프로젝트에서는 필요없음)
git pull

3. 코드수정

4. 수정후 모든 것을 staging area에 넣기
git add . 

5. 메세지와 같이 main에 올리기
git commit -m ‘메세지’

6. 깃헙(원격저장소)에 보내기
git push