🌐인터프리터 언어 코드가 실행되는 단계인 런타임에 문 단위로 한 줄씩 중간 코드인 *바이트코드로 변환한 후 실행한다. * 바이트코드 : 특정한 하드웨어가 아니라 가상 머신에서 실행하도록 만든 바이너리 코드 🌐컴파일러 언어 코드가 실행되기 전 단계인 컴파일 타임에 소스코드 전체를 한 번에 *머신코드로 변환한 후 실행한다. * 머신코드 : CPU가 바로 실행할 수 있는 기계어 자바스크립트는 컴파일 언어인가? 인터프리터 언어인가? 자바스크립트는 인터프리터 언어다. 따라서 개발자가 별도의 컴파일 작업을 수행하지 않는다. 인터프리터 언어는 코드가 실행될 때마다 인터프리트 과정이 반복 수행되므로 코드 실행 속도가 비교적 느리다. 때문에 대부분의 자바스크립트 엔진(V8, SpiderMonkey ...)은 전통적인 컴..
내가 맡은 파트 중에 사용자가 글을 등록하는 Form 페이지가 있었다. 피그마로 디자인을 하고 문제가 없어서 코드로 구현까지 마친 후 테스트를 위해 직접 작성하려고 하는데, 어딘가 어색하고 불편한 느낌이 들었다. (아무도 피드백을 주진 않았지만... 그냥 내가 불편했음) 그동안 단순하게 제목과 글만 쓰는 블로그에서만 폼을 작성해보다 보니, 날짜, 시간, 가격, 위치 등 다양한 내용을 작성하는 폼을 디자인하는 게 어색했던 탓이었다. 물론 처음 디자인도 나쁜 건 아니었지만, 전문적이지 않은 느낌이 계속 들었는데 나는 '누가봐도 초짜가 만든 사이트'처럼 보이게 두고 싶지 않았다..! 그래서 이것저것 참고해보니 역시 폼 작성과 관련된 가이드가 어느정도 정해져 있었다. 🔗참고한 사이트 왼쪽 사진이 초안이고, 오른..
2023년 3월 ~ 12월 첫째 주 회고📆2023.03.05 - 12.12 무려 9달 하고도 보름...밀린 회고를 써보려고 한다. 1. 3~5월 방황기3월 초까지는 계속 해왔던 것처럼 스프링 공부와 알고리즘 공부를 이어갔다. 그러다가 감기와 할머니 기일이 겹쳐 멘탈이 한동안 나가있었다. 거의 2주 간 정신 못차리고 있다가 다시 시작하니 이전만큼 오래 집중하지도 못하고 힘이 너무 빠져서 방황기가 시작됐다. 그 당시 나의 목표는 데브코스였는데 공부도 제대로 하지 못하고 자신이 없으니 더욱 현실 도피하기 바빴고, 결국 포기상태로 4월을 보냈다(4월은 거의 프로그래머스만 한두 문제씩 풀었음). 당연하게도 데브코스는 망했고, 5월은 경험삼아 싸피 적성진단도 해봤다. 문제는 여기서 시작됐다. 막상 데브코스..
💡 디바이스 크기가 줄어들고 늘어남에 따라 - 자연스럽게 웹사이트의 스타일이 변화되면 반응형 - 뚝뚝 끊겨서 독립적인 스타일이 적용되면 적응형 미디어쿼리 @media 여러 디바이스에 대응되는 반응형 또는 적응형 웹사이트를 만들 때 사용되는 CSS 구문 스타일을 변경하기 위한 조건 min-width : 브라우저의 최소 가로 폭 max-width : 브라우저의 최대 가로 폭 ex) 브라우저의 가로폭이 320px ~ 800px이 되었을 경우 아래 CSS 속성으로 대체한다. @media screen and (min-width: 320px) and (max-width: 800px) { h1 {...} h1:hover {...} } 미디어쿼리 사용 시 주의사항 1. meta 코드 작성 다음 코드를 반드시 html의..
HTML HTML : Hyper Text Markup Language 웹 사이트에서 눈에 보이는 정보나 특정 구역을 설정할 때 사용하는 언어 눈에 보이는 정보 : 텍스트, 이미지 등 네비게이션, 로그인, 베너 등 영역을 나누는 역할 시간이 지남에 따라 자주 사용되지 않는 용어들은 사라지고, 새로운 언어가 생기기도 함 HTML 태그 구성 요소 태그명 : HTML이 갖고 있는 고유의 기능 형태로 입력 닫힌 태그가 없는 태그도 몇 있음 컨텐츠 : 열린 태그와 닫힌 태그 사이에 있는 내용물 속성 : 태그가 가지는 추가 정보 속성 값 : 어떤 역할을 수행할지 구체적인 명령 HTML 문서 기본 구조 html5라는 신조어. 문서를 선언하는 태그 html 문서의 시작과 끝을 의미 웹사이트의 간단한 요약 정보를 담는 영..
웹이란? 월드 와이드 웹(World Wide Web, WWW) : 인터넷에 연결된 사용자들이 서로의 정보를 공유하는 공간 인터넷 상에서 텍스트, 그림, 영상 등 멀티미디어 정보를 하이퍼텍스트 방식으로 연결하여 제공한다. 하이퍼텍스트(hypertext) : 하이퍼링크를 통해 서로 참조할 수 있는 기술 하이퍼링크(hyperlink) : 문서 내부에서 또 다른 문서로 연결되는 참조 링크 웹 구성 웹 페이지 : HTML 언어를 사용하여 작성된 하이퍼 텍스트 문서 웹 사이트 : 서로 관련된 내용으로 작성된 웹페이지들의 집합 웹 페이지들은 하이퍼링크를 통해 연결됨 웹 브라우저 HTML 문서를 읽고 웹 페이지에 정보를 표시하는 소프트웨어 URL을 통해 접근한다. ex) 크롬, 인터넷 익스플로러, 파이어폭스, 네이버웨..
힙 트리 우선순위 큐를 위해 만들어진 자료구조 최소 값이나 최대 값을 빠르게 찾아내기 위해 완전 이진 트리를 기반으로 한 자료구조 우선순위 큐 : 우선순위 개념을 큐에 도입한 자료구조. 데이터들이 우선순위를 가지고 있어 우선순위가 높은 데이터가 먼저 나간다. 반 정렬 상태 완전 이진 트리의 일종 중복 값을 허용 종류 최대 힙 : 부모 노드의 키 값이 자식 노드의 키 값보다 크거나 같은 완전 이진 트리 최소 힙 : 부모 노드의 키 값이 자식 노드의 키 값보다 작거나 같은 완전 이진 트리 구현 힙 구현의 표준은 배열이다. 부모와 자식 인덱스는 항상 정해져 있다. 왼쪽 자식 index = (부모 index) * 2 오른쪽 자식 index = (부모 index) * 2 + 1 부모 index = (자식 inde..
트리 노드들이 나뭇가지처럼 연결된 비선형 계층적 자료구조 그래프의 한 종류이다. 하나의 루트 노드와 0개 이상의 하위 트리 비선형 자료구조 : 데이터를 순차적으로 저장하지 않음 재귀적 자료구조 : 트리 내에 또 다른 트리가 있다. loop가 없는 연결 무방향 그래프 모든 자식 노드는 하나의 부모 노드만 갖는다. 노드가 n개인 트리는 항상 n-1개의 간선을 가진다. 관련 용어 노드(Node) : 그래프의 정점 루트 노드 : 트리의 기준이 되는 노드. 나무의 뿌리를 생각하면 된다. 루트 노드에서 가지가 뻗어나가는 이미지. 부모 노드 : 자신과 인접한 노드들 중 루트 노드로 향하는 노드 자식 노드 : 자신과 인접한 노드들 중 루트 노드의 반대 방향으로 향하는 노드 단말 노드 : 자식 노드가 존재하지 않는 노드..
그래프 노드와 그 노드를 연결하는 간선을 모아 놓은 자료구조 즉, 연결된 객체 간의 관계를 표현하는 자료구조 관련 용어 정점(vertex) : 위치라는 개념. node라고도 부름 간선(edge) : 위치 간의 관계. 즉, 노드를 연결하는 선. link, branch라고도 부름 인접 정점 : 간선에 의해 직접 연결된 정점 차수 : 무방향 그래프에서 하나의 정점에 인접한 정점의 수 진입 차수(내차수) : 방향 그래프에서 외부에서 오는 간선의 수 진출 차수(외차수) : 방향 그래프에서 외부로 향하는 간선의 수 경로 길이 : 경로를 구성하는 데 사용된 간선의 수 단순 경로 : 반복되는 정점이 없는 경로 (한붓그리기) 사이클 : 단순 경로의 시작과 종료 정점이 동일한 경우 그래프 구현 방법 1. 인접 행렬(2차원..
