반복영역 건너뛰기
주메뉴 바로가기
본문 바로가기
제품/서비스
EMS Solution
Features
클라우드 관리
AI 인공지능
서버관리
데이터베이스 관리
네트워크 관리
트래픽 관리
설비 IoT 관리
무선 AP 관리
교환기 관리
운영자동화
실시간 관리
백업 관리
APM Solution
애플리케이션 관리
URL 관리
ITSM Solution
서비스데스크
IT 서비스 관리
Big Data Solution
SIEM
Dashboard
대시보드
Consulting Service
컨설팅 서비스
고객
레퍼런스
고객FAQ
문의하기
가격
자료실
카탈로그
사용자매뉴얼
회사소개
비전·미션
연혁
2016~현재
2000~2015
인증서·수상
투자정보
재무정보
전자공고
IR자료
새소식
공고
보도자료
오시는 길
채용
피플
컬처
공고
FAQ
블로그
열기
메인 페이지로 이동
블로그
기술이야기
블로그
최신이야기
사람이야기
회사이야기
기술이야기
다양한이야기
기술이야기
검색
기술이야기
IT 인프라 모니터링 트렌드
기술이야기
IT 인프라 모니터링 트렌드
EMS란? EMS는 Enterprise Management System의 약자로, 여러 기업과 기관의 IT서비스를 이루는 다양한 IT Infrastructure를 통합적으로 모니터링하는 시스템을 의미합니다. 해외에서는 일반적으로 ITIM(IT Infra Management)이라는 용어로 많이 사용되고 있지만, 국내에서는 EMS라는 용어로 통용되고 있습니다. EMS는 IT인프라의 데이터를 실시간으로 수집 및 분석할 뿐만 아니라, 수집된 데이터를 활용해 비즈니스의 가치를 창출할 수 있습니다. 글로벌 IT분야 연구자문 기업인 “가트너(Gartner)”에서는 ITIM, 즉 EMS를 데이터센터, Edge, IaaS(Infrastructure as a Service), PaaS(Platform as a Service) 등에 존재하는 IT인프라 구성요소의 상태와 리소스 사용률을 수집하는 도구로 정의하며, 컨테이너, 가상화시스템, 서버, 스토리지, 데이터베이스, 라우터, 네트워크 스위치 등에 대한 실시간 모니터링이 가능해야 한다고 서술합니다. <사진 설명: 가트너의 ITIM 정의를 도식화한 그림> 이러한 EMS는 초기에는 기업 전산실에 물리적인 형태로 존재하는 서버, 네트워크의 리소스관리를 중심으로 모니터링해 왔습니다. 서버의 CPU, Memory 등의 리소스 정보를 수집하거나, 네트워크 장비의 트래픽 정보를 모니터링하고 임계치를 기반으로 이벤트 감지하는 역할이 대부분이었으며, 이 정도 수준에서도 충분한 IT 인프라 관리가 이뤄질 수 있었습니다. 그러나 가상화(Virtualization)라는 개념이 생겨나고 다양한 IT 인프라들이 기업 전산실에서 클라우드(Cloud) 환경으로 전환됨에 따라, EMS의 모니터링 분야도 조금씩 바뀌어 가고 있습니다. 많은 기업들이 효율적인 리소스 사용과 비용 절감을 목표로 VMware와 같은 가상화 시스템을 도입해 운영하게 됐으며, 모니터링 부문도 이에 대응하기 위해 가상화 리소스에 대한 관리 영역으로 확장됐습니다. 가상화 환경을 이루는 하이퍼바이저(Hypervisor)와 가상머신(Virtual Machine)의 연관성을 추적하고, 각 가상머신들이 사용하고 있는 리소스를 실시간으로 분석해 효율적인 자원 배분, 즉 프로비저닝(Provisioning)을 위한 근거 데이터를 제공할 수 있도록 하고 있습니다. 더 나아가 VMware, Hyper-V 등의 다양한 가상화 플랫폼에서 가상머신을 생성하고 삭제하고, 실제로 가상머신에 CPU, Memory 등과 같은 리소스를 할당해 줄 수 있는 컨트롤 영역까지 제공하는 제품을 개발하는 벤더사들이 많아지고 있습니다. 이러한 가상화 기술을 기반으로 현대에는 IT 인프라들이 대부분 클라우드 환경으로 전환하고 있는 추세입니다. 클라우드 환경으로의 전환 클라우드(Cloud)란, 언제 어디서나 필요한 컴퓨팅 자원을 필요한 시간만큼 인터넷을 통해 활용할 수 있는 컴퓨팅 방식으로, 최근 기업들은 각자의 목적과 상황에 맞게 AWS, MS Azure와 같은 Public Cloud 및 OpenStack, Nutanix 등을 활용한 Private Cloud 등의 환경으로 기업의 전산설비들을 마이그레이션 하고 있습니다. 클라우드로의 전환과 기술의 발전에 따라, EMS의 IT 인프라 모니터링은 더 이상 *On-Premise 환경에서의 접근이 아닌, Cloud 환경, 특히 MSA(Micro Service Architecture)를 기반으로 하는 클라우드 네이티브(Cloud Native) 관점에서의 IT 운영 관리라는 새로운 접근이 필요하게 됐습니다. (*On-Premise : 기업이 서버를 클라우드 환경이 아닌 자체 설비로 보유하고 운영하는 형태) 클라우드 네이티브란, 클라우드 기반 구성요소를 클라우드 환경에 최적화된 방식으로 조립하기 위한 아키텍처로서, 마이크로서비스 기반의 개발환경, 그리고 컨테이너 중심의 애플리케이션 구동환경 위주의 클라우드를 의미합니다. 클라우드 네이티브는 IT비즈니스의 신속성을 위해 도커(Docker)와 같은 컨테이너를 기반으로 애플리케이션이 운영되므로, EMS는 컨테이너의 성능, 로그, 프로세스 및 파일시스템 등 세부적인 관찰과 이상징후를 판단할 수 있는 기능들이 요구되고 있습니다. 자사 제품인 Zenius SMS에서는 이러한 변화에 따라 Docker에 대한 모니터링 기능을 기본적으로 제공하고 있습니다. Docker 컨테이너가 생성되면 자동으로 관리대상으로 등록되며, Up/Down 뿐만 아니라, CPU, Memory, Network 및 Process의 정보를 실시간으로 모니터링하고 발생되는 로그들을 통합관리 할 수 있도록 합니다. <사진 설명: Zenius-SMS에서 제공하고 있는 Docker 컨테이너 모니터링 기능> 또, 복원력과 탄력성을 위해 쿠버네티스와 같은 오케스트레이션 도구를 활용해 컨테이너를 스핀업하고, 예상되는 성능에 맞게 효율적으로 리소스를 맵핑하고 있으며, 이러한 기술에 대응하기 위해 EMS는 쿠버네티스(Kubernetes), 도커스웜(Docker Swarm) 등의 오케스트레이터들의 동작여부를 직관적으로 관찰하는 제품들이 지속적으로 출시되고 있는 상황입니다. 이와 더불어 컨테이너, 오케스트레이터의 동적 연결관계를 실시간으로 모니터링하고, 파드(POD), 클러스터, 호스트 및 애플리케이션의 관계를 표현하는 역할의 중요성이 점차 커져가고 있습니다. 통합 모니터링(Monitoring) EMS 모니터링의 또 다른 변화로는 통합(Integration)의 역할이 더더욱 강해지고 있다는 것입니다. IT 서비스가 복잡해지고 다양해짐에 따라 IT 인프라의 관리 범위도 점차 증가하면서, 다양한 IT 인프라들을 융합하고 관리하기 위한 노력들이 관찰되고 있습니다. 데이터독(Datadog), 스플렁크(SPLUNK)와 같은 장비 관점의 모니터링 벤더들은 APM과 같은 애플리케이션 모니터링 시장으로, 앱다이나믹스(AppDynamics), 다이나트레이스(Dynatrace), 뉴렐릭(NewRelic)과 같은 애플리케이션 모니터링 시장의 강자들은 인프라 장비 관점의 모니터링 시장으로의 융합이 확인되고 있습니다. 자사 제품인 Zenius 역시 서버, 네트워크 중심의 관리에서 애플리케이션, 데이터베이스 등의 시장으로 관리 범위를 확장해 나가고 있는 추세입니다. IT 서비스의 영속성을 유지하기 위해서는 IT 서비스를 구성하는 다양한 요소들을 실시간으로 모니터링하고 연관관계를 추적해 문제 원인을 찾아내는 것이 중요하기 때문에 다양한 IT 요소들을 통합적으로 모니터링하는 것 뿐만 아니라, 상호 연관관계를 표현하고 추적할 수 있는 기능들이 지속적으로 요구되고 있습니다. 모니터링의 트렌드는 서버, 네트워크 등의 독립적인 개체에 대한 모니터링 아닌 IT 서비스를 중심으로 기반 요소들을 모두 통합적으로 모니터링하고, 각 상호간의 의존성과 영향도를 파악해 RCA(Root Cause Analysis) 분석을 가능하게 하고 이를 통해 IT 서비스의 연속성을 보장할 수 있는 통찰력을 확보하게끔 하는 방향으로 흘러가고 있습니다. Zenius는 서버, 네트워크, 애플리케이션, 데이터베이스 및 각종 로그들의 정보를 시각적으로 통합 모니터링할 수 있는 오버뷰(Overview) 도구와 IT 서비스 레벨에서 인프라들의 연관관계를 정의하고 다양한 조건(Rule)에 따라 서비스 이상유무와 원인분석이 가능한 서비스 맵(Service Map) 도구를 기본적으로 제공하고 있습니다. <사진 설명: Zenius 오버뷰 화면> <사진 설명: Zenius 서비스맵 화면> 앞서 언급했듯이, 클라우드 환경으로 전환함에 따라 통합적 관리 요구는 더욱 높아지고 있습니다. IT 인프라에 대한 통합 뿐만 아니라, AD(Active Directory), SAP 및 AWS, Azure, GCP 등의 다양한 서비스의 주요 지표까지 연계하고 하나의 시스템으로 통합 모니터링하기 위한 노력들이 관찰되고 있습니다. 데이터독(Datadog)의 경우, 500개 이상의 시스템, 애플리케이션 및 서비스들의 지표들을 손쉽게 통합 관리할 수 있다고 돼있습니다. <사진 설명: 데이터독 홈페이지 캡처> 이처럼 IT 서비스의 복잡성과 다양화에 따라 관리해야 될 서비스와 지표들은 점점 늘어나고 있으며, 기업의 현황에 맞게 컴포넌트 기반으로 손쉽게 지표들을 통합할 수 있는 기능과 도구들이 요구되고 있습니다. AI 기반의 예측&자동화 모니터링의 세번째 변화로는 ’AI 기반의 예측과 자동화’입니다. IT 인프라 및 서비스의 주요 지표를 모니터링하는 것도 중요하지만, 축적된 데이터를 기반으로 미래의 상황을 예측 및 이상탐지해 사전에 대비할 수 있는 체계를 갖추는 일은 모니터링 시장에서 중요한 이슈로 자리잡고 있습니다. 현재의 AIOps(AI for IT Operations)를 표방하는 모니터링 기술들은 서버, 네트워크, 애플리케이션, 데이터베이스 등의 주요 지표들을 실시간으로 수집하고, 저장된 데이터를 기반으로 AI 알고리즘 또는 통계기법을 통해 미래데이터를 예측하며 장애 발생가능성을 제공하고 있습니다. 이와 같은 기술을 통해 미래 성능 값을 예측해 IT 인프라의 증설 필요성 등을 판단하고, 장애 예측으로 크리티컬한 문제가 발생되기 전에 미리 조치를 취할 수 있도록 해 효율적인 의사결정을 할 수 있도록 합니다. Zenius도 4차 산업혁명 및 디지털 뉴딜시대가 도래함에 따라 미래예측 기능을 최신 버전에 탑재했으며, 이를 통해 IT운영자가 미래 상황에 유연하고 선제적으로 대응할 수 있도록 합니다. Zenius에서는 서버, 네트워크, 애플리케이션 등 다양한 IT 인프라의 미래 성능 값, 패턴 범위, 이상 범위 등을 예측해 IT 운영자에게 제시합니다. <사진 설명: 인공지능(AI) 기반 미래데이터 예측 화면> 다만, 인공지능 기술을 통해 장애 발생 가능성을 탐지하는 기능 외에, 어디에 문제가 발생됐는지 알려주는 기능은 모니터링 시장에 과제로 남아있고, 이를 제공하기 위한 여러 업체들의 노력이 보이고 있습니다. 이제는 EMS에서 보편적인 것이 됐지만, 모바일 기기를 통해 시∙공간적 제약 없는 모니터링이 이뤄지고 있습니다. 다양한 기종의 스마트폰, 태블릿PC 등을 이용해 운영콘솔(Console) 뿐만 아니라, 회의 등 시간을 잠시 비우더라도 IT 인프라에 대한 연속적인 모니터링이 모바일기기를 통해 가능해졌습니다. <사진 설명: 다양한 기기를 통한 모니터링>
2022.09.05
기술이야기
벽을 넘어서고 싶은 신입 개발자의 브레인즈 생활기
기술이야기
벽을 넘어서고 싶은 신입 개발자의 브레인즈 생활기
지원 이유와 여정 대학교 졸업 후, 부족한 웹개발 역량을 쌓기 위해 5달간의 풀스택 부트캠프 교육을 수료하고 1달간의 기업 협업 인턴을 마쳤습니다. 이후, 제 역량을 마음껏 펼쳐내며 지속적으로 성장할 수 있는 회사에서 일하고 싶다는 생각이 들었습니다. 그러다 풀스택 기술뿐만 아니라, 빅데이터 및 AI 기술을 활용해 차세대 기술을 개발하는 브레인즈컴퍼니의 채용공고를 발견했습니다. 이 회사에서라면 많은 것을 배워 역량을 키우고 성장하며 일할 수 있겠다는 생각에 지원했고, 면접 끝에 첫 직장에 취업하게 됐습니다. 웹개발도 재밌지만 개발자로서 지속적으로 새로운 기술들을 습득하며 성장하는 것에서 성취감과 보람을 느끼는 것이 컸고, 그럴 수 있는 부서에서 첫 회사 생활을 시작할 수 있다는 생각에 기뻤습니다. 채용 과정 면접에서 기억에 남는 질문은 "우리 부서는 프론트엔드 보다 백엔드를 더 추구하는 편이라 함께 일을 하게 된다면, 프론트엔드와 백엔드 모두를 아울러 사용할 것인데 할 수 있습니까?"였습니다. 풀스택 개발자로서 일을 하게 된다는 질문이었고, 저는 이 부분에 대해 긍정적이었기 때문에 자신 있게 할 수 있다고 대답했습니다. 백엔드 개발자보다 많은 영역에서 발전하며 성장할 수 있다는 생각에 더욱 기대되고 설렜던 기억이 있습니다. 그렇게 저의 첫 직장 생활이 시작됐습니다. 입사 후, 지난 3달간의 일대기 채용이 된 후, 출근까지 2주간의 자유 시간이 주어졌습니다. 졸업 후 부트캠프 교육을 이수하면서 줄곧 달려왔고, 즐겁게 공부했지만 지쳐있는 심신을 달래기 위해 여행도 다녀오고 친구들과 가족들과 시간을 보내면서 출근 준비를 했습니다. 그렇게 2주 후 첫 출근을 하는 날이 됐고, 본격적으로 사원으로 근무하는 날이 다가왔습니다! 브레인즈컴퍼니의 개발 그룹은 1~5그룹으로 나눠져 있으며, 저는 개발4그룹에 소속됐습니다. 개발4그룹은 프론트엔드와 백엔드 개발뿐만 아니라, 빅데이터 및 AI 기술을 동원한 신기술 개발을 담당하고 있어, 배울 점도 많고 나아가야할 길도 멀리 펼쳐져 있다고 느꼈습니다. 1st Month_적응기 입사 첫 달은, 개발4그룹에서 집중적으로 개발 진행 중인 로그매니저와 Zenius AI의 제품 매뉴얼과 웹페이지에서 실제로 사용되고 있는 각각의 기능들을 학습하며 제품을 파악하고 익숙해지는 기간을 가졌습니다. 그렇게 한 달 간은 개발에 투입되기보다는 제품 및 사용된 기능들에 대한 학습과 공부를 하는 기간이었습니다. 단순히 제품의 매뉴얼만을 보며 학습을 했다면 집중도가 떨어졌을 수 있지만, 제품에서 사용하고 있는 다양한 기술들, Elasticsearch, Kibana, Kafka, Cluster 등 스택들에 대해 공부하면서 흥미와 재미를 느끼며 학습을 이어갈 수 있었습니다. 잘 몰랐던 신 기술들을 접하면서, 앞으로도 배우게 될 다양한 기술들에 대해 기대감이 부풀었던 한달이었습니다. 이외에도 학습을 진행하면서 원래 사용하던 스택인 JavaScript와 Linux의 Base부터 차근차근 다시 복습하며 결점을 보완하고, 제 자신을 Refactoring하기도 했던 한 달이었습니다. 2nd Month_개인정보 마스킹 기능 개발 입사 두 달째 부터는, 로그매니저와 Zenius AI의 기능들과 매뉴얼에 대해 전반적인 이해를 갖게 됐고, 각 사이트 기능들의 동작 원리 등을 대략적으로 파악할 수 있었습니다. 두 달이 된 이 시점부터 프론트엔드와 백엔드 모두를 사용하는 프로젝트가 주어졌습니다. 주어진 프로젝트는 ‘개인정보 마스킹 기능 개발’ 이었습니다. 로그매니저 내에서 수집되는 대용량의 로그들 안에 개인 정보가 포함될 경우가 있는데, 개인정보가 그대로 노출되는 것을 방지하기 위해 개인정보에 해당하는 정보는 마스킹처리를 자동적으로 진행하는 기능 개발을 진행하게 됐습니다. 예를 들어, 로그에 ‘961219-1234567’, ‘서울시 성동구 성수이로’, ‘010-1234-5678’ 등과 같은 주민등록번호, 주소, 연락처 뿐만 아니라 다양한 개인정보들을 지정한 특수문자(Default로는 *을 사용) 로 마스킹 처리를 해주는 기능을 개발하는 과정이 중점이 되는 프로젝트였습니다. 풀스택 공부를 하면서, 백엔드는 Node.js와 MySQL, PrismaOrm 등을 사용해 기능 개발을 진행했지만, 이번 프로젝트는 Elasticsearch, Kafka.js, Cluster.js 및 커스텀마이징된 다양한 메소드와 함수들을 통해 진행했기 때문에 배울 점이 매우 많았고, 성장하는 것을 느낄 수 있었습니다. 이외에도 프론트엔드에서 Ace.js를 통한 텍스트 편집기를 개발하고, 개인정보유형에 해당하는 정보가 입력되면 Syntax Highlighting 기능을 통해 해당 부분에 형광펜 효과를 적용시켜주는 기능의 개발을 진행했습니다. 개인정보 유형에 해당하는 정보에 대응되는 정규표현식, 그리고 백엔드에서 마스킹 처리될 특수문자 타입의 데이터 등은 Elasticsearch의 Index를 통해서 데이터의 저장과 반환작업 처리를 진행해줬으며, 이 데이터들을 기반으로 프론트엔드와 백엔드에서 모두 정상적인 마스킹 기능과 Syntax Highlighting 기능을 개발할 수 있었습니다. 새로운 기술을 활용해 프로젝트를 진행하면서 어려운 점도 많았고 시행착오도 겪었지만, 그만큼얻어가고 배워가는 것이 많았던 첫 업무였습니다. Elasticsearch, Kibana, Cluster, Kafka 등 새로운 기술 스택에 대해 배우고 적용할 수 있었다는 점이 매우 흥미로웠고 뿌듯한 경험이었습니다. <사진 설명: 개인정보 유형과 마스킹 여부, 정규표현식 관리와 마스킹 기능 ON/OFF가 가능한 페이지> <사진 설명: 선택한 개인정보 정규표현식에 해당되는 데이터 Syntax Hilighting 기능 구현> 3rd Month_데몬프로세스 그룹화 작업 및 테스트케이스 입사 세 달째 부터는, 어느 정도 회사 생활에 적응이 된 상태가 됐습니다. 아침 일찍 일어나는 것에도 적응이 됐고, 초반에는 어색했던 업무회의와 주간업무보고서 작성도 이제는 자연스럽게 하고 있는 모습을 발견할 수 있었습니다. 첫번째 프로젝트를 마친 후, 두번째로는 로그매니저의 데몬프로세스 기능을 그룹별로 정렬하는 업무를 맡게 됐습니다. 데몬프로세스가 각각의 그룹 속성을 지니고 있지만, 이를 그룹별로 나눠서 보여준다면 좀 더 가독성과 가시성이 높아질 것이기 때문에, Elasticsearch에서 반환 받는 데이터를 그룹의 조건에 따라 분류해주는 작업이 주가 됐습니다. 두번째 개발 후에는 로그매니저의 각 기능들에 대한 테스트 케이스 및 오류 사항 확인의 과정을 거쳤고, 제가 개발한 ‘개인정보 관리’ 기능에 대한 테스트 케이스 작성도 진행했습니다. 개발자가 개발을 잘하는 것도 중요하지만, 이렇게 자신이 개발한 기능에 대해 테스트케이스를 작성하면서 유저가 해당 테스트케이스를 확인하고, 개발한 기능을 자연스레 사용할 수 있게 해야 하는 것은 개발만큼이나 중요하다고 생각하기 때문에 기분 좋게 테스트케이스 작성을 진행할 수 있었습니다. 또, 로그매니저 제품 각 기술들의 테스트케이스들을 확인하며 각각의 기능들을 모두 테스트해볼 수 있는 기회가 됐으며, 개발하고 서비스되고 있는 기술들에 대해 좀더 명확하게 인지하고 확인할 수 있어 제품 이해에 큰 도움이 됐습니다. 이를 기회로 개발만이 중요한 것이 아닌 테스트케이스의 중요성을 절실히 깨닫고, 제가 개발하는 기술들에 대한 테스트케이스 작성이 필수불가결하다는 것을 느끼게 됐습니다. 느낀 점 브레인즈컴퍼니 개발4그룹에 입사 후, 3달간 근무하며 느낀 점은 제가 만족하며 회사를 다니고 있다는 점입니다. 그룹의 모든 구성원분들이 잘 적응할 수 있도록 도와주고 챙겨주셨고, 문제가 될 수도 있는 실수가 발생해도 모든 그룹원들이 다 잘 다독여 주셨습니다. 또, 좋은 피드백을 줘서 지속적으로 배워가고 성장할 수 있는 회사의 성장할 수 있는 부서라고 생각합니다. 그룹의 상래님, 신후님, 천웅님, 태민님 모두 제게 좋은 피드백과 도움을 주시고, 개선돼야할 점과 공부해야 할 부분, 그리고 개발을 하면서 고쳐야 할 습관들을 알려주셔서 점차 앞으로 나아갈 수 있다고 생각합니다. 일을 하면서 빼놓을 수 없는 게 워라밸일 것이라고 생각합니다. 첫 회사에서 일과 삶의 밸런스가 매우 적절하다고 생각하고 만족하며 근무를 하고 있습니다. 퇴근을 한 뒤에도 운동을 할 수 있고, 식단 관리도 병행하며 몸을 기르고 있습니다. 만약, 워라밸이 좋지 않았더라면 이렇게 삶을 유지할 수 없을 거라는 생각이 듭니다. 글을 마치며 면접에서 제가 했던 말이 있습니다. 저는 앞에 벽이 있다면 돌아가 다른 길을 찾으려 하기보다는 그 벽을 넘을 수 있는 방법을 생각합니다. 앞으로 나아갈 수 있고 성장할 수 있는 삶을 추구하고 있습니다. 비록 그 벽을 넘지 못하더라도, 다음에 그 벽보다 낮은 벽은 넘을 수 있을 것입니다. 시도조차 하지 않으면 당연히 발전도 없다고 생각합니다. 매번 도전하고 또 도전하며 발전하는 개발4그룹의 일원이 돼, 신기술 개발에도 큰 보탬이 되는 개발자로 성장하고 싶습니다. 그리고 브레인즈컴퍼니 개발4그룹에서 반드시 실현 가능하다고 생각합니다. 다양한 기술들을 배우고 학습해 제 것으로 만들고, 그룹과 회사에 보탬이 되는 개발자로 성장하겠습니다! [출처] https://twitter.com/gom_translate https://me2.kr/wvu3p http://jjaltoon.gallery/?p=11311 https://me2.kr/eq144
2022.08.25
기술이야기
[ZNG 개발기] #1. ZNG와 Vue.js
기술이야기
[ZNG 개발기] #1. ZNG와 Vue.js
안녕하세요. 브레인즈컴퍼니 개발 3그룹에서 ZNG의 프론트엔드를 개발하고 있는 1년차 신입 개발자 김현수입니다. ZNG란 Zenius New Generation의 약자로, 브레인즈컴퍼니의 핵심 서비스인 제니우스의 차세대 버전을 말합니다. ZNG는 데이터베이스를 제외한 프론트엔드와 백엔드는 완전히 제로베이스에서 시작하는 장기 프로젝트이기에, 프로젝트를 진행하는 과정에서 새롭게 배운 것, 개발자로서 성장, 팀 개발 경험 등을 기록하고자 ZNG 개발기를 작성하게 됐습니다. ZNG 개발기는 달마다 개발과정에서 있었던 이슈들, 경험, 공부한 내용 등을 기술적인 내용과 함께 작성할 예정입니다. 다 함께! <사진 설명: 펭수, "렛츠고!"> 1. ZNG가 무엇인가요? ZNG는 기존 제니우스에서 발생하는 불편함을 해소하고자 탄생한 프로젝트입니다. 기존 제니우스에는 어떤 불편함이 있었고, 이를 해소하고자 ZNG는 어떤 컨셉을 목표로 개발할 것인가에 대해 알아보겠습니다. 같은 부서 선배 동료들을 쫄래쫄래 따라다니며 물어보고 배워가며 정리한 내용을 바탕으로 작성하는 글입니다. 혹시라도 틀린 부분이 있다면 알려주시면 감사하겠습니다! <사진 설명: 자환님은 아니라고 하셨다...> 제니우스는 B2B 솔루션 서비스 상품으로 사용자의 요구사항에 맞게 유연한 변경이 가능해야 합니다. 새로운 컴포넌트를 추가 한다거나, 여러 기능을 합치는 등 다양한 요구사항에 대응해야 합니다. 당연히도 현재 제니우스는 사용자의 요구사항에 맞춰 조금씩 커스텀해 서비스되고 있습니다. 그러나 효율적이지 못한 상황이 생기기도 합니다. 대체로 같은 내용의 코드를 반복해서 작성하는 상황이 그러합니다. 같은 형태를 가진 컴포넌트여도 출력하고자 하는 데이터의 종류가 다르다면 컴포넌트를 통째로 다시 만들어야 했습니다. 반복적인 작업은 개발자에게 피로감을 주게 되고 단순히 피로감을 넘어, 개발자에게 목표 의식을 저하시킬 우려가 있습니다. <사진 설명: 다양한 종류의 컴포넌트가 있다. 사용자마다 원하는 컴포넌트, 데이터가 다를 수 있다.> 이런 불편함을 해소하는 방법으로, ZNG는 코드의 재사용성을 높이기 위해 노력합니다. 각 기능끼리의 의존도는 낮추고, 독립성을 높여서 반복적인 작업을 최소화합니다. 같은 형태를 가진 컴포넌트에 대해서 데이터만 다르다면 데이터만 바꿔주면 됩니다. 사용자마다 다른 종류의 데이터를 출력하기를 원할 경우 더 빠르고 효율적인 대처가 가능합니다. 이러한 컨셉과 Vue.js의 Component를 관리하는 방법이 일치해 ZNG는 Vue.js로 개발하게 됐습니다. 2. ZNG와 Vue.js Vue.js에는 여러가지 특징이 있습니다. 그 중에서도 Vue Component에 대해서 자세히 알아보겠습니다. Vue Component Vue Component란 화면을 구성하는 하나의 블록입니다. Component는 하나의 전체 화면일수도 있고 전체 화면 중 일부분을 차지하는 또 하나의 작은 화면일수도 있습니다. 따라서 화면을 구현할 때 화면 전체를 한 번에 구현하지 않고, 부분적으로 구현해 관리하는 것이 가능합니다. Component를 활용하면 화면을 구조화해 직관적으로 개발할 수 있으며 코드의 재사용성이 올라갑니다. <사진 설명: 화면의 영역을 블록으로 쪼개 재활용 가능항 형태로 관리하는 것이 Vue Component> ZNG 기능 중 모니터링은 추출한 데이터를 그래프, 표 등을 통해 다양한 형태의 컴포넌트로 보여줍니다. 각각의 컴포넌트는 서로 다른 모양을 통해, 서로 다른 데이터를 보여줍니다. 반대로 말하면 하나의 컴포넌트에 대해서 모양, 데이터만 다르게 준다면 여러 종류의 컴포넌트를 만들 수 있습니다. 다음은 ZNG 코드 일부입니다. PCContainer는 컴포넌트를 감싸는 블록입니다. component 태그 안에 있는 ‘is’옵션에 ‘컴포넌트의 이름’을 넣어 그리고자 하는 컴포넌트를 선택할 수 있습니다. PCLineChart는 그래프를 그리는 컴포넌트입니다. highchartsOptions에 어떤 데이터를 넣느냐에 따라 원하는 그래프를 그릴 수 있습니다. <사진 설명: PCContainer> 하나의 PCContainer로 여러 모양의 컴포넌트를 그리고, 하나의 컴포넌트(PCLineChart)로 다양한 데이터를 표현할 수 있습니다. 컴포넌트를 만들기 위해 새로운 코드를 작성하지 않고, Vue Component를 통해 코드를 재사용함으로써 효율적이고 직관적인 코드를 개발할 수 있습니다. 부모와 자식 컴포넌트 관계 각 Vue Component는 데이터를 주고받을 때 부모-자식 관계를 갖는 것이 일반적입니다. <사진 설명: 부모-자식 컴포넌트> 부모는 자식에게 데이터를 전달할 수 있어야 하며, 자식은 부모에게 일어난 일을 알려야 합니다. 부모는 props를 통해 자식에게 데이터를 전달하며, 자식은 emit로 이벤트를 호출해 부모에게 데이터를 알립니다. 부모 컴포넌트와 자식 컴포넌트는 분명히 구분된 컴포넌트지만 props와 emit을 통해 의사소통이 가능합니다. ZNG는 최상단 레이아웃에서 서버로부터 데이터를 받아와 props를 통해 각 컴포넌트로 데이터를 보내줍니다. 하위 컴포넌트에서 발생한 이벤트를 통해 다시 상위 컴포넌트로 데이터를 전달해 데이터를 관리합니다. 다음은 ZNG 코드 중 일부입니다. 자식 컴포넌트는 props를 통해 부모 컴포넌트로부터 데이터를 받고, emit을 통해 부모 컴포넌트로 이벤트를 통해 알립니다. props와 emit을 통해 컴포넌트 간 의사소통을 수행하지만, 각 컴포넌트마다 코드를 분리하기 때문에 관리가 편하고 쉽게 재사용할 수 있습니다. 3. 마치며 ZNG의 개발 방향성과 이와 관련해 Vue.js의 Component 특징을 정리해봤습니다. Vue Component는 이전부터 알고 있던 개념이지만 직접 개발한 코드와 비교해보니 머릿속에 명확하게 정리되는 느낌이었습니다. 특히 코드를 다시 보면서 개념을 리마인드하는 과정이 좋았습니다. ZNG 개발기는 이제 시작입니다! 앞으로도 계속될 ZNG 개발기에 많은 관심 부탁드리며 ZNG 프로젝트를 성공적으로 수행할 때까지 응원해주세요! <사진 설명: 개발의 신이시여... 지켜봐 주세요!> [출처] https://kr.vuejs.org/ https://ko.wikipedia.org/wiki/Vue.js https://www.instagram.com/waterglasstoon/
2022.08.03
1
2
3