SeanWong17/Future-Style-Periodic-Table

어떤 프로젝트인가요?

핵심 기능

• 01분류별 필터링과 기호, 이름 또는 원자 번호 검색을 지원하는 118개 원소 대화형 주기율표.
• 02전기 음성도와 녹는점 등의 특성에 따라 원소를 색으로 표시하는 히트맵 모드.
• 03회전할 수 있고 확대·축소가 가능한 전체 화면으로 볼 수 있는 간소화된 3D 보어 원자 모형.
• 04전자 배치, 동위원소, 흔한 산화 상태를 보여 주는 상세 카드.
• 05중국어와 영어 간 전환을 지원하는 인터페이스와 데스크톱 및 모바일용 반응형 레이아웃.

활용 사례

• 일반 화학을 가르치거나 학생에게 주기율표를 소개할 때 활용.
• 히트맵으로 원소 특성을 시각적으로 비교.
• CSS 3D 변환과 Vite 기반 TypeScript를 살펴볼 수 있는 참고 프로젝트.
• GitHub Pages 또는 Docker를 통해 직접 주기율표 참고 사이트를 호스팅.

빠른 시작

1. 1

   리포지토리를 클론합니다

   git clone https://github.com/SeanWong17/Future-Style-Periodic-Table.git
2. 2

   프로젝트 폴더로 이동합니다

   cd Future-Style-Periodic-Table
3. 3

   종속성을 설치합니다

   npm install
4. 4

   개발 서버를 시작한 다음 http://localhost:5173/ 를 엽니다

   npm run dev

사용 전 알아둘 점

• !3D 원자 모델은 교육을 위해 단순화한 보어 모형 시각화이며, 실제 전자 구름 분포를 나타내지는 않습니다.

포함된 컬렉션

토픽

자주 묻는 질문

Future-Style-Periodic-Table은(는) 무엇인가요?

TypeScript와 Vite로 만든 사이버펑크 스타일의 대화형 주기율표로, 118개 원소와 3D 오비탈 모델, 히트맵, 이중 언어 UI를 제공합니다. Future Style Periodic Table은 118개 화학 원소를 어두운 사이버펑크풍 디자인과 네온 색상의 원소 분류 강조, 글래스모피즘 패널로 보여 주는 브라우저 기반 대화형 주기율표입니다. 각 원소를 선택하면 원자 번호, 원자량, 전자 배치, 동위원소, 흔한 산화 상태를 담은 상세 정보를 확인할 수 있습니다.

Future-Style-Periodic-Table은(는) 무료로 사용할 수 있나요? 라이선스는 무엇인가요?

Future-Style-Periodic-Table은(는) MIT 라이선스의 오픈소스입니다. 상업용 제품에 사용하기 전에 라이선스 조건을 확인하세요.

Future-Style-Periodic-Table은(는) 아직 유지보수되고 있나요?

활발히 유지보수 중. Future-Style-Periodic-Table의 마지막 커밋은 2026년 10월 29일입니다.

Future-Style-Periodic-Table은(는) 어디에 사용할 수 있나요?

일반 화학을 가르치거나 학생에게 주기율표를 소개할 때 활용. 히트맵으로 원소 특성을 시각적으로 비교. CSS 3D 변환과 Vite 기반 TypeScript를 살펴볼 수 있는 참고 프로젝트. GitHub Pages 또는 Docker를 통해 직접 주기율표 참고 사이트를 호스팅.

Future-Style-Periodic-Table는 어떻게 설치하나요?

리포지토리를 클론합니다: git clone https://github.com/SeanWong17/Future-Style-Periodic-Table.git 프로젝트 폴더로 이동합니다: cd Future-Style-Periodic-Table 종속성을 설치합니다: npm install 개발 서버를 시작한 다음 http://localhost:5173/ 를 엽니다: npm run dev

Future-Style-Periodic-Table은(는) 어디서 받을 수 있나요?

소스 코드와 설치 방법은 GitHub에 있습니다: https://github.com/SeanWong17/Future-Style-Periodic-Table