typescript6 Backstage 패키지 수사대: 5초 만에 프론트엔드 플러그인 찾아내기 안녕하세요! 오늘은 Backstage의 거대한 모노레포 숲속에서 "이 패키지가 프론트엔드 플러그인인지 어떻게 알 수 있을까?"라는 주제로 깊이 있는 탐험을 떠나보겠습니다. 🕵️♂️Backstage는 수많은 패키지로 구성되어 있어 처음 접하면 길을 잃기 쉽습니다. 하지만 몇 가지 명확한 '단서'만 알면, 어떤 패키지가 사용자 화면을 담당하는 프론트엔드 플러그인인지 단 5초 만에 파악할 수 있습니다. 그 비결을 지금 바로 공개합니다! 💡🏗️ 프론트엔드 플러그인 식별의 3단계 공식Backstage 패키지를 조사할 때 다음 3가지 요소를 확인하면 됩니다. 이들은 프론트엔드 플러그인임을 증명하는 결정적인 증거들입니다.1. package.json의 이름과 의존성 📦가장 먼저 확인해야 할 곳은 패키지의 루트.. 2025. 12. 26. 내 맘대로 구성하는 Backstage 엔터티 페이지! 조건부 탭(Conditional Tab) 구현 가이드 🛠️ 안녕하세요, 플랫폼 엔지니어 여러분! 👋 Backstage를 운영하다 보면 이런 고민이 생깁니다. "우리 팀은 Kubernetes를 쓰는 서비스만 K8s 탭을 보여주고 싶은데...""자바 프로젝트에만 SonarQube 탭을 노출할 수 없을까?" Backstage는 EntityLayout.Route와 'Filter Functions'를 결합하여 이 문제를 아주 우아하게 해결합니다. 지금부터 그 방법을 상세히 파헤쳐 보겠습니다!1. 기본 개념: EntityLayout.Route와 if 프롭 🧩Backstage 엔터티 페이지의 각 탭은 EntityLayout.Route 컴포넌트로 정의됩니다. 이 컴포넌트에는 if라는 아주 특별한 프롭(Prop)이 있습니다.동작 원리: if 프롭에 전달된 함수가 true를 .. 2025. 12. 25. TypeScript 대규모 프로젝트, tsc로 똑똑하게 빌드하는 A to Z 🚀 수많은 .ts 파일들이 유기적으로 연결된 TypeScript 프로젝트, 매번 어떻게 컴파일하고 계신가요? 혹시 아직도 개별 파일을 지정하거나 비효율적인 방법으로 시간을 낭비하고 계신다면, 이 글이 여러분의 워크플로우를 혁신적으로 바꿔줄 것입니다. tsconfig.json 파일과 tsc 명령어의 진정한 시너지를 경험해 보세요! ✨ 1. 왜 효율적인 컴파일이 중요할까요? ⏰개발자에게 시간은 금입니다. 특히 대규모 프로젝트에서는 다음과 같은 이유로 효율적인 컴파일 전략이 필수적입니다.빠른 피드백: 코드 수정 후 결과물을 빠르게 확인해야 개발 흐름이 끊기지 않습니다.리소스 절약: 매번 전체 파일을 다시 읽고 컴파일하는 것은 CPU와 메모리 낭비입니다.일관된 환경: 팀원 모두가 동일한 설정으로 빌드해야 예측 가능.. 2025. 12. 25. 파일이 수백 개라도 끄떡없다! TypeScript 프로젝트 전체를 가장 효율적으로 컴파일하는 비법 🛠️ 안녕하세요, 개발자 여러분! TypeScript 프로젝트를 진행하다 보면 어느새 파일 개수가 수십, 수백 개로 늘어난 것을 발견하게 됩니다. 이때 터미널에 일일이 파일 이름을 입력하며 빌드하고 계시지는 않나요? 😅오늘은 TypeScript 컴파일러(tsc)의 잠재력을 100% 끌어올려, 프로젝트 전체를 가장 빠르고 정확하게 JavaScript로 변환하는 표준화된 방법을 소개합니다.1. 정답은 바로 tsconfig.json 파일입니다! 📄단순히 파일 하나를 변환할 때는 tsc index.ts라고 입력하면 되지만, 프로젝트 단위의 컴파일에서는 tsconfig.json 설정 파일이 필수입니다.정의: 프로젝트의 루트 디렉토리에 위치하며, 컴파일러 설정과 포함/제외할 파일 목록을 정의하는 설정 파일입니다.작동.. 2025. 12. 25. Backstage 백엔드의 심장, @backstage/backend-common 완벽 해부! 🛠️ 안녕하세요, 플랫폼 엔지니어 여러분! Backstage를 커스텀하거나 새로운 백엔드 플러그인을 만들 때 반드시 마주치게 되는 라이브러리가 있습니다. 바로 @backstage/backend-common이죠. 이 라이브러리가 제공하는 강력한 도구들을 알면 개발 시간이 절반으로 줄어든답니다. ⏱️1. @backstage/backend-common이란? 🔍이 패키지는 Backstage 백엔드 생태계에서 "공통 유틸리티의 보물창고"와 같습니다. 백엔드 서비스를 구축할 때 반복적으로 필요한 기능들을 표준화된 방식으로 제공하여, 개발자가 비즈니스 로직에만 집중할 수 있게 도와줍니다.2. 주요 제공 기능 (핵심 유틸리티) 🛠️이 라이브러리가 제공하는 대표적인 유틸리티들은 다음과 같습니다.데이터베이스 연결 (Data.. 2025. 12. 25. TypeScript 개발의 필수템! tsc --watch 모드 완벽 가이드 TypeScript로 코딩을 할 때, 수정한 내용을 확인하기 위해 매번 터미널에 tsc를 입력하고 계시진 않나요?그렇다면 여러분은 오늘 이 글을 읽고 나서 완전히 새로운 세상을 만나게 될 거예요! 😉1. --watch 플래그란 무엇인가요? 🤔기본적으로 tsc 명령어를 실행하면 TypeScript 컴파일러는 프로젝트 내의 소스 파일들을 한 번 스캔하여 JavaScript 파일로 변환한 뒤 종료됩니다.하지만 --watch (또는 짧게 -w) 플래그를 붙이면 상황이 달라집니다.지속적 감시: 컴파일러가 종료되지 않고 프로세스를 유지합니다.파일 변경 감지: 프로젝트 내의 파일이 저장(Save)되는 순간을 실시간으로 감지합니다.증분 컴파일: 변경된 부분만 빠르게 다시 컴파일하여 결과물을 업데이트합니다.2. 왜 .. 2025. 12. 25. 이전 1 다음
