Netbeans/C2/Developing-a-Sample-Web-Application/Tamil - Revision history

Priyacst at 09:03, 27 February 2017

2017-02-27T09:03:27Z

Priyacst at 09:04, 1 November 2015

2015-11-01T09:04:51Z

Priyacst at 04:23, 13 October 2015

2015-10-13T04:23:18Z

Show changes

Priyacst: Created page with "{| Border=1 || '''Time''' || '''Narration''' |- | 00:01 | வணக்கம் |- | 00:02 | Netbeans IDE ல் Web Applicationகளை உருவாக்குதலி..."

2015-10-08T16:18:07Z

Created page with "{| Border=1 || '''Time''' || '''Narration''' |- | 00:01 | வணக்கம் |- | 00:02 | Netbeans IDE ல் Web Applicationகளை உருவாக்குதலி..."

New page

{| Border=1
|| '''Time'''
|| '''Narration'''
|-
| 00:01
| வணக்கம்
|-
| 00:02
| Netbeans IDE ல் Web Applicationகளை உருவாக்குதலின் அறிமுகம் குறித்த டுடோரியலுக்கு நல்வரவு.
|-
|00:08
|netbeans ன் அடிப்படை உங்களுக்கு தெரிந்திருக்கும் என நம்புகிறோம்
|-
|00:12
| இல்லையெனில் Netbeans டுடோரியல்களுக்கு spoken tutorial website ஐ காணவும்
|-
| 00:19
| Having viewed the first tutorial you would already be familiar
|-
|00:22
|with the installation and interface of Netbeans.
|-
| 00:25
|The previous tutorial also teaches you how to create a new project.
|-
| 00:29
|For this demonstration I am using the Linux Operating System Ubuntu v11.04 and Netbeans IDE v7.1.1
|-
|00:40
|This tutorial will take you through the basics of using Netbeans to develop web applications.
|-
| 00:45
|we will see
|-
| 00:46
| setting up a web application project
|-
|00:49
|creating and editing web applications source files
|-
|00:52
|creating a java package and a java source file
|-
|00:56
|Generating the Getter and Setter methods
|-
|00:59
|Editing the default JavaServer Pages file
|-
|01:02
|Creating a JavaServer pages file
|-
| 01:05
|and finally running our web application project
|-
| 01:08
|To follow this tutorial, you will need the Netbeans IDE
|-
|01:13
|The Java Development Kit (JDK) version 6
|-
|01:17
|The GlassFish Server Open Source Edition
|-
|01:20
|All the above can be downloaded in a single bundle from the link shown on the screen
|-
|01:26
|This tutorial demonstrates how to create a simple web application,
|-
|01:30
|Deploy it to a server,
|-
|01:32
|and View its presentation in a browser.
|-
|01:35
|The application employes (JSP) JavaServer Pages to ask you to input your name
|-
|01:42
|It then uses JavaBeans component to persist the name during the HTTP session,
|-
|01:48
|and then retrieves the output on a second JSP page.
|-
|01:51
| Let us now move to Netbeans and create our web application project
|-
|01:58
|From the '''File''' menu choose '''New Project'''
|-
| 02:01
|Under '''Categories,''' select '''Java Web. '''
|-
| 02:04
|Under '''Projects,''' select '''Web Application''' , and click '''Next.'''
|-
| 02:09
|Give your project a name. I will name my project as '''HelloWeb'''
|-
| 02:15
|Specify the Project Location to any directory on your computer.
|-
|02:20
| Click '''Next.'''
|-
|02:22
| The '''Server and Settings''' panel opens.
|-
|02:25
|Select the version of Java you want to use with your application.
|-
|02:29
|And Select the server, you want to deploy your application to.
|-
| 02:34
|Click '''Next.'''
|-
| 02:36
|In the '''Frameworks''' panel,
|-
| 02:38
|click '''Finish''' to create the project.
|-
|02:41
|The IDE creates the '''HelloWeb''' project folder.
|-
| 02:46
|This folder contains all of your sources and project metadata.
|-
|02:51
|The Welcome page, '''index.jsp'' opens in the Source Editor in the main window.
|-
| 02:57
| You can view the project's file structure in the Files window on the left here
|-
| 03:05
|and it's logical structure in the Projects Window.
|-
|03:10
|Creating and editing source files is the most important function that the IDE serves.
|-
|03:15
|Now in the '''Projects''' window, expand the '''Source Packages''' node.
|-
|03:20
|Note that the Source Packages node contains only an empty default package node.
|-
|03.25
|Right-click on the '''Source Packages''' and choose '''New > Java Class.'''
|-
|03:32
|Give your class a name. I will name the class as '''NameHandler'''
|-
| 03:40
|and in the '''Package''' combobox let me type '''org.mypackage.hello'''
|-
| 03:54
|And Click '''Finish.'''
|-
|03:57
|The '''NameHandler.java''' file opens in the Source Editor.
|-
| 04:01
|Now lets us declare a String variable directly below the class declaration
|-
| 04:07
|I will delare a string variable String name and
|-
| 04:12
| I will also add a constructor '''public NameHandler''' to the class
|-
| 04:23
|Now let me also add '''name = null;''' within the constructor.
|-
| 04:30
|Let us next generate the '''Getter and Setter Methods'''
|-
| 04:33
| Right-click the name field in the '''Source Editor''' choose '''Refactor''' and '''Encapsulate Fields ''' from the contextual menu
|-
| 04:46
|'''Refactoring''' is a disciplined technique for improving the structure of existing code without changing the observable behaviour.
|-
| 04:56
|In short, you can change the structure of the code without changing the behaviour.
|-
| 05:01
| With '''Refactoring,''' you can easily move fields, methods or classes around, without breaking things.
|-
| 05:08
|Lets move back to the IDE.
|-
| 05:11
| The '''Encapsulate Fields''' dialog opens, listing the name field.
|-
| 05:16
| Notice that the '''Fields''' visibility is set to private,
|-
| 05:20
|and '''Accessors''' visibility is set to '''public,''' by default
|-
| 05:24
| Indicating that the access modifier for the class variables wil be specified as '''private''',
|-
| 05:30
| Whereas the '''getter''' and '''setter''' methods will be generated with '''public''' modifiers respectively.
|-
| 05:36
| Click on '''Refactor.'''
|-
| 05:39
|The '''Getter''' and '''Setter''' methods are generated for the '''name''' field.
|-
| 05:46
|The modifier for the class variable is set to '''private''' whereas the '''getter''' and '''setter''' methods are generated with public modifier.
|-
| 05:56
|Your java class should finally look like this
|-
| 05:59
|Let us next Edit the '''Default JavaServer Pages File'''
|-
| 06:04
|Let us Refocus the '''index.jsp''' file by clicking its tab displayed at the top of the Source Editor.
|-
| 06:11
|Now let us open the '''Palette manager''' by going to the '''Tools''' menu > '''Palette''' and click on '''HTML/JSP code clips'''
|-
| 06:21
|The '''Palatte manager''' opens.
|-
| 06:26
|In the palette manager expand the '''HTML forms''' options
|-
| 06:31
| Select the '''Form''' items.
|-
| 06:34
| Drag it and drop it to the points after the h1 tags in your Source Editor
|-
| 06:42
|The '''Insert form''' dialog box opens .
|-
| 06:45
|Let us Specify the values as been shown on the screen:
|-
| 06:49
|The '''Action''' as '''response.jsp'''
|-
| 06:54
|The '''Method''' as '''GET '''
|-
| 06:56
|And lets us give our form a name as '''Name input form.'''
|-
| 07:04
|Click OK.
|-
| 07:07
|An HTML form is added to the '''index.jsp file.'''
|-
| 07:13
|Now from the Palette manager select a Text Input item drag it and drop it to a point just before the closing form tags
|-
| 07:25
|In the '''Insert text input''' dialog box specify the '''Name''' as '''name'''
|-
| 07:32
|Leave the '''Type''' at '''text'''
|-
| 07:34
|And Click on OK.
|-
| 07:36
|A HTML input tag is now added between the form tags.
|-
| 07:41
|Let us delete the empty value attribute from the input tag.
|-
| 07:49
|Now from the palette select the '''Button''' item.
|-
| 07:53
|Drag it and drop it to the point before the closing form tag
|-
| 07:58
|Specify the '''Label''' as '''OK'''
|-
| 08:00
|The '''Type''' as '''submit'''
|-
| 08:03
|And Click on '''OK''' again
|-
| 08:05
|An HTML button is now added to a form tags.
|-
| 08:12
|Infront of the first '''input tag''' let us enter the text '''Enter your name'''
|-
| 08:22
|And let us change the default text between the h1 tags
|-
| 08:28
|We will change the text to '''Entry form'''
|-
| 08:34
|Now Right click, let me close the palette manager for now.
|-
| 08:38
|Right-click within your Source Editor
|-
| 08:41
|Select the Format option to tidy the format of your code.
|-
| 08:46
|Your '''index.jsp''' file should now look like this.
|-
| 08:49
|Let us next Create a JavaServer Pages File
|-
| 08:53
|In the Projects window, right-click on the '''HelloWeb''' project node, choose '''New > JSP. '''
|-
| 09:01
|The '''New JSP''' File wizard opens.
|-
| 09:05
|Name the file as '''response,''' and click on '''Finish. '''
|-
| 09:14
|Notice that a '''response.jsp''' file node displays in the Projects window beneath the '''index.jsp file''' ,
|-
| 09:23
| And the new file opens in the Source Editor.
|-
| 09:26
|Open the Palette manager again
|-
| 09:35
|Now expand the JSP option.
|-
| 09:39
|Select a '''Use Bean''' item, drag it and drop it to a point just below the body
|-
| 09:53
|The '''Insert Use Bean''' dialog opens.
|-
| 09:56
|Specify the values as
|-
| 09:58
|The '''ID''' as '''mybean'''
|-
| 10:01
|The '''Class''' as '''org.mypackage.hello.NameHandler '''
|-
| 10:13
|Set the '''Scope''' as '''session '''
|-
| 10:15
|And click on OK.
|-
| 10:18
|Notice that a jsp:useBean tag is added beneath the body tag.
|-
| 10:30
|JavaBeans are reusable software components for Java.
|-
| 10:34
|They are used to encapsulate many objects into a single object
|-
| 10:38
|So that they can be passed around as a single bean object instead of multiple individual objects.
|-
| 10:46
|Now from the Palette manager, Select a setbean property item, drag it and drop it to a point just before the h1 tags
|-
| 11:03
|And click on OK.
|-
| 11:12
|Here in the jsp:setProperty tag that appears, delete the empty value attribute.
|-
| 11:21
|And set the name attribute to '''mybean''' and the Property to '''name'''
|-
| 11:30
|Now in between the h1 tags let us change the text to '''Hello''' comma space and a '''exclamation mark'''
|-
| 11:40
|Now from the Palette manager Select a '''Get Bean property''' item drag it and drop it after the '''Hello text''' in between the h1 tags
|-
| 11:51
|In the '''Get Bean Property''' item
|-
| 11:53
|Set the '''Bean Name''' to '''mybean'''
|-
| 11:57
|And the '''Property Name''' to '''name '''
|-
| 11:59
|Click on '''OK.'''
|-
| 12:01
|Notice that '''jsp:getProperty''' tag is now added between the h1 tags.
|-
| 12:07
|Right-click within the Source Editor again, click on '''Format''' to tidy the format of your code if required
|-
| 12:16
|The next step is to run our '''Web Application Project '''
|-
| 12:20
|Let me close the palette manager
|-
| 12:26
|In the Projects window, right-click the '''HelloWeb''' project node and choose the '''Run''' option
|-
|12:32
|You can also click the '''Run''' option from the toolbar or press F6 key on your keyboard to run your Project.
|-
|12:41
|I will select the button on the toolbar to run my Project
|-
|12:44
|When you run a '''Web application''' the '''IDE''' builds and compiles the application code
|-
| 12:53
|Launches the server and deploys the application to the server
|-
| 12:58
|and finally displays the application in a browser window
|-
|13:02
|To view this process you can open the output window from the '''Window''' menu and select the '''Output''' option
|-
| 13:10
|You can see that your application has been built successfully
|-
| 13:17
|The '''index.jsp''' page opens in your default browser
|-
| 13:23
|Let me run the project again
|-
| 13:27
|Here it is, it opens in your default browser
|-
| 13:32
|Note that the browser window may sometime open before the IDE displays the server output
|-
| 13:38
| Now let us Enter the name in the text box in the browser
|-
| 13:42
| For eg '''Ubuntu''' and click on OK.
|-
| 13:46
|The '''response.jsp''' page displays, providing you with a simple greeting.
|-
| 13:52
|Now to the assignment part
|-
| 13:56
|As an extension to the web application project, insert two more text fields that is totally three input text fields in your application
|-
| 14:06
|Use the JavaBeans Component to set the bean property and
|-
| 14:09
|View its presentation in the browser
|-
| 14:12
|And finally Retrieve the output on the second JSP page
|-
| 14:17
|I have already constructed my assignment
|-
| 14:21
|Let me open my assignment and run it in the ''' IDE'''
|-
| 14:30
|I am presented with 3 input text fields
|-
| 14:35
|Let me enter the details and click on Ok
|-
| 14:42
|I should be presented with an output like this
|-
| 14:47
|Watch the video available at the link shown on the screen.
|-
| 14:51
|It summarizes the Spoken Tutorial project.

|-
| 14:54
|If you do not have good bandwidth, you can download and watch the videos.
|-
| 14:59
|The Spoken Tutorial project team conduct workshops using Spoken Tutorials.
|-
| 15:05
|Gives certificates to those pass an online test.
|-
| 15:09
|For more details please write to contact@spoken-tutorial.org
|-
| 15:16
|Spoken Tutorial Project is a part of the Talk to a Teacher Project
|-
| 15:21
|It is Supported by the National Mission on education through ICT, MHRD, Government of India
|-
| 15:28
|More information on this mission is available at spoken-tutorial.org/NMEICT-Intro
|-
| 15:40
|This tutorial has been contributed by IT for Change
|-
| 15:43
|Thank you for joining us.

@@ Line 2: / Line 2: @@
 || '''Time'''
 || '''Narration'''
 |-
 | 00:02
-|  Netbeans IDE ல் Web Applicationகளை உருவாக்குதலின் அறிமுகம் குறித்த டுடோரியலுக்கு நல்வரவு.
+|வணக்கம்.  Netbeans IDE ல் Web Applicationகளை உருவாக்குதலின் அறிமுகம் குறித்த டுடோரியலுக்கு நல்வரவு.
 |-
 |00:08

@@ Line 28: / Line 28: @@
 |-
 |00:40
-|இந்த டுடோரியலில் Netbeans ஐ பயன்படுத்தி web applicationகளை உருவாக்குவதைக் காண்போம்.
+|Netbeans ஐ பயன்படுத்தி web applicationகளை உருவாக்குவதைக் காண்போம்.
-|-
-| 00:45
-|மேலும் கற்கபோவது
 |-
 | 00:46
@@ Line 37: / Line 34: @@
 |-
 |00:49
-| web applicationகளின் source fileகளை ஐ உருவாக்குதல் மற்றும் edit செய்தல்
+| source fileகளை ஐ உருவாக்குதல் மற்றும் edit செய்தல்
 |-
 |00:52
@@ Line 52: / Line 49: @@
 |-
 | 01:05
-|கடைசியாக நம் web application project ஐ இயக்குதல்
+|கடைசியாக நம் web application project ஐ இயக்குதல்.
 |-
 | 01:08
@@ Line 61: / Line 58: @@
 |-
 |01:17
-|GlassFish Server Open Source Edition
+|GlassFish Server Open Source Edition.
 |-
 |01:20
@@ Line 67: / Line 64: @@
 |-
 |01:26
-|இந்த டுடோரியலில் காட்டப்படுபவை ஒரு எளிய web application ஐ உருவாக்குதல்,
+|இந்த டுடோரியலில் காட்டப்படுபவை, ஒரு எளிய web application ஐ உருவாக்குதல்,
 |-
 |01:30
@@ Line 130: / Line 127: @@
 |-
 |02:51
-| main windowல் Source Editor ல்  Welcome page, '''index.jsp'' திறக்கிறது.
+| main windowல் Source Editor ல்  Welcome page, '''index.jsp'' திறக்கப்படுகிறது.
 |-
 | 02:57
@@ Line 178: / Line 175: @@
 |-
 | 04:33
-| '''Source Editor''' ல் name field ல் ரைட் க்ளிக் செய்து contextual menu ல் '''Refactor'''  பின் '''Encapsulate Fields '''ஐ தேர்ந்தெடுக்கவும்
+| '''Source Editor''' ல் name field ல் ரைட் க்ளிக் செய்து context menu ல் '''Refactor'''  பின் '''Encapsulate Fields '''ஐ தேர்ந்தெடுக்கவும்
 |-
 | 04:46
-|ஏற்கனவே உள்ள code ன் structure ஐ மேம்படுத்துவதற்கான  ஒழுங்குமுறையான நுட்பம் '''Refactoring''' ஆகும் இது காணக்கூடிய நடத்தை  மாற்றாமல் செய்யப்படுகிறது.
+|ஏற்கனவே உள்ள code ன் structure ஐ மேம்படுத்துவதற்கான  ஒழுங்குமுறையான நுட்பம் '''Refactoring''' ஆகும். இது காணக்கூடிய நடத்தையை  மாற்றாமல் செய்யப்படுகிறது.
 |-
 | 04:56
@@ Line 193: / Line 190: @@
 |-
 | 05:11
-|   '''Encapsulate Fields''' dialog திறந்து name fieldஐ பட்டியலிடுகிறது .
+|   '''Encapsulate Fields''' dialog திறக்கப்பட்டு name field பட்டியலிடப்படுகிறது.
 |-
 | 05:16
@@ Line 202: / Line 199: @@
 |-
 | 05:24
-| இது class variableகளுக்கான  access modifier ஆனது '''private''' ஆக குறிப்பிடப்பட்டிருப்பதைக் காட்டுகிறது,
+|class variableகளுக்கான  access modifier ஆனது '''private''' ஆக குறிப்பிடப்பட்டிருப்பதை  இது  காட்டுகிறது,
 |-
 | 05:30
@@ Line 214: / Line 211: @@
 |-
 | 05:46
-|class variableக்கான modifier ஆனது  '''private''' ஆக அமைக்கப்படுகிறது அதேசமயம் '''getter''' மற்றும் '''setter''' methodsகள் public modifierஉடன் உருவாக்கப்படுகின்றன.
+|class variableக்கான modifier ஆனது  '''private''' ஆக அமைக்கப்படுகிறது அதேசமயம் '''getter''' மற்றும் '''setter''' methodகள் public modifierஉடன் உருவாக்கப்படுகின்றன.
 |-
 | 05:56
@@ Line 391: / Line 388: @@
 |-
 | 11:40
-|இப்போதுPalette manager ல் '''Get Bean property'''  item ஐ இழுத்து h1 tagகளுக்கு இடையே '''Hello text''' க்கு பின் வைக்கவும்
+|இப்போது Palette manager ல் '''Get Bean property'''  item ஐ தேர்ந்தெடுத்து அதை இழுத்து h1 tagகளுக்கு இடையே '''Hello text''' க்கு பின் வைக்கவும்
 |-
 | 11:51
@@ Line 400: / Line 397: @@
 |-
 | 11:57
-| '''Property Name''' ல் '''name ''' ஐ அமைத்து
+| '''Property Name''' ல் '''name ''' என அமைத்து
 |-
 | 11:59
@@ Line 409: / Line 406: @@
 |-
 | 12:07
-|மீண்டும் Source Editor ல் ரைட் க்ளிக் செய்து, தே தேவையெனில் உங்கள் code ன் format ஐ சீராக்க Format ஐ க்ளிக் செய்க
+|மீண்டும் Source Editor ல் ரைட் க்ளிக் செய்து, தேவையெனில் உங்கள் code ன் format ஐ சீராக்க Format ஐ க்ளிக் செய்க
 |-
 | 12:16
@@ Line 424: / Line 421: @@
 |-
 |12:41
-|என் project ஐ இயக்க toolbar ல்  '''Run''' button ஐ தேர்ந்தெடுக்கிறேன்
+|என் project ஐ இயக்க toolbar ல்  '''Run''' button ஐ க்ளிக் செய்கிறேன்`
 |-
 |12:44
@@ Line 460: / Line 457: @@
 |-
 | 13:46
-| '''response.jsp''' பக்கம் காட்டப்பட்டு, ஒரு எளிய வரவேற்பு செய்தியைக் காட்டுகிறது.
+| '''response.jsp''' பக்கம் காட்டப்பட்டு, ஒரு எளிய வரவேற்பு செய்தி காட்டப்படுகிறது.
 |-
 | 13:52
@@ Line 475: / Line 472: @@
 |-
 | 14:12
-|கடைசியகா  இரண்டாம் JSP பக்கத்தில் அதன் output ஐ பெறவும்
+|கடைசியாக  இரண்டாம் JSP பக்கத்தில் அதன் output ஐ பெறவும்
 |-
 | 14:17
@@ Line 514: / Line 511: @@
 |-
 | 15:28
-|மேலும் தகவல்களுக்கு spoken hyphen tutorial dot org slash NMEICT hyphen Intro
+|இந்த திட்டம் பற்றிய மேலதிக தகவல்கள் கீழுள்ள இணைப்பில் கிடைக்கும் spoken hyphen tutorial dot org slash NMEICT hyphen Intro
 |-
 | 15:40
 |இந்த டுடோரியலை தமிழாக்கம் செய்து குரல் கொடுத்தது ஐஐடி பாம்பேவில் இருந்து பிரியா. நன்றி.