Difference between revisions of "PERL/C3/Perl-and-HTML/English-timed"
From Script | Spoken-Tutorial
Sandhya.np14 (Talk | contribs) |
Sandhya.np14 (Talk | contribs) |
||
| Line 113: | Line 113: | ||
|- | |- | ||
| 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 137: | ||
|- | |- | ||
| 03:20 | | 03:20 | ||
| − | | First, let us check whether | + | | First, let us check whether web server is working or not. |
|- | |- | ||
| Line 169: | Line 169: | ||
|- | |- | ||
| 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 177: | ||
|- | |- | ||
| 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 189: | ||
|- | |- | ||
| 04:33 | | 04:33 | ||
| − | | Run the script. | + | | '''Run''' the script. |
|- | |- | ||
| Line 214: | Line 214: | ||
|- | |- | ||
| 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 222: | ||
|- | |- | ||
| 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 242: | ||
|- | |- | ||
| 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 258: | ||
|- | |- | ||
| 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 290: | ||
|- | |- | ||
| 07:26 | | 07:26 | ||
| − | | '''Clear''' button is used to clear the form. | + | | '''Clear''' button is used to clear the '''form'''. |
|- | |- | ||
| Line 355: | Line 355: | ||
|- | |- | ||
| 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 | * conducts workshops using spoken tutorials and | ||
* gives certificates on passing online tests. | * gives certificates on passing online tests. | ||
| Line 372: | Line 371: | ||
| 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. | ||
Revision as of 14:28, 18 July 2016
| 'Time | Narration |
| 00:01 | Welcome to the Spoken Tutorial on Perl and HTML. |
| 00:06 | In this tutorial, we will learn how to create
|
| 00:14 | To record this tutorial, I am using:
|
| 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:
|
| 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. |
