pugnet

Spring boot + Vue.js 환경세팅(1) 본문

Programming/ToyProject

Spring boot + Vue.js 환경세팅(1)

diverJenny 2023. 7. 1. 21:48

인턴 기간 중에 게시판 개발을 2차 과제로 받았다.

Vue는 처음 사용해 보는데, 환경 세팅부터 개발 과정까지 기록을 해두려고 포스팅을 작성한다.


 

개발환경

IDE : IntelliJ

OS : Mac OS

Frontend : Vue.js 3

Backnd : Spring boot(2.2.2) / Maven(3.6.3)

JAVA : JAVA8(openJDK1.8)

Node.js : 16.19.1(npm : 8.19.3)

Database : MariaDB


JAVA 설치

jdk를 brew로 다운받아 보려고 했으나 로제타를 설치하라고해서 패스.

oracle 홈페이지에서 회원 가입 후 다운받았다.

https://www.oracle.com/kr/java/technologies/downloads/#java8-mac

 

Download the Latest Java LTS Free

Subscribe to Java SE and get the most comprehensive Java support available, with 24/7 global access to the experts.

www.oracle.com

다운받은 파일을 클릭하면 쉽게 설치할 수 있다.


vue.js 설치

vue.js는 javascript의 라이브러리 중 하나로 node.js 설치가 필요하다.

https://nodejs.org/ko/download 여기서 해당하는 OS를 클릭하여 설치하면 되지만, 나는 특정 버전을 설치해야했다.

 

다운로드 | Node.js

Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

nodejs.org

 

https://nodejs.org/dist/v16.19.1/ 여기에서 .pkg파일을 다운받았다.

다운받은 파일을 실행시켜서 설치하면 완료!

 

node.js 설치가 완료되면 아래 명령어로 버전을 확인해준다.

node -v

 

그 다음 npm으로 vue cli를 설치하기 위해서 npm 버전을 확인해준다.

(보통 node.js를 설치하면 npm은 자동으로 설치가 된다.)

npm -v

 

vue CLI 설치 명령어를 입력해 설치하고, 버전을 확인해 준다.

EACCES: permission denied, 에러가 발생하여 sudo 권한으로 명령을 실행해줬다.

# vue CLI 설치
sudo npm i -g @vue/cli

# vue CLI버전 확인
vue -V

 

비밀번호를 입력하면 설치가 된다.

 

vue 설치 완료!

'Programming > ToyProject' 카테고리의 다른 글

도서관 프로그램 만들기 3차  (0) 2020.10.20