Language
-
LocalStorage 패키지별 관리Language/Java Script 2025. 3. 13. 09:15
로컬스토리지 막쓰게되면 나중에 관리하기 힘들어진다. 요새 바빠서 관리 못하다가 만들어 둔거 정리해둔다. 소스Utils.tsxexport default class Utils { ... /** * LocalStorageManager 클래스 * baseKey를 기반으로 localStorage를 관리하는 클래스 */ static LocalStorageManager = class { #baseKey: string; #data: Record; /** * LocalStorageManager 생성자 * @param baseKey 기본 키 (네임스페이스) */ constructor(baseKey: string) { this.#baseKey = baseK..
-
Cursor에서 Figma to React rule 적용Language/React 2025. 3. 10. 18:14
Figma 디자인을 React 컴포넌트로 수작업으로 변환하는 과정은 시간이 많이 소요되고 반복적인 작업이다.이 과정은 효율적이지 못하며, 자동화를 통해 개선할 필요가 있다고 생각되었다.초기 목표는 Figma API를 활용하여 디자인 토큰을 추출하고, 이를 바탕으로 React 코드를 자동 생성하는 것이었다. 그러나 여러 기술적 한계로 인해 완벽한 자동화에 실패하였다.특히, Figma의 디자인을 AI를 사용하지 않고 완벽하게 React 코드로 재현하는 것은 몇일간 테스트한 결과 한계가 있는듯 보인다. (더이상 시간투자 X)그래도 노가다 작업을 줄이기 위해서 작업 방향을 급선회 하여, Cursor에서 제공하는 규칙을 사용하여 Figma 디자인에서 React 컴포넌트로의 변환 시간을 단축시키는 방식으로 정리해 ..
-
TypeScript로 MCP Server 만들기Language/React 2025. 3. 9. 12:44
프로젝트 설정프로젝트 생성$ mkdir mcp-typescript-250309$ cd mcp-typescript-250309$ mkdir src$ cd src 라이브러리 설지$ npm install express @modelcontextprotocol/sdk zod$ npm install -D typescript ts-node$ npm install --save-dev @types/express 소스코드server.tsimport { McpServer, ResourceTemplate } from "@modelcontextprotocol/sdk/server/mcp.js";import { z } from "zod";import express from "express";import { SSEServerTran..
-
Python으로 MCP Server 만들기Language/Python 2025. 3. 7. 16:23
프로젝트 생성$ mkdir mcp-python-250309 소스코드pythonserver.py대충 로그 찍어두고 서버 기동하자from mcp.server.fastmcp import FastMCPimport loggingimport sys# 로깅 설정logging.basicConfig( level=logging.DEBUG, format='%(asctime)s - %(name)s - %(levelname)s - %(message)s', handlers=[ logging.StreamHandler(sys.stdout) ])logger = logging.getLogger("mcp-server")# Create an MCP server# mcp = FastMCP("MCP 서버")m..
-
uv/uvx란 무엇이고 설치는?Language/Python 2025. 3. 7. 11:54
UVX란? (ChatGPT)UVX는 UV 도구의 별칭으로, Python 패키지에서 제공하는 명령줄 도구를 설치하지 않고 실행할 수 있게 해주는 커맨드라인 인터페이스입니다. UVX를 사용하면 도구의 종속성이 일시적인 가상 환경에 설치되어 프로젝트와 격리되어 실행됩니다. 이를 통해 필요할 때마다 도구를 쉽게 실행할 수 있으며, 실행 후에는 가상 환경이 자동으로 삭제되어 디스크 공간을 절약할 수 있습니다. 예를 들어, uvx pycowsay 'hello world!' 명령을 사용하면 pycowsay 도구를 일시적인 환경에 설치하고 실행하여, 사용자가 추가적인 설치 과정 없이 즉시 도구를 사용할 수 있게 합니다.이와 같이 UVX는 특히 개발자들이 여러 다른 도구를 자주 사용하지만, 이들을 영구적으로 설치하고 싶..
-
React로 Gauge Chart 만들기Language/React 2025. 2. 27. 17:07
2년전 차트로 화면을 표시할때 비슷한 차트 라이브러리를 찾고 커스터마이징해서 작업하는데 시간이 꽤 많이 소요되었다. 찾는것도 일이지만 직접 만들지 않았다보니 커스터마이징이 헬일경우가 많다.이번에 리뉴얼이 많이 되면서 비슷한 차트를 찾기도 힘들고 유지보수도 힘들것 같으니 직접 만들어보기로 했다. 1. Figma에서 화면 캡쳐 및 GPT에서 html로 변환 요청캡쳐 및 GTP 요청이렇게 요청하면 react-gauge-char등 기존 라이브러리를 찾아서 사용하라고 한다.. OTL.. 다시요청예상대로 svg로 만드는 법을 알려준다. 대충 만들어 진 코드 react에 복붙하면된다. 2. React 적용 및 커스터 마이징GPT로 요청한건 아직까지는 완벽하지 않다. 많이 부족하다.. 그래도 없는것 보다는!!아래 겁..
-
InfiniteScroll 컴포넌트 간단구현Language/React 2025. 2. 24. 11:36
react + java + jpa 환경에서 InfiniteScroll을 간단하게 구현해 보자. Reactviews Componentconst ReceiptViews: React.FC = (props) => { const [loading, setLoading] = useState(false); const [hasMore, setHasMore] = useState(true); const paginationRef = useRef({ current: 1, pageSize: 9 }); const pageNoRef = useRef(1); ... const fetchItems = async () => { setLoading(true); const l_pageNo = pageNoRef.cu..
-
리뷰 작성 유도 방법Language/iOS,AOS 2025. 1. 8. 10:29
iOS에서 리뷰 작성을 유도하기 위해서 팝업 및 리뷰페이지 이동방법을 정리한다. 소스코드MainViewControllerclass MainViewController: BaseViewController { let APP_STORE_ID = "111111111" ...}enum WebAction: String { ... case openReviewApp case openReviewPage}extension MainViewController: WKScriptMessageHandler { func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMes..