연혁을 개발 역량 중심으로 정리하고 내용을 HTML로 분리

- 연도별 제목을 프로젝트와 개발 역량 중심으로 변경
- 모두의약국, BISPET, BEMS 등 서비스의 대상과 기능을 설명해 이해도 개선
- 반복되는 분류명, 강조 문구와 기술 태그를 제거하고 제목과 설명으로 간소화
- 설명 안의 핵심 기술과 서비스명을 강조하고 별도 연혁 스타일 추가
- 연혁 내용을 두 HTML 페이지로 옮기고 공통 스크립트는 탭 전환과 키보드 이동만 담당
- 변경된 스크립트와 연혁 스타일에 버전 URL을 적용하고 README에 편집 방법 기록

검증: JavaScript 문법 및 변경 공백 검사 통과
This commit is contained in:
2026-10-07 11:35:04 +09:00
parent 7b4badf5a4
commit 7748eb2973
5 changed files with 118 additions and 23 deletions

View File

@@ -18,13 +18,14 @@
<link rel="stylesheet" href="styles.css">
<link rel="stylesheet" href="portfolio.css?v=780175b64ad9">
<link rel="stylesheet" href="company.css">
<script src="script.js?v=20261006-contact-email" defer></script>
<script src="script.js?v=55c672584ac0" defer></script>
<script src="portfolio.js" defer></script>
<link rel="stylesheet" href="map-dialog.css">
<script src="map-dialog.js" defer></script>
<link rel="stylesheet" href="image-viewer.css">
<script src="image-viewer.js" defer></script>
<link rel="stylesheet" href="icons.css">
<link rel="stylesheet" href="journey.css?v=4a370cc28a98">
<link rel="stylesheet" href="contact-email.css">
<script src="contact-email.js" defer></script>
</head>
@@ -318,7 +319,55 @@
</div>
</section>
<section id="journey" class="journey section" aria-labelledby="journey-title"><div class="wrap"><div class="section-top reveal"><p class="section-label"><span>05 /</span> OUR JOURNEY</p><span class="side-note">A CONTINUOUS JOURNEY OF INNOVATION</span></div><div class="journey-heading reveal"><h2 id="journey-title">새로운 길은,<br>계속됩니다.</h2><p>첫 서버에서 글로벌 모빌리티까지.<br>기술이 바뀌어도, 더 나은 답을 찾는 우리의 태도는 같습니다.</p></div><div class="timeline-tabs reveal" role="tablist" aria-label="트론트 주요 연혁"><button id="year-2008" role="tab" aria-selected="false" aria-controls="timeline-panel" tabindex="-1" data-year="2008">2008<span>THE BEGINNING</span></button><button id="year-2012" role="tab" aria-selected="false" aria-controls="timeline-panel" tabindex="-1" data-year="2012">2012<span>NEW CONNECTIONS</span></button><button id="year-2018" role="tab" aria-selected="false" aria-controls="timeline-panel" tabindex="-1" data-year="2018">2018<span>MOVING FORWARD</span></button><button id="year-2022" role="tab" aria-selected="false" aria-controls="timeline-panel" tabindex="-1" data-year="2022">2022<span>EVERYDAY IMPACT</span></button><button id="year-2025" role="tab" aria-selected="true" aria-controls="timeline-panel" tabindex="0" data-year="2025">2025<span>WHAT'S NEXT</span></button></div><div id="timeline-panel" class="timeline-panel reveal" role="tabpanel" aria-labelledby="year-2025" tabindex="0"><span class="timeline-year" aria-hidden="true">2025</span><div class="timeline-detail"><p class="eyebrow">WHAT'S NEXT</p><h3>더 넓은 연결, 다음의 가능성</h3><p class="timeline-description">블록체인 기반 기부 플랫폼 GivOn 관리자 개발과 소규모 기관차 관제 프로그램 개발로 기술의 쓰임을 넓혀갑니다.</p><div class="tags"><span>Web3</span><span>관제 시스템</span><span>디지털 플랫폼</span></div></div></div></div></section>
<section id="journey" class="journey section" aria-labelledby="journey-title">
<div class="wrap">
<div class="section-top reveal"><p class="section-label"><span>05 /</span> OUR JOURNEY</p><span class="side-note">TECHNOLOGY & EXPERIENCE</span></div>
<div class="journey-heading reveal"><h2 id="journey-title">프로젝트로 쌓아온<br>기술과 경험.</h2><p>서버·업무 시스템부터 내비게이션 HMI,<br>모바일·웹 플랫폼과 관제까지.</p></div>
<div class="timeline-tabs reveal" role="tablist" aria-label="트론트 연도별 개발 역량">
<button id="year-2008" role="tab" aria-selected="false" aria-controls="timeline-panel-2008" tabindex="-1" data-year="2008">2008<span>서버·업무 시스템</span></button>
<button id="year-2012" role="tab" aria-selected="false" aria-controls="timeline-panel-2012" tabindex="-1" data-year="2012">2012<span>사이니지·자산 관리</span></button>
<button id="year-2018" role="tab" aria-selected="false" aria-controls="timeline-panel-2018" tabindex="-1" data-year="2018">2018<span>내비게이션 HMI</span></button>
<button id="year-2022" role="tab" aria-selected="false" aria-controls="timeline-panel-2022" tabindex="-1" data-year="2022">2022<span>앱·웹·통합 관제</span></button>
<button id="year-2025" role="tab" aria-selected="true" aria-controls="timeline-panel-2025" tabindex="0" data-year="2025">2025<span>블록체인·관제</span></button>
</div>
<!-- 연도별 제목과 설명을 아래 HTML에서 수정합니다. -->
<div id="timeline-panel-2008" class="timeline-panel" role="tabpanel" aria-labelledby="year-2008" tabindex="0" hidden>
<span class="timeline-year" aria-hidden="true">2008</span>
<div class="timeline-detail">
<h3>서버와 업무 시스템 개발의 시작</h3>
<p class="timeline-description">2008년 12월 1일 설립 이후, 도메인 연결을 위한 DDNS 서버와 기업의 협업을 지원하는 그룹웨어, 원격강의 지원 시스템(LMS)을 개발했습니다. <strong>차량용 미들웨어</strong> 개발에도 참여하며 서버와 차량 소프트웨어 분야의 경험을 쌓았습니다.</p>
</div>
</div>
<div id="timeline-panel-2012" class="timeline-panel" role="tabpanel" aria-labelledby="year-2012" tabindex="0" hidden>
<span class="timeline-year" aria-hidden="true">2012</span>
<div class="timeline-detail">
<h3>영상 안내부터 자산 관리까지</h3>
<p class="timeline-description">건물 내 여러 화면에 콘텐츠를 배포하는 <strong>디지털 사이니지</strong>와 <strong>NFC·RFID 기반 자산 관리</strong> 솔루션을 개발했습니다. 청라 U-CITY 환경 서비스에도 참여하며 현장의 정보를 연결하는 시스템을 구현했습니다.</p>
</div>
</div>
<div id="timeline-panel-2018" class="timeline-panel" role="tabpanel" aria-labelledby="year-2018" tabindex="0" hidden>
<span class="timeline-year" aria-hidden="true">2018</span>
<div class="timeline-detail">
<h3>현대오토에버 국내외 내비게이션 HMI 개발</h3>
<p class="timeline-description">운전자와 차량 시스템을 연결하는 내비게이션 화면과 인터페이스를 개발했습니다. <strong>C++·Qt 기반 GUI</strong> 구현을 통해 국내외 시장을 위한 차량용 소프트웨어 개발에 참여했습니다.</p>
</div>
</div>
<div id="timeline-panel-2022" class="timeline-panel" role="tabpanel" aria-labelledby="year-2022" tabindex="0" hidden>
<span class="timeline-year" aria-hidden="true">2022</span>
<div class="timeline-detail">
<h3>커뮤니티 플랫폼과 건물 에너지 관제 개발</h3>
<p class="timeline-description">약사의 구인·구직과 약국 매물, 약 정보를 나누는 <strong>모두의약국</strong>의 모바일 앱·웹·백엔드를 개발했습니다. 반려동물의 일상과 산책 활동을 기록하는 SNS 앱 <strong>BISPET</strong>, 건물의 온·습도와 공조기 가동 정보, 사용 전력을 관리하는 <strong>빌딩 에너지 관리 시스템(BEMS)</strong>도 구현했습니다.</p>
</div>
</div>
<div id="timeline-panel-2025" class="timeline-panel" role="tabpanel" aria-labelledby="year-2025" tabindex="0">
<span class="timeline-year" aria-hidden="true">2025</span>
<div class="timeline-detail">
<h3>기부 플랫폼과 기관차 관제 개발</h3>
<p class="timeline-description">블록체인 기반 기부 플랫폼 <strong>GivOn</strong>의 관리자 시스템을 개발했습니다. 소규모 기관차 관제 프로그램 개발에도 참여하며 플랫폼 운영과 산업 현장에 필요한 소프트웨어를 구현했습니다.</p>
</div>
</div>
</div>
</section>
<section id="contact" class="contact contact-email-section section" aria-labelledby="contact-title">
<div class="wrap">