BFS(너비 우선 탐색) BFS(Breadth-first search)는 같은 깊이에 있는 정점부터 탐색하는 알고리즘이다. BFS(너비 우선 탐색) - Queue 를 사용하여 구현 - 시작 지점에서 가까운 정점부터 탐색 - 시간 복잡도 O(정점의 수 + 간선의 수) Queue 를 사용한 BFS step 1 | Queue [ 1 ] Queue에 1을 enqueue step 2 | Queue [ 2 ] [ 3 ] [ 4 ] 1을 dequeue 하고, 자식 정점 2, 3, 4를 enqueue step 3 | Queue [ 3 ] [ 4 ] [ 5 ] [ 6 ] 2를 dequeue 하고, 자식 정점 5, 6를 enqueue step 4 | Queue [ 4 ] [ 5 ] [ 6 ] 3을 dequeue 하고, 자..

시작하기 앞서 지난 게시물에서 입력 태그인 input에 대해 알아보았다. HTML input 태그(새 창 바로가기) 정보를 입력받을 때 사용되는 태그이지만 input 이 아닌 태그에 대해 알아볼 것이다. textarea 태그 input 태그를 보면 내용을 입력하는 부분이 한 줄이다. 그래서 만약 게시물처럼 긴 글을 입력하고 싶을 때에는 태그를 사용한다. textarea 태그 메시지를 입력하세요. 그러면 긴 텍스트를 입력하는 창이 생긴다. textarea - 크기 변경 만약 텍스트 창의 크기를 수정하고 싶으면 cols, rows 속성을 사용하여 각각 열(가로)과 행(세로) 수를 설정하여 크기를 수정한다. 그래서 가로는 30개 만큼 커졌고, 세로는 5개 만큼 커졌다. textarea - 입력 값 넣기 in..

HTML 입력 태그 HTML 에서 아이디나 비밀번호 등 정보를 입력해서 로그인 하거나, 게시물과 댓글 등을 작성하기 위해서 입력 태그인 태그 등을 사용해야 한다. HTML 입력 태그 구조 입력 태그를 사용하기 전 알아야 되는 4가지 태그가 있다. 태그 설명 속성 제출할 정보들을 담고 있는 태그 autocomplete (자동 완성 여부) - on, off 정보를 입력 받는 태그 type - 매우 다양함 태그의 라벨 for - input 태그의 id 와 연결 버튼 type - submit(제출), rest(초기화), button(기본) 사용 방법은 다음과 같다. 태그 안에 태그를 넣는다. 은 입력받는 태그로 이름을 입력받기 위해 text 형식을 속성으로 설정해준다. 은 태그의 라벨로 의 for 값과 의 id..

☘️ 정렬 정렬 정의 정렬이란 요소들을 일정한 순서대로(오름차순 or 내림차순) 열거하는 알고리즘이다. 정렬 방식 삽입 정렬 선택 정렬 버블 정렬 머지 정렬 힙 정렬 퀵 정렬 등。。。 버블 정렬 버블 정렬은 인접한 두 요소의 크기를 비교하여, 자리를 교환하면서 정렬하는 방식이다. 예) 오름차순 정렬 6과 4를 비교했을 때, 앞에 있는 6이 더 크기 때문에 자리를 교환한다. 다음으로 6과 1을 비교했을 때, 앞에 있는 6이 더 크기 때문에 자리를 교환한다. 다음으로 6과 2를 비교했을 때, 앞에 있는 6이 더 크기 때문에 자리를 교환한다. 6과 8을 비교했을 때, 정렬 순서가 맞기 때문에 자리를 교환하지 않는다. (첫번째 순회 완료) 첫 번째 순회를 완료했다. 그러면 맨 끝에 있는 8은 정렬이 완료 된 것..

시작하며... 이번엔 HTML 태그 중에서 링크 태그인 에 대해 알아볼 것이다. HTML 링크 태그 a 태그 html에서 다른 페이지로 이동하는 링크는 태그를 사용하여 만들 수 있다. - HTML: Hypertext Markup Language | MDN HTML 요소(앵커 요소)는 href 특성을 통해 다른 페이지나 같은 페이지의 어느 위치, 파일, 이메일 주소와 그 외 다른 URL로 연결할 수 있는 하이퍼링크를 만듭니다. 안의 콘텐츠는 링크 목적지 developer.mozilla.org a 태그 속성 - href, target 태그 속성에는 href 와 target 이 있다. href는 이동할 링크의 주소를 작성한다. 예를 들어 https://www.naver.com 와 같은 웹 사이트 주소이다. t..

☘️ 이진 탐색 이진 탐색 정의 이진 탐색은 정렬된 요소들을 절반씩 줄여가며 찾는 알고리즘이다. 이진 탐색 정렬이 되어 있어야 함 배열, 이진 트리 사용하여 구현 시간 복잡도 O(log n) 로 빠름 이진 탐색 구현 - 배열 원하는 숫자를 찾기 방법은 다음과 같다. 정렬된 배열에서 맨 앞을 left, 맨 뒤를 right, 가운데를 mid 로 설정 찾는 숫자를 mid 값과 비교 mid 값이 더 크면 right = mid - 1 mid 값이 더 작으면 left = mid + 1 새롭게 설정된 left 또는 right 값으로 mid 값 다시 설정 이를 반복하여 mid 값과 찾는 숫자가 같으면 종료 배열을 사용하여 이진 탐색을 구현하면 선형 시간 O(n) 이 소요된다. 그래서 이를 해결하기 위해 이진 탐색 트리..

시작하며... 이번엔 HTML 태그 중에서 이미지와 표 태그에 대해 알아볼 것이다. HTML 이미지 태그 img 태그 웹 상에 이미지를 넣기 위해 태그를 사용한다. img 태그 속성 - src, alt, title, width, height 태그의 속성 중에 많은 속성이 있는데 그 중 자주 사용되고 중요한 속성은 다음과 같다. src 필수 속성이며, 이미지의 경로를 넣는다. alt 대체 텍스트, 이미지가 보이지 않을 경우 대체 텍스트를 보여준다. title 이미지를 가져다 댔을 때 보임, alt의 대체제나 중복이 되어서는 안 됨 width, height 각각 넓이와 높이, px(픽셀) 단위로 길이 조절 img 이미지 태그 결과를 보면 왼쪽처럼 이미지가 나타나고 사진에다가 마우스를 가져다 댔을 때 titl..

시작하며... 이번엔 HTML 태그 중에서 나열과 관련된 태그에 대해 알아볼 것이다. HTML 목록 태그 li 목록 태그 태그는 목록들의 요소를 표현한다. list 의 약자로 또는 태그 안에 위치해야 한다. - HTML: Hypertext Markup Language | MDN HTML 요소는 목록의 항목을 나타냅니다. 반드시 정렬 목록(), 비정렬 목록(, 혹은 메뉴( (en-US)) 안에 위치해야 합니다. 메뉴와 비정렬 목록에서는 보통 불릿으로 항목을 나타내고, 정 developer.mozilla.org ul 비정렬 목록 태그 태그는 unordered list 의 약자로 순서가 필요 없는 요소들을 나열할 때 사용된다. ul, li 태그 사과 오렌지 포도 샤인머스캣 거봉 청포도 요소 안에 하위 목록을 ..

시작하며... 이번엔 HTML 태그 중에서 인용에 관련된 blockquote, cite, q, mark, abbr 태그에 대해 알아볼 것이다. HTML 속성 태그를 설명하기 전에 HTML 속성에 대해 알아볼 것이다. HTML 속성은 무엇일까? 사용자가 원하는 기준에 맞도록 요소를 설정하거나 다양한 방식으로 요소의 동작을 조절하기 위한 값 즉 태그의 동작을 설정하고 제어하는 것이다. 예를 들어 처음 게시물에서 언어를 한국어로 바꿨을 때, 태그 안에 lang="en" 값을 lang="ko" 로 바꿨다. 이때 태그 안에 값을 넣어 설정하는 것이라고 할 수 있다. 자세한 설명은 아래 링크에서 확인가능하다. HTML 특성 참고서 - HTML: Hypertext Markup Language | MDN HTML의 요..

시작하며... 나는 React도 할 수 있고, 프로젝트 경험도 있지만 매번 사용하는 HTML 태그만 사용하고, 비슷한 태그의 차이점과 내가 자주 사용하지 않는 것들에 대해 까먹고 있거나 모르는 것이 많다고 생각해서 다시 HTML 기초부터 공부해보기로 하였다. HTML 실습 준비 비주얼 스튜디오 먼저 가장 기본적인 비주얼 스튜디오를 설치한다. 그리고 내가 만든 html 파일을 웹상에서 새로고침 없이 볼 수 있도록, Live Server 라는 플러그인을 설치한다. 파일 생성 폴더를 생성하고 index.html 파일을 생성한다. 그리고 ! 를 입력하면 자동으로 HTML 기본틀이 생성된다. 웹 상에 나타나는 내용은 태그 라는 곳에 넣으면 된다. 그리고 언어를 기존 영어인 en 에서 한국어인 ko 로 수정해준다..