210210 Side Project Diary 3/4/5일차

Side Project Diary 3/4/5일차

오늘은 3,4,5일차에 진행되었던 Side Project의 진행 상황에 대해서 정리해보려고 한다. 우선 Side Project의 진척이 빠르게 진행되지 않는 이유는 단위테스트(Unit Test)를 같이 진행하기 위해서이다. Jest와 RTL(React-Testing-Libary)를 사용한 JavaScript 코드 및 React component, axios mockup 테스트 관련해서 별도의 공부가 필요하다고 생각되어, 우선적으로 테스트 관련해서 기본적으로 필요한 공부들을 했다.
공부한 내용과 연습용 Repository는 모두 정리해서 블로그에 올렸다.

(1) 210209 RTL(React Testing Library)를 활용한 Axios Mockup 테스트

⮕ 실습 Repository link (1)

(2) 210208 Jest의 개념과 기본사용

(3) 210208 Jest의 다양한 matcher

Read More

Baekjoon Online Judge 1302번 베스트 샐러 문제

백준 저지 1302번 베스트 샐러 문제 Pseudo code + Python code

손 코딩을 한 코드에서 sorted로 정렬을 한 뒤에 list로 변환을 하였는데, dictionary type의 데이터를 items()로 하게 되면, 리스트 내에 튜플(key, value쌍)로 변환이 되기 때문에 그럴 필요가 없었다. 정렬된 튜플 데이터 리스트에서 첫번째 요소의 첫번째(book title-(key))를 추출하게 되면 가장 높은 판매 수를 기록한 책의 제목을 추출할 수 있다.

1
2
3
4
5
6
7
8
n = int(input())
sold_book = dict()
for _ in range(n):
book_title = input()
sold_book[book_title] = sold_book.get(book_title, 0) + 1
sorted_sold_book = sorted(sold_book.items(), key=lambda x: x[1], reverse=True)
print(sorted_sold_book[0][0])

Read More

210210 Self Development TIL

Thought of the day

게으름은 즐겁지만 괴로운 상태다. 우리는 행복해지기 위해 무엇인가 하고 있어야 한다.
(Indolence is a delightful but distressing state; we must be doing something to be happy.)
마하트마 간디 / Mahatma Gandhi


DAILY RECORD

오늘은 지하철을 타고 오면서 간단한 알고리즘 한 문제를 풀었다. 생각보다 지하철에 사람이 없어서 쾌적하게 올 수 있었던 것 같다.
오늘도 의미있는 하루가 되기 위해 노력하는 내가 되자.

TO DO LIST

210209 Python Assignment

Python

과제1) 성수역 지하철 열차 시스템

210209_train

지하철 노선 클래스

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
# 2호선 내부순환선 (총 43개 역) 시청역 <->시청역 (내부순환)
# 성수지선 (총 5개 역) 성수역 <-> 신설동
# 신정지선 (총 38개 역) 성수역 <->까치산
# class instance를 만들때 각 노선의 최대 정착역의 수를 구한다.
class SubwayLine:
def __init__(self, num_of_stn):
# 지하철역의 수 만큼 [0]리스트를 만들어서
# 역별로 정차하고 있는 지하철의 수를 관리
self.num_of_stop_train_list = [0]*num_of_stn

# 해당 index위치의 count값을 1증가 시켜준다.
def increaseNumOfStopTrain(self, idx):
if self.num_of_stop_train_list[idx] == 0:
self.num_of_stop_train_list[idx] += 1
else:
# 위험 알람 method를 호출해서 False값을 반환하도록 한다.
self.setDangerAlert()

def decreaseNumOfStopTrain(self, idx):
if self.num_of_stop_train_list[idx] == 1:
self.num_of_stop_train_list[idx] -= 1

# 해당 index위치에 정차되어있는 지하철의 수를 반환한다.
def getNumOfStopTrain(self, idx):
return self.num_of_stop_train_list[idx]
# 해당 역 위치에 지하철이 정차되어있는 경우, False값을 반환해서 출발할 수 없도록 한다.

def setDangerAlert(self):
return False

Read More

210209 Self Development TIL

Thought of the day

현명한 자라면 찾아낸 기회보다 더 많은 기회를 만들 것이다.
(A wise man will make more opportunities than he finds)
프랜시스 베이컨/Sir Francis Bacon


DAILY RECORD

오늘도 하루종일 자습을 하였다.
오전에는 Jest framework의 사용법에 대한 공부와 ReactJS side project를 진행하였다. 오후에는 Python 메인 강사님 과제와 ReactJS에서 Jest의 Mock module을 활용해서 Async API 코드를 unit test하는 방법에 대해서 정리를 해 볼 것이다.

TO DO LIST

Read More

210208 Jest의 다양한 matcher


Jest Matcher

이전에 사용했던 toBe() matcher는 숫자나 문자와 같은 기본 타입(Primitive Type)의 데이터를 비교할때 사용했다. 그럼 그 외에 다른 matcher에는 어떤 것들이 있는지 알아보고 실습을 해보도록 하겠다.

Jest의 다양한 matcher

  • toEqual() : primitive type의 변수나 객체를 비교할때 사용된다.
    객체는 참조변수이기 때문에 값은 같더라도 참조하는 주소가 다르다.

  • toStrictEqual() : 객체를 좀 더 엄격하게 검사할때 사용된다.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    // makeUser()를 toEqual()로 검사를 하게 되면 passed
    // toStrictEqual()를 toEqual()로 검사를 하게 되면 failed
    const fn = {
    add: (a, b) => a + b,
    makeUser: (name, age) => ({ name, age, gender: undefined }),
    throwErr: () => {
    throw new Error('xx');
    }
    };

    Read More

210208 Self Development TIL

Thought of the day

좋아하는 직업으르 택하면 평생 하루도 일하지 않아도 될 것이니라.
(Choose a job you love, and you will never have to work a day in your life.)
공자/Confucius


DAILY RECORD

오늘은 하루종일 자습을 하였다.
자습의 시작은 JavaScript test framework인 Jest의 간단한 사용법과 실습한 내용을 정리하는 것으로 시작했다.

TO DO LIST

  • TypeScript 공부 (Understanding TypeScript - 2021 Edition)

    • Section 1.8.Setting Up A Code Editor / IDE ~ (예정)
  • Side Project 시작

    Read More

210208 Jest의 개념과 기본사용


Jest

Jest는 Facebook에 의해서 개발된 JavaScript 테스트 프레임워크이며, 대규모 Web application의 테스트를 좀 더 심플하게 할 수 있도록 도와준다.

Jest framework의 사용

간단한 JavaScript 코드를 Jest framework를 사용해서 테스트 해보도록 하자.

실습 내용

실습 Repository : https://github.com/LeeHyungi0622/javascript-jest-test-practice-repo

  1. 프로젝트의 branch 기본 구성은 master branch로 구성한다.

  2. README.md 파일의 documentation작업을 제외한 모든 작업은 별도의 branch를 새로 끊어서 작업을 시작한다.


Read More

210207 API & Networking with Axios instance

본 포스팅 내용은 과거에 개인적으로 공부할때 정리했던 ReactJS의 내용을 복습의 목적으로 다시 정리하는 포스팅입니다.


  • Axios vs Fetch


  • Fetch()

Fetch API는 Request나 Response와 같은 HTTP Pipeline에 접근 및 조작을 하기 위한 JavaScript interface를 제공한다.
Network를 통해 비동기방식으로 resource를 fetch하기 위해서 사용된다고 이해하면 된다.

사용방법은 아래와 같이 fetch() method에 자원을 얻기 위한 path를 넣어주고 request, response에 접근하면 된다.

1
2
3
4
5
6
7
8
// fetch의 기본적인 사용
fetch('examples/example.json')
.then((response) => {
// Do stuff with the response
})
.catch((error) => {
console.log('Looks like there was a problem: \n', error);
});

Read More