PHP BASICS BY ALL-TECH SYSTEMS & CO

Size: px

Start display at page:

Download "PHP BASICS BY ALL-TECH SYSTEMS & CO"

Joan Blanche Richard
5 years ago
Views:

1 LET S GET STARTED PHP BASICS BY PHP is a server scripting language, and a powerful tool for making dynamic and interactive Web pages. To start with PHP, you must have an idea about the following 1. HTML 2. CSS 3. Little JavaScript. In case you missed our previous classes on html/css and javascript, kindly get the notes from the links below: HTML/CSS - Javascript - To continue, you will also need A laptop/desktop. 2. A browser like Mozilla Firefox, Google Chrome, Microsoft Internet Explorer, or Opera. 3. A text editor. If you have access to Windows "Notepad" or "WordPad" programs or the MAC "Simple Text" program, are the defaults you can use to get started. 4. A web server (apache)/database (MySQL)/php parser [get XAMPP or WAMP on your own PC (laptop/desktop)] OR Find a web host (online) with PHP and MySQL support. Click the link below to get your webserver/database/php in one software and install Nevertheless, we recommend excellent text editors (e.g. PHPStorm, Sublime Text, Visual Studio, Notepad++, Dream weaver etc.) because they easily spot errors in codes. The official PHP website (PHP.net) visit there to learn more on PHP: You can also go use this link to download your local server 1 P a g e

2 PHP BASICS BY WHAT IS PHP? PHP is an acronym for "PHP: Hypertext Preprocessor" PHP is a widely-used, open source scripting language PHP scripts are executed on the server PHP is free to download and use What is a PHP File? PHP files can contain Text, HTML, CSS, JavaScript, and PHP code PHP codes are executed on the server, and the result is returned to the browser as plain HTML PHP files have extension ".php" 2 P a g e

PHP BASICS BY What Can PHP Do? PHP can generate dynamic page contents. PHP can create, open, read, write, delete, and close files on the server. PHP can collect form data.

3 PHP BASICS BY What Can PHP Do? PHP can generate dynamic page contents. PHP can create, open, read, write, delete, and close files on the server. PHP can collect form data. PHP can send and receive cookies. PHP can add, delete, and modify data in your database. PHP can be used to control user-access. PHP can encrypt data. With PHP you are not limited to outputting HTML. You can also output images, PDF files, and even flash movies etc. N.B: PHP is an amazing and popular language! It is used by Facebook, Yahoo, Wikipedia, and WordPress! etc. NOW LETS CREATE OUR FIRST DYNAMIC PHP WEBSITE!!! For this course I would be using a XAMPP SERVER Hope you have downloaded yours? If NOT go to this site to download it If you have installed the XAMPP then, you are good to go. Kindly follow the steps below: Step 1: Run the Xampp application then start the apache and mysql Image 1: Example of XAMPP Application 3 P a g e

4 PHP BASICS BY Step 2: Create a folder in your local server (follow the images to do so): Image 2: Open your studio folder Image 3: Open your OS (C:) Image 4: Open the XAMPP folder Image 5: All files/folder should be saved in the "htdoc folder" for it to be display by the server Image 6: Create a new folder in the htdocs folder Image 7: Rename the folder to "studio" 4 P a g e

5 PHP BASICS BY Step 3: Open your text editor (Any one of your choice). Then go to the top left corner of your editor click on File >> open folder >> OS(C:) >> XAMPP >> htdocs >> studio Then select studio ; Step 4: Create a new file and save it, To do this go to top left corner of your editor click on File >> New File (Ctrl+N) >> file >> save (Ctrl+s) >> OS(C:) >> XAMPP >> htdocs >> studio. Name the file test.php. Step 5: Type the following codes in your test.php (You can also copy and paste); <!DOCTYPE html> <html> <body> <h1>my first PHP page</h1> <?php echo "Hello World!"; echo "<br><br>"; // This is a single-line comment # This is also a single-line comment /* This is a multiple-lines comment block that spans over multiple lines */ // You can also use comments to leave out parts of a code line $a = 5 /* + 15 */ + 5; ECHO $a. "<br><br>"; $name = "Rafiu"; $surname = "adebisi"; EcHo "My name is ". $name. "<br>"; echo "My name is ". $NAME. "<br>"; Echo "My name is ". $name. "<br>"; EcHo "My name is ". strtoupper($surname). "<br>"; $x = 5; $y = 4; echo $x + $y. "<br>"; echo $x - $y;?> </body> </html> Image 8: The codes on my text editor 5 P a g e

6 PHP BASICS BY Step 6: Load your browser and type the following in your URL - localhost/studio/test.php Image 9: Display in my browser Hello World! (Output of line 8 in the image 8 above as shown in image 9 i.e in our browsers) 10 (Output of line 23 in the image 8 above as shown in image 9 i.e in our browsers) My name is Rafiu (Output of line 28 in the image 8 above as shown in image 9 i.e in our browsers) Notice: Undefined variable: NAME in C:\xampp\htdocs\studio\test.php on line 29 My name is (Output of line 29 in the image 8 above as shown in image 9 i.e in our browsers) Notice: Undefined variable name in C:\xampp\htdocs\studio\test.php on line 30 My name is (Output of line 30 in the image 8 above as shown in image 9 i.e in our browsers) My name is Mr. ADEBISI (Output of line 32 in the image 8 above as shown in image 9 i.e in our browsers) 6 P a g e

7 PHP BASICS BY 9 (Output of line 36 in the image 8 above as shown in image 9 i.e in our browsers) 1 (Output of line 37 in the image 8 above as shown in image 9 i.e in our browsers) PHP CODES EXPLANATION Line 1-5 & 41-42: HTML syntax which has been covered in our previous tutorial series. Kindly visit this link: to download our HTML/CSS class. A PHP script starts with <?php and ends with?> : e.g. (Image 8: line 7 & 39). Every lines of code inside the Angle brackets are PHP codes and all lines of code should end with semi-colon (;). Echo (e.g. Line 8, 9, 23, 36, 37 etc.). This is a PHP pre-defined function used to display output. N.B: They are NOT CASE-SENSITIVE [e.g. line 8, 36, 37 (lowercase), 23 (uppercase) and line 9, 28, 29, 30 (combination of lower and upper case)]. In PHP, all keywords (e.g. if, else, while, echo, etc.) are NOT case-sensitive. Comments (line 11, 13, etc.): A comment in PHP code is a line that is not read/executed as part of the program. Its only purpose is to be read by someone who is looking at the code. If you check the image 9 above the comments are not displayed despite the fact that they are part of the code. A comment can be a single line using double forward slash (// e.g. line 11, 13) or Hash sign (#) in PHP or can be a multiple line as shown on line using (/* */). It is very important because it makes other people to read and understand your lines of code. Variable (line 22, 25, 26, 34, 35): Variables are "containers" for storing information. In PHP, a variable starts with the $ sign, followed by the name of the variable. Note: When you assign a text value to a variable, you must put a quote around the value (e.g. $country = Nigeria ;) and numbers don t require quotes (e.g. $total = 2500; more examples on the Image 9 above. o In PHP VARIABLES are CASE-SENSITIVE e.g. the Variable $name on line 25 and 28 are the same but not the same as $NAME (line 29) or $name (line 30); that is the reason for the Notice: Undefined variable: NAME in C:\xampp\htdocs\studio\test.php on line 29 and 30 in image 9 above. You can correct it on your own. o Many variables can be combined to form a longer sentence (e.g. line 28-30, 32). Combines the Variable $surname and $name with the other text. This principle is called CONCATENATION It uses the dot (.) sign. All text or HTML tags are wrapped with quotes within PHP. o Arithmetic: Variables can add, subtract, multiply or divide each other (e.g. of addition and subtraction on line 36 and 37 respectively); HTML tags: <br> tag This is an HTML tag for adding a line break between text, 7 P a g e

8 PHP BASICS BY Other Function: strtoupper ( ) (line 32), this is the function that changes the $surname to CAPITAL LETTERS. There are thousands of functions available. You can go to to view more and how to use. Localhost/studio: is like pressing www. When we want to surf the internet. It automatically fetch the content as far as you had install the local server (XAMPP) and you save it in the htdoc folder. NOW LETS learn about Array and more function: Copy these lines of codes and paste it between the closing php tag?> and the closing body tag </body> as shown below on image 11; <?php $colors = array('red', 'blue', 'yellow', 'green', 'white', 'ash'); echo '<pre>'; print_r($colors); //Note: To view all the element in an array we can't use echo echo '</pre>'; print $colors[0]; //this will give me color 'red' echo '<hr>'; foreach ($colors as $color) { //The foreach loop is used to view all the element in array print $color. '<br>'; } echo '<hr>'; echo count($colors); // The count() function is used to count the element in the array echo "<br>"; echo rand(0, 5); // the rand() function is like a random selection of numbers echo '<hr>'; $foods = array('protein' => 'beans', 'fat and oil' => 'vegetable oil', 'carbonhydrate' => 'Yam', 'vitamin'=> 'vitamin C', 'mineral salt'=>'table salt', 'water' => 'water'); echo '<pre>'; print_r($foods); //Note: To view all the element in an array we can't use echo or print echo '</pre>'; //this is used to display all in $food array foreach ($foods as $class => $value) { echo "$class = $value <br>"; } $characters = array("a", "b", "c", "d", [1,2,3,4], "e"); echo '<pre>'; print_r($characters); echo '</pre>'; Image 10: The code in my text editor 8 P a g e

9 PHP BASICS BY?> Image 11: Result in my browser when saved and refreshed 9 P a g e

10 PHP BASICS BY Output of line 46 in image 10 above as shown in image 11(as displayed on the browser) Array { [0] => red [1] => blue 10 P a g e [2] => yellow

11 [3] => green [4] => white [5] => ash PHP BASICS BY } Output of line 49 in image 10 above as shown in image 11(as displayed on the browser) red Output of line 52 in image 10 above as shown in image 11(as displayed on the browser) red blue yellow green white ash Output of line 57 & 59 respectively in image 10 above as shown in image 11(as displayed on the browser) 6 5 Output of line 66 in image 10 above as shown in image 11(as displayed on the browser) Array { [protein] => beans [fat and oil] => vegetable oil 11 P a g e

12 PHP BASICS BY [carbonhydrate] => Yam [vitamin] => vitamin C [mineral salt] => table salt [water] => water } Output of line 69 in image 10 above as shown in image 11(as displayed on the browser) protein = beans fat and oil = vegetable oil carbonhydrate = Yam vitamin = vitamin C mineral salt = table salt water = water Output of line 76 in image 10 above as shown in image 11(as displayed on the browser) Array { [0] => a [1] => b [2] => c [3] => d [4] => Array { [0] => 1 12 P a g e

13 PHP BASICS BY [1] => 2 [2] => 3 [3] => 4 } [5] => e PHP EXPLANATION: } An array is a special variable, which can hold more than one value at a time. If you have a list of items (a list of colors), storing different type of colors in single variables could look like this: $color1 = "red"; $color2 = "blue"; $color3 = "yellow"; etc. To save us time and reduce codes we use array to store all. An Array can simply be declared using the function array ( ) or a square bracket [ ] and all the element are listed and wrapped in quote e.g. in image 10 shown above (line 44) array of $colors An Array can be Indexed Array (line 44), Associative Array (line 62) or Multidimensional Array (line 73). Indexed Array: We declare the array in PHP, give it positioning (index) i.e. the first color in the array (red) takes position [0], blue takes [1] and so on, e.g. array of colors below [0] [1] [2] [3] [4] [5] $colors = array( 'red', 'blue', 'yellow', 'green', 'white', 'ash'); OR $colors = [ 'red', 'blue', 'yellow', 'green', 'white', 'ash']; It can also be declared using indexing method $colors[0] = 'red'; $colors[1] = 'blue'; $colors[2] = 'yellow' etc. N.B: All examples above are the same, just pick any method for declaring your array either [ ] or the array ( ). 13 P a g e

14 PHP BASICS BY Associative array: In this type we declare the value and the key (index). E.g. Array of food below. The first is protein and the value is beans and next is fat and oil and the value is vegetable oil and so on... $foods = array('protein' => 'beans', 'fat and oil' => 'vegetable oil', 'carbohydrate' => 'Yam', 'vitamin'=> 'vitamin C', 'mineral salt'=>'table salt', 'water' => 'water'); N.B: The key should come first before the value and note the arrow used to link them together => (equals to then greater than sign) and all wrapped in quotes. It can also be declared alternatively using the method below $foods [ protein ] = "beans"; $foods[ fat and oil ] = "vegetable oil"; $foods[ carbohydrate ] = "yam"; etc. Multidimensional Arrays: is declaring an array inside another array e.g. array of numbers and letters below $characters = array ( a, b, c, d, [1,2,3,4], e ); If you look at the 4th index you will see an array of numbers. (Check image 11 for the output); Loops: There are three types of loop. They are 1) for loop 2) while loop 3) foreach loop. foreach loop (Image 10 line 52(for indexed array) and line 69 (for associative array)) is used to loop through the Array and output all the content of the array. Other pre-defined functions: print_r( ) {line 46, 66, 76} : It is used to output full details of the array as shown in the image 11 above for output of line 46, 66, 76. <pre> </pre> {line 45-47, 65-67}: This is an HTML tag used to display content in preformatted layouts. count ( ){line 57} : This is used to count the elements inside an array. rand ( ) {line 59} : rand function takes two parameters lower and highest value e.g. rand(10, 20) means give me a random number from 10 to 20, rand(0, 5) numbers from 0 to 5 etc. User defined function 14 P a g e

15 PHP BASICS BY A function is a block of statements that can be used repeatedly in a program. Besides the built-in PHP functions, we can create our own functions. A user defined function declaration starts with the word "function": function functionname( ) { code to be executed; } A function name can start with a letter or underscore (not a number) e.g. the addition and multiplication function below {Image 12 line 85, 98} respectively. 15 P a g e

16 PHP BASICS BY Let s copy and paste the codes below starting from line 81 to 108 as shown below {image 12} <h3>user define function</h3> <?php function add($a, $b){ $c = $a + $b; print "The result for $a + $b is equals to $c"; } // calling the add function we input add(5,4); echo "<br>"; add(12358, 3568); echo "<br><br>"; function multiply($a, $b){ $c = $a * $b; print "The result for $a * $b is equals to $c"; } // calling our made function multiply(1, 20); echo "<br>"; multiply(35, 61);?> Image 12: View from my text editor User defined function 16 P a g e

17 PHP BASICS BY Image 13: Display from the browser when the codes are saved and refreshed Output of line 92 in Image 12 as shown in Image 13 (as displayed in the browser) The result for is equals to 9 Output of line 94 in Image 12 as shown in Image 13 (as displayed in the browser) The result for is equals to Output of line 104 in Image 12 as shown in Image 13 (as displayed in the browser) The result for 1 * 20 is equals to 20 Output of line 106 in Image 12 as shown in Image 13 (as displayed in the browser) PHP EXPLANATION: The result for 35 * 61 is equals to P a g e

18 PHP BASICS BY We defined two functions add (line 85) and multiply (line 98) respectively. We passed in two parameters each into the functions on line (92, 94, 104, and 106) as shown in image 12 above. N.B: We need to call the function when needed for operation after defining it. Image 14: Other examples or arithmetic operators 18 P a g e

19 PHP BASICS BY NOW LETS APPLY ALL WE HAVE LEARNT TO MAKE OUR HTML WEBSITE DYNAMIC Step 1: Open the studio folder on your desktop then copy all the files and images to our new studio in the htdocs folder. Follow the following image steps. Image 16: Press ctrl key down and click on all the file and images, Then right click on it to copy all Image 15: Navigate to your htdocs studio folder, then right click and paste 19 P a g e

html to rename Image 18: change to index.

20 PHP BASICS BY Step 2: Open your text editor then rename the index.html to index.php. Image 17: Right click on index.html to rename Image 18: change to index.php and then press enter Step 3: Open your browser and press localhost/studio then enter. Image 19: Display in my browser N.B: No changes. 20 P a g e

PHP BASICS BY Step 4: Open a php tag <?php?> at the top of index.php, Then declare four variables: header, images, contents and footer. Also create two functions to display the images and contents.

21 PHP BASICS BY Step 4: Open a php tag <?php?> at the top of index.php, Then declare four variables: header, images, contents and footer. Also create two functions to display the images and contents. Figure 10: kindly type the following lines of codes (1-18) CODE EXPLANATION: The header and footer are only simple contents that s why we declared them as a single variable but the images and contents contains 4 and 3 items respectively so we use an array to hold them and then use the functions to fetch all the details. Step 5: Copy and paste the following codes in your declared variable $header $header = <span class='logo'>studio</span> <br/> <em class='moto'> We play it to your taste </em> <blockquote> <q>one good thing about music, when it hits you, you feel no pain.</q> </blockquote> ; $footer 21 P a g e

PHP BASICS BY $footer = Copyright 2018. All-Right Reserved ; Array $images $images =array('home' => 'microphone.jpg', 'Services'=> 'guitar.jpg', 'Gallery' => 'keyboard.jpg', 'Contact'=>'disc.

22 PHP BASICS BY $footer = Copyright All-Right Reserved ; Array $images $images =array('home' => 'microphone.jpg', 'Services'=> 'guitar.jpg', 'Gallery' => 'keyboard.jpg', 'Contact'=>'disc.jpg'); Array $contents $contents= array ("<h4>excellent</h4> <q>excellence is an art won by training and habituation. We do not act rightly because we have virtue or excellence, but we rather have those because we have acted rightly. <em><b>we are what we repeatedly do.</b></q>", "<h4>integrity</h4> <q>the greatness of a man is not in how much wealth he acquires, but in his <em><b>integrity</b></em> and his ability to affect those around him positively</q>", "<h4>professionalism</h4> <q>the true mark of <em><b>professionalism</b></em> is the ability to respect everyone else for their styles and always find something positive in every dining experience and highlight it in your thoughts and words </q>"); Figure 11: Display from my text editor 22 P a g e

23 PHP BASICS BY Step 6: Define the functions. Copy and paste the following codes inside our functions Displayimages function displayimages ($images) { foreach ($images as $key => $value) { echo $image = "<div class='menu-icon'> <a href=''> <span><img src='$value'></span> <br><span>$key</span> </a> </div>"; } return $image; } Displaycontents function displaycontents ($images) { foreach ($contents as $value) { $content = print "<div class='tumbnails'>$value</div>"; } return $content; } Figure 12: display in my text editor 23 P a g e

PHP BASICS BY Step 8: Use php function echo to display all in their respective div tags as show in the image below i.e replace the contents within your body tag [i.

24 PHP BASICS BY Step 8: Use php function echo to display all in their respective div tags as show in the image below i.e replace the contents within your body tag [i.e <body> </body>] with the codes below by typing the line of codes from line 122 to line 148 Figure 13: remove all the static values and replace it with dynamic value as shown in the image above Step 10: Hit the save button and then refresh your browser. Figure 14: Display in my browser. N.B No changes 24 P a g e

$color = ['red', 'blue', 'green', 'white', 'purple', 'pink']; Then add these codes to your CSS parts CODE EXPLANATION: In the array of

25 PHP BASICS BY Finally let s add some dynamic beauty to our CSS. Declare an array of colours inside your php block as many as you can for this project I would be using six (6) colours. $color = ['red', 'blue', 'green', 'white', 'purple', 'pink']; Then add these codes to your CSS parts CODE EXPLANATION: In the array of colours we declared index [0] as red and the last index [5] as pink. We used function rand( ); to change the indexes and this resulted in changing the colours of the container and the border of the thumbnails. 25 P a g e

26 PHP BASICS BY 26 P a g e

In the next class we will be taking PHP and MySQL on Wednesday at 2pm where we would design and code a login form that allow users to

27 PHP BASICS BY Figure 15: You can refresh as much as possible to get different colours Dear Programmers; It has been an honour as well as a privilege to walk you through this tutorial. In the next class we will be taking PHP and MySQL on Wednesday at 2pm where we would design and code a login form that allow users to Register, Sign in and Log out. Feel free to check out updates on the timing of the other courses at alltsnetwork.com/blog.php. Thank you very much for your time. All-Tech Systems & Co. Excellence, Satisfaction, Integrity & Simplicity...! 27 P a g e

Hello everyone! Page 1. Your folder should look like this. To start with Run your XAMPP app and start your Apache and MySQL.

Hello everyone! Page 1. Your folder should look like this. To start with Run your XAMPP app and start your Apache and MySQL. Hello everyone! Welcome to our PHP + MySQL (Easy to learn) E.T.L. free online course Hope you have installed your XAMPP? And you have created your forms inside the studio file in the htdocs folder using