Understanding Grails Framework at The 1st Sight

Hi readers, it’s been a long time we haven’t met yet. I’ve been drop to the jail of daily routine that make me hard to find a time to write something here. I wrote some notes on my primary blog, and I can’t find a good idea to write something here. But it will change, I have something to share it here now..:p

I have impressed by Grails Framework, for the past 4 weeks, I’ve spent my time to go deeper to understand this framework. I don’t understand Grails Framework definition and description, but you can open their home page if you find your self in curious about it. What I want to share about Grails Framework here is, my notes when I tried to use this framework. It’s more like a steps for understanding Grails Framework manually. Okay, I’m gonna cut these craps and go straight to the point of this notes.

Okay, before the notes begin, I assumed you have installed the grails framework on your system and set the grails home installed directory to your system environment variables, here we go:

1. Create grails application.

Open the command prompt and execute below command:

E:\Data\MyProject\Grails>grails create-app grails-test
| Created Grails Application at E:\Data\MyProject\Grails\grails-test

This command will create a directory named grails-test containing the grails project skeleton

2. Create the controller

After entering the generated directory, lets create a controller called HomeController by executing this command :

    E:\Data\MyProject\Grails\grails-test>grails create-controller com.mygrails.coba.Home
    | Created file grails-app/controllers/com/mygrails/coba/HomeController.groovy
    | Created file grails-app/views/home
    | Created file test/unit/com/mygrails/coba/HomeControllerTests.groovy

Okay, I also put the prefix com.mygrails.coba before the words Home as a package of the HomeController will be placed. You can see above, when the command executed successfully, the command create a Home Controller file and stored the file at grails-app/controllers/com/mygrails/coba/ folder. by default HomeController file will contained at least with one method. This command also create a folder under the grails-app/views/ named as home too, this is the folder where we will store the viewer layer (gsp’s files) later. When we open the HomeController file, we can see the default method created like this screenshot:

package com.mygrails.coba

class HomeController {

   def index() { }
}

In using of Grails Framework software development. I’m a unit-test ignored person, so let’s ignore the created unit-test file..:P

4. Create the viewer layer.

And then let’s create viewer layer which is gsp file, as mentioned above, this file should be located at grails-app/views/home folder. So use your best text editor to create the index.gsp file and store it to the folder. I use notepad to create the file by executing this command:

E:\Data\MyProject\Grails\grails-test>start notepad grails-app\views\home\index.gsp

I write the content of the index.gsp file using common html tag like this:

<html>
   <head>
       <title></title>
   </head>
   <body>
       Howdy...??
    <p>
     Welcome to Grails Framework
    </p>
   </body>
</html>

5. Run the application.

After the file saved let’s run the application by executing this command:

    E:\Data\MyProject\Grails\grails-test>grails run-app
    | Running Grails application
    Sep 10, 2013 10:19:00 PM org.apache.coyote.AbstractProtocol init
    INFO: Initializing ProtocolHandler ["http-bio-8080"]
    Sep 10, 2013 10:19:01 PM org.apache.catalina.core.StandardService startInternal
    INFO: Starting service Tomcat
    Sep 10, 2013 10:19:01 PM org.apache.catalina.core.StandardEngine startInternal
    INFO: Starting Servlet Engine: Apache Tomcat/7.0.39
    Sep 10, 2013 10:19:01 PM org.apache.catalina.startup.ContextConfig getDefaultWebXmlFragment
    INFO: No global web.xml found
    Sep 10, 2013 10:19:01 PM org.apache.catalina.core.ApplicationContext log
    | Server running. Browse to http://localhost:8080/grails-test

6. Open the application.

Use your favorite browser to open the application by entering this http://localhost:8080/grails-test/home/index to the address bar of the browser. You should see the result like this:

OpenApp5. Proof Grails Framework run time changed code.

Next task is modifying the content of gsp file by adding more words or html tag, remember we do this without stopping the running Grails Application. After we did the task and saved the changed gsp file, try to refresh the browser by pressing F5. When the content of opened page in the browser changed, I can consider we understood that the grails framework doesn’t need to stop and start the running application while we changed the content.

6. Passing data from controller.

Now we ready to move to the next task which is passing the data from controller layer to viewer layer in order to make us understand how these two layers can communicate each others. Open your HomeController.groovy file using your favorite text editor, and insert the code inside the index method, just like below example:

def index() {
  def name = params.name
  [nameToPass:name]
}

and then edit the index.gsp file to display the data from controller just like below:

<body>
    Welcome...<b>${nameToPass}</b><br>
    This application powered by Grails Framework
</body>

After all the files saved, try to refresh the browser and add the url parameter to the URL address like this http://localhost:8080/grails-test/home/index?name=Stevie, we should see the content changed. And I hope we could understand that url parameter name  sent from browser, and then catch by the controller and then the controller send the parameter value to gsp file to display in the browser.

ChangedCodeThat’s it, that’s my way to understand the Grails Framework at the 1st sight. With Integrated Development Editor such as eclipse or Intellijidea, grails framework will be more easier to understand especially the code syntax.

See ya..

Josescalia

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s