홍군's 설레는 IT Story

 지난 포스팅에서는 이곳저곳 찾아다니면서 Vue.js를 개발하기 위한 환경설정을 했었다! 그렇다면,,이번엔 프로젝트를 생성하기 위해서 어떻게 해야할지 찾아보면서 또 한번 정리하자!

Vue-CLI를 이용해서 프로젝트 생성하기

     개발환경 

      OS : Mac OS Catalina 10.15.4

      node.js 설치 링크 : https://nodejs.org/ko/download/

    1. homebrew, node.js 설치 

      - 우선, Vue-CLI를 설치하려면 npm이 필요하다.

         npm(Node Package Manager)은 Node.js를 설치하면 자동으로 설치가 되기 때문에 Node.js를 먼저 설치해준다.

      - mac에서는 hombrew로 설치하는게 간편하더라 

      - hombrew 설치 참고 링크 : https://whitepaek.tistory.com/3

     # node 설치 

       => brew install node

     # Node.js 버전 확인
       => node --version
     # npm 버전 확인
       => npm --version

   필자는 확인해보니깐, node.js은 12.16.2이고, npm은 6.14.4을 설치하였다.

   2. Vue-CLI설치하여 로컬서버에서 Vue구동시켜보기  

      # Vue-CLI 설치
        => npm install -g @vue-cli 

          ※ Vue-CLI을 설치중에 위와같은 에러가 발생한다면, 반드시 "sudo" 권한을 주어야한다. 

      # Vue 버전 확인
        => vue --version  

     필자는 버전이 2.9.6 버전이었다 

     이렇게 vue 설치가 마무리됬다. 휴우...

 3. Vue 프로젝트 생성하기 

   # Vue 프로젝트를 만들 경로에 들어간다. 

   => vue create 프로젝트명 

    cd 프로젝트명 으로 이동해서 

    npm run serve를 실행시킨 후 http://localhost:8080/ 확인해 보면 아래와 같은 페이지가 뜨는 것을 통해 확인할 수 있다. 

 회사에서 vue.js를 접할 기회가 생겨 후다닥 스터디를 진행하게 되었다. 요즘 많이 사용한다는 vsCode로 학습을 해볼까 한다.

그동안은 Eclipse환경에서 개발을 하다보니 조금 적응이 안될 수 있지만! 아직 젊기에 도전해볼 수 이싸!! 

그래서 오늘은 vsCode로 vue.js 개발환경을 세팅하는 방법을 정리하려고한다!

  visual studio Code 설치 링크 : https://code.visualstudio.com/

1. Visual Studio Code 한글 적용하기! 

  1.1  처음 에디터를 켜면 영어로 되어 있기 때문에, 우선 한글화를 적용하려고한다. vsCode에서도 패키지 설치가 가능한데,

        Eclipse에서 사용했던 Marketplace에서 플러그인들을 추가해서 사용했던 것처럼 동일한 방식이더라..!

  1.2 "Korean Language Pack for Visual Studio Code"를 검색해서 한국어 패치를 해주자!

  1.3  설치가 다되면 [RestartNow]버튼을 눌러 vsCode를 재실행 시켜준다! 그러면, 한국어 패치가 적용된걸 확인할 수 있다. 

2. Vue.js를 사용하기 위한 Visual Studio Code Plugin Install

  2.1  Vue.js를 효과적으로 사용하기 위해서는 플러그인들을 설치

      - 필자가 지금 설치해본건 아래 세개지만, 이외에도 여러가지가 있기에 출처와 좀 더 좋은 블로그를 찾아서 플러그인을 설치하도록하자! 

        (출처 : https://joshua1988.github.io/web-development/vuejs/boost-productivity/ 

• Prettier - 코드 자동정렬
• vetur - 문법강조 및 자동완성등 기능 제공
• Vue VSCode Snippets - 자동완성기능 제공
• Material Icon Theme - 아이콘 구분기능 제공
• ESLint - JavaScript 코드스타일, 문법기능 제공
• Live Server -  작성한 소스코드의 웹페이지를 바로 확인해볼 수 있는 기능 제공

3. Chrome에서 Extendtion Tool 설치 

   - 크롬웹스토어 에서 확장프로그램 "vue.js devtools"를 추가하자

   - 크롬웹스토어 링크 : https://chrome.google.com/webstore/category/extensions?hl=ko  

필자는 요즘 대기업 프로젝트를 진행 중 인데, 개발 중 VO부분이 너무 많아서 getter와 setter를 간편하게 사용해주는

방법을 알아냈다!!!얏호!! 생각보다 매우 간편해서 놀랬다ㅋㅋ라면끓이는 정도랄까..?ㅎ

1.  이클립스 저장 경로에 "lombok.jar"파일을 저장한다.

2. eclipse.ini 파일을 열어 맨 하단에 추가내용을 입력한다. 

   - 추가내용

      -vmargs
      -javaagent:lombok.jar

3. 간편하게 사용하면 된다:)

   - 준비 : Project에 lombok.jar 파일이 등록되어 있어야 한다.

  example)

     ① Vo 클래스를 선언한다.

     ② 실행방법 : 객체를 선언하고, setter와 getter를 자유자재로 사용할 수 있다!

     ③ 실행결과

안녕하세요!

저는 Si프로젝트에서 Backend-Dev로 있는 직장인입니다! 

최신기술에 많이 늦은 감이 있지만, 요즘 Web 프로젝트를 만들어보면서 개념을 익히고, 습득하는 중인데요!

예전에 공부했었어야 했는데, Mobile(Android)만 한창 공부하다보니.. 허허

아무튼 오늘은 간략하게 공부한 것들을 홍군의 블로그에 올려봤습니다!

1. @Controller와 @RestController의 차이

 - 기존의 MVC @Controller는 View 기술을 사용하지만, @RestController는 객체를 반환할때 객체 데이터는

    바로 JSON/XML 타입의 HTTP 응답을 직접 리턴하게 된다. 

  1.1 @Controller를 사용하여 View와 연결하는 방식.

     - 참조블로그를 확인해주시면 감사하겠습니다..ㅜㅜ

  1.2 @RestController를 사용하여 바로 JSON 타입의 HTTP 응답을 리턴하는 방식 

       Controller(MailController)

         - 저는 현재 DataBase와 연결하는 방식을 JPA로 하고 있어서 Mapping부분은 신경쓰지 말아주세요~ㅎㅎ

           (확인하려고 테스트했던 부분이라..ㅠㅜ)

       브라우저 화면.

1.3 @Controller와 @RestController 실행의 흐름

   1.3.1 @Controller 

       - Client -> Request -> Dispatcher Servlet -> Handler Mapping -> Controller -> View -> Dispatcher Servlet ->

          Response -> Client 

    1.3.2 @RestController

        - Client -> HTTP Request -> Dispatcher Servlet -> Handler Mapping -> 

             RestController(자동 ResponseBody 추가)-> HTTP Response -> Client

2. 참조 블로그 

  -  http://doublesprogramming.tistory.com/105

안녕하세요! 홍군의 포스팅을 남기네요 :) 처음 올리다보니봐쥬세유 

우선, OCJP란?

  - Oracle Certified Java Programmer의 약자로 자바 프로그래밍 언어 활용 능력을 검증하는 자격증입니다.

  - 직접 개발한 선 마이크로시스템즈에서 자바 프로그래밍 언어에 관련된 지식을 표준화된 방식으로 검증해 주는

     시험인데, 선 마이크로시스템즈가 오라클사로 인수되면서 자격증 명칭이 SCJP에서 OCJP로 변경되었습니다.

OCJP 자격증을 따려고 정보를 찾아봤어요! 

 OCJP시험이 상당히 많은 부분이 바뀌어서 OCJP를 취득하고자 하시는 모든 분들께 도움이 되고자, 

                  직접 한국오라클센터에 문의해서 찾아본 정보들을 알려드리려고 글을 올립니다.

OCJP는, 제가 따려고 할 때만해도!

     JAVA SE 6버전인 과목코드 '1Z0-851'의 덤프만 공부해도 충분히 취득할 수 있었습니다. (끄덕끄덕)

문제는 2018년 5월 31일 부로 '1Z0-851'가 만료되어, 이전에 공유되고 있었던 덤프들이 소용이 없어졌다는데 있습니다.

(이전에 OCJP자격증이라고 한다면 과목코드 '1Z0-851' 이었습니다)

버전을 간단하게 소개해 드리자면,

Java SE 6 Programmer Certified Professional : 1Z0-851 (2018년 5월 31일 만료)

Java SE 7 Programmer I : 1Z0-803 (2018년 12월 31일 만료)

Java SE 7 Programmer II : 1Z0-804 (2018년 12월 31일 만료)

Java SE 8 Programmer I : 1Z0-808 (만료 기한 아직 없음)

Java SE 8 Programmer II : 1Z0-809 (만료 기한 아직 없음)

이전에는, 과목코드 '1Z0-851'만 보고도 OCJP를 취득할 수 있었어요!

현재 바뀐 부분은,

'1Z0-803' 혹은 '1Z0-808'를 합격하면 OCAJP(Oracle Certified Associate Java Programmer)를 취득하게 되고,

'1Z0-804' 혹은 '1Z0-809'를 합격하면 OCPJP(Oracle Certified Professional Java Programmer)를 취득하게 됩니다.

그리고, '1Z0-804' 시험을 응시하려면, OCAJP를 취득해야하므로 '1Z0-803'을 합격해야 합니다. '1Z0-803'이 선수 과목이 되는셈이죠. 역시 마찬가지로, '1Z0-809' 시험을 응시하려면, OCAJP를 취득해야하므로 '1Z0-808'을 합격해야 합니다. '1Z0-808'이 선수 과목이 되는셈이죠.

7버전인 '1Z0-803', '1Z0-804' 역시 2018년 12월 31일에 만료되므로, 2019년부터는 응시할 수 없다고 하네요.

8버전은 한국오라클센터에 문의한 결과, 아직 기한이 없다고 합니다.

만료전에 취득할 수 있었던 OCJP는 현재의 OCPJP와 같은 수준으로, OCAJP를 포함하는 자격증입니다.

6버전 만료로 인해 시험을 OCAJP와 OCPJP로 2번 봐야된다는게... 조금 귀찮게 바뀐 부분인 것 같습니다.

(기사자격증인 OCJP의 아래 단계로, 기능사자격증인 OCAJP가 생겼다고 생각하시면 됩니다) 크크

또한, 시험정보가 많이 공유된 6버전 덤프와 달리, 7버전 및 8버전 덤프는 아직 확실하게 공유된게 없습니다.

시험 후기들을 찾아봐도 몇몇 덤프에서 나오는데 많이 나와봐야 30%라고 하니..

저처럼 덤프를 통해 자격증을 취득하시려는 분들은.. 시험후기들이 확실해질때까지 조금 더 기다려야 할 것 같네요.

OCJP 합격기준은 61% 이상이면 되며 시험비용은 약 28만원($275) 했던걸로 기억합니다.

저는 전부 다맞아서 아 덤프를 완전 다 외우긴했는데 기억에 남는건 프로젝트 경험이 자격증보다 많이 남더라구요.

아무튼, 작년생각이나서 포스팅을 해봤습니다!ㅎㅎ

OCJP 준비하시는 모든분들 힘내세요!!!

종종 찾아올께요!~