Dog foot print

서론 지난 포스팅에 이어 오늘은 [i]에 대해서 포스팅 하도록 하겠습니다. ISP (Interface Segregation Principal) : 인터페이스 분리 원칙 인터페이스 분리 원칙은 어떤 인터페이스로부터 상속받아 클래스를 정의 할 때, 사용하지 않는 메서드까지 상속 받지 말고 새로운 인터페이스를 생성하여 기존 상속하려던 인터페이스를 새롭게 확장하여 상속 받아야 한다는 분리원칙이다. 다음의 클래스다이어그램을 보도록 하자 . 위의 클래스 다이어그램에서 파리,벌,사슴벌레 클래스는 곤충 인터페이스를 상속받는다. 이 경우 파리 클래스에서는 독을 뿜다. 라는 메서드가 필요없으며, 벌 클래스와 사슴벌레 클래스에서는 각각 뿔을 움직인다, 독을 뿜다라는 메서드가 필요없음에도 곤충인터페이스를 상속 받았기 때문에 ..

책 소개 애자일 마스터는 2012년 조너선 라스무슨에 의해 작성된 책이다. 책의 진행 방식은 챕터별로 분류되어 있는 목록을 풀이하고, 중간 중간 애자일 마스터와 제자가 해당 챕터에서 다루고 있는 문제를 변형하여, 질문과 대답을 주고 받는 것으로 한 챕터가 종료된다. 독자는 충분히 의구심을 품을 수 있는 내용을 애자일 마스터와 제자가 대신 질문하고 답변 해주기 때문에, 쉽게 이해 할 수 있다. 책을 읽은 계기 올해 5월 부터 근무하게 된 Hitit 회사에서 첫 날 OT때 이사님으로부터, "Agile 방식으로 팀을 운영합니다. 매일 Stand up을 실천하고, 스프린트가 종료되는 날에는 retro spective를 진행 합니다. 또한 CICD를 통해서 테스트 자동화와 지속적인 배포를 하고 있습니다." 라고 ..

서론 지난 포스팅에 이어 SOLID 원칙 중 [L]에 대해서 포스팅을 이어나가보도록 하겠다. LSP(Liskov substitution Principle) : 리스코프 치환 법칙 리스코프는 하위타입에 대해서 다음과 같이 정의하였다. "S타입의 객체 o1 각각에 대응하는 T타입 객체 o2가 있고, T타입을 이용해서 정의한 모든 프로그램 P에서 o2의 자리에 o1을 치환하더라도 P의 행위가 변하지 않는다면,S는 T의 하위 타입이다. " 리스코프의 말이 어렵게 느껴지는 것이 당연하다. 이를 조금 더 쉽게 풀어 설명하면, 다음과 같다. "부모 A로부터 상속받은 자식 B가 존재할 때 부모 A는 자식 B로 타입을 치환하여도 프로그램에서 행위는 변하지 않는다. " 어찌 보면 당연한 소리이다. 부모 A로부터 만들어진 ..

서론 로버트 C 마틴의 Clean Architecture 의 책을 읽는 중, SOLID원칙이 등장하여, 이를 정리하고자 글을 써본다. 재미있는 부분이라 함은 SOLID 원칙의 SOLID는 기존에 존재하던 5가지의 원칙의 이름을 2000년대 초반 마이클 페더스(레거시 코드 활용전략 저자)가 로버트 C마틴에게 앞 글자만 따서 재배열하여 SOLID라는 이름이 탄생한 것이다. SOLID SOLID 원칙은 함수와 데이터 구조를 클래스로 배치하는 방법, 그리고 이들 클래스를 서로 결합하는 방법을 설명해준다. (절대 객체지향프로그래밍 패러다임에 국한되지 않는다.) SOLID원칙의 목적은 다음과 같다. (클래스의 역할이 아닌 삽입과 삭제)변경에 유연하다. (프로그래머가) 이해하기 쉽다. 많은 소프트웨어 시스템에 사용될..

서론 App의 컴포넌트 트리가 혹시 길어지는 것을 경험 해본 적이 있는가 ? 짧은 토이 프로젝트의 경우 컴포넌트 노드의 레벨이 3정도 될 것이다. 이런 경우 root component에서 최 하위 컴포넌트 노드에게 정보를 전달 해주기 위해, props를 각 레벨의 컴포넌트 노드에게 전달 해준 경험이 존재 할 것이다. 그렇게 어려운 일도 아니고, props를 각 컴포넌트에게 전달 하면 장땡이다 ! 이처럼 짧은 거리의 컴포넌트에게는 props로 데이터를 전달해주는 것은 충분하다. 그러나 트리의 높이가 4이상을 넘어가게 되면, props로 상위 컴포넌트의데이터를 전달해주는 것은 매우 힘들다 . 불가능하다는 이야기가 아니다. 코드가 지저분해지고, 이를 하위 프롭스로 전달하는 과정에서, 개발자의 실수로 유지하지 ..

서론 “Side Effect”를 사용하기 위해서는 useEffect 함수로 의존성 배열을 통해 발생 시킨다고 지난번 포스팅에서 언급하였다. 그러나 이전에 작성한 함수형 컴포넌트를 내부를 보면 useEffect를 내부에서 사용함에 따라, sideEffect를 발생 시키는 useEffect 함수를 재 사용 하기 어렵고, 간결함이 장점인 함수형 컴포넌트가 useEffect함수로 오염되어 버렸다. function App() { const [counter,setCounter] = useState(0); const [name,setName] = useState('hokeys'); const [show,setShow] = useState(false); useEffect(()=>{ console.log("compone..

Side Effect ‘Side Effect’ 란 무엇인가 ? 바로 함수 호출 시, 함수 내부가 아닌 외부에 영향을 미치는 것을 말한다. 다음의 코드를 보도록 하자 let a = 0; function sideEffect(){ a++; } sideEffect() sideEffect는 매개변수로 들어온 a를 변경하거나, a를 1을 증가시켜 return하지 않는다. 단순히 어떤 함수를 이용하다가 외부 스코프에 있는 변수 a를 변경하였다. 이처럼 외부 상태를 변경시키는 것을 ‘side Effect’라고 한다. ‘부수 효과’라는 어감 때문에, 무조건 안 좋은 느낌이 들 수 있지만 절대 나쁜 용도로 사용하는 것이 아니다. Use effect 클래스 형 컴포넌트에서는 부수효과를 발생 시키기 위해, ‘component..

React로 만드는 calendar app만들기 Calendar 날짜 표현하기 금일 만들어 볼 것은 calendar에 날짜를 표시하는 부분입니다. 날짜를 표시하고 최초 마운트 시 오늘에 해당하는 날짜가 검게 표현되어야 합니다. 또한 토요일과 일요일은 평일과 다르게 색상을 표현해야 합니다. 마지막으로 이번 달이 아닌 날이 달력에 표시되게 되면 흰색으로 표현되게 끔 해야합니다. Issue 발생 ! 평소 달력은 이렇게 5주가 보통 정상적이지만 달에 따라서는 6주인 경우가 존재하고 2월의 경우 4주가 존재하는 경우가 있습니다. 달력이 만약 5주에서 6주 그리고 4주로 계속해서 레이아웃이 변경 되는 경우 사용자가 불편함을 느낄 가능성이 매우 높습니다. 그렇기에 우리는 5주를 기본 주로 두고, 6주인 경우 23일과..