Please read this section at least one day prior to the seminar. This section outlines what you are expected to know, be able to do, or prepare in advance. Following these instructions will help you get the most out of the seminar and ensure smooth participation.
Before the start of the practical, you should be able to:
You can use OneCompiler PHP to test yourself before the lecture.
Please refer to PHP array documentation for more details on arrays.
This slide applies to you only if you plan to use your own computer for the practical.
Before the start of the practical, make sure that:
php commands from a command line.We need PHP at least version 8. For some tasks you can run it online using an online compiler. For other tasks, you need to run PHP with an HTTP server. There is a difference running in a development and production setup. At the practicals we are fine with the development version.
ssh -p 42222 {user-name}@webik.ms.mff.cuni.cz
php {script-file}php -S 127.0.0.1:8000
A PHP runtime can be configured to not report errors to the user. You can see this on webik where an PHP error result only in HTTP 500 response. This is good for production, but bad for development and debugging.
To make errors visible to everyone use the following code at the beginning of your PHP file.
<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);
There is a small PHP cheat sheet you can use.
Keep in mind that there is a PHP documentation. For most functions there are examples on how to use them.
Contemporary IDEs can help you when coding. You should alway check for tooling, or plugins, are available for a technology you plan to use. For VSCode you can use PHP Intelephense extension.
Highlights:
===, !==) to avoid unexpected type conversion.There is a set of standard recommendations for writing PHP code. Use it so you PHP code does look like PHP and not ...
Check PSR-1: Basic Coding Standard and PSR-12: Extended Coding Style Guide.
<?php
methodNamesAreInCamelCase();
if ($condition) { // Spaces after if keyword, and before opening brace that MUST be on the same line
// Code MUST use an indent of 4 spaces for each indent level, and MUST NOT use tabs for indenting.
}
for ($i = 0; $i < 10; $i++) { // Note spaces around operators
// For body
}
// You MUST NOT close the PHP tag if you do not have any intended HTML after it
Following script on webik, executed by Apache server, will yield a following exception.
<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);
$content = "{}";
file_put_contents(__DIR__ . '/data.json', $content);
Warning: file_put_contents(/home/skoda/public_html/data/data.json): Failed to open stream: Permission denied in /home/skoda/public_html/index.php on line 7
In order to make this work you need to update ACL settings. You can use following command.
# Create the file manually.
touch ~/public_html/data/data.json
# Enable access to given file.
setfacl -m u:www-data:rw ~/public_html/data/data.json
The objective of this exercise is to create a script that render JSON as HTML document. While the topic is related to web applications, most of the functionality is not web specific.
Download and save JSON file with data and familiarize yourself with it.
There are two approaches to implementing this exercise. The first approach is easier. The second is a little more complicated and general. Please select the approach based on you coding experience. Both approaches are described on the following slides.
Continue to the next slide once you are done.
Your objective is to explore the JSON structure and render it as a list of books. For each book render: title, year of publication, the publisher, the author, and reviews. For each review render author and content. See the fragment below as an example of output.
<ul>
<li>
<h2>The Quantum Enigma</h2>
<p>by Dr. Emily Carter</p>
<p>published by Future Horizons Press in 2023</p>
<p>Reviews</p>
<ul>
<li>John Doe <br/> A fascinating dive into the mysteries of quantum mechanics. Highly recommended!</li>
...
</ul>
</li>
...
</ul>
Do not hardcode the values, you must load the value from the JSON file.
Continue to the next slide once you are done.
Create a general rendering script where:
The algorithm should produce following fragment:
<ul>
<li>
<ul>
<li>title: The Quantum Enigma</li>
<li>year_of_publication: 2023</li>
...
<li>reviews: <ul> ...
</ul>
</li>
...
</ul>
Continue to the next slide once you are done.
Congratulations, if you have followed the instructions, you have just reached the end of this exercise.
Objective of this exercise is to create a simple form application. A user can fill in the form and submit it. In the next step user confirms the details and submit again. All submissions are saved using local JSON file - do not user for production! In addition, user can also list all submitted data.
Warning: This is only an introductory exercise. The chosen approach is suitable for small applications at best. We talk about better ways in the followup practical. For information about development and deployment of medium and above sized application see NSWI153.
Download event registration form and save it as registration.php. Familiarize yourself with the form and the way it submits data.
Continue to the next slide once you are done.
Create confirm-registration.php file and explore value of the $_GET variable.
Next, generate a summary of the submitted data and a confirmation dialog. The dialog must use POST method to finish-registration.php. Post the data using multipart/form-data. The objective is to allow user to review and confirm the registration.
Continue to the next slide once you are done.
Create and implement finish-registration.php script. The script must store the information using a JSON file. The JSON file location should be ./database.json, relative to finish-registration.php script file.
Create index.php file. The site will serve as a landing page for the registration. The page must contain link to the registration.php file.
In addition the page must contain list of all registered participants. For each participant list the full name and workshops they registered for.
Continue to the next slide once you are done.
Make sure that all generated HTML is valid and that you are using htmlspecialchars to sanitize output.
Feel free to add graphics or text to improve the overall content or visual appearance.
Upload all your files to the ~/public_html/ai-event/ directory at webik.ms.mff.cuni.cz .
Continue to the next slide once you are done.
Congratulations, if you have followed the instructions, you have just reached the end of this exercise.