홈키퍼 개발도전기

반응형
  • All (53)
    • Web_Programming (10)
      • React (17)
      • Next (5)
      • JavaScript (11)
      • Node.js (2)
    • Cloud (3)
    • Algorithm (0)
    • DeepLearning_study (2)
    • Dev_etc (1)
      • Git (2)
  • 홈
  • 태그
  • 방명록
  • Github
RSS 피드
로그인
로그아웃 글쓰기 관리

홈키퍼 개발도전기

컨텐츠 검색

태그

리액트 자바스크립트 nodejs react-query react.js OAuth2 코틀린쿡북 JS Next13 코틀린 Next Kotlin AWS 디자인 패턴 JavaScript React 코틀린스터디 카카오 로그인 exercism SSR

최근글

댓글

공지사항

아카이브

web_programming

자세히보기
React/Next/TS 기본 개념 및 사용이유

React란?사용자 인터페이스 구축을 위한 JavaScript 라이브러리등장 배경기존의 UI 구현 방식의 한계 명령형 방식 + jQuery$('#button').click(function() { $('#modal').show();});직접 절차적으로 명시상태 변화에 따른 DOM 조작 직접 관리=> 로직이 복잡하고 버그가 발생하기 쉬움=> 상태와 UI 간의 일관성 유지가 어려움React의 주요 특징 및 해결책선언형 프로그래밍“무엇을 보여줄 것인가”를 선언하면, React가 UI를 알아서 그려줌상태가 변하면 UI를 자동으로 다시 렌더링복잡한 DOM 조작을 직접 하지 않아도 됨// Vanila JSconst list = document.getElementById("list");const item = docu..

자세히보기
NATS의 Pub/Sub, Req/Reply, JetStream 예제

NATS docker 실행 및 설정 방법docker 실행 방법docker run --rm -it \\ -p 4222:4222 \\ # 클라이언트 연결 포트 (기본 포트) -p 6222:6222 \\ # 서버 간 클러스터링 포트 (필요시) -p 8222:8222 \\ # NATS 서버의 상태 및 모니터링 정보를 HTTP로 제공하는 포트 (Grafana 용) nats:2.10-alpine \\ # 사용할 Docker 이미지: NATS v2.10, 경량 Alpine 기반 -js -m 8222 # JetStream 활성화nats 서버 설정configuration Docs# nats.confport: 4222http_port: 8222jetst..

자세히보기
GitHub Package Registry로 비공개 NPM 패키지 배포하기

by HITS-AI 왜 GitHub Package Registry를 선택했는가? 기존에는 내부 라이브러리를 공유하기 위해 SSH 주소를 통해 로컬 설치하는 방식을 사용했지만, 다음과 같은 이유로 GitHub Package Registry 기반 배포로 전환하였습니다-버전 관리의 명확성: Git 태그 기반 버저닝으로 변경 이력 추적이 명확설정의 간편함: GitHub Action을 통한 배포 자동화 가설치 속도 및 안정성: CDN 캐싱과 병렬 처리 덕분에, git+ssh 방식에 비해 설치 속도가 빠르고 안정적 (17s -> 13s)package.json 설정git package에 배포하기 위해서는 라이브러리의 package.json에 name, version, publishConfig 값을 지정해줘야 합니다..

자세히보기
[디자인 패턴] 반복자 패턴_Iterator pattern (JavaScript)

Iterator 패턴이란?Iterator Pattern은 데이터 컬렉션의 내부 구조를 숨기면서 클라이언트가 일관된 방식으로 데이터에 순차적으로 접근할 수 있도록 도와주는 디자인 패턴입니다. 이 패턴은 단일 책임 원칙을 따르며, 데이터 집합체의 내부 구현과 데이터 순회 방법을 분리하여 결합도를 낮추고 코드의 확장성을 높입니다.구성요소IterableCollection (Aggregate)컬렉션을 순회할 이터레이터를 생성하는 인터페이스를 정의합니다.createIterator(): ConcreteIterator 객체를 반환하는 팩토리 메서드.ConcreteCollection (ConcreteAggregate)데이터 집합체를 구현하며, 이터레이터를 반환하는 메서드를 제공합니다.Iterator (Interface)..

자세히보기
[디자인 패턴] 방문자 패턴_ Visitor pattern (JavaScript)

Visitor 패턴이란?Visitor 패턴은 객체 구조를 변경하지 않고도 새로운 연산을 추가할 수 있도록 하는 행동 디자인 패턴입니다. 데이터 구조와 알고리즘의 분리를 통해, 데이터 객체는 그대로 두고 외부에서 로직을 확장할 수 있습니다.구성요소Visitor 인터페이스데이터 구조의 각 요소에 대해 수행될 연산을 선언합니다.메서드 이름과 매개변수는 구체적인 요소 타입에 따라 달라집니다. interface Visitor { visitConcreteElementA(element: ConcreteElementA): void; visitConcreteElementB(element: ConcreteElementB): void;}ConcreteVisitorVisitor 인터페이스를 구현하며, 각 요소 타입..

자세히보기
homkeeper's coding
© 2018 TISTORY. All rights reserved.

티스토리툴바