WhiteJotter

---

이것은 주로 vue.js + springboot technologies를 사용하여 개발 된 간단한 프론트 엔드 및 백엔드 분리 프로젝트입니다.

소개 운동으로 사용되는 것 외에도 프로젝트가 웹 사이트 구축 프로세스를 단순화하는 데 도움이되는 일부 일반적인 웹 프로젝트의 발판으로 사용될 수 있기를 바랍니다. 0에서 시작하여 시간이 지남에 따라 점차 개선되기 때문에 흰색 Jotter라고합니다.

Frontend Repo ： https : //github.com/realdonald1994/whitejotter_vue

백엔드 리포 : https : //github.com/realdonald1994/whitejotter

White Jotter에 가입하는 데 오신 것을 환영합니다!

전반적인 디스플레이

1. 집

이 프로젝트 개발을위한 주요 참조 자료, 최근 업데이트 및 슬로건을 포함한 디스플레이 페이지로

2. 도서관

책 및 영화 정보 표시 기능을 제공하십시오

3. Jotter

메모 제공, 블로그 게시물 표시 기능

4. 백 그라운드 관리

대시 보드, 컨텐츠 관리, 사용자 및 권한 관리 등을 포함하여

5. 나에 대해

개인 소개 및 관련 링크

건축학

• 애플리케이션

• 기술

기술 스택

1. 프론트 엔드 기술 스택

1. vue.js
2. 요소
3.axios
4. vuex

2. 백엔드 기술 스택

1. 스프링 부츠
2. 스프링 데이터 + JPA
3.mysql
4. 시로

3. 데이터베이스

1.mysql

4. 서버

1.centos7
2.nginx
3. fastdfs

5. 테스트

1. 주니트
2. 제스트

전개

1. 현지에 대한 클론 프로젝트

프론트 엔드 :

git clone https://github.com/realdonald1994/WhiteJotter_Vue

백엔드 :

git clone https://github.com/realdonald1994/WhiteJotter

2. MySQL에서 데이터베이스 white_jotter 만들고 프로젝트를 실행하면 데이터가 자동으로 주입됩니다.

Redis 포트는 6379 (기본 포트)이며 암호는 비어 있습니다.

3. 데이터베이스는 백엔드 프로젝트의 src main resources 디렉토리의 application.properties 파일에 구성되어 있으며 MySQL 버전은 8.0.15입니다.

4. Intellij 아이디어의 백엔드 프로젝트를 시작하십시오. 프로젝트가 성공적으로 실행되도록하려면 pom.xml 마우스 오른쪽 버튼으로 클릭하고 Maven-> Reimport를 선택하고 프로젝트를 다시 시작할 수 있습니다.

이 시점에서 서버가 성공적으로 시작되었으며 동시에 프론트 엔드 프로젝트를 실행하고 http: // localhost: 8080 방문하십시오. 로그인 페이지를 입력 할 수 있고 기본 계정은 admin 이며 암호는 123 입니다.

2 차 개발을 원한다면 다섯 번째와 6 단계를 계속보십시오.

5. 프론트 엔드 프로젝트의 루트 디렉토리를 인증하고 명령 줄에서 순서대로 다음 명령을 입력하십시오.

# Install dependencies
  npm install

# Start the project at localhost: 8080
  npm run dev

포트 전달이 wj-front 프로젝트에서 데이터를 SpringBoot로 전달하기 위해 구성되었으므로 프로젝트가 시작된 후 브라우저에 http: // localhost: 8080 입력하여 프론트 엔드 프로젝트에 액세스하기 위해 모든 요청을 SpringBoot로 전달합니다. 포트 전달을 통해 (현재 스프링 부츠 프로젝트를 닫지 않아야한다는 점).

6. 결국, WebStorm 및 기타 도구를 사용하여 wj-front 프로젝트를 열고 개발을 계속할 수 있습니다. 개발이 완료되면 프로젝트가 온라인으로 진행될 때 여전히 wj-front 디렉토리를 입력 한 다음 다음 명령을 실행합니다.

 npm run build

명령이 성공적으로 실행되면 dist 폴더가 WJ-Front 디렉토리에서 생성되고 폴더의 두 파일 assets 및 index.html 은 Nginx에 복사 할 수 있습니다. 그런 다음 백엔드 루트 디렉토리를 입력하고 명령 줄을 실행할 수 있습니다.

 mvn clean install

마지막으로, 새로 생성 된 target 디렉토리에 명령 줄 java -jar xxx.jar 입력하십시오. 백엔드 서버를 시작하십시오.

nginx 파일 아래에 명령 줄을 입력하십시오. start nginx . 프론트 엔드 서버를 시작하십시오.

업데이트

2020

08-20 Redis를 추가하십시오
06-09 VUE 테스트 UTILS 및 JEST로 단위 테스트 추가
06-04 GZIP를 사용하여 웹 페이지로드를 천천히 해결하십시오
06-02 프로젝트는 클라우드 서버에 배포되었으며 웹 사이트가 처음으로 게시 되었습니까 ?
05-29 별도의 프론트 엔드 및 백엔드 프로젝트
04-20 오픈 소스 마크 다운 편집기를 사용하여 기사 디스플레이 및 관리 모듈을 달성하십시오.

...