[프로그래머스] 백엔드기초(2)

Lina Hongbi Ko·2024년 8월 29일
0

Programmers_BootCamp

목록 보기
11/76
post-thumbnail

2024년 8월 29일

✏️ HTTP method

: HTTP에 담아 보내는 나의 목적(방법)

  • HTTP는 규약이기 때문에 정해둔 용어가 있음 -> 적절한 method 찾아서 사용
    • 생성(=등록) : POST

    • 조회 : GET

    • 수정 : PUT / PATCH

    • 삭제 : DELETE

    • 이외의 것들 : HAED, OPTIONS, CONNECT, TRACE (데이터 번외 것들(통신)에 대한 설정들을 위한 것)

      cf) PUT vs PATCH
      - PUT : 덮어쓰기 / 값이 바뀌었든 아니든 새걸로 덮어쓰기
      - PATCH : 일부변경 / 값이 바뀐 것만 변경 ex) 연락처, 이메일, 주소 등 하나만 바꾸는 경우(부분수정)

    • HTTP method는 사실 HTTP의 Head 부분에 들어감

✏️ node.js

: node.js는 백엔드에서만 쓰이는게 아님

  • 특정 로직을 위한 기술을 넘어서서 여러가지의 자바스크립트를 이용한 것들을(ex 리액트, 뷰 ...등) 위한 운동장을 제공하는 기술에도 사용됨
  • 넷플릭스, 에어비앤비, 링크드인, 우버, NASA ... 등등 많은 곳들이 node.js를 사용함
  • 자바스크립트를 스크립트언어 이상으로 프로그래밍 언어 역할을 할 수 있도록 지원하는 플랫폼(=자바슼릡트가 뛰어다닐 수 있게 지원하는 운동장)
  • 자바스크립트는 원래 웹브라우저 위에서만 쓸 수 있었지만, node.js를 통해 브라우저 밖에서도 코드를 실행시킬 수 있음

✏️ node.js 특징

  1. 싱글 스레드
    : 요리사가 한 명이고, 주문이 계속 밀려들어와도 한명이 다 처리해야함
    ex) 라면 1개 주문(요리시간: 10분/ 물끓는시간:5분), 볶음밥 1개 주문(요리시간:5분)

  2. 이벤트 기반
    : 주문이 들어와야만 일을 함(= 주문 없으면 일 안함)
    ex) 핫도그 주문하려고 했지만 그냥 안함

  3. 논블로킹 I/O (Non-Blocking Insert/Out)
    : 요리사 한 명이 일을 하는데 순차적으로 하지 않고, 중간중간 비는 시간에 다른 요리를 함
    ex) 라면 물 끓여놓고 끓기 기다림(5분) -> 그동안 볶음밥 요리 -> 남은 5분에 라면 요리

cf) 스프링: 스프링도 싱글스레드가 기본구조

참조사이트 : https://medium.com/@vdongbin/node-js-%EB%8F%99%EC%9E%91%EC%9B%90%EB%A6%AC-single-thread-event-driven-non-blocking-i-o-event-loop-ce97e58a8e21

💡 논블로킹의 예(setTimeout)

: 자바스크립트를 node.js 위에서 동작시키면, 남들이 만들어 놓은 기등들을 사용할 수 있음

  • 그중에서 setTimeout을 이용해 논블로킹을 이해해보자.
  • 기본형태 : setTimeout(function, time)
// none-blockig-demo.js

function first() {
	console.log('first');
}
function first() {
	console.log('second');
}
function first() {
	console.log('third');
}

first();
setTimeout(second, 2000);
third();

// 결과값
// first
// third
// second
// 2초 뒤에 second 실행시킴

이처럼 비는 시간이 있으면 그 시간에 다른 일을 하는 것을 알 수 있음!

✏️ 모듈

: 내가 만든게 아닌, 선배 개발자들이 미리 만들어둔 코드 덩어리

  • 모듈을 어디까지 할지 정하는 것은 마음대로임
  • 모듈 = 라이브러리 라고도함 -> 가져다 쓸 수 있음
  • 기본적으로 제공하고 있는 모듈 : 내장모듈 / 표준모듈 이라고함
    ex) setTimeout(), console.log()

✏️ 라이브러리 vs 프레임워크

  • 라이브러리

    • 모듈이랑 거의 같은 의미 -> 원하는 것만 직접 가져다 쓸 수 있음
    • 내가 원하는 걸 빌릴 수 있는 것이 장점
    • 고르기 힘들 수 있고 시간이 오래걸리는 것이 단점
  • 프레임워크

    • 틀 안에서 일을 하는 것
    • 내가 만들고 싶은 서비스를 구현하는데 필요한 모든 일을 틀 안에서 함(서비스를 완성하는데 필요한 라이브러리(모듈)을 미리 틀 안에 다 넣어 두었음)
    • 프레임워크가 지원하는 라이브러리만 사용함

❗️ 그럼 라이브러리와 모듈은 진짜 차이가 없는게 맞을까?? 하는 의문이 들어서 찾아본 정보 -> https://joie-kim.github.io/Module-Library-Framework/

이 글에 의하면 라이브러리 > 모듈 이라고 해서 라이브러리가 조금 더 큰 개념인 듯 하다.

✏️ npm (1)

: 외부 모듈을 설치할 수 있게 도와주는 매니저

  • node를 사용하기 위해 필요한 패키지 관리자

💡 figlet 외부모듈 설치해보기

  • npm 사이트 -> ASCII ART 검색하면 관련 라이브러리가 나오는데 그 중, figlet 클릭

  • figlet 설치부터 사용방법까지 친절 하게 나와있음!

  • 설치 해보면,
    : npm install figlet

  • package-lock.json / package.json / node_modules가 생긴것을 확인할 수 있음 = 설치 잘되었다는 소리

  • figlet 사용

    • figlet사용할 js파일 생성 -> 소스 붙여넣기 -> 오른쪽 상단 실행버튼 클릭 -> Hello World!! 생성된 것 확인 가능

      // figlet-demo.js
      
      const figlet = require("figlet");
      
      figlet("Hello Word!!", function(err, data) {
          if(err) {
              console.log("Something went wrong...");
              console.dir(err);
              return;
          }
          console.log(data);
      });

💡 figlet을 통해 콜백함수 확인하기

// figlet-demo.js

const figlet = require("figlet");
// figlet 모듈 가져와서 figlet 변수에 넣어주기

figlet("Hello Word!!", function(err, data) {
// asci code로 출력하고 싶은 문자열(첫번째 매개변수), 콜백함수(두번째 매개변수)
// 매개변수로 함수를 전달 할 수 있음 -> 함수의 매개변수로 변수 또는 값을 전달하는 것이 아니라, 함수를 전달
// == 콜백함수
// 익명의 함수를 콜백함수로 던짐
// 익명의 함수를 쓰는 이유 = 이 함수를 쓸 일이 다른데는 없어서
// 왜 그럼 콜백함수를 쓰냐? figlet만든 사람이 매개변수로 함수를 받기로 했기 때문

	if(err) {
		console.log("Something went wrong...");
		console.dir(err);
		return;
	}
	console.log(data);
});

// 함수가 filget모듈 안에서 어떻게 호출 된것인가?
// 첫번째 매개 변수 'Hello World'라는 문자열을 받아와서,
// 아스키 아트를 만든 다음에
// 두번째 매개 변수 function 함수를 실행 = 콜백

💡 http 모듈을 통해 콜백함수 확인하기

// server-demo.js

let http = require('http');
//http는 내장모듈인 것을 알 수 있음 (npm i~~ 하지 않았잖아)

function onRequest(request, response) {
	response.writeHead(200, {'Content-Type' : 'text/html'});
	response.write('Hello Node.js');
	response.end();
}

http.createServer(onRequest).listen(8888);
// http 만든 사람이 이렇게 형식을 만들었기 때문에 우리는 이를 따라야한다
// http 모듈에 createServer 함수에서 할 일(서버를 만드는 일)을 다 한 다음에
// onRequest 콜백 함수를 실행시켜달라고 매개변수로 던진 것!

✏️ let, const

: let과 const는 블록스코프임

  • {}을 기준으로 그 안에서 선언되었다면 그밖에서는 사용하지 못함
// scope-demo.js

if (true) {
	var num1 = 7;
	const num2 = 3;
	let num3 = 5;
}

console.log(num1); // 7
console.log(num2); // error
console.log(num3); // error
  • let은 값의 재할당이 가능하지만 const는 상수이기때문에 재할당 못함
    +템플릿 문자열 : 2015년 이후 변수와 문자열을 쉽게 쓰기 위해 나온 표현 방법 / 백틱사용
// scope-demo.js

if (true) {
	var num1 = 7;
	const num2 = 3;
	let num3 = 5;
	
	num2 = 10; // 상수 이기 때문에 값 재할당 불가능
	num3 = 21; // 값 재할당 가능
	
	console.log(num1 + " X " num2 + " = " + num3); // 7 X 3 = 21
	// 변수와 문자열을 같이 보이기 위해 + 를 썼는데, 2015년 이후에 표현법이 새로 나옴
	// console.log(`${num1} X ${num2} = ${num3}`); // 백틱 사용 -> 템플릿 문자열
	// 7 X 3 = 21 로 똑같이 출력됨
}

console.log(num1); // 7
console.log(num2); // error
console.log(num3); // error

✏️ npm (2)

npm으로 외부모듈 삭제 하고 싶으면

  • npm uninstall figlet

📍 package.json : 라이브러리 설치하면 dependencies(=의존성/사용할것)에 입력(key와 value로)되어 설치 된 것을 확인 할 수 있음
📍 package-lock.json : 프로젝트 이름부터 require, package 등 자세한 것들을 더 볼 수 있음

  • npm install -g figlet-cli
    : -g는 -global의 약자로 전역이라는 뜻임 -> 컴퓨터의 모든 프로젝트에 입력한 모듈을 설치하겠다는 뜻임 -> 비추(비효율적)

💡 npm 사용 연습 한 번더

: 문자열이 주어졌을때 홀수인지 체크하는 외부모듈 설치해보기

  • npm i is-odd-num
// is-odd-demo.js

const isOdd = require('is-odd-num');

console.log(isOdd('8')); // true
console.log(isOdd('3')); // true

console.log(isOdd(5)); // true
console.log(isOdd(2)); // false

결론적으로 npm은 외부모듈을 내 프로젝트에 설치할 수 있게 도와주는 친구이다. package-lock.json 파일을 잘 살펴보면 resolved부분에서 url이 있고, tgz라는 zip파일 형식으로 연결 할 수 있게 url이 입력 되어 있는 것을 확인할 수 있다. 이 말은 npm이 이 주소를 따라가서 다운받고 zip파일을 풀어서 우리가 사용할 수 있게 도와주기 때문이다.

  • npm은 자기가 마련해 놓은 저장소에 외부모듈 설치를 원하는 프로젝트에 자동으로 해준다
    -> 프로그램 설치 파일 다운로드 받아서 더블 클릭 하는 것 = npm install 모듈이름
  • npm은 간편하게 삭제도 가능 : npm uninstall 모듈이름
profile
프론트엔드개발자가 되고 싶어서 열심히 땅굴 파는 자

0개의 댓글