개발은 재밌어야 한다
반응형
article thumbnail
리덕스 라이브러리 이해하기
javascript/React 2023. 4. 5. 01:24

리덕스란?리액트 상태 관리 라이브러리로 리덕스를 사용하면 컴포넌트의 상태 업데이트 관련 로직을 다른 파일로 분리시켜 더욱 효율적으로 관리할 수 있습니다.또한, 컴포넌트끼리 똑같은 상태를 공유해야 할 때도 여러 컴포넌트를 거치지 않고 손쉽게 상태 값을 전달하거나 업데이트 할 수 있습니다. 리덕스 왜 쓸까?예를 들어 아래와 같은 TodoList 프로젝트가 있다고 가정해보면대부분의 작업에서 부모 컴포넌트가 중간자 역할을 하게 됩니다.컴포넌트끼리 직접 소통하는 방법이 있긴 하지만, 그렇게 하면 코드가 꼬여버리기 때문에 권장하지 않는 방법이다.이런식으로 App 컴포넌트를 거쳐서 건너건너 필요한 값을 업데이트하고, 리렌더링 하는 방식으로 프로젝트가 개발되면부모 컴포넌트에서 모든걸 관리하고 아래로 내려주는 것이기 때..

article thumbnail
[Oracle] 오라클 조인하는 방법 정리
RDBMS 2023. 3. 27. 23:59

오라클에서 사용되는 조인들에 대해 알아보자 우선 예제 테이블 데이터를 준비합니다.  CREATE TABLE DEPT (DEPTNO number(10), DNAME VARCHAR2(14), LOC VARCHAR2(13) );INSERT INTO DEPT VALUES (10, 'ACCOUNTING', 'NEW YORK');INSERT INTO DEPT VALUES (20, 'RESEARCH', 'DALLAS');INSERT INTO DEPT VALUES (30, 'SALES', 'CHICAGO');INSERT INTO DEPT VALUES (40, 'OPERATIONS', 'BOSTON');CREATE TABLE EMP ( EMPNO ..

article thumbnail
[Oracle] 오라클 소수점 반올림(ROUND), 절사(TRUNC)
RDBMS 2023. 2. 15. 22:12

오라클 소수점을 반올림하거나 절사(버림)하는 함수를 적어볼까한다.  | ROUND오라클에서 소수점 자리수를 반올림하기 위해서는 ROUND를 사용한다.ROUND(처리하는 값, 자리수)로 사용할 수 있다.자리수가 양수이면 해당 자리수만큼 반올림하고음수이면 해당 자리수만큼 반올림한다. 예시)1) 소수점 반올림SELECT ROUND(182.658947) AS VALUE FROM DUAL해당 경우에는 자리수를 지정하지 않았기 때문에 소수점뒤로 반올림을 하여서 183이 된다.  2) 소수점 첫째짜리까지 반올림SELECT ROUND(182.658947, 1) AS VALUE FROM DUAL해당 경우에는 소수점 첫째자리까지 반올림해서 보여주기 때문에 소수점 둘째자리에서 반올림해서 보여준다. 3) 소수점 둘째자리까지 ..

article thumbnail
[Oracle] 오라클 데이터 복구
RDBMS 2023. 1. 30. 23:33

데이터를 실수로 삭제를 해버렸다...오라클에서는 데이터를 삭제 또는 수정후 COMMIT했을때 Oralce의 Flashback을 통해 TIMESTAMP를 사용해서 이전의 데이터를 조회해서 복구할 수 있는 기능이 있다(해당 기능은 오라클 9i 버전 이상부터 지원) 주의할점은 Flashback은 Undo Data를 사용하기 때문에 undo_retention 파라미터값에 의해 보존되는 시간이 정해져있습니다. (기본값 900초) undo_retetion 조회 쿼리select * from v$parameter where name = 'undo_retention'; 사용방법SELECT *FROM [TABLE 명] AS OF TIMESTAMP(SYSTIMESTAMP-INTERVAL '10' MINUTE) -- 단위는 ..

article thumbnail
immer를 사용하여 더 쉽게 불변성 유지하기
javascript/React 2023. 1. 24. 02:41

React의 컴포넌트에서 상태의 불변성을 유지하는 것은 매우 중요합니다. 불변성은 기존 값을 직접 수정하지 않으면서 새로운 값을 만들어내는 것을 의미합니다. 따라서 배열이나 객체의 값을 변경할 때는 새로운 배열이나 객체를 만들어 필요한 부분을 변경해주어야 합니다. 불변성이 유지되지 않으면 값이 변경되어도 감지하지 못하게 되고 렌더링 성능을 최적화하지 못하는 문제가 발생합니다.위의 불변성에 대한 정의로, 우리는 불변성을 지키기 위해 필요한 값을 변형해 사용하고 싶다면 어떤 값을 복사본을 만들어 사용해야 합니다.   const user = { name: 'Yeum', age: 25 };const copyUser = user;// user와 copyUser 변수에는 같은 참조값 즉, 같은 힙 영역의 메모리를 ..

article thumbnail
3년차 개발자로서의 2022년 회고록
null채우기 2023. 1. 6. 00:21

어느덧 2022년이 지나고 2023년이 왔다.올해를 한번 되돌아 보면..블로그는 마지막으로 글을 작성한게 올해 9월이 마지막인데, 솔직히 이직하고 바빠서 글을 작성할 시간적 여유도 없었고 작성할 여력도 안됬다.블로그를 처음 시작할때만 해도 방문자수 1000명이 되는것만으로도 뿌듯하고 성취감을 느꼈는데, 요즘은 일평균 300명이상의 방문자 수를 기록하는데 블로그 글도 종종 다시 써야겠다...개발적인 나의 성장일기와 같은 깃허브를 보면서 다시한번 올해의 내가 개인적으로 개발적인 것들을 어떤것들을 해왔나 살펴보자이번년도도 연말에 회사 프로젝트가 너무 바빳다..1월토이프로젝트랑 스프링 스터디 진행했던게 보이네요유난히 눈에 띄는건 마지막에 github coummunity에 글을 올린건데요반응이 HOT 했습니다 ㅋ..

article thumbnail
[Oracle] MERGE INTO -> 데이터가 있는지 확인(SELECT) 하고 데이터를 삽입하거나 업데이트(INSERT, UPDATE)하자
RDBMS 2022. 9. 17. 01:37

보통 데이터를 처리할때 데이터의 존재 여부를 확인(SELECT)하고 해당 값이 없으면 삽입(INSERT)하고 있으면 업데이트(UPDATE)를 하게 된다. 이렇게 되면 데이터를 확인하는 쿼리, 데이터를 삽입 하는 쿼리, 데이터를 업데이트 하는 쿼리3개의 쿼리를 작성해줘야합니다.  오라클에서는 이러한 처리를 한번에 가능 할 수 있습니다 !바로 MERGE INTO 를 사용하는 것입니다오라클 9i 버전부터 MEGER 문을 사용할 수 있으며, DELETE를 사용하는 MERGE 문은 10g 버전부터 사용할 수 있다.   사용 문법MERGE INTO [TABLE / VIEW] -- update 또는 insert할 테이블 혹은 뷰    USING [TABLE / VIEW / DUAL] -- 비교할 대상 테이블 혹은 뷰..

article thumbnail
[React] 리액트 기초 예시 -2
javascript/React 2022. 7. 30. 01:36

6. PropTypes props구성 요소에는 React에서 호출되는 많은 특정 속성이 있으며 모든 유형이 될 수 있습니다. 때때로 이러한 props를 검증하는 방법이 필요합니다. 사용자가 구성 요소에 아무 것도 입력할 수 있는 자유를 원하지 않습니다. React에는 이에 대한 솔루션이 있으며 이를 PropTypes라고 합니다. class MyTitle extends React.Component { static propTypes = { title: PropTypes.string.isRequired, } render() { return {this.props.title} ; } } 위의 구성 요소 MyTitle에는 title있습니다. PropTypes는 제목이 필수이고 값이 문자열(PropTypes.stri..

article thumbnail
[React] 리액트 기초 예시 - 1
javascript/React 2022. 7. 29. 09:12

1. Render JSX React의 템플릿 구문을 JSX라고 합니다. JSX에서는 HTML 태그를 JavaScript 코드에 직접 넣을 수 있습니다. ReactDOM.render()는 JSX를 HTML로 변환하고 지정된 DOM 노드로 렌더링하는 메소드입니다. 실행결과 2. JSX에서 자바스크립트 사용하기(Use JavaScript in JSX) JSX에서 JavaScript를 사용할 수도 있습니다. HTML 구문의 시작으로 꺾쇠 괄호( < )를 사용하고 JavaScript 구문의 시작으로 중괄호( { )를 사용합니다. Tips. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/map map() 메서드는..

article thumbnail
[디자인패턴] 템플릿 메서드 패턴 (Template Method Pattern)

템플릿 메서드 패턴볼트라고 하는 이름의 강아징와 키티라는 이름의 고양이를 키운다고 상상해보자.볼트, 키티와 함께 재미있는 시간을 보내는 세계를 프로그래밍으로 표현한다면 다음과 같은 2개의 클래스가 필요 할 것입니다.Dog클래스와 Cat 클래스 안에 있는 playWithOwner() 메서드를 보면 서로 짖는 부분(멍멍, 야옹야옹)만 빼고는 모두 동일한 것을 볼 수 있다.코드를 보고 있으면 객체 지향의 4대 특성 가운데 상속을 통해 동일한 부분(중복)은 상위 클래스로, 달라지는 부분만 하위 클래스로 분할하고 싶은 객체 지향 설계에 대한 욕구가 자극될 것입니다.따라서 이 코드를 개선해보겠습니다.상위 클래스인 Animal에는 템플릿(견본)을 제공하는 playWithOwner() 메서드와 하위 클래스에게 구현을 ..

article thumbnail
Apache Kafaka의 주요 요소 - Consumer
Kafka 2022. 7. 15. 14:47

Consumer Offset 해당 Consumer가 읽은 파티션의 위치의 그 다음번째를 저장한다. 위의 예시로 Consumer Group A가 MyTopic 파티션에서 2번째에 있는 위치를 가져가서 사용을 했다면 그 다음 읽어갈 위치인 3번째의 위치를 저장합니다. 카프카의 내부 인터널 토픽에 저장을 한다(Topic __consumer_offsets) 컨슈머가 하나이고 해당 컨슈머가 모든 파티션의 데이터를 읽어간다하면 해당 컨슈머는 모든 파티션의 모든 레코드를 Consume한다. 동일한 컨슈머 그룹을 가지고 싶다면 group.id가 같기만 하면 된다. 위와 같은 경우 파티션4개, 컨슈머4개 이므로 각자 하나의 컨슈머에서 하나의 파티션을 consume할 수 있다. 멀티 컨슈머 그룹 다른 Consumer Gr..

article thumbnail
Apache Kafaka의 주요 요소 - Producer
Kafka 2022. 7. 15. 14:42

Producer Producer : 메세지를 생산(Produce)해서 Kafka의 Topic으로 메세지를 보내는 애플리케이션 Consumer: Topic의 메세지를 가져와서 소비(Consume)하는 애플리케이션 Consumer Group: Topic의 메세지를 사용하기 위해 협력하는 Consumer들의 집합 하나의 Consumer는 하나의 Consumer Group에 포함되며, Consumer Group 내의 Consumer들을 협력하여 Topic의 메세지를 병렬 처리함 Producer와 Consumer의 분리 (Decoupling) Producer와 Consumer의 기본 동작 방식 Producer와 Consumer는 서로 알지 못하며, Producer와 Consumer는 각각 고유의 속도로 Commi..

반응형