Play2.4 로 웹 개발 시작하기 
쉽고, 재밌고, 강력하고, 편리한 최강의 웹 프레임워크 Play2  (scala 언어기반) 을 배워봅시다.

환경

- Windows 10 

- JDK 1.8

- IntelliJ 2016.2.2 

- Scala 2.11

- Play 2.48 


연재 순서 

1. Play2 웹 개발 시작하기 -  설치 및 프로젝트 만들기 

2. Play2 웹 개발 시작하기 -  프로젝트 살펴보기 

3. Play2 웹 개발 시작하기 -  나만의 프로젝트 만들기 

*  2.5 에 대한 한글 자료가 부족한듯 싶습니다. 경험 풍부한 분들의 적극적인 정보 공유가 필요합니다.


3. 나만의 프로젝트 만들기

* 디폴트 프로젝트를 그대로 이용하겠습니다.


2-.1 컨트롤러 작성하기

 기존의 Application 소스를  이렇게 바꿉니다.

package controllers
import play.api.mvc._

object Application extends Controller {

def index = Action {
Ok("Hello world")
}

def hello(name: String) = Action {
Ok(views.html.main(name))
} }

hello 라는 메소드를 추가했습니다. 클라이언트가 http://localhost/hello? n = "john"  이라고 보내면 
인자로 이름을 받아서 main view 로 보내줍니다.


2-2 routes 추가하기 

GET     /hello   controllers.Application.hello(n: String)

 http://localhost/hello? n = "john"  를 hello 라는 메소드와 매핑하기 위한 라우트를 설정합니다.
 굉장히 직관적이며 간단합니다.  n 은 GET 메소드의 인자와 이름이 같아야합니다. 
 (컨트롤러의 인자이름은 달라도 됩니다. 2-1 에서 name 이었군요.) 

2-3. html 변경하기 

 * 기존 index.html 삭제하고 main.html 내용을 아래와 같이 바꿉니다.

@(name: String)
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Hello</title>
</head>
<body>
<h1>Hello <em>@name</em></h1>
</body>
</html>

젤 첫라인에 name 인자를 받습니다. 앞에 골뱅이제외하고는 평범한 Scala방식입니다.
HTML 코드 내부에 @name 으로 사용합니다.


2-4. 실행하면 

def index = Action {Ok("Hello world")} 이 호출되어서 위의  화면이 나오고 


GET /hello controllers.Application.hello(n: String) 라우트에 의해

def hello(name: String) = Action {
Ok(views.html.main(name)) }

이게 호출되어 저 화면이 나옵니다.


3. 나만의 프로젝트에 DB 데이터 가져오기 추가

  * 원하는 db 를 이용해서 테이블을 하나 만들어 놓으세요. 컬럼은 int 형 id , string name 이면 됩니다. 
    저는 postgreSQL 를 이용하였습니다.


  3-1. DB 에 접근하기 위한 디펜던시를 설정해 줍니다. build.sbt 파일을 열어서 아래처럼 넣어줍니다.

     *  anorm 라이브러리에 관해서는 다음을 참고 합니다. Anorm 이란 

libraryDependencies ++= Seq(
jdbc ,
"com.typesafe.play" %% "anorm" % "2.5.0",
cache ,
ws ,
specs2 % Test,

"org.postgresql" % "postgresql" % "9.3-1102-jdbc41")

  3-2. app 에 오른쪽 클릭해서 models 패키지를 만들고 , MyModel 을 scala 클래스로 만들어 줍니다.


    3-2.  MyModel.scala 에 코딩합니다.

case class Thing (
thing_id : Int,
name : String
)

object Thing {
implicit def jsonWrites = Json . writes [ Thing ]
implicit def jsonReads = Json . reads [ Thing ]
}

object MyModel {

def findByID(id : Int): List[Thing] = DB.withConnection {

implicit connection =>
val sql = SQL("select * from tbl_thing_info where thing_id = {id}").on("id" -> id)

sql().map ( row =>

Thing(row[Int]("thing_id"), row[String]("name"))

).toList
}

}

모델클래스 Thing를 만듭니다. VO 라고 하죠?  굉장히 간단합니다.  GET/SET 가 없습니다. 
Thing 모델클래스의 컴패니언 객체를 Json 으로 내보내는데 사용하기 위해서 추가합니다.
MyModel의 findByID 를 통해서 DB 접속을 해서 데이터를 가져옵니다.Anorm 라이브러리를 이용하였으며 타입에 엄격한 모습을 보여줍니다. 그러면서도 매우 단순하죠. (스프링을 생각해보세요 ;;) 참고로 Anorm 은 MyBatis 와 비슷하다면 하이버네이트와 비슷한 Slick 이란것도 있습니다.


 3-3.  Application.conf 에 DB 접근 설정을 해줍니다.

      db.default.url="jdbc:postgresql://localhost/YOURDB"
      db.default.username=postgres
      db.default.password=1234

      db.default.driver=org.postgresql.Driver

PostgreSQL 에 접근하기위한 설정.


4. 나만의 프로젝트에 Json 객체로 내보내기 추가 

def FindThingByID (id  : Int) = Action {
val res3 : List[models.Thing] = MyModel.findByID(id)
Ok(Json.toJson(res3)) }

Json.toJson(res3)  이 한방으로 Json 객체를 클라이언트쪽으로 보내줍니다.



ps. FrontEnd 쪽에서 Ajax 를 통해서 호출해주고 Json 객체를 받는것은 이 포스트에서 제외했습니다.

  Play2.4 로 웹 개발 시작하기 
쉽고, 재밌고, 강력하고, 편리한 웹 프레임워크 Play2  (scala 언어기반) 을 배워봅시다.

환경

- Windows 10 

- JDK 1.8

- IntelliJ 2016.2.2 

- Scala 2.11

- Play 2.48 


연재 순서 

1. Play2 웹 개발 시작하기 -  설치 및 프로젝트 만들기 

2. Play2 웹 개발 시작하기 -  프로젝트 살펴보기 

3. Play2 웹 개발 시작하기 -  나만의 프로젝트 만들기 

*  2.5 에 대한 한글 자료가 부족한듯 싶습니다. 경험 풍부한 분들의 적극적인 정보 공유가 필요합니다.


2. 기본 프로젝트 살펴보기 

  설치 포스트를 통해 프로젝트를 만들면 아래와 같이 자동으로 프로젝트가 구성 됩니다.

    

  주요 구성 요소로는 
   가. 컨트롤러 (controllers)   :  클라이언트가 보낸  호출을 컨트롤 합니다. (현재 모델은 없습니다)
   나. 뷰 (views) :  사용자에게 보여질 HTML 페이지 입니다.
   다. 설정 (conf)  : application.conf 엔 로그,DB 접속등에 관한 설정을 적어줍니다.
                         routes 는 클라이언트 보낸 HTTP 를 컨트롤러에 매핑해줍니다.
   라. public 폴더 :   여기엔 js,css,img 등 각종 리소스를 넣습니다. 
   마. build.sbt  :  필요한 디펜던시를 설정하여 자동 다운로드 받게 합니다. 

  

구체적으로 살펴보시죠.

routes 파일입니다.

빨강색 박스안에 규칙을 설정해 줍니다.
/   경로로 보내면  controllers.Application.index 컨트롤러가 반응한다는 말입니다.
GET   /search  controllers.Application.search  이렇게 추가 할 수 있습니다.
굉장히 간단하면서 직관적입니다. 


Controllers 패키지내의 Application 입니다.
Controllers 를 상속받은 object 입니다.

routes 파일의 GET   /  controllers.Application.index   에 따라서 
매핑된 index 컨트롤러 함수가 정의되 있네요.
뷰의 index html 파일로 문자열을 보내는 기능만 있습니다. 
추후에 모델클래스 만들어서 DB에서 받아온 데이터를 넘겨주면 될거 같습니다.

views 패키지내의 index.scala.html 파일 입니다.

컨트롤러의 index  함수에서  Ok(views.html.index("Your new application is ready."))
이렇게 호출했었죠?  내부의 문자열 인자는  
index.scala.html 파일의 젤 위에 
@(message: String) 에 보내집니다. 
Scala 언어의 인자받는 구문과  똑같습니다. 

@main("Welcome to Play") 는 main.scala.html 를 호출하며 인자로 Welcome to Play를 보냅니다. 내부의 @play20.welcome(message) 는 main.scala.html 파일의 @content 에서 사용될 것입니다.


views 패키지내의 main.scala.html 파일 입니다.

index.scala.html 파일에서 보낸 "Welcome to Play" 는 (title: String) 에 담겨지며 
@play20.welcome(message) 는  @content 에 담겨집니다.

리소스는  @routes.Assets.at 이런식 접근합니다. 
<script src="@routes.Assets.at("javascripts/jquery-1.9.0.min.js")"

@routes.Assets.at 는 routes 파일에 아래와 같이 정의되 있구요.
GET      /assets/*file      controllers.Assets.at(path="/public", file)


디폴트 웹 어플리케이션 모습 입니다.


내용 추가 예정 .. 


+ Recent posts