우주
커뮤니티
AstroVerse
ASTROVERSE
목차
ASTROVERSE
1
2
프로젝트 선전 배경
3
4
5
화면 구성
개발 환경
시연
데이터베이스 구조
개발 환경
ASTROVERSE
DB 구조 ERD
ASTROVERSE
<비밀번호 암호화>
BCryptPasswordEncoder를 사용하여 비밀번호를 복호화가 불가능한 단방향 해시값으로 변환해 DB에 안전하게 저장
<OAuth 연동>
구글과 네이버의 로그인 정보(이메일 주소, 별명)를 활용하여, 별도의 복잡한 회원가입 절차 없이도 서비스에 로그인할 수 있도록 구현
<JWT 발급>
로그인 성공 시 JWT(Access Token)를 사용하여, 서버가 별도의 세션 저장소 없이도 모든 페이지에서 유저 정보를 즉시 식별
<Refresh Token 교체>
로그인을 새로 할 때마다 기존의 Refresh Token을 삭제하고 새로운 토큰으로 교체 발급하여, 만약 이전 토큰이 탈취되더라도 해커가 사용할 수 없도록 보안 강화
<Role 기반 접근 제어>
URL 패턴에 따라 관리자(Admin), 프리미엄(Premium), 일반(User) 회원의 접근 권한을
철저히 분리하여, 비인가 사용자의 중요 데이터 접근을 원천 차단
로그인 화면
<cloud 연동>
게시글과 프로필 이미지를 AWS S3 호환 API를 지원하는 Cloudflare R2를 연동하여 올릴 수 있게 하였고 DB에 파일 키를 남겨 서비스 확장에 유연한 스토리지 환경을 구축
로그인 화면
화면구성
메인화면
ASTROVERSE
메인화면
THREE.JS 라이브러리
태양계 행성들을 3D로 렌더링하고 �이 행성들이 공전 ,자전하는 모습을 구현
PAGE 03
YOUR COMPANY
화면구성
메인화면
ASTROVERSE
천문학뉴스
천문학뉴스
사용 기술
1. 언어 서비스 기업의 82%
2. 기계 번역 정확도 89%
3. 별자리 번역 가능
4. AI 뉴스 요약 기능
ASTROVERSE
화면구성
메인화면
ASTROVERSE
천문학뉴스
관측정보
관측정보
ASTROVERSE
THREE.JS 라이브러리
1. 3D 지구·우주 환경 위에 관측을 실시간 렌더링
2. 2D 지도에서는 최적 관측지 & 길찾기 플랫폼
관측정보
사용 기술
1. 3D 지구 렌더링 구현 (실시간 조명 + 그림자)
2. 전 세계 관측지 100+ 개 포인트 시각화
3. 실시간 기상 데이터 연동 (온도·습도·달 위상)
ASTROVERSE
globe.gl api
관측정보
사용 기술
1. 최적 관측지 자동 추천 (정확도 95%)
2. 대중교통/도보/차량 길찾기 지원
3. 실시간 낮/밤 시각화
4. 전세계 100+ 관측지 자동 분석
ASTROVERSE
Google Maps JavaScript API
관측정보
ASTROVERSE
사용 기술
1. 최적 관측지 자동 추천 (정확도 95%)
2. 대중교통/도보/차량 길찾기 지원
3. 실시간 낮/밤 시각화
4. 전세계 100+ 관측지 자동 분석
Google Maps JavaScript API
"길찾기 버튼 클릭"
ASTROGRAM
화면구성
ASTROVERSE
AstroGram
ASTROVERSE
사용 기술
1. 천체 사진 EXIF 자동 분석 · 관측 로그 자동 생성
2. 좋아요·댓글·팔로우 기반 천체 사진 SNS 커뮤니티
3. 안전한 커뮤니티 운영을 위한 신고·관리 기능 내장
4. 개인 관측 기록 자동 저장 & 무한 스크롤 피드 제공
AstroGram
ASTROVERSE
사용 기술
1. 천체 사진 EXIF 자동 분석 · 관측 로그 자동 생성
2. 좋아요·댓글·팔로우 기반 천체 사진 SNS 커뮤니티
3. 안전한 커뮤니티 운영을 위한 신고·관리 기능 내장
4. 개인 관측 기록 자동 저장 & 무한 스크롤 피드 제공
AstroGram
ASTROVERSE
사용 기술
1. 천체 사진 EXIF 자동 분석 · 관측 로그 자동 생성
2. 좋아요·댓글·팔로우 기반 천체 사진 SNS 커뮤니티
3. 안전한 커뮤니티 운영을 위한 신고·관리 기능 내장
4. 개인 관측 기록 자동 저장 & 무한 스크롤 피드 제공
ASTROGRAM
별자리 운세
화면구성
ASTROVERSE
별자리 운세
YOUR COMPANY
별자리 궁합
PAGE 07
자신과 상대방의 생년월일을 통해
별자리와 궁합 점수와 궁합 내용들을
볼 수 있다
ASTROVERSE
오늘의 운세
닌자 API - HOROSCOPE API
자신의 생년월일에 맞게 12개의 별자리들의 운세를 매일 새롭게 볼 수 있다.
DEEPL API
API에서 지원하는 운세는 영어로만 제공되기에 DeepL API를 사용하여 한글로 지원함으로써
사용자 편의성을 제공
PAGE 07
ASTROVERSE
ASTROGRAM
별자리 운세
우주상점
화면구성
ASTROVERSE
우주상점
YOUR COMPANY
PAGE 07
장바구니& 수량 변경
& 삭제 & 구매
우주상점
주문한 상품들의
리스트가 나열됨
PAGE 07
우주상점
신규 회원이
상품 구매 즉시
우주 상점_관리자
우주 상점 페이지에 관리자 화면 버튼이 우측 상단에 표시되며
관리자는 여기서 상품들을 관리할 수 있다.
ROLE_ADMIN 계정
일반 계정
우주 비행 게임
화면구성
ASTROVERSE
우주 비행 게임
ASTROVERSE
06
KEYPOINT 01
우주 비행 게임
게임 설명
THREE.JS
ASRTOVERSE
PAGE 05
우주 비행 게임
화면구성
ASTROVERSE
밤하늘 갤러리
밤하늘 갤러리
ASTROVERSE
사용 기술
1. 최적 관측지 자동 추천 (정확도 95%)
2. 대중교통/도보/차량 길찾기 지원
3. 실시간 낮/밤 시각화
4. 전세계 100+ 관측지 자동 분석
우주비행 게임
마이페이지
화면구성
ASTROVERSE
밤하늘 갤러리
마이페이지
ASTROVERSE
마이페이지 설명
1. 이메일, 멤버십 등급, 생년월일 확인
2. 프로필 수정 가능
3. 닉네임, 프로필 사진, 자기 소개, 생년월일
4. 회원 탈퇴 가능
Q & A