Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
80 views

HTML + Css With PHP and Phpmyadmin Programming

This document outlines steps for students to create a basic dynamic web page using HTML, CSS, PHP, and PHPMyAdmin. The objectives are to learn the basics of these technologies and how to create dynamic web pages that can respond to links, pictures, and text boxes. It provides 15 steps to create a PHP file and PHPMyAdmin database, connect them, and display database records on a web page. The goal is for students to create their first full dynamic web application.

Uploaded by

Micaela Manalo
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
80 views

HTML + Css With PHP and Phpmyadmin Programming

This document outlines steps for students to create a basic dynamic web page using HTML, CSS, PHP, and PHPMyAdmin. The objectives are to learn the basics of these technologies and how to create dynamic web pages that can respond to links, pictures, and text boxes. It provides 15 steps to create a PHP file and PHPMyAdmin database, connect them, and display database records on a web page. The goal is for students to create their first full dynamic web application.

Uploaded by

Micaela Manalo
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 8

HTML + CSS WITH PHP AND PHPMYADMIN PROGRAMMING

OBJECTIVE: at the end of the semester, the students will be able to:
1. Learn the basic of HTML and Cascading style sheets (CSS)
2. Learn PHP programming with database using PHPmyadmin.
3. Create dynamic web pages using the four applications stated above.
4. Learn the basic use of Standard Query language (SQL) in programming.
5. Learn how dynamic web pages response using links, pictures, icons, and text boxes.
Steps in creating your first program in php.
1. Browse to my computer and click Local disk C:\ then click on xammp folder

2. Find the htdocs folder and click to open.

3. Create your “folder” with your Last name (e.g Tabien), by clicking the new folder tab
above. (see images below) it will create a new folder and while it is highlighted type
your last name then press enter key.

COMP20033 COMPUTER PROGRAMMING 2 LYNEL P. TABIEN - INSTRUCTOR


4. Open your notepad++ then write your first php sample code.
<html>
<body>
<h1>My first PHP page</h1>

<?php
echo "Hello World!";
?>

</body>
</html>

Note: php code are always inside HTML code.

COMP20033 COMPUTER PROGRAMMING 2 LYNEL P. TABIEN - INSTRUCTOR


5. Click save button on notepad or the save icon, save as window will appear

Make sure that you will save it to your folder you have just created inside the htdocs folder and
don’t forget to include the .php as extension in your file name, see above picture the filename
use is sample with .php, once done click save button.

6. To run the created program, make sure that you have already connect the xammp control panel
and make sure that there is no error on connection. To check if there is no error, see image
below encircle in red, apache and mysql are detected running.

COMP20033 COMPUTER PROGRAMMING 2 LYNEL P. TABIEN - INSTRUCTOR


7. Next is click on your browser (Mozilla/Chrome) then type localhost\your folder (in htdocs).

COMP20033 COMPUTER PROGRAMMING 2 LYNEL P. TABIEN - INSTRUCTOR


You will see your php file created inside your folder, to run just click the file and then it will open
via html.

Congratulations! You run your first program in php!

next on our step by step is to create a sample database in phpmyadmin and later we will
going to connect it in your php program and display the contents of your database created. To
do that, open a new tab in your browser and just type localhost.

8. On the right side of your screen, you will see the phpMyadmin link, click on it and you will see
the image below.

COMP20033 COMPUTER PROGRAMMING 2 LYNEL P. TABIEN - INSTRUCTOR


9. Click on test first, then click create table, write your table name(e.g table1) then depending on
your needed fields (columns) if your design is more than 4 click on number of columns to add
more columns for your fieldnames then click on GO button on the lower left of your screen.

10. On the red arrow, write the fieldnames (e.g IDnumber), click on type green arrow if the
fieldname is text or integer(INT) normally if number the default of course is INT, if text or Last
name, First name select VARCHAR. On maroon arrow write the length values(e.g IDnumber
=”4”, Lastname = “25”).
11. After all the fieldnames is correctly encoded, click save button on the lower left of your screen.
12. To add data or record on your created table click INSERT tab.

13. Use the right side textboxes to add records and click GO once done, see image below

COMP20033 COMPUTER PROGRAMMING 2 LYNEL P. TABIEN - INSTRUCTOR


14. you can use the two sets of textboxes if you want to have a multiple entry, click the GO button
below to add two records at a time.

15. Once done, click the browse tab to see the added records.

COMP20033 COMPUTER PROGRAMMING 2 LYNEL P. TABIEN - INSTRUCTOR


HOORAY! YOU’VE DONE YOUR FIRST PHPMYADMIN DATABASE!

Our next activity is to connect the phpmyadmin database to


php program then display it via html and later add record using
links..please download the working php code under the lecture
folder on your schoology.

COMP20033 COMPUTER PROGRAMMING 2 LYNEL P. TABIEN - INSTRUCTOR

You might also like