Skip to content

zefa42/stock-auto-trade-Frontend

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

59 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Stock Auto Trade - 프론트엔드 상세 문서

image image

📎 기술 스택 상세

Vue 3

  • Vue 3: Composition API 중심 개발
  • TypeScript: 타입 안정성
  • Vite: 최적화된 프로덕션 빌드

상태 관리

  • Pinia: 상태 관리, TypeScript 지원
  • Axios: HTTP 클라이언트, 인터셉터

UI

  • TailwindCSS: Utility-First CSS
  • 반응형 디자인: 모바일/데스크톱 대응

✏️ 프로젝트 구조

src/
├── main.ts                          # 애플리케이션 진입점
├── App.vue                          # 루트 컴포넌트
│
├── router/index.ts                  # Vue Router 설정, Navigation Guards
├── stores/auth.ts                   # Pinia 인증 스토어
│
├── api/                             # API 클라이언트 모듈
│   ├── http.ts                      # Axios 인스턴스 (인터셉터)
│   ├── auth.ts                      # 인증 API
│   ├── symbol.ts                    # 종목 API
│   ├── watchlist.ts                 # 관심종목 API
│   └── market.ts                    # 시장 데이터 API
│
├── views/                           # 페이지 컴포넌트
│   ├── LoginView.vue                # 로그인 페이지
│   ├── SignupView.vue               # 회원가입 페이지
│   ├── WatchlistEditor.vue          # 관심종목 관리
│   ├── SymbolDetail.vue             # 종목 상세 (차트 포함)
│   ├── DomesticRankingView.vue      # 시가총액 순위
│   └── AboutView.vue                # 소개 페이지 (Deprecated)
│
├── pages/Dashboard.vue              # 관리자 대시보드
│
├── components/                      # 재사용 컴포넌트
│   ├── AppNavbar.vue                # 네비게이션 바
│   ├── WatchList.vue                # 관심종목 목록
│   ├── SymbolList.vue               # 종목 검색 목록
│   ├── SymbolPriceChart.vue         # 가격 차트
│   ├── QuotesTable.vue              # 시세 테이블
│   ├── AutoRefreshToggle.vue        # 자동 새로고침 토글 (Deprecated)
│   ├── AdminManualRefresh.vue       # 관리자 수동 갱신
│   └── LimitInput.vue               # Limit 입력 (Deprecated)
│
├── composables/useToast.ts          
├── types/                           # TypeScript 타입 정의
├── assets/                          # CSS, 이미지
└── lib/                             # 공통 라이브러리 설정

🧩 라우트 정의

  • /: 관심종목으로 리다이렉트
  • /login: 로그인 페이지
  • /signup: 회원가입 페이지
  • /watchlist: 관심종목 관리 (인증 필요)
  • /markets/domestic/ranking: 국내주식 시가총액 순위 (인증 필요)
  • /admin: 관리자 대시보드 (ADMIN 권한 필요)
  • /id/:symbolId/detail: 종목 상세 (인증 필요)

About

주식 프론트엔드

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors