내일배움캠프 Node.js 본캠프 25일차

김선우·2024년 9월 9일
post-thumbnail

알고리즘 문제 풀어보기

문자열 내 마음대로 정렬하기

문제 설명

문자열로 구성된 리스트 strings와, 정수 n이 주어졌을 때, 각 문자열의 인덱스 n번째 글자를 기준으로 오름차순 정렬하려 합니다. 예를 들어 strings가 ["sun", "bed", "car"]이고 n이 1이면 각 단어의 인덱스 1의 문자 "u", "e", "a"로 strings를 정렬합니다.

제한 사항

strings는 길이 1 이상, 50이하인 배열입니다.
strings의 원소는 소문자 알파벳으로 이루어져 있습니다.
strings의 원소는 길이 1 이상, 100이하인 문자열입니다.
모든 strings의 원소의 길이는 n보다 큽니다.
인덱스 1의 문자가 같은 문자열이 여럿 일 경우, 사전순으로 앞선 문자열이 앞쪽에 위치합니다.

작성 코드

function solution(strings, n) {
    var answer = [];
    
    for( i=0; i < strings.length; i++ )
        {
            strings[i] = strings[i][n] + strings[i];
        }
    
    strings.sort();
    
    for( i=0; i < strings.length; i++ )
        {
            strings[i] = strings[i].replace(strings[i][0], "");
            answer.push(strings[i]);
        }
    
    return answer;
}

풀이 과정

첫번째 반복문 과정을 통해 정렬에 해당하는값과 원래값이 있는 배열을 만들 수 있다.

  • ex) strings[] =[[["u"],["sun"]],[["e"],["bed"]],[["a"],["car"]]]
    이후 sort를 통해 오름차순 정렬을 해주고 replace를 통해 뽑아낸 n값의 인덱스문자를 ""으로 치환해주고 answer에 넣어준후 return하면 문제 해결.

K번째 수

문제 설명

배열 array의 i번째 숫자부터 j번째 숫자까지 자르고 정렬했을 때, k번째에 있는 수를 구하려 합니다.

예를 들어 array가 [1, 5, 2, 6, 3, 7, 4], i = 2, j = 5, k = 3이라면

array의 2번째부터 5번째까지 자르면 [5, 2, 6, 3]입니다.
1에서 나온 배열을 정렬하면 [2, 3, 5, 6]입니다.
2에서 나온 배열의 3번째 숫자는 5입니다.
배열 array, [i, j, k]를 원소로 가진 2차원 배열 commands가 매개변수로 주어질 때, commands의 모든 원소에 대해 앞서 설명한 연산을 적용했을 때 나온 결과를 배열에 담아 return 하도록 solution 함수를 작성해주세요.

제한 사항

array의 길이는 1 이상 100 이하입니다.
array의 각 원소는 1 이상 100 이하입니다.
commands의 길이는 1 이상 50 이하입니다.
commands의 각 원소는 길이가 3입니다.

작성 코드

function solution(array, commands) {
  var answer = [];
  for (i = 0; i < commands.length; i++) {
    var selectArray = array.slice(commands[i][0] - 1, commands[i][1]);

    selectArray.sort((a, b) => a - b);

    answer.push(selectArray[commands[i][2] - 1]);
  }
  return answer;
}

풀이 과정

slice는 처음값~마지막값-1한 값을 가져온다. 배열은 0번째부터 시작하고 위의 i는 0번째를 고려하지 않은 것이므로 i번째 값은 -1을 해야 해당하는 array값에서 시작할 것이고 j번째값은 그대로 가져와도 j번째까지 잘릴것이다.
이후 sort를 통해 오름차순정렬을 해주고 해당 배열의 k번째 값을 answer에 넣어주고 return해주면 문제 해결!

데이터 유효성 검증 라이브러리 Joi

Joi

JS 유효성 검증을 위한 라이브러리
=> 여러 타입과 규칙을 이용해 유효성을 검증, 검증에 실패 시 오류를 발생.

유효성 검증(Validation)

어떤 것을 검증하는 것.

function is1(value) {
	return value === 1;
}

=> 위의 코드의 경우 값이 1인지 아닌지 판단 후 Boolean 타입의 값을 반환하는 함수.(이런 간단한 코드도 검증을 위한 코드가 됨.)

  • Joi를 이용해 구현을 하게 되면 더 깔끔하고 쉽게 검증을 위한 코드를 구현할 수 있음.
  • Nest.js 프레임워크에서는 Pipe라는 이름으로도 불림.

에러 처리 미들웨어

Express.js의 에러 처리 미들웨어

에러를 인자로 전달받아 클라이언트에게 에러 응답을 반환 또는 다음 미들웨어로 에러를 전달하는 역할

app.use((err, req, res, next) => {
  console.error(err.stack);
  res.status(500).send('Something broke!');
});
  • err : 이전 미들웨어에서 발생한 에러를 전달받은 객체
  • req, res : 일반적으로 사용하는 HTTP 요청과 응답을 관리하는 객체
  • next : 다음 미들웨어를 실행하는 함수

에러 처리 미들웨어를 Router 하단에 등록하는 이유

미들웨어는 등록된 순서대로 실행
=> 라우터 이전에 에러 처리 미들웨어를 등록하면 라우터에서 발생한 에러를 처리할 수가 없음.(라우터에서 발생한 에러가 라우터 이후에 등록된 미들웨어로 전달되므로.)

코드 서식

  • 코드의 형식(Format)
    개발자마다 같은 기능, 내용의 코드를 작성해도 다른 형태로 코드를 작성하게됨.
    => 어떤 코드 스타일을 사용해서 코드를 작성하냐에 정답은 없음. 하지만 일관된 코드 서식은 팀원간의 협업을 원활하게 하고 코드 리뷰를 통해 피드백 과정을 효과적으로 만들어줌.
    Git에서 협업하거나 코드 리뷰를 진행 중 발생하는 코드 충돌(Code Conflict)을 줄여주고 커밋 내역을 관리할 때 들여쓰기같은 수정 내역을 줄여주기도함.
  • ==>Prettier나 ESLint같은 도구를 도입해서 코드의 일관성을 강제로 유지하게 된다면 팀 전체가 동일한 코드 스타일을 유지하도록 도와줌.

Prettier

기본 제공 규칙

const config = {
  trailingComma: "es5", // ES5에서 제원하는 위치에 쉼표를 추가합니다.
  tabWidth: 4, // Tab의 너비를 4 스페이스로 설정합니다.
  semi: false, // 세미콜론을 사용하지 않습니다.
  singleQuote: true, // 따옴표를 작은 따옴표(')를 사용합니다.
};

export default config;
  • 해당 규칙들은 나에게 맞게 바꿀 수 있음.

규칙

trailingComma: "es5"

  • 코드 맨 뒤에 콤마(,)를 붙일수 있는 경우 콤마를 붙일지 말지 결정하는 규칙입니다!
    // 원래 코드
    const items = [
        'item1',
        'item2'
    ];
    
    // Prettier 규칙을 적용한 후
    const items = [
        'item1',
        'item2',
    ];
  • es5라는 값은 JavaScript 버전중 하나인 ES5에서 허용되는 부분까지만 콤마를 뒤에 붙이는 규칙입니다.
  • none이라는 값은 가능한 모든 코드에서 코드 뒤에 붙은 콤마를 제거합니다. (에러가 나도록 다 제거하는것은 아닙니다!)
  • all 이라는 값은 ES8 이전의 버전까지 허용되는 모든 부분에 콤마를 붙이도록 합니다.

아직 all 규칙에 해당하는 문법을 지원하지 않는 브라우저가 있기 때문에 현재 여러분에게 권장드리는 규칙은 "es5" 혹은 "none" 입니다.

tabWidth:

  • 들여쓰기 한번에 얼만큼의 스페이스(여백)로 구성할지에 대한 설정입니다.
    // tabWidth: 2
    function foo() {
      console.log('Hello, world!');
    }
    
    // tabWidth: 4
    function foo() {
        console.log('Hello, world!');
    }
  • 위처럼 2개의 여백으로 들여쓰기를 했었던 파일이 4개의 여백으로 바뀌었습니다.
  • 최근 스크립트 언어들의 들여쓰기는 2개~4개로 하는것이 일반적인 관례입니다.
  • 만약 코드의 들여쓰기가 잘 구분이 안된다 하시면 4개, 코드가 길어지는게 싫다 하시면 2개를 권장합니다.

semi: false

  • 코드 뒤에 세미콜론을 붙일지 말지 결정하는 규칙입니다.
    true인 경우 세미콜론을 항상 붙이도록 해줍니다.
    ```jsx
    // semi: true
    const x = 10;
    const y = 20;
    
    // semi: false
    const x = 10
    const y = 20
    ```
  • 만약 이 설정을 false로 하는 경우 위 사진처럼 세미콜론이 모두 제거됩니다.
    자바스크립트는 세미콜론이 없어도 정상적으로 동작할 수 있는 언어이기 때문에 존재할 수 있는 옵션입니다!
  • 이 규칙은 항상 true로 하시길 권장드립니다.
    코드가 어디서 끝맺음을 하는지 코드의 맥락을 파악하는데 도움을 주는 중요한 요소이기 때문이죠 🙂

singleQuote: true

  • 문자열을 표기하는 문법에서 외따옴표(’)를 사용할지, 쌍따옴표(”)를 사용할지의 여부를 설정하는 규칙입니다.
    // singleQuote: false
    const greeting = "Hello, world!";
    
    // singleQuote: true
    const greeting = 'Hello, world!';
  • 이 규칙은 true로 설정해두어 외따옴표(’)를 사용하는것을 권장드립니다.
  • 키를 매번 입력하다보면 쉬프트 키를 매번 누르는것이 상당히 번거롭고, 외따옴표를 썼을때 단점이 특별히 없기 때문입니다 😄

arrowParens: "always"

  • Arrow function에서 파라미터 부분에 괄호를 항상 붙여주는 규칙입니다.
    // arrowParens: "avoid"
    const square = x => x * x;
    
    // arrowParens: "always"
    const square = (x) => x * x;
  • 이 규칙은 항상 "always"로 해두시는걸 권장합니다.
  • Arrow function이 아무리 편리하고 코드를 짧게 쓰도록 도와준다고 해도, 괄호가 있는것이 일관적인 코드를 작성하는것에 도움이 됩니다. → 일관적인 코드는 무엇이라고 했죠? 가독성 향상⤴️ 입니다!!

Git

  • 체계적인 개발과 프로그램의 배포를 도와주는 형상 관리 도구, 버전 관리 시스템

사용 이유

  • 프로젝트의 개발 단계에서 소스 코드의 버전을 효과적으로 관리 가능.
  • 다양한 사람과 협업해 같은 파일을 여러명에서 동시에 작업 가능

개념

저장소(Repository)

모든 파일의 변경 사항을 저장할 수 있는 저장소.

  • Local Repository - 컴퓨터에 존재하는 저장소
  • Remote Repository - Git 서버에서 제공되는 저장소(GitHub등)

커밋(Commit)

이전 변경사항 기준으로 새로 변경된 내용을 기록하는 단위.

브랜치(Branch)

여러 사람이 하나의 저장소에서 작업할 때 작업 내용이 충돌 되지 않도록 해주는 개념.
=> 프로젝트의 특정 시점의 복제본을 만들어 관리하는 것으로 볼 수 있음.

  • 여러 사람이 동시에 작업해도 서로의 작업이 섞이지 않고 개별적으로 관리 가능.

Git의 Flow

  • 1) 작업 디렉토리
    개인컴퓨터에서 프로젝트의 파일 수정 및 새로운 파일을 생성하는 작업을 담당.
    => 코드 작성 및 수정하는 작업 수행
  • 2) 스테이징 영역
    프로젝트의 변경 사항이 생기면 'git add' 명렁어를 이용해 변경사항을 스테이징 영역에 저장.
    => 변경사항만 선택적으로 커밋에 포함 가능.
  • 3) 로컬 저장소
    스테이징 영역에 저장된 변경사항을 'git commit' 명령어를 이용해 기록을 남김.
    => 각 커밋은 고유한 ID를 가지며 프로젝트의 버전을 표시
  • 4) 원격 저장소
    로컬 저장소에 저장된 커밋들을 'git push' 명령어를 통해 Github같은 원격 저장소에 업로드.
    => 원격 저장소를 이용해 다른사람 또는 다른장치에서 프로젝트를 공유하고 이어서 작업 가능.

IP 주소(IP Address)

컴퓨터가 통신할 수 있도록 컴퓨터마다 가지는 고유한 주소.

  • 각 기기가 어디에 있는지 알려주는 좌표(Coordinate)와 비슷함.

공인 IP 주소(Public IP Address)

인터넷 전체에서 유일. 해당 주소를 통해 외부에서도 접근이 가능.

사설 IP 주소(Private IP Address)

네트워크 내부에서만 사용. 외부의 접근이 불가.

포트(Port)

데이터가 드나들 수 있는 통로

  • 하나의 포트는 여러 프로그램이 같이 사용할 수 없다.
    => IP주소가 집 주소라면 포트는 그 집안의 특정한 방.

DNS(Domain Name System)

  • 도메인을 실제 서버를 찾을수 있도록 변환해주는 시스템.

도메인

URL은 우리가 알아보기 쉽게 하는 등의 이유로 IP주소에 별명을 붙이는 것

0개의 댓글