이미지 경로를 포함한 객체에서 경로를 못읽을때 발생하는 404 에러 해결방안이다. (나의 개발환경은 vue.js 이다. 객체를 v-for로 반복문을 통해 호출하고, 객체의 path 값을 이미지 경로로 사용하여 렌더링한다.) 상황 1. HTML 부분 (vue.js 의 template) 객체의 이미지 경로는 다음과 같이 호출하였다. 2. 사용 객체 let imgArr = [ { name: '테스트 이미지', path: '@/assets/img/my-img.png' } ] 호출 대상이 되는 객체는 다음과 같은 형태이다. 이때 빌드를 수행하면 아래와 같은 404 에러가 발생한다. 해결방안 에러의 원인은 다음과 같다. imgArr 배열의 path 값을 넘겨받을때 ('@/assets/img/my-img.png'),..

다음은 운영체제의 메모리 공간이다. 📌코드(code) 영역 메모리의 코드(code) 영역은 실행할 프로그램의 코드가 저장되는 영역으로 텍스트(code) 영역이라고도 부른다. CPU는 코드 영역에 저장된 명령어를 하나씩 가져가서 처리하게 된다. 코드 영역에는 상수, 함수, 제어문 등이 저장된다. 📌데이터(data) 영역 메모리의 데이터(data) 영역은 프로그램의 전역 변수와 정적(static) 변수가 저장되는 영역이다. 데이터 영역은 프로그램의 시작과 함께 할당되며, 프로그램이 종료되면 소멸한다. 📌힙(heap) 영역 모리의 힙(heap) 영역은 사용자에 의해 관리되는 영역이다. 흔히 동적으로 할당 할 변수들이 이곳에 저장된다고 보면 된다. 힙 영역은 사용자에 의해 메모리 공간이 동적으로 할당되고 해제된..

📝 HTTP 버전 역사 전체 HTTP/0.9 (1991년) HTTP/1.0 (1996년) HTTP/1.1 (1997년) : 가장 많이 사용중 RFC2068 (1997) -> RFC2616 (1999) -> RFC7230~7235 (2014) 현재 표준 스펙을 보려면 RFC7230 이후를 봐야 한다 HTTP/2.0 (2015년) : HTTP 1.1의 성능 개선 및 확장 HTTP/3.0 (진행중) 핵심 HTTP 1.1 이 모든것의 기반이기에 잘 알아두는것이 좋다. 📝 HTTP 0.9 특징 HTTP 초기 버전을 구분하기 위해 부르는 버전 (1991년) 요청은 단일 라인으로 구성되며, 리소스에 대한 method는 GET만 존재 응답도 극도로 단순 (파일 내용 자체로만 구성) HTTP 헤더도 없고, HTML파일만..

📝 공유메모리란? (shared memory) - 프로세스 간에 공통으로 사용하는 공유 메모리 공간으로 프로세스 간 협력을 한다. - IPC(Inter-Process Communication)의 일종으로 프로세스간 통신시 사용한다. 운영체제에서 가상메모리공간은 독립적이다. 모든 프로세스는 자신의 업무를 수행하기 위해 독립적인 메모리 공간을 가지게 된다. 예를들어 프로세스 A의 작업내용이 프로세스 B에 영향이 가면 안되기 때문이다. 프로세스를 침범해버릴 경우 운영체제는 프로세스를 논리규칙 위반에 따라 종료시킨다. 여러개의 프로세스가 특정 메모리 공간을 동시에 접근해야할 필요가 있을때 공유 메모리라는 IPC 기법을 사용한다. 공유메모리는 이러한 작업을 위한 효울적인 방법을 제공한다. 📌 특징 1. 하나의 메..

기본 선언방식의 아쉬운점 사실 로직을 짜다보면 가독성을 높이기 위해 변수를 선언하는 경우가 있다. 예를어 아래처럼 사용자 정보가 담긴 배열이 있다고 하자. (설명을 위해 복잡한 인덱스를 만들어보았다.) // 사용자 아이디 userInfoArr[0][1].userId[0]; // 사용자 이름 userInfoArr[0][1].userName[0]; // 사용자 주소 userInfoArr[0][1].userAddr[0]; 특정 값을 반복적으로 사용해야하는 경우가 있다고 할때 아래처럼 코드의 길이를 줄이고 가독성을 높이기 위해 명확한 뜻을 가진 변수명을 선언하곤 한다. const uInfo = userInfoArr[0][1]; uInfo.userId[0]; uInfo.userName[0]; uInfo.userA..

sort() 란? sort 메서드는 배열의 요소를 정렬할때 사용하는 함수이다. MDN에서는 기본 구문을 아래와 같이 정의한다. arr.sort([compareFunction]) * 대괄호[] 는 괄호 안의 매개변수가 생략이 가능하다는 의미이다. 정렬의 경우 매개변수가 있을 경우와 없을 경우, 값이 다르게 출력되는 경우가 발생한다. 실제로 정렬 알고리즘을 풀면서 원하는 출력값이 나오지 않아 내용을 정리해보고자 한다. 10 이 2보다 먼저 정렬된다? 다음과같은 배열이 주어졌을때 sort 메서드로 정렬을 수행한 수 0번째 인덱스 값을 추출하려 한다. 2가 가장 작고, 7, 10 순으로 커지니 출력 기댓값은 2였다. 하지만 실제로는 10이 출력된다. 대체 왜일까? let sortArray = [7, 10, 2]..

나의 코드를 npm install 형식으로 배포하기 위한 과정에서 문득 모듈과 패키지에 대해 같은것을 다르게 지칭하는 것인지 궁금해졌다. 모듈이란 Node.js require() 함수에 의해 로드할 수 있는 node_modules 디렉터리 파일 또는 디렉터리를 말한다. 개발하는 어플리케이션의 크기가 커지면 파일을 여러개로 분리해야하는 시점이 온다. 이때 분리된 각각의 파일을 모듈 이라고 한다. 모듈은 대개 특정한 기능을 수행하는 복수의 함수로 구성되어있다. 모듈은 단지 하나의 파일에 불과하다. 모듈에 특수 지시자인 export나 import를 적용하면 다른 모듈을 불러와 함수를 호출하는 기능 공유가 가능하다. 모듈은 package.json 파일을 가질필요가 없기 때문에 모든 모듈이 패키지 인것은 아니다!..

. 재귀(Recursion) 란? : 재귀함수란 자기 자신을 계속 호출하는 함수를 뜻한다. - 자기 자신을 호출할 수 있기 때문에 반복 연산에 자주 사용된다. - 모든 재귀함수는 무한재귀가 발생하는것을 방지하기 위해 탈출 조건인 기본단계와 재귀단계로 나누어져 있다. - 함수가 호출될 때 스택 메모리(stack memory)를 사용하게 되는데, 함수의 스택 call이 반복적으로 이루어지므로 메모리를 많이 차지하며 반복문에 비해 성능이 좋지 않다. - 메모리가 부족한 상황까지 반복된다면 stack overflow가 발생하며 프로그램이 비정상 종료 된다. 재귀 vs 반복문 여기까지의 결론 재귀는 반복문보다 느리고 성능이 좋지 않다. 그럼 대체 재귀를 왜 사용하는걸까?... 재귀함수를 사용하는 이유 1. 재귀적..