홈페이지>프로그래밍 관련>기타 소스코드
다운로드

적합 트랙

Fit-Track은 Mern (Mongodb, Express, React+Vite, Node.js) 스택을 사용하여 구축 된 운동 로그 추적 응용 프로그램입니다. 이 문서는이 프로젝트에 기여하는 과정을 안내합니다.

목차

  • 설치
    • 프론트 엔드
    • 백엔드
  • 기여
    • 저장소를 포킹합니다
    • 저장소 복제
    • 지점 만들기
    • 변경
    • 변화를 커밋합니다
    • 변화를 추진합니다
    • 풀 요청 생성
  • 특허

설치

프론트 엔드

  1. frontend 디렉토리로 이동하십시오. 
     cd frontend
  2. 종속성 설치 : 
    npm install
  3. 개발 서버 시작 : 
    npm run dev

백엔드

  1. backend 디렉토리로 이동하십시오. 

     cd backend

  2. 종속성 설치 : 

    npm install

  3. MongoDB Atlas 설정 :

    1. Mongodb Atlas로 가서 아직 계정이없는 경우 계정을 만듭니다.
    2. 프롬프트에 따라 새 클러스터를 만듭니다. 몽고 아틀라스 클러스터 제작 자습서
    3. 클러스터가 생성되면 데이터베이스 액세스 섹션으로 이동하여 필요한 권한을 가진 사용자를 만듭니다.
    4. 네트워크 액세스 로 이동하여 IP 주소를 허용하거나 (또는 ​​로컬 테스트하는 경우 어디서나 액세스 할 수 있습니다).
    5. 클러스터 섹션에서 Connect를 클릭 한 다음 응용 프로그램 연결을 선택하십시오. 다음과 같이 보이는 연결 문자열이 표시됩니다. 
       mongodb+srv://<username>:<password>@cluster0.mongodb.net/?retryWrites=true&w=majority
    6. 실제 MongoDB Atlas 사용자 이름 및 비밀번호로 <username> 및 <password> 교체하십시오. 전체 연결 문자열을 복사하십시오.

  4. mongodb atlas_uri를 .env 파일에 추가하십시오.

    • backend 디렉토리에서 .env 파일을 만듭니다.
    • 다음 줄을 .env 파일에 추가하여 MongoDB Atlas에서 복사 한 연결 문자열로 <your-mongodb-connection-string> connection-string>을 대체하십시오. 
      ATLAS_URI=mongodb+srv:// < username > : < password > @cluster0.mongodb.net/fit-track ? retryWrites=true & w=majority

  5. 서버 시작 : 

    node server.js

    또는 Backend의 라이브 업데이트를 위해 nodemon 설치된 경우 : 

    nodemon server.js

프로젝트 구조

프론트 엔드

frontend 디렉토리에는 RECT 응용 프로그램이 포함되어 있습니다.

  • public : 응용 프로그램의 공개 자산이 포함되어 있습니다.
  • src : 응용 프로그램의 소스 코드가 포함되어 있습니다.
    • components : 재사용 가능한 UI 구성 요소.
      • Home : 홈페이지 구성 요소
        • Exercise : 연습 행 요소를 표시하여 지속 시간, 상태, 일 검사
        • ExercisesList : 사용자가 수행 한 연습 목록을 표시하려면
        • HeatMap : ApexCharts.js에 의해 구동되는 사용자 운동 루틴을 표시합니다.
        • Quotes : API 닌자에서 인용문을 무작위로 표시하여 사용자에게 동기를 부여합니다.
        • TotalDays : 사용자가 행사 한 일수를 표시하려면
        • UserExperience : Gamified Experience의 사용자 경험을 표시하려면
        • UserRoutine : 행진처럼 사용자의 주간 루틴을 표시하려면
      • HomePage : 홈페이지 표시 및 렌더링
      • Login : 로그인 페이지 표시
      • SignUp : 가입 및 사용자 페이지 편집
      • navbar : NAVBAR 구성 요소
  • App.jsx : 경로를 설정하는 기본 구성 요소입니다.
  • main.jsx : React 응용 프로그램의 진입 점.

백엔드

backend 디렉토리에는 node.js 서버 및 Express Application이 포함되어 있습니다.

  • models : 몽구스 스키마를 포함합니다.
    • exercise.model : 운동 스키마
    • user.model : 사용자 스키마
  • routes : API 경로가 포함되어 있습니다.
    • exercises : 연습용 API 경로
    • user : 사용자를위한 백엔드 API 경로
  • server.js : 서버 응용 프로그램의 진입 점.

기여

우리는 기여를 환영합니다! Fit-Track에 기여하려면 다음을 수행하십시오.

저장소를 포킹합니다

  1. GitHub의 저장소 페이지 오른쪽 상단에있는 "Fork"버튼을 클릭하여 저장소를 포크하십시오. 저장소를 포킹합니다

저장소 복제

  1. 포크 리포지토리를 로컬 컴퓨터로 복제하십시오. 
    git clone https://github.com/your-username/Fit-Track.git
  2. 프로젝트 디렉토리로 이동하십시오. 
     cd Fit-Track

지점 만들기

  1. 기능 또는 버그 수정에 대한 새 지점을 만듭니다 (작업중인 문제에 따라 분기 생성) : 
    git switch -c your-branch-name

변경

  1. 코드베이스를 변경하십시오. 선호하는 코드 편집기를 사용하여 파일을 편집 할 수 있습니다.

변화를 커밋합니다

  1. 스테이징 영역에 변경 사항을 추가하십시오. 
    git add .
  2. 설명적인 메시지로 변경 사항을 커밋하십시오. 
    git commit -m " Description of your changes "

변화를 추진합니다

  1. 포크 리포지토리에 변경 사항을 밀어 넣으십시오. 
    git push origin your-branch-name

풀 요청 생성

  1. 포크 리포지토리에서 메인 저장소로의 풀 요청을 만듭니다. 기본 저장소의 "PULL 요청"탭으로 이동하여 "새 풀 요청"을 클릭하십시오. 지침에 따라 풀 요청을 작성하십시오.

이것은 시작에 불과합니다! 나는이 놀라운 커뮤니티와 더 의미있는 기여를하고 협력하기를 기대합니다. 함께 좋은 것을 만들고 최고 트랙을 최선으로 만들어 봅시다! ❤️?

특허

이 프로젝트는 MIT 라이센스에 따라 라이센스가 부여됩니다. 자세한 내용은 라이센스 파일을 참조하십시오.

확장하다
추가 정보
관련 애플리케이션
추천
관련 정보 전체