react (9) 썸네일형 리스트형 Kaneo는 가볍게 시작하는 셀프 호스팅 프로젝트 관리 도구예요 Kaneo는 가볍게 시작하는 셀프 호스팅 프로젝트 관리 도구예요AI 뉴스 썸네일프로젝트 관리 도구가 복잡해질수록 팀은 일을 기록하는 데 더 많은 시간을 써요. Kaneo는 칸반과 이슈 추적에 집중하고, 데이터를 직접 보관할 수 있게 만든 오픈소스 도구예요. Docker Compose부터 Kubernetes, MCP 연동까지 배포와 자동화 선택지도 갖췄어요. 2핵심 요약구분핵심왜 볼 만한가요제품 방향칸반과 이슈 관리에 필요한 흐름을 단순한 화면에 담았어요Jira나 Linear의 기능이 팀 규모에 비해 무겁게 느껴질 때 비교할 수 있어요데이터 운영애플리케이션과 PostgreSQL을 직접 운영할 수 있어요프로젝트와 업무 데이터를 외부 서비스에 맡기지 않는 구성이 가능해요배포 방식drim CLI, Docker .. Wails v3 베타, Go 데스크톱 앱의 구조를 다시 짰어요 Wails v3 베타, Go 데스크톱 앱의 구조를 다시 짰어요Wails v3 베타 썸네일Wails v3가 3년 넘는 알파 개발을 마치고 베타 단계에 들어갔어요. Go 백엔드와 웹 프론트엔드로 데스크톱 앱을 만드는 방식은 그대로지만, 복잡한 제품을 다루기 위한 내부 구조는 크게 달라졌어요. 여러 창과 서비스의 수명주기를 코드에서 명확히 관리할 수 있게 된 점이 이번 변화의 중심이에요. 1핵심 요약구분달라진 점개발자가 확인할 부분앱 구조Application, Window, Service를 명시적인 객체로 다뤄요창과 서비스의 생성·종료 시점을 코드에서 추적하기 쉬워져요멀티윈도우여러 창을 기본 기능으로 지원해요에디터, 설정, 검사 도구처럼 창이 많은 앱에 잘 맞아요프론트엔드 연결Go 소스를 분석해 TypeScr.. AI가 만든 화면을 다시 묶는 코드 중심 디자인 시스템 AI가 만든 화면을 다시 묶는 코드 중심 디자인 시스템AI 뉴스 썸네일AI 코딩 도구로 화면을 빠르게 만들 수 있게 되면서 디자인 시스템의 역할도 달라지고 있어요. 여러 팀이 각자 만든 결과물을 하나의 제품처럼 정리하려면 검증된 컴포넌트와 토큰, 접근성 규칙을 기계가 읽을 수 있는 형태로 제공해야 해요. Figma의 제품 아키텍트 TJ Pietre는 디자인에서 코드로 넘기던 단방향 작업보다 코드와 캔버스를 오가는 흐름에 무게를 둬요. 1 2핵심 요약구분핵심왜 볼 만한가요작업 순서AI가 만든 제품에서 공통 코드를 추출한 뒤 캔버스로 되돌려 검토해요이미 구현된 사업 논리를 살리면서 제품 간 차이를 정리할 수 있어요품질 기준컴포넌트·토큰·문서·접근성 속성을 함께 제공해요AI가 비슷한 화면을 제각각 다시 만드는.. React 터미널 UI를 조립하는 termcn, 99개 컴포넌트를 한 번에 React 터미널 UI를 조립하는 termcn, 99개 컴포넌트를 한 번에AI 뉴스 썸네일터미널 앱도 웹 화면처럼 검증된 부품을 조립해 만들 수 있게 됐어요. termcn은 React 개발자가 명령 하나로 설치하고, 필요한 터미널 UI 컴포넌트만 골라 쓸 수 있는 오픈소스예요. Ink와 OpenTUI를 바닥에 두고 shadcn/ui와 비슷한 사용 흐름을 제공해요. 1핵심 요약구분핵심왜 볼 만한가요설치와 구성별도 설정 없이 명령 하나로 시작할 수 있어요TUI 프로젝트의 초기 설정 시간을 줄일 수 있어요컴포넌트11개 범주에 99개 컴포넌트를 제공해요폼부터 차트, AI 도구 화면까지 같은 방식으로 조립할 수 있어요개발 방식React, Ink, OpenTUI와 shadcn/ui식 레지스트리를 써요웹 프론트엔드 .. 100만 행 데이터 그리드가 버티는 법, 양축 가상화부터 DOM 풀링까지 100만 행 데이터 그리드가 버티는 법, 양축 가상화부터 DOM 풀링까지IT & AI 뉴스 썸네일대용량 데이터 그리드는 행 몇 개를 덜 그리는 것만으로 빨라지지 않아요. 열 너비 계산, 검색 상태, 편집기, 아이콘, 스크롤 이벤트가 한 프레임 안에서 함께 움직여야 해요. VisuaLeaf 개발자가 MongoDB와 PostgreSQL용 그리드를 약 1년 동안 다듬으며 적용한 최적화 과정을 공개했어요. 1핵심 요약구분핵심왜 볼 만한가요렌더링 범위화면에 보이는 행과 열만 그리는 양축 가상화데이터가 늘어도 DOM 크기를 일정하게 유지할 수 있어요상태 구조원본 데이터와 별도로 표시용 섀도 테이블 구성스크롤 중 타입 판별과 중첩 경로 탐색을 반복하지 않아요스크롤 처리수동적 리스너, 프레임 병합, 버퍼와 히스테리시스.. 버튼 하나로 돌아본 프론트엔드 20년 버튼 하나로 돌아본 프론트엔드 20년AI 뉴스 썸네일2008년 무렵 웹 개발을 떠났다가 지금 돌아오면 `` 하나를 만드는 과정부터 낯설 수 있어요. jQuery, React, TypeScript, Vite, 서버 렌더링, 코딩 에이전트까지 여러 층이 더해졌기 때문이에요. David Poblador의 글은 각 도구가 어떤 불편을 해결하려고 등장했고, 그 해결책이 어떤 새 비용을 만들었는지 한 개의 버튼을 따라가며 보여줘요. 1핵심 요약시기해결하려던 문제뒤따른 비용jQuery와 AJAX브라우저 차이를 줄이고 페이지 일부만 바꿨어요데이터와 DOM 상태를 개발자가 직접 맞춰야 했어요컴포넌트 프레임워크상태에 따라 화면을 선언적으로 그렸어요런타임과 프레임워크 학습 비용이 커졌어요번들러와 고속 툴링모듈, 구형 브라우.. 코딩 에이전트의 작업 경로를 3D 지도로 보여주는 Mindwalk 코딩 에이전트의 작업 경로를 3D 지도로 보여주는 MindwalkAI 뉴스 썸네일Claude Code나 Codex가 어떤 파일을 읽고 고쳤는지는 세션 기록에서 찾을 수 있어요. 하지만 에이전트가 저장소를 얼마나 넓게 돌아다녔는지, 요청과 무관한 영역까지 건드렸는지는 긴 JSONL만으로 파악하기 어려워요. Mindwalk는 이 경로를 빛이 움직이는 3D 지도로 바꿔 보여주는 오픈소스 도구예요. 1핵심 요약구분내용확인할 점세션 재생Claude Code와 Codex 기록을 저장소 지도 위에서 재생해요탐색 범위와 수정 흐름을 시간순으로 볼 수 있어요지도 표현Tree와 Terrain 화면에서 파일 상태를 색과 밝기로 나눠요읽기, 수정, 미방문 파일이 한눈에 구분돼요실행 방식하나의 Go 바이너리가 로컬 서버와 웹 .. LinkedIn 채용 과제에 숨은 악성코드, 개발자 컴퓨터를 노렸어요 LinkedIn 채용 과제에 숨은 악성코드, 개발자 컴퓨터를 노렸어요LinkedIn 채용 과제 악성코드 보안 썸네일LinkedIn에서 받은 코딩 과제를 실행했다가 개발 환경이 공격당한 사례가 공개됐어요. 겉보기에는 평범한 React와 Web3 프로젝트였지만, `tailwind.config.js` 안에는 원격 제어와 정보 탈취로 이어지는 난독화 코드가 숨어 있었어요. 낯선 저장소를 개인 컴퓨터에서 바로 실행하는 습관이 왜 위험한지 구체적으로 보여 주는 사례예요. 1핵심 요약구분핵심왜 볼 만한가요공격 경로LinkedIn 채용 제안 뒤 비공개 GitHub 과제를 전달했어요개발자가 평소 신뢰하는 채용 절차와 개발 도구를 함께 악용했어요은닉 방식30,987바이트짜리 `tailwind.config.js`의 공백 뒤.. Meta의 오픈소스 디자인 시스템 Astryx가 보여준 변화 Meta의 오픈소스 디자인 시스템 Astryx가 보여준 변화AI 뉴스 썸네일Meta가 Astryx라는 오픈소스 디자인 시스템을 공개했어요. React와 StyleX 기반 컴포넌트, 브랜드별 테마, CLI, MCP 문서 흐름을 한 묶음으로 제공하는 점이 눈에 띄어요. 디자인 시스템이 더 이상 화면 컴포넌트 묶음에만 머물지 않고, 사람이 쓰는 문서와 AI 코딩 도구가 함께 읽는 작업 기준으로 바뀌고 있어요.핵심 요약구분핵심왜 볼만한가요디자인 시스템Astryx는 160개 이상 React 컴포넌트와 테마, 템플릿을 제공해요제품 팀이 UI 기본기를 매번 다시 만들 필요를 줄여요개발자 도구CLI와 MCP로 컴포넌트 목록, 토큰, 문서를 탐색할 수 있어요AI 코딩 도구가 디자인 시스템 규칙을 더 쉽게 따라갈 수 있어.. 이전 1 다음
