'Study' 카테고리의 글 목록 (6 Page)

728x90

(1) LocalStorage, SessionStorage 란?

DOM 저장소 ( 문서 개체 모델 저장소) 라고도하는 웹 저장소는 클라이언트 측 데이터를 저장하기위한 메서드와 프로토콜을 웹 앱에 제공 합니다.
웹 저장소는 쿠키와 유사 하지만 용량이 크게 향상되고 HTTP 요청 헤더에 저장된 정보가없는 영구 데이터 저장소를 지원합니다.
웹 저장소는 Local Storage와 Session Storage는로 나누어져 있습니다.
Local Storage는 세션이 종료되어도 데이터가 사라지지 않고 남아있으며 Session Storage는 세션종료(페이지 종료)시 데이터가 사라집니다.

(2) LocalStorage, SessionStorage 사용법

Local Storage와 Session Storage는 동일한 메소드와 프로퍼티를 제공합니다.

//키-값 쌍을 보관
localStorage.setItem(key, value)
sessionStorage.setItem(key, value)

//키에 해당하는 값 반환
let val = localStorage.getItem(key)
let val = sessionStorage.getItem(key)

//키에 해당하는 값 제거
localStorage.removeItem(key)
sessionStorage.removeItem(key)

//모두 삭제
localStorage.clear()
sessionStorage.clear()

//index에 해당하는 키값 반환
let key = localStorage.key(index)
let key = sessionStorage.key(index)

//저장된 항목의 개수 반환
let size = localStorage.length
let size = sessionStorage.length

참조 - en.wikipedia.org/wiki/Web_storage, ko.javascript.info/localstorage#ref-30

저작자표시 (새창열림)

'Study > JavaScript' 카테고리의 다른 글

[JavaScript] DIV 보이기, 감추기 (0)	2021.02.22
[JavaScript] 논리 연산자 (0)	2021.01.18
[JavaScript] var, let, const 차이점 (0)	2021.01.17

728x90

(1) 중복처리 하는 이유

웹 사이트를 만드는 경우 상단(nav)/하단(footer) 등 여러 페이지에 중복해서 사용되는 부분이 있다. 이러한 경우 html마다 작성하게 되면 보기에도 불편하며 나중에 수정이 생길 경우 하나하나 다 바꿔야 하는 번거로움이 생기며 오타로 인한 오류가 발생할 수 있다. 이러한 문제점을 해결하기 위해 하나의 코드를 작성 후 필요한 html에서 불러오는 방법을 사용할 수 있다.

(2) Code

{% include '????.html' %}

{% include 'nav.html' %}

{% include 'footer.html' %}

//상대 경로로 인한 html호출
{% include_relative somedir/footer.html %}

nav.html, footer.html과 같이 중복적으로 사용할 html을 따로 만들어 놓은 후 사용하길 원하는 곳에 해당 코드를 입력하면 됩니다.

저작자표시 (새창열림)

'Study > HTML&CSS' 카테고리의 다른 글

[HTML/CSS] CSS, JS, img파일 변경 후 적용시키기 (1)	2021.03.02
[HTML/CSS] html 에서 카카오맵 불러오기 및 가운데 정렬 (!important) (3)	2021.02.20
[HTML/CSS] 부트스트랩 시작 템플릿 (0)	2021.02.15

728x90

(1) 부트스트랩 이란

부트스트랩(Bootstrap)은 웹사이트를 쉽게 만들 수 있게 도와주는 HTML, CSS, JS 프레임워크이다. 하나의 CSS로 휴대폰, 태블릿, 데스크탑까지 다양한 기기에서 작동한다. 다양한 기능을 제공하여 사용자가 쉽게 웹사이트를 제작, 유지, 보수할 수 있도록 도와준다.

(2) 부트스트랩 시작 템플릿 코드

<!doctype html>
<html lang="en">

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
        integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

    <!-- Optional JavaScript -->
    <!-- jQuery first, then Popper.js, then Bootstrap JS -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"
        integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
        crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
        integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl"
        crossorigin="anonymous"></script>
</head>

<body>

</body>

</html>

(3) 부트스트랩 참고 사이트

getbootstrap.com/docs/4.0/components/alerts/

Alerts

Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages.

getbootstrap.com

startbootstrap.com/

Free Bootstrap Themes, Templates, Snippets, and Guides

Start Bootstrap develops free to download, open source Bootstrap 4 themes, templates, and snippets and creates guides and tutorials to help you learn more about designing and developing with Bootstrap.

startbootstrap.com

출처 :

ko.wikipedia.org/wiki/%EB%B6%80%ED%8A%B8%EC%8A%A4%ED%8A%B8%EB%9E%A9_(%ED%94%84%EB%9F%B0%ED%8A%B8%EC%97%94%EB%93%9C_%ED%94%84%EB%A0%88%EC%9E%84%EC%9B%8C%ED%81%AC),

스파르타코딩클럽 웹개발종합반 -1주차 中

저작자표시 (새창열림)

'Study > HTML&CSS' 카테고리의 다른 글

[HTML/CSS] CSS, JS, img파일 변경 후 적용시키기 (1)	2021.03.02
[HTML/CSS] html 에서 카카오맵 불러오기 및 가운데 정렬 (!important) (3)	2021.02.20
[HTML/CSS] 중복되는 html 처리방법(flask) (3)	2021.02.17

728x90

(1) 논리 연산자

논리 연산자는 보통 부울 값으로 사용하지만, 그렇지 않을 경우 실제로 명시된 피연자들 중 하나를 반환한다.

//예시
true && false; // false
true && "Hello World"; // Hello World

true || false; // true
"Hello World" || true; //"Hello World"

(2) &&(논리곱, AND) 연산자

expr1 && expr2 인 경우 expr1을 true로 변환할 수 있는 경우 expr2을 반환하고, 그렇지 않으면 expr1을 반환합니다.

true && true;     // t && t returns true
true && false;    // t && f returns false
false && true;     // f && t returns false
false && (3 == 4); // f && f returns false
"Cat" && "Dog";    // t && t returns Dog
false && "Cat";    // f && t returns false
"Cat" && false;    // t && f returns false

(3) ||(논리합, OR) 연산자

expr1 || expr2 인 경우 expr1을 true로 변환할 수 있으면 expr1을 반환하고, 그렇지 않으면 expr2를 반환합니다.

true || true;      // t || t returns true
false || true;     // f || t returns true
true || false;     // t || f returns true
false || (3 == 4); // f || f returns false
"Cat" || "Dog";    // t || t returns Cat
false || "Cat";    // f || t returns Cat
"Cat" || false;    // t || f returns Cat

(4) !(NOT) 연산자

단일 피연산자를 true로 변환할 수 있으면 false를 반환합니다. 그렇지 않으면 true를 반환합니다.

!true;  // !t returns false
!false; // !f returns true
!"Cat"; // !t returns false

참조 - developer.mozilla.org/ko/docs/Web/JavaScript/Guide/Expressions_and_Operators#%EB%85%BC%EB%A6%AC_%EC%97%B0%EC%82%B0%EC%9E%90

저작자표시 (새창열림)

'Study > JavaScript' 카테고리의 다른 글

[JavaScript] DIV 보이기, 감추기 (0)	2021.02.22
[JavaScript] Local Storage 와 Session Storage (0)	2021.02.18
[JavaScript] var, let, const 차이점 (0)	2021.01.17

728x90

(1) 블록 레벨 스코프

대부분의 프로그래밍 언어는 블록 레벨 스코프(Block-level scope)를 따르지만 자바스크립트는 함수 레벨 스코프(Function-level scope)를 따른다.

함수 레벨 스코프(Function-level scope) - 함수 내에서 선언된 변수는 함수 내에서만 유효하며 함수 외부에서는 참조할 수 없다. 즉, 함수 내부에서 선언한 변수는 지역 변수이며 함수 외부에서 선언한 변수는 모두 전역 변수이다.
블록 레벨 스코프(Block-level scope) - 모든 코드 블록(함수, if 문, for 문, while 문, try/catch 문 등) 내에서 선언된 변수는 코드 블록 내에서만 유효하며 코드 블록 외부에서는 참조할 수 없다. 즉, 코드 블록 내부에서 선언한 변수는 지역 변수이다.

위와 같이 var키워드 특성 상 변수 a는 전역변수로 할당 되며 변수 a의 재정의, 재할당 하는것에 있어 문법적으로 문제가 없는 것을 확인할 수 있다. 이러한 경우 의도하지 않은 변수값의 변경이 일어날 가능성이 크다. 이것을 방지하기 위해 블록 레벨 스코프를 따르는 let키워드를 제공한다.

(2) 변수 중복 선언

var 키워드로는 동일한 이름을 갖는 변수를 중복해서 정의할 수 있다. 하지만 let 키워드는 동일한 이름을 갖는 변수를 중복해서 선언 할 수 없다.

(3) 재할당

const키워드는 let키워드와 비슷하지만 const는 반드시 선언과 동시에 할당이 이루어져야 한다. 또한 이미 할당한 값을 변경할 수 없으며 변경경우 문법적으로 에러가 발생한다.

(4) Const와 객체

const는 재할당이 금지되지만, const타입의 객체인 경우 객체의 프로퍼티는 변경이 가능하다.

참조 - poiemaweb.com/es6-block-scope

저작자표시 (새창열림)

'Study > JavaScript' 카테고리의 다른 글

[JavaScript] DIV 보이기, 감추기 (0)	2021.02.22
[JavaScript] Local Storage 와 Session Storage (0)	2021.02.18
[JavaScript] 논리 연산자 (0)	2021.01.18

728x90

(1) 탐욕법(그리디) 알고리즘 이란?

매 선택에서 지금 이 순간 최적의 답을 선택하는 알고리즘이다.

단, 매 선택이 각 단계에서는 최적이지만 종합적으로 보았을 경우 최적이라는 보장이 없다.

예를 들어 매 순간 최적을 따라가게되면 1-1-1-100으로 갈경우 매 순간 최적이 아니더라도 1-1-10-10이 종합적으로 보았을 경우 더 최적일 수 있는 경우가 생긴다.

탐욕법(그리디) 알고리즘은 한번의 선택이 다음 선택에는 전혀 무관한 값이여야 하며 매 순간의 최적해가 문제에 대한 최적해인 경우 문제를 해결하는데 강점이있다.

저작자표시 (새창열림)

'Study > Algorithm' 카테고리의 다른 글

[Algorithm] 이분탐색 (0)	2024.12.20
[Algorithm] 슬라이딩 윈도우 (1)	2024.12.20

728x90

(1) 강의내용

1일차 HTML, CSS 기초 - 로그인 폼 만들기

웹페이지 동작 원리의 기초를 배우고, HTML, CSS의 역할을 이해합니다.
HTML, CSS의 기본문법을 익히고, 프론트엔드를 실제로 코딩해봅니다.
그럴싸한 로그인 페이지를 만들면서, HTML, CSS의 사용법을 익혀봅니다.
숙제 - 버튼모양 예쁘게 바꿔보기

2일차 크리스마스 카드 만들기, Javascript 맛보기

HTML과 CSS를 응용해서, 크리스마스 카드를 직접 디자인합니다.
기초적인 Javascript를 사용해서, 버튼을 누르면 카드가 펼쳐지게 만듭니다.
모바일도 잊으면 안되겠죠! 반응형 웹의 기초를 배워봅니다.
직접 만든 카드를 업로드하고, 친구에게 공유 가능한 URL을 받아 자랑합니다!
숙제 - 내 URL을 제출하기

(2) 코드 / 빌드 링크

1일차

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>스파르타코딩클럽 | HTML 기초</title>
</head>

<body>
    <!-- 구역을 나누는 태그들 -->
    <div>나는 구역을 나누죠</div>
    <p>나는 문단이에요</p>
    <ul>
        <li> bullet point!1 </li>
        <li> bullet point!2 </li>
    </ul>

    <!-- 구역 내 콘텐츠 태그들 -->
    <h1>h1은 제목을 나타내는 태그입니다. 페이지마다 하나씩 꼭 써주는 게 좋아요. 그래야 구글 검색이 잘 되거든요.</h1>
    <h2>h2는 소제목입니다.</h2>
    <h3>h3~h6도 각자의 역할이 있죠. 비중은 작지만..</h3>
    <hr>
    span 태그입니다: 특정 <span style="color:red">글자</span>를 꾸밀 때 써요
    <hr>
    a 태그입니다: <a href="http://naver.com/"> 하이퍼링크 </a>
    <hr>
    img 태그입니다: <img src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" />
    <hr>
    input 태그입니다: <input type="text" />
    <hr>
    button 태그입니다: <button> 버튼입니다</button>
    <hr>
    textarea 태그입니다: <textarea>나는 무엇일까요?</textarea>
</body>

</html>

2일차
- Login.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>로그인페이지</title>

    <link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Nanum+Gothic+Coding&display=swap" rel="stylesheet">

    <style>
        * {
            font-family: 'Nanum Gothic Coding', monospace;
        }

        .mytitle {
            color: white;
            width: 300px;
            height: 200px;

            background-image: url('https://www.ancient-origins.net/sites/default/files/field/image/Agesilaus-II-cover.jpg');
            background-size: cover;
            background-position: center;

            border-radius: 10px;
            text-align: center;
            padding-top: 40px;
        }

        .wrap {
            width: 300px;
            margin: auto;
        }

        .mybtn {
            width: 300px;
            height: 50px;
            border-radius: 10px;
            background-color: brown;
            color: white;
        }
    </style>

</head>

<body>
    <div class="wrap">
        <div class="mytitle">
            <h1>로그인 페이지</h1>
            <h5>아이디, 비밀번호를 입력해주세요</h5>
        </div>
        <p>ID: <input type="text" /></p>
        <p>PW: <input type="text" /></p>
        <button class="mybtn"> 로그인하기</button>
    </div>
</body>

</html>

x-mas.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>2020년을 보내며</title>

    <link rel="shortcut icon" href="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSfJW0hgZrN4wdXMVy4a4gBvg3-B8-tDPv15A&usqp=CAU">

    <meta property="og:image" content="https://www.buckinghamtahoerentals.com/wp-content/uploads/2018/12/christmas-800x400.jpg">
    <meta property="og:title" content="남석이의 카드">
    <meta property="og:description" content="2020을 추억하며">

    <script src="https://s3.ap-northeast-2.amazonaws.com/materials.spartacodingclub.kr/xmas/snow.js"></script>

    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Poor+Story&display=swap" rel="stylesheet">

    <style>
        * {
            font-family: 'Poor Story', cursive;
        }

        body {
            background-color: #9b070f;
        }

        .envelope {
            width: 200px;
            height: 200px;

            background-image: url('https://pngimg.com/uploads/envelope/envelope_PNG18366.png');
            background-size: cover;
            background-position: center;

            margin: 200px auto 0 auto;

            cursor: pointer;
        }

        .envelope-msg {
            color: white;
            text-align: center;
        }

        .letter-close {
            display: block;
        }

        .letter-open {
            display: none;
        }

        .rtan {
            width: 200px;
            height: 200px;

            background-image: url('https://s3.ap-northeast-2.amazonaws.com/materials.spartacodingclub.kr/xmas/rtan.gif');
            background-size: cover;
            background-position: center;
            background-color: white;

            margin: 100px auto 0 auto;

            border-radius: 100px;
            border: 5px solid white;
            box-shadow: 0px 0px 10px 0px white;
        }

        h1 {
            color: white;
            text-align: center;
            margin-top: 30px;
            margin-bottom: 30px;
        }

        .messagebox {
            width: 400px;

            font-size: 20px;
            line-height: 30px;
            padding: 30px;
            color: brown;
            margin: auto;

            background-color: ivory;
            box-shadow: 0px 0px 10px 0px white;
        }

        .from {
            text-align: right;
            margin-bottom: 0px;
        }

        @media screen and (max-width: 760px) {
            .messagebox {
                width: 300px;
                padding: 20px;
            }

            .rtan {
                width: 150px;
                height: 150px;
                margin: 70px auto 0 auto;
            }

            h1 {
                font-size: 28px;
            }

            .envelope {
                margin: 150px auto 0px auto;
            }
        }
    </style>

    <script>
        function open_letter() {
            document.getElementsByClassName("letter-close")[0].style.display = 'none';
            document.getElementsByClassName("letter-open")[0].style.display = 'block';
        }

        function go_rtan() {
            alert('앗,어떻게 찾았지!');
            window.location.href='https://dev-code-notepad.tistory.com/';
        }
    </script>
</head>

<body>
    <div class="letter-close">
        <div class="envelope" onclick="open_letter()"></div>
        <h2 class="envelope-msg">봉투를 열어봐!</h2>
    </div>

    <div class="letter-open">
        <div class="rtan" onclick="go_rtan()"></div>
        <h1>2020년 수고 많았어!</h1>
        <div class="messagebox">
            친구들에게. <br />
            올해 이런저런 일이 많았는데 <br />
            너희 덕분에 하나도 힘들지 않았어 <br />
            내년에도 우리 우정 변치말자 <br />
            연말에 다 같이 못 봐서 아쉽다 <br />
            <p class="from">2020.12.22 남석이가</p>
        </div>
    </div>
</body>
</html>

링크
- xmas.spartacodingclub.kr/fjlKq22R1E5l/x-mas.html

(3) 느낀점

1일차

html에 관하여 간단한 설명과 태그 검색 방법, 태그의 종류 등 알기쉽게 잘 설명해주셔서 어려움 없이 진행 할 수 있었습니다.

2일차

대학교에서 접해본html과 달리 css는 접해본 경험이 없어 어떤것일까 많이 궁금하기도 했고, 기대하며 수업을 들었습니다. 생각했던거와 달리 css는 html을 좀 더 이쁘게 꾸며주기 위한 클래스 개념처럼 이해했으며, 수업 중 반복적으로 학습할 수 있게 진행하셨으며, 과제를 통해 또 한번 되새김질 할 수 있도록 하는 수업이었습니다. 간단한 function을 이용해 자바스크립트를 간접적으로 체험 할 수 있었으며, 개인 pc에서만 실행 되는 오프라인 홈페이지가 아닌 과제 제출 시 링크를 주어 다른 가족, 친구, 지인들에게 공유할 수 있어 만족스러웠습니다.

(4) 수료증

저작자표시 (새창열림)

'Study > Sparta Coding Club' 카테고리의 다른 글

[스파르타코딩클럽] 웹 개발 종합반 - 5주차 (후기) (1)	2021.03.11
[스파르타코딩클럽] 웹 개발 종합반 - 4주차 (후기) (0)	2021.03.01
[스파르타코딩클럽] 웹 개발 종합반 - 3주차 (후기) (1)	2021.02.26
[스파르타코딩클럽] 웹 개발 종합반 - 2주차 (후기) (1)	2021.02.22
[스파르타코딩클럽] 웹 개발 종합반 - 1주차 (후기) (2)	2021.02.19

728x90

(1) Next_permutation 함수란?

범위의 요소를 [first,last]다음 사전 식으로더 큰 순열로 다시 정렬합니다.

ex) 1,2,3 -> 1,3,2 -> 2,1,3 -> 2,3,1 -> 3,1,2 -> 3,2,1

단, 1,3,2 에서 시작 시 1,2,3의 경우는 돌아가지 않는다.

(2) Next_permutation 함수 구조

필요 헤더

#include <algorithm>

템플릿

//default
template <class BidirectionalIterator>
  bool next_permutation (BidirectionalIterator first,
                         BidirectionalIterator last);

//custom(비교문을 넣을 수 있음)                         
template <class BidirectionalIterator, class Compare>
  bool next_permutation (BidirectionalIterator first,
                         BidirectionalIterator last, Compare comp);
                         
 <------------------------예제------------------------>
#include <iostream>     // std::cout
#include <algorithm>    // std::next_permutation, std::sort

int main () {
  int myints[] = {1,2,3};

  std::sort (myints,myints+3);

  std::cout << "The 3! possible permutations with 3 elements:\n";
  do {
    std::cout << myints[0] << ' ' << myints[1] << ' ' << myints[2] << '\n';
  } while ( std::next_permutation(myints,myints+3) );

  std::cout << "After loop: " << myints[0] << ' ' << myints[1] << ' ' << myints[2] << '\n';

  return 0;
}

(3) Next_permutation 사용법

#include <iostream>
#include <vector>
#include <algorithm>

using namespace std;

int main()
{
	vector<int> v;

	v.push_back(2);
	v.push_back(1);
	v.push_back(3);

//모든 경우의 수를 확인하기 위해 최초 벡터를 오름차순으로 정렬
	sort(v.begin(), v.end());
	
	do {
		for (int i = 0; i < v.size(); i++)
		{
			cout << v.at(i);
		}
		cout << endl;
	} while (next_permutation(v.begin(), v.end()));

	return 0;
}

아래 링크를 통해 Next_permutation 함수를 사용한 완전탐색예제를 확인하실수 있습니다.

2020/11/27 - [Programmers/C++] - [프로그래머스] 코딩테스트 연습 > 완전탐색 > 소수 찾기(C++)

저작자표시 (새창열림)

'Study > C++' 카테고리의 다른 글

[TCP] TCP - Server (2)	2020.11.06
[STL] Vector Container 기본 사용법 (0)	2020.10.21

728x90

(1) TCP 란?

Transmission Control Protocol의 축약어로 컴퓨터가 다른 컴퓨터와 데이터 통신을 하기 위한 규약(프로토콜)의 일종이다.

(2) TCP 특징

연결형 서비스로 가상 회선 방식을 제공
3-way handshaking과정을 통해 연결을 설정하고 4-way handshaking을 통해 해제
흐름 제어 및 혼잡 제어
높은 신뢰성을 보장
UDP보다 속도가 느림

(3) Code - Server

#include <winsock2.h>
#include <iostream>

#pragma comment(lib, "ws2_32.lib")

using namespace std;

void ErrorHandling(string message);

#define PORT 1000
#define BUFFER_SIZE 1024

int main()
{
	WSADATA     wsaData;
	SOCKET      hServSock, hClntSock;
	SOCKADDR_IN servAddr, clntAddr;

	memset(&wsaData, 0x00, sizeof(WSADATA));
	memset(&hServSock, 0x00, sizeof(SOCKET));
	memset(&hClntSock, 0x00, sizeof(SOCKET));
	memset(&servAddr, 0x00, sizeof(SOCKADDR_IN));
	memset(&clntAddr, 0x00, sizeof(SOCKADDR_IN));


	bool	bAccept = false;
	bool	bBind = false;
	int     szClntAddr = 0;
	bool	bBind = false;

	while (1)
	{
		if (!bAccept)
		{
			if (!bBind)
			{
				// 윈속 초기화, 소켓사용하기전 초기화 해야함
				if (WSAStartup(MAKEWORD(2, 2), &wsaData) != 0)
					ErrorHandling("WSAStartup() error!");

				// TCP 소켓생성
				hServSock = socket(PF_INET, SOCK_STREAM, IPPROTO_TCP);

				int opt = 1;

				ioctlsocket(hServSock, FIONBIO, (u_long*)&opt);

				if (hServSock == INVALID_SOCKET)
					ErrorHandling("socket() error!");

				servAddr.sin_family = AF_INET;
				servAddr.sin_addr.s_addr = htonl(INADDR_ANY); 	// 현재 PC IP주소 사용
				servAddr.sin_port = htons(PORT);	// 포트번호

				// 주소 지정
				if (bind(hServSock, (SOCKADDR*)&servAddr, sizeof(servAddr)) == SOCKET_ERROR)
					ErrorHandling("bind() error!");

				bBind = true;
			}
			else
			{
				// 접속 받을수 있게
				if (listen(hServSock, 5) == SOCKET_ERROR)
					ErrorHandling("listen() error!");

				// 연결 수락
				szClntAddr = sizeof(clntAddr);

				hClntSock = accept(hServSock, (SOCKADDR*)&clntAddr, &szClntAddr);   
				if (hClntSock == INVALID_SOCKET)
					ErrorHandling("accept() error!");
				else
					bAccept = true;				
			}
		}
		else if (bBind && bAccept)
		{
			char cBuffer[BUFFER_SIZE] = {};
			int size = 0;

			size = recv(hClntSock, cBuffer, BUFFER_SIZE, 0);

			if (size > 0)
			{
				cout << cBuffer << endl;
			}			
		}
	}
	return 0;
}

void ErrorHandling(string message)
{
	cout << message << endl;
}

저작자표시 (새창열림)

'Study > C++' 카테고리의 다른 글

[STL] Next_permutation 함수 (C++) (1)	2020.11.27
[STL] Vector Container 기본 사용법 (0)	2020.10.21

728x90

(1) Vector란?

Vector는 C++ 표준 라이브러리(Standard Template Library)에 있는 컨테이너로 사용자가 손쉽게 사용하기 위해 정의된 class입니다. Vector의 가장 큰 장점은 동적으로 원소를 추가할 수 있으며 크기가 자동으로 늘어난다는 점입니다. 쉽게 말해 크기가 가변적으로 변하는 배열이라고 할 수 있습니다. 속도적인 측면에서는 배열에 비해 떨어지지만 메모리를 효율적으로 관리할 수 있다는 장점이 있어 굉장히 많이 사용합니다. vector는 배열과 마찬가지로 원소들이 하나의 메모리 블록에 연속하게 저장됩니다. 그렇기에 원소가 추가되거나 삽입될 때 메모리 재할당이 발생할 수 있고 상당한 부하가 발생하게 된다는 점은 단점으로 꼽히고 있습니다.

(2) Vector 구조

vector를 생성하면 메모리 heap에 생성되며 동적 할당됩니다.

front() : 첫 번째 원소
back() : 마지막 원소
begin() : 첫번째 위치
end() : 마지막의 다음 위치
size() : 원소의 개수
capacity() : 할당된 공간의 크기

size와 capacity가 따로 있는 이유

매번 새로운 원소가 들어올 때마다 새로운 메모리가 할당되는 것은 비효율적입니다. 그렇기에 vector는 새로운 원소가 벡터에 추가되면 메모리 공간을 추가적으로 할당되는 방식으로 이루어져 있습니다. 좀 더 정확하게는 capacity가 모자랄 경우 capacity/2 만큼의 capacity를 늘려나가게 됩니다. 만약 입력될 원소의 개수를 알 수 있다면 reserve를 사용하여 미리 capapcity 메모리를 할당해 놓으면 좀 더 호율적으로 vector를 사용할 수 있습니다.

(3) Vector 사용법

vector Container를 사용하기 위한 헤더

#include <vector>

Vector <T> 변수명 : T자료형을 가진 Vector 변수명을 선언

vector<int> _Vector

push_back(const T& x) : 벡터 끝에 원소를 추가
pop_back : 벡터의 마지막 원소를 삭제
insert(iterator position, const value_type& val) : position에 val를 삽입
erase(iterator position) : position에 위치한 값 삭제

_Vector.push_back(10);		// 벡터의 끝에 10값을 삽입
_Vector.pop_back;		// 벡터의 마지막 원소 삭제
_Vector.insert(3,10);		// 3번째에 10 삽입 //_Vector.insert(i,val)
_Vector.erase(3);		// 3번째값 삭제 //_Vector.erase(i)

begin() : 벡터의 시작 원소를 가리키는 반복자를 반환
end() : 벡터의 끝 표시 반복자를 반환
at() : 벡터의 n에 있는 원소를 반환

_Vector.begin();
_Vector.end();
_Vector.at(i);

'Study > C++' 카테고리의 다른 글

[STL] Next_permutation 함수 (C++) (1)	2020.11.27
[TCP] TCP - Server (2)	2020.11.06

Study

(1) LocalStorage, SessionStorage 란?

(2) LocalStorage, SessionStorage 사용법

'Study > JavaScript' 카테고리의 다른 글

(1) 중복처리 하는 이유

(2) Code

'Study > HTML&CSS' 카테고리의 다른 글

(1) 부트스트랩 이란

(2) 부트스트랩 시작 템플릿 코드

(3) 부트스트랩 참고 사이트

'Study > HTML&CSS' 카테고리의 다른 글

(1) 논리 연산자

(2) &&(논리곱, AND) 연산자

(3) ||(논리합, OR) 연산자

(4) !(NOT) 연산자

'Study > JavaScript' 카테고리의 다른 글

(1) 블록 레벨 스코프

(2) 변수 중복 선언

(3) 재할당

(4) Const와 객체

'Study > JavaScript' 카테고리의 다른 글

(1) 탐욕법(그리디) 알고리즘 이란?

'Study > Algorithm' 카테고리의 다른 글

(1) 강의내용

(2) 코드 / 빌드 링크

(3) 느낀점

(4) 수료증

'Study > Sparta Coding Club' 카테고리의 다른 글

(1) Next_permutation 함수란?

(2) Next_permutation 함수 구조

(3) Next_permutation 사용법

'Study > C++' 카테고리의 다른 글

(1) TCP 란?

(2) TCP 특징

(3) Code - Server

'Study > C++' 카테고리의 다른 글

(1) Vector란?

(2) Vector 구조

size와 capacity가 따로 있는 이유

(3) Vector 사용법

'Study > C++' 카테고리의 다른 글

티스토리툴바