카테고리 없음

09.25 최종 프로젝트 & 온보딩 인턴십

saramnim 2023. 9. 25. 16:46
728x90

파란만장 최종 프로젝트가 끝난 후 드디어 인턴십을 왔다..!

(프로젝트 동안의 개발 기록은 추후 업로드 예정)

인턴십은 uvc로 왔다.

아마 제일 지원자가 많았던 것 같다.

 

아무튼 처음 와서는 아무래도 월욜이다 보니 주간회의가 있으셨는지 쭈욱 기다렸다가

점심 사주셔서 점심 먹구

돌아와서 추석 전까지 3일간 뭘해야할지 일러주셨다.

 

그동안 쓴건 React였는데, 앞으로 이 회사에 있는 동안 써야할 건 Vue 3.0이다..!

3일 동안 Vue에 대해 개인 학습 뒤, 추석 지나고 팀플을 진행할 예정이다~

 

따라서 앞으로는 Vue 개발 기록이 주가 될 예정이다.

참고로 현재 공부 예정인 정처기, RN에 대한 이야기도 가끔 올라갈 것 같다~~

암튼 밑부터는 Vue 개발 기록 시작~~

Vue

Vue를 시작하기 위해 Gpt의 힘도 빌려보고 구글링의 힘도 빌려봤다.

React와 유사한 방법으로는 Vue CLI를 써서 처음부터 빌드가 되도록 시작하는 방법과 <script> 태그를 써서 vue를 삽입하는 방법이 있다.

나는 오늘은 Vue CLI를 쓰는 방법을 채택했다.

먼저, Vue CLI로 초기 세팅하는 방법에 대해 알아보자.

 

Vue CLI

npm i -g @vue/cli

먼저, vue cli를 깔아준다.

리액트를 깔아주는 것보다 짧은 시간을 기다려주자.

vue create login-app

다음으로는 vue create ~ 를 사용해 ~ 부분에 원하는 프로젝트의 이름을 입력해주자.

나는 로그인 기능만 예시적으로 만들어 볼 것이라 login-app을 이름으로 했다.

위와 같이 입력하면 preset과 package manager를 선택하도록 뜨는데,

내 경우 vue 3.0을 사용할 것이니 Vue 3, NPM을 선택했다.

마찬가지로 약간의 시간을 기다려주면,

위와 같이 초기 구성이 완료된다.

"dependencies": {
    "core-js": "^3.8.3",
    "vue": "^3.2.13"
  },
  "devDependencies": {
    "@babel/core": "^7.12.16",
    "@babel/eslint-parser": "^7.12.16",
    "@vue/cli-plugin-babel": "~5.0.0",
    "@vue/cli-plugin-eslint": "~5.0.0",
    "@vue/cli-service": "~5.0.0",
    "eslint": "^7.32.0",
    "eslint-plugin-vue": "^8.0.3"
  },

package.json을 확인해보면, 위와 같이 vue와 babel에 관련된 것들이 깔려있는 것을 확인할 수 있다.

 

터미널에 써있는대로

cd login-app
npm run serve

위와 같이 입력해준 뒤, 인터넷 창에 localhost:8080을 입력해주면 

위처럼 Vue 튜토리얼 창이 나온다.

728x90
반응형