Difference between revisions of "PERL/C3/Perl-and-HTML/English-timed"
From Script | Spoken-Tutorial
Sandhya.np14 (Talk | contribs) |
Sandhya.np14 (Talk | contribs) |
||
(2 intermediate revisions by 2 users not shown) | |||
Line 11: | Line 11: | ||
| 00:06 | | 00:06 | ||
| In this tutorial, we will learn how to create | | 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, | |
− | + | '''Perl''' 5.14.2, | |
− | + | '''Firefox Web Browser''', | |
− | + | '''Apache HTTP server '''and | |
− | + | ''''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 33: | 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. |
|- | |- | ||
Line 113: | Line 112: | ||
|- | |- | ||
| 02:49 | | 02:49 | ||
− | | The''' end_html''' method returns the '''BODY '''and | + | | The''' end_html''' method returns the '''BODY '''and HTML tags. |
|- | |- | ||
Line 137: | Line 136: | ||
|- | |- | ||
| 03:20 | | 03:20 | ||
− | | First, let us check whether | + | | First, let us check whether web server is working or not. |
|- | |- | ||
Line 169: | Line 168: | ||
|- | |- | ||
| 04:04 | | 04:04 | ||
− | |Now, we will test the same script via the | + | |Now, we will test the same script via the web server. |
|- | |- | ||
Line 177: | 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 | + | | First, place our program in the''' cgi-bin''' directory where the web server will recognize it as a''' CGI''' script. |
|- | |- | ||
Line 189: | Line 188: | ||
|- | |- | ||
| 04:33 | | 04:33 | ||
− | | Run the script. | + | | '''Run''' the script. |
|- | |- | ||
Line 205: | Line 204: | ||
|- | |- | ||
| 04:47 | | 04:47 | ||
− | | For this, type the command: | + | | For this, type the command:'''sudo space cp space cgiexample.pl /usr/lib/cgi-bin/'''. |
− | '''sudo space cp space cgiexample.pl /usr/lib/cgi-bin/'''. | + | |
|- | |- | ||
Line 214: | Line 212: | ||
|- | |- | ||
| 05:06 | | 05:06 | ||
− | | Next, we need to give the | + | | Next, we need to give the Web-server user 'read' and 'execute' '''permission''' for the file. |
|- | |- | ||
Line 222: | Line 220: | ||
|- | |- | ||
| 05:31 | | 05:31 | ||
− | | Now our file which is placed in the '''cgi-bin | + | | Now, our file which is placed in the '''cgi-bin''' directory is ready to execute. |
|- | |- | ||
Line 242: | Line 240: | ||
|- | |- | ||
| 06:06 | | 06:06 | ||
− | | In the''' cgi-bin directory''' created earlier, I have saved a file | + | | In the''' cgi-bin directory''' created earlier, I have saved a file 'form.cgi'. I will open this file in''' gedit'''. |
|- | |- | ||
Line 258: | Line 256: | ||
|- | |- | ||
| 06:36 | | 06:36 | ||
− | | '''Form field''' methods are very similar to the standard | + | | '''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. |
|- | |- | ||
Line 290: | Line 288: | ||
|- | |- | ||
| 07:26 | | 07:26 | ||
− | | '''Clear''' button is used to clear the form. | + | | '''Clear''' button is used to clear the '''form'''. |
|- | |- | ||
Line 342: | Line 340: | ||
|- | |- | ||
| 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 355: | Line 352: | ||
|- | |- | ||
| 08:52 | | 08:52 | ||
− | | The video at the following link | + | | 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''' | + | | The''' Spoken Tutorial Project''' team: |
− | + | conducts workshops using spoken tutorials and | |
− | + | 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. | + | |
|- | |- |
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. |