목록전체 글 (305)
데이터베이스 (DB) 데이터베이스는 데이터의 집합, 여러 정보들을 저장하여 운영하는 데이터의 묶음이다. 어떤 의미에선 아래와 같이 내가 작년 산책하던 기록을 저장한다면 그 또한 데이터베이스라고 볼 수 있다. 미래 개발자로서의 입장으로는 '컴퓨터 시스템에 저장되는 조직화된 데이터 모음'이라고도 정의할 수도 있다. 데이터베이스의 유형을 구분하는 것은 여러 갈래로 표현할 수 있겠지만, 오늘은 SQL 과 noSQL 에 대해 공부한 내용에 대해 다뤄보려고 한다. 먼저 SQL과 noSQL 에서 QL이 무슨 의미를 갖는지 알 필요가 있는데 다음과 같다. QL(Query Language) : QL은 '질의어'라는 의미를 갖는데, 이는 DB에 저장되어 있는 데이터를 꺼내거나 저장시킬 수 있는 언어라는 의미를 가지고 있다..
가상 머신 기존 운영 체제(OS)안에 다른 OS(일반적으로는 리눅스)를 추가로 설치하여 운용하는 것을 가상 머신이라 한다. 가상 머신의 장단점을 나열하자면, 장점 : 무료(리눅스)이며 서버로 쓰기에 가장 안정적이지만, 단점 : 부팅을 두 번해야 할뿐더러 용량을 많이 차지하여 성능 저하가 우려된다. Docker 위와 같은 단점을 보완하기 위해 나온 것이 Docker. (docker 또한 기본적으로 리눅스 os를 채택함) Docker 의 핵심적인 장점을 나열하자면 1. 개발 / 배포환경 통일 : 한 사람이 설치한 내용을 타인에게 파일처럼 효율적으로 공유할 수 있음 2. 프로그램 미리 설치 : 이미지를 저장해놓고 컨테이너로 불러와 사용하기 때문에 굳이 새로 설치할 필요 없음 3. 가벼운 가상컴퓨터 :커널(운영..
async-await async-await를 이해하기 위해선 동기와 비동기 개념을 이해해야 한다. 동기 : 등록이 될 때까지 기다림 / 서버 컴퓨터가 작업이 끝날 때까지 기다리는 통신 비동기 : 요청들이 서로 기다릴 필요 없을 때 사용 / 동시에 여러 일을 할 때 / 서버 컴퓨터가 작업이 끝날 때까지 기다리지 않는 통신 => axios 와 같은 API 관련 기능들은 '비동기'가 기본값 vscode 내에서 비동기 // 비동기 통신 // 비동기로 실행되기 때문에 생기는 Promise const data = axios.get(url - / 중략 / ) // API정보를 받아오기 전에 저장 console.log(data) // 비동기 통신 (async / await) // async : 함수 앞 / await ..
axios axios는 node.js를 위한 Promise API를 활용하는 HTTP 비동기 통신 라이브러리다. 쉽게 말해, 백엔드와 프론트엔드 간 통신을 쉽게하기 위해 사용한다. (백엔드, 프론트엔드 둘다 가능) 이번 포스팅에서는 HTML내에 axios를 설치하고 적용하는 방식에 대해 설명한다. 해당 코딩은 이전에 만든 휴대폰 번호 토큰 전송 기능을 활용한다. axios 설치는 npmjs에 제시된 cdn을 통해 완료했다. 먼저 프론트엔드(가상) 내에 axios 통신이 구현됨을 확인하기 위해 HTML을 만들었다. 이때, '인증하기' 버튼을 누르면, zzz() 라 이름지은 함수가 실행되게 되는데 그 함수의 모습은 이렇다. function zzz(){ // 1. 입력한 휴대폰 번호 가져오기 const myP..
배열 관련 메서드 : map / filter / sort / reduce 문자열 관련 메서드 : slice / substring / substr/ split / join slice / substring / substr 차이 map map 메서드 역시 배열을 순회하는 메서드이다. 다만, 모든 순회(반복) 과정에서 return 값이 존재해야 하며, 없을 경우 'undefined'를 반환한다. // map 예시 const arr = [1,2,3,4,5] arr.map((el) => { if(el % 2 == 0 ){ // 부여한 조건 return el } }) // 반환값 : [ undefined, 2, undefined, 4, undefined ] 추가적으로 꼴보기 싫은 undefined를 단번에 제외하려면..
서버 서버는 백엔드 컴퓨터나 DB컴퓨터처럼 특정된 것이 아니라, 클라이언트로 '요청을 받는' 모든 것들을 의미한다. 반대로 클라이언트 또한 브라우저나 사용자로 특정된 것이 아닌, '요청하는' 모든 것들이라 볼 수 있다. 클라이언트와 서버 사이의 관계를 가볍게 요약하자면 다음과 같다. 괄호 안 숫자 == 포트번호 프론트엔드 (3000) 백엔드 (4000) DB (3306) 브라우저 컴퓨터 / 프로그램 HTML / CSS / JS 요청 및 응답 프론트엔드 컴퓨터 / 프로그램 API 요청 및 응답 백엔드 컴퓨터 / 프로그램 DB / 해당데이터 요청 및 응답 포트 이때, 각각의 컴퓨터/프로그램은 프론트엔드(3000), 백엔드(4000), DB(3306) 포트번호를 가지고 있으며, 이 번호는 무조건적으로 정해진 ..
break : 원하는 구간에서 반복문 종료 // break 예시 for(let i = 0 ; i < 5 ; i++){ if(i===2){ break // break의 경우 switch 반복문에서 항상 사용 } console.log(i) // 0 1 } continue : 해당 구간의 반복문을 실행하지 않음 (생략) // continue 예시 for(let i = 0 ; i < 5 ; i++){ if(i===2){ continue } console.log(i) // 0 1 3 4 } 반복문의 여러 문법 for ~ in // Key ~ in 예시 const obj = { name : 'otter', age : 30 } for(let key in obj){ console.log(key, obj[key]) //..
데이터 통신 기초 HTTP(HyperText Transfer Protocol) : 텍스트 / 하이퍼텍스트(HTML) ( 이때 protocol == 데이터가 다니는 '길') 통신이란, 두 컴퓨터 간 데이터 전송을 의미한다. 통신은, 요청(request)과 응답(response)으로 구성되며, 요청 & 응답은 헤더와 바디로 구분된다. 단 '응답'에는 '상태코드'가 부여되게 되는데, 예시로는 아래와 같다. ex) 200(성공 관련), 400(클라이언트, 요청자 에러 관련), 500(서버, 응답자 에러 관련) JSON (javascript object notation, 자바스크립트 객체 표기법) 데이터 요청과 응답은 JSON 형태로 주고 받게 된다. (stringtify & parse) 이와 관련된 내용은 이전..