ExtJS 6 강좌 영상은 링크를 통해 제공됩니다.


    (YOUTUBE 채널 구독해주세요!!)



    ExtJS 실전/응용 두번째 강좌입니다.


    많은 분들께서 서버연동하는 부분까지 요청을 주셔서 진행을 하게 되었습니다.


    저의 경우, Dynamic Web Project 를 이용해서 프로젝트 생성을 하지 않고, 


    Spring Boot를 이용해서 서버연동을 진행하도록 하겠습니다.


    Dynamic Web Project 로 진행을 하게 되면 이클립스의 경우 Building Workspace 


    동작을 하면서 이클립스 자체에서 메모리관련 문제가 발생합니다.


    Validation 설정으로 막을수도 있는 부분이긴 합니다만, 해당 부분은 IDE 설정부분이


    기 때문에 따로 설명드리지 않도록 하겠습니다.


    저희 강좌는 Spring Boot를 이용하여 강의를 연동하도록 하겠습니다.



    물론, 언어 관련문제가 아닌, IDE 툴에 대한 문제점이므로 


    타언어(PHP,ASP,ASP.NET, NodeJS 등...) 를 사용하시는 분들께서는 


    기존 사용하시는 툴을 이용하셔서 강좌를 진행하셔도 될거같습니다.


    프로젝트 생성


    우선 스프링부트 프로젝트를 생성하도록 합니다.


    우클릭 → New → Spring Starter Project




    위와같이 입력 및 선택값 설정 후, Next!


    다음은, 프로젝트 연동에 필요한 라이브러리를 체크 후 Finish 버튼 클릭을 합니다.



    저희 강의는 MySQL(MariaDB)를 이용하여 진행하므로 MySQL을 선택하였지만,


    기타 다른 DB를 사용하고자 하는 분들은 SQL 부분에 다른 DBMS 라이브러리

    체크를 하시면 되겠습니다.


    프로젝트 실행

    완료가 되었다면, 정상적으로 구동되는지 실행해보도록 하겠습니다.


    프로젝트 우클릭 → Run As → Spring Boot App


    바로 서버를 실행하게 된다면 아래와 같은 오류가 발생할 수 있습니다.


    Description:


    Cannot determine embedded database driver class for database type NONE



    이유는 JDBC 설정을 잡아주어야 하는데 설정을 하지 않아서 그렇습니다.


    이부분은 다음강좌에 진행하도록 하고, 

    pom.xml 에서 spring-boot-starter-jdbc 관련 dependency를 막아주고, 

    다시한번 실행해보도록 하겠습니다.


    Started MarketApplication in 3.674 seconds (JVM running for 4.554)


    마지막 로그에 위와같이 Started XXX 관련 로그가 출력이 되었다면 정상적으로 

    WAS가 구동된것입니다.


    그럼 Spring Boot의 기본포트인 8080으로 접속한번 해보도록 합니다.


    Witelabel Error Page 가 출력되었다면, WAS는 정상적으로 구동된 것입니다.


    신경쓰지 말고, 다음으로 넘어가도록 하겠습니다.


    임의로 API 데이터 만들기

    JSON 규격의 임의의 API 를 만들어 보도록 합니다.


    프로젝트내에 controller 디렉토리와 컨트롤러 클래스파일 하나 만들어 봅니다.





    TestController 클래스에 아래와 같이 API 샘플 코드를 작성 후, 


    브라우저에서 호출해보도록 하겠습니다.



    위와같이 코드를 작성하였다면, 한번 API URL 호출을 하여 


    JSON 값이 정상적으로 출력되는지 확인해봅니다.





    위와같이 나왔다면, API를 만들기 위한 기본적인 구성은 완료! 


    다음 강좌에 본격적으로 ExtJS 를 Sencha CMD를 이용해서 프로젝트 생성해보고 방금 생성한 api를 AJAX를 통해서 호출해보도록 하겠습니다 ^^



    Posted by 몽고