Difference between revisions of "PERL/C3/Perl-and-HTML/English-timed"

From Script | Spoken-Tutorial
Jump to: navigation, search
(Created page with " {| Border=1 | '''Time'' | '''Narration''' |- | 00:01 | Welcome to the''' Spoken Tutorial''' on''' Perl and HTML.''' |- | 00:06 | In this tutorial we will learn how to creat...")
 
 
(4 intermediate revisions by 2 users not shown)
Line 10: Line 10:
 
|-
 
|-
 
| 00:06
 
| 00:06
−
| In this tutorial we will learn how to create * '''html pages'''  and * '''CGI  module'''
+
| In this tutorial, we will learn how to create
 +
'''html pages'''  and '''CGI  module'''.
  
 
|-
 
|-
 
| 00:14
 
| 00:14
−
| To record this tutorial, I am using
+
| To record this tutorial, I am using:
−
 
+
'''Ubuntu Linux 12.04''' operating system,
−
* '''Ubuntu Linux 12.04''' operating system
+
'''Perl''' 5.14.2,
−
* '''Perl 5.14.2 '''
+
'''Firefox Web Browser''',
−
* '''Firefox Web Browser'''
+
'''Apache HTTP server '''and
−
* '''Apache HTTP server '''and
+
''''gedit' Text Editor'''.
−
* '''gedit''' Text Editor
+
  
 
|-
 
|-
 
| 00:31
 
| 00:31
−
| You can use any text editor of your choice.
+
| You can use any text-editor of your choice.
  
 
|-
 
|-
Line 32: Line 32:
 
|-
 
|-
 
| 00:40
 
| 00:40
−
| If not, then go through the relevant''' Perl''' spoken tutorials on the''' spoken tutorial''' website.
+
| If not, then go through the relevant''' Perl''' spoken-tutorials on the''' spoken tutorial''' website.
  
 
|-
 
|-
 
| 00:47
 
| 00:47
−
| Perl programs which are used on the web are called''' Perl CGI'''.
+
| Perl programs which are used on the '''web''' are called''' Perl CGI'''.
  
 
|-
 
|-
Line 44: Line 44:
 
|-
 
|-
 
| 00:56
 
| 00:56
−
| It is an interface to serve client-server web communication
+
| It is an interface to serve '''client-server''' web communication.
  
 
|-
 
|-
 
| 01:01  
 
| 01:01  
−
| '''CGI.pm''' is a''' Perl''' module that get installed along with '''Perl''' installation, which serves the communication.
+
| '''CGI.pm''' is a''' Perl''' module that gets installed along with '''Perl''' installation which serves the communication.
  
 
|-
 
|-
 
| 01:10
 
| 01:10
−
|  '''CGI.pm '''has ready to use functions to help developers to write '''Perl CGI''' applications.
+
|  '''CGI.pm '''has ready to use '''function'''s to help developers, to write '''Perl CGI''' applications.
  
 
|-
 
|-
 
| 01:19
 
| 01:19
−
|  When a file in certain directory is requested from web browser,  unlike HTTP server, '''Perl CGI''' scripts get executed and send output back to browser to display.
+
|  When a file in certain directory is requested from web browser,  unlike '''HTTP server''', '''Perl CGI''' scripts get executed and send output back to browser to display.
  
 
|-
 
|-
 
| 01:33
 
| 01:33
−
| This function is called '''CGI''' and the programs are called '''CGI''' scripts.
+
| This function is called '''CGI''' and the programs are called '''CGI scripts'''.
  
 
|-
 
|-
 
| 01:40
 
| 01:40
−
| '''CGI''' programs can be a '''Perl''' script, Shell Script, C or C++ program.
+
| '''CGI''' programs can be a '''Perl script, Shell Script, C''' or '''C++ program'''.
  
 
|-
 
|-
 
| 01:47
 
| 01:47
−
| Now let us see a sample '''Perl''' program.
+
| Now, let us see a sample '''Perl''' program.
  
 
|-
 
|-
Line 92: Line 92:
 
|-
 
|-
 
| 02:19
 
| 02:19
−
| It will load the '''module '''and make a set of''' CGI functions '''available for our code.
+
| It will load the module and make a set of''' CGI functions '''available for our code.
  
 
|-
 
|-
 
| 02:26
 
| 02:26
−
| To start the''' HTML''', we use the '''method start_html'''.
+
| To start the''' HTML''', we use the method '''start_html()'''.
  
 
|-
 
|-
 
| 02:33
 
| 02:33
−
| “'''My Home Page'''” is the page title given for the web page.
+
| “My Home Page” is the '''page''' title given for the web page.
  
 
|-
 
|-
Line 108: Line 108:
 
|-
 
|-
 
| 02:43
 
| 02:43
−
| Heading tags are represented by''' h1, h2''' etc
+
| Heading tags are represented by''' h1, h2''' etc.
  
 
|-
 
|-
 
| 02:49
 
| 02:49
−
| The''' end_html method '''returns the '''BODY '''and  '''HTML tags'''.
+
| The''' end_html''' method returns the '''BODY '''and  HTML tags.
  
 
|-
 
|-
 
| 02:55
 
| 02:55
−
| Now, save the file.
+
| Now, '''save''' the file.
  
 
|-
 
|-
 
| 02:57
 
| 02:57
−
| Before we try to run the '''script '''via the '''web server''', let's try running it from the '''command line'''.
+
| Before we try to '''run''' the script via the '''web server''', let's try running it from the '''command line'''.
  
 
|-
 
|-
 
| 03:04
 
| 03:04
−
| Switch back to the''' terminal''' and type '''perl cgiexample.pl''' and press''' Enter'''.
+
| Switch back to the''' terminal''' and type: '''perl cgiexample.pl''' and press''' Enter'''.
  
 
|-
 
|-
Line 132: Line 132:
 
|-
 
|-
 
| 03:15
 
| 03:15
−
| Next, we will test the same '''script''' via the '''web server.'''
+
| Next, we will test the same script via the '''web server.'''
  
 
|-
 
|-
 
| 03:20
 
| 03:20
−
| First, let us check whether '''web server '''is working or not.
+
| First, let us check whether web server is working or not.
  
 
|-
 
|-
Line 144: Line 144:
 
|-
 
|-
 
| 03:31
 
| 03:31
−
| Otherwise, you can type as ''' localhost'''
+
| Otherwise, you can type as "localhost".
  
 
|-
 
|-
 
| 03:35
 
| 03:35
−
| If everything works fine you will see something like this in the browser.
+
| If everything works fine, you will see something like this in the browser.
  
 
|-
 
|-
Line 156: Line 156:
 
|-
 
|-
 
| 03:48
 
| 03:48
−
|Apache HTTP server is installed in my machine.
+
|'''Apache HTTP server''' is installed in my machine.
  
 
|-
 
|-
 
| 03:52
 
| 03:52
−
| If it is not installed execute the below command on the terminal.
+
| If it is not installed, '''execute''' the below '''command''' on the terminal.
  
 
|-
 
|-
 
| 03:58
 
| 03:58
−
| Otherwise, please ask your system administrator for server configuration  
+
| Otherwise, please ask your system administrator for server configuration.
  
 
|-
 
|-
 
| 04:04
 
| 04:04
−
|Now, we will test the same '''script''' via the''' web server.'''
+
|Now, we will test the same script via the web server.
  
 
|-
 
|-
Line 176: Line 176:
 
|-
 
|-
 
| 04:13
 
| 04:13
−
| First place our program in the''' cgi-bin''' directory where the '''web server''' will recognize it as a''' CGI script.'''
+
| First, place our program in the''' cgi-bin''' directory where the web server will recognize it as a''' CGI''' script.
  
 
|-
 
|-
Line 188: Line 188:
 
|-
 
|-
 
| 04:33
 
| 04:33
−
| Run the '''script'''
+
| '''Run''' the script.
  
 
|-
 
|-
 
| 04:35
 
| 04:35
−
|  The URL for this program will be as shown in the slide
+
|  The URL for this program will be as shown in the '''slide'''.
  
 
|-
 
|-
 
| 04:40
 
| 04:40
−
| Switch to the '''terminal'''.
+
| Switch to the terminal.
  
 
|-
 
|-
 
| 04:42
 
| 04:42
−
| Now we will copy the file to the''' cgi-bin''' directory.  
+
| Now, we will copy the file to the''' cgi-bin''' directory.  
  
 
|-
 
|-
 
| 04:47
 
| 04:47
−
| For this type the '''command''' '''sudo space cp space cgiexample.pl /usr/lib/cgi-bin/'''.  
+
| For this, type the command:'''sudo space cp space cgiexample.pl /usr/lib/cgi-bin/'''.  
  
 
|-
 
|-
 
| 05:03
 
| 05:03
−
| Enter the password if required
+
| Enter the password if required.
  
 
|-
 
|-
 
| 05:06
 
| 05:06
−
| Next we need to give the '''Web-server user''' '''read''' and '''execute permission''' for the file.
+
| Next, we need to give the Web-server user 'read' and 'execute' '''permission''' for the file.
  
 
|-
 
|-
 
| 05:13
 
| 05:13
−
| For this, type '''sudo space chmod space 755 space /usr/lib/cgi-bin/cgiexample.pl'''
+
| For this, type: '''sudo space chmod space 755 space /usr/lib/cgi-bin/cgiexample.pl'''
  
 
|-
 
|-
 
| 05:31
 
| 05:31
−
| Now our file which is placed in the '''cgi-bin directory''' is ready to execute.
+
| Now, our file which is placed in the '''cgi-bin''' directory is ready to execute.
  
 
|-
 
|-
Line 228: Line 228:
 
|-
 
|-
 
| 05:41
 
| 05:41
−
| Type''' localhost/cgi-bin/cgiexample.pl''' and press '''Enter'''.
+
| Type:''' localhost/cgi-bin/cgiexample.pl''' and press '''Enter'''.
  
 
|-
 
|-
 
| 05:50
 
| 05:50
−
| We can see the output that is executed on the '''web browser.'''
+
| We can see the output that is executed on the web browser.
  
 
|-
 
|-
 
| 05:55
 
| 05:55
−
| Now let us see another program. This program will add fields to a form and retrieve the entered values to our''' web page.'''
+
| Now, let us see another program. This program will add '''field'''s to a '''form''' and retrieve the entered values to our web page.
  
 
|-
 
|-
 
| 06:06
 
| 06:06
−
| In the''' cgi-bin directory''' created earlier, I have saved a file '''form.cgi'''. I will open this file in''' gedit'''.
+
| In the''' cgi-bin directory''' created earlier, I have saved a file 'form.cgi'. I will open this file in''' gedit'''.
  
 
|-
 
|-
 
| 06:17
 
| 06:17
−
| Now add the below lines. This program generates a feedback form.
+
| Now, add the below lines. This program generates a '''feedback form'''.
  
 
|-
 
|-
 
| 06:24
 
| 06:24
−
| The user has to enter the first name, last name, gender and feedback details.
+
| The user has to enter the '''first name, last name, gender''' and feedback details.
  
 
|-
 
|-
 
| 06:31
 
| 06:31
−
| To begin a form, we are using ''' start_form method'''.
+
| To begin a '''form''', we are using ''' start_form()''' method.
  
 
|-
 
|-
 
| 06:36
 
| 06:36
−
| '''Form field methods '''are very similar to the standard''' html tag methods'''.
+
| '''Form field''' methods are very similar to the standard html tag methods.
  
 
|-
 
|-
 
| 06:42
 
| 06:42
−
| To create a textbox in the form,''' Textfield''' method is used with several parameters.
+
| To create a textbox in the form,''' Textfield()''' method is used with several parameters.
  
 
|-
 
|-
 
| 06:49
 
| 06:49
−
| Here “fname”, “lname” are the names of the textbox which gets the input from the user.
+
| Here “fname”, “lname” are the names of the textbox which get the input from the user.
  
 
|-
 
|-
Line 272: Line 272:
 
|-
 
|-
 
| 07:05
 
| 07:05
−
| This is denoted by the parameter '''hyphen values'''
+
| This is denoted by the parameter '''hyphen values'''.
  
 
|-
 
|-
Line 288: Line 288:
 
|-
 
|-
 
| 07:26
 
| 07:26
−
| '''Clear''' button is used to clear the form.
+
| '''Clear''' button is used to clear the '''form'''.
  
 
|-
 
|-
 
| 07:30
 
| 07:30
−
| The''' displayform function '''retrieves the values we entered in the form.
+
| The''' displayform''' function retrieves the values, we entered in the form.
  
 
|-
 
|-
 
| 07:36
 
| 07:36
−
| '''param function '''gives the value of the form field whose name is passed as parameter.
+
| '''param()''' function gives the value of the form field whose name is passed as parameter.
  
 
|-
 
|-
 
| 07:42
 
| 07:42
−
| Here '''“fname” '''is the name given to the '''“First Name”''' textbox.
+
| Here “fname” is the name given to the “First Name” textbox.
  
 
|-
 
|-
Line 308: Line 308:
 
|-
 
|-
 
| 07:53
 
| 07:53
−
| Let us execute the program now.
+
| Let us '''execute''' the program now.
  
 
|-
 
|-
Line 316: Line 316:
 
|-
 
|-
 
| 07:58
 
| 07:58
−
| Type''' localhost/cgi-bin/form.cgi''' and press '''Enter'''.
+
| Type:''' localhost/cgi-bin/form.cgi''' and press '''Enter'''.
  
 
|-
 
|-
 
| 08:06
 
| 08:06
−
| The feedback form is displayed.
+
| The '''feedback form''' is displayed.
  
 
|-
 
|-
 
| 08:09
 
| 08:09
−
| I'll enter data in this form as shown here.
+
| I'll enter data in this '''form''' as shown here.
  
 
|-
 
|-
Line 332: Line 332:
 
|-
 
|-
 
| 08:21
 
| 08:21
−
| This brings us to the end of this tutorial. Let us summarise.
+
| This brings us to the end of this tutorial. Let us summarize.
  
 
|-
 
|-
 
| 08:26
 
| 08:26
−
| In this tutorial we learnt how to create  '''html pages''' using  '''CGI'''  module
+
| In this tutorial, we learnt how to create  '''html pages''' using  '''CGI'''  module.
  
 
|-
 
|-
 
| 08:33
 
| 08:33
−
| Assignment
+
| Assignment-In''' form.cgi''' program, add '''checkbox''' option for languages '''Java, C/C++ '''and '''Perl'''.
−
 
+
−
In''' form.cgi''' program''',''' add '''checkbox''' option for languages '''Java, C/C++ '''and '''Perl'''
+
  
 
|-
 
|-
Line 354: Line 352:
 
|-
 
|-
 
| 08:52
 
| 08:52
−
| The video at the following link summarises the Spoken Tutorial project.
+
| The video at the following link summarizes the Spoken Tutorial project.
−
 
+
Please download and watch it.
−
Please download and watch it
+
  
 
|-
 
|-
 
| 08:59
 
| 08:59
−
| The''' Spoken Tutorial Project''' Team
+
| The''' Spoken Tutorial Project''' team:
−
 
+
conducts workshops using spoken tutorials and
−
* conducts workshops using spoken tutorials and
+
gives certificates on passing online tests.
−
* gives certificates on passing online tests.
+
  
 
|-
 
|-
Line 371: Line 367:
 
|-
 
|-
 
| 09:11
 
| 09:11
−
| Spoken Tutorial project is funded by NMEICT, MHRD, Government of India.
+
| Spoken Tutorial project is funded by NMEICT, MHRD, Government of India.More information on this mission is available at this link.
−
 
+
−
More information on this mission is available at this link.
+
  
 
|-
 
|-
 
| 09:23
 
| 09:23
−
| This is Nirmala Venkat from IIT Bombay, signing off. Thanks for watching.
+
| This is Nirmala Venkat from '''IIT Bombay''', signing off. Thanks for watching.
  
 
|}
 
|}

Latest revision as of 09:49, 12 October 2017

'Time Narration
00:01 Welcome to the Spoken Tutorial on Perl and HTML.
00:06 In this tutorial, we will learn how to create

html pages and CGI module.

00:14 To record this tutorial, I am using:

Ubuntu Linux 12.04 operating system, Perl 5.14.2, Firefox Web Browser, Apache HTTP server and 'gedit' Text Editor.

00:31 You can use any text-editor of your choice.
00:35 To follow this tutorial, you should have working knowledge of Perl programming.
00:40 If not, then go through the relevant Perl spoken-tutorials on the spoken tutorial website.
00:47 Perl programs which are used on the web are called Perl CGI.
00:52 CGI stands for Common Gateway Interface.
00:56 It is an interface to serve client-server web communication.
01:01 CGI.pm is a Perl module that gets installed along with Perl installation which serves the communication.
01:10 CGI.pm has ready to use functions to help developers, to write Perl CGI applications.
01:19 When a file in certain directory is requested from web browser, unlike HTTP server, Perl CGI scripts get executed and send output back to browser to display.
01:33 This function is called CGI and the programs are called CGI scripts.
01:40 CGI programs can be a Perl script, Shell Script, C or C++ program.
01:47 Now, let us see a sample Perl program.
01:50 Switch to the terminal.
01:53 Let me open a file cgiexample.pl in gedit which I have already saved.
02:01 In the cgiexample dot pl file, type the following code as displayed on the screen.
02:08 Let us understand the code now.
02:11 use CGI statement tells Perl that we want to use the CGI.pm module in our program.
02:19 It will load the module and make a set of CGI functions available for our code.
02:26 To start the HTML, we use the method start_html().
02:33 “My Home Page” is the page title given for the web page.
02:38 We can print any HTML tag using the CGI module.
02:43 Heading tags are represented by h1, h2 etc.
02:49 The end_html method returns the BODY and HTML tags.
02:55 Now, save the file.
02:57 Before we try to run the script via the web server, let's try running it from the command line.
03:04 Switch back to the terminal and type: perl cgiexample.pl and press Enter.
03:12 The output looks like HTML.
03:15 Next, we will test the same script via the web server.
03:20 First, let us check whether web server is working or not.
03:25 Open your web browser and enter the IP address of the machine and press Enter.
03:31 Otherwise, you can type as "localhost".
03:35 If everything works fine, you will see something like this in the browser.
03:40 If you get any error, then the web service is not installed or it is not in ON status.
03:48 Apache HTTP server is installed in my machine.
03:52 If it is not installed, execute the below command on the terminal.
03:58 Otherwise, please ask your system administrator for server configuration.
04:04 Now, we will test the same script via the web server.
04:09 For this, we need to follow certain steps.
04:13 First, place our program in the cgi-bin directory where the web server will recognize it as a CGI script.
04:22 The program filename must end with dot pl or dot cgi extension.
04:29 Set permission for the file to execute on the server.
04:33 Run the script.
04:35 The URL for this program will be as shown in the slide.
04:40 Switch to the terminal.
04:42 Now, we will copy the file to the cgi-bin directory.
04:47 For this, type the command:sudo space cp space cgiexample.pl /usr/lib/cgi-bin/.
05:03 Enter the password if required.
05:06 Next, we need to give the Web-server user 'read' and 'execute' permission for the file.
05:13 For this, type: sudo space chmod space 755 space /usr/lib/cgi-bin/cgiexample.pl
05:31 Now, our file which is placed in the cgi-bin directory is ready to execute.
05:38 Go to the web browser.
05:41 Type: localhost/cgi-bin/cgiexample.pl and press Enter.
05:50 We can see the output that is executed on the web browser.
05:55 Now, let us see another program. This program will add fields to a form and retrieve the entered values to our web page.
06:06 In the cgi-bin directory created earlier, I have saved a file 'form.cgi'. I will open this file in gedit.
06:17 Now, add the below lines. This program generates a feedback form.
06:24 The user has to enter the first name, last name, gender and feedback details.
06:31 To begin a form, we are using start_form() method.
06:36 Form field methods are very similar to the standard html tag methods.
06:42 To create a textbox in the form, Textfield() method is used with several parameters.
06:49 Here “fname”, “lname” are the names of the textbox which get the input from the user.
06:57 radio underscore group specifies the radio button with two options “Male” and “Female”.
07:05 This is denoted by the parameter hyphen values.
07:09 hyphen default parameter indicates the default selection of the radio button.
07:15 popup underscore menu specifies the listbox option.
07:20 Submit button is used to submit the entered data to the URL provider.
07:26 Clear button is used to clear the form.
07:30 The displayform function retrieves the values, we entered in the form.
07:36 param() function gives the value of the form field whose name is passed as parameter.
07:42 Here “fname” is the name given to the “First Name” textbox.
07:47 The value is retrieved and stored in the variable dollar name1.
07:53 Let us execute the program now.
07:56 Go to the web browser.
07:58 Type: localhost/cgi-bin/form.cgi and press Enter.
08:06 The feedback form is displayed.
08:09 I'll enter data in this form as shown here.
08:15 Then, press the Submit button to see the output that is retrieved from the form.
08:21 This brings us to the end of this tutorial. Let us summarize.
08:26 In this tutorial, we learnt how to create html pages using CGI module.
08:33 Assignment-In form.cgi program, add checkbox option for languages Java, C/C++ and Perl.
08:44 Add textarea option to get the user feedback.
08:48 Print the user entered information on the webpage.
08:52 The video at the following link summarizes the Spoken Tutorial project.

Please download and watch it.

08:59 The Spoken Tutorial Project team:

conducts workshops using spoken tutorials and gives certificates on passing online tests.

09:08 For more details, please write to us.
09:11 Spoken Tutorial project is funded by NMEICT, MHRD, Government of India.More information on this mission is available at this link.
09:23 This is Nirmala Venkat from IIT Bombay, signing off. Thanks for watching.

Contributors and Content Editors

PoojaMoolya, Sandhya.np14

Retrieved from "https://script.spoken-tutorial.org/index.php?title=PERL/C3/Perl-and-HTML/English-timed&oldid=39893"