PHP Basics

Creating a Form

Maximiliano Firtman

Maximiliano Firtman

Independent Consultant
PHP Basics

Check out a free preview of the full PHP Basics course

The "Creating a Form" Lesson is part of the full, PHP Basics course featured in this preview video. Here's what you'd learn in this lesson:

Maximiliano begins the Cryptomasters example by creating an index.php file and coding a basic HTML form. The form will take a US dollar value as input and convert it to an equivalent cryptocurrency value.

Preview
Close

Transcript from the "Creating a Form" Lesson

[00:00:00]
>> Maximiliano Firtman: I will open a folder that you already have that's kind of empty, there is only one file there, crypto masters. So git, no, I don't want it, okay I have just a URL here that we will use in a second. So we are going to make our first server side rendering webpage with PHP, we're going to create a crypto converter.

[00:00:23]
So I well, I have two bitcoins, I wanna know how many US dollars do I have, okay? Something like that, not a big deal, but we will learn at least some ideas in the meantime. And that's the URL that we are going to use, so it's an open free API available, okay?

[00:00:41]
We will get into that later, so first I'm in the folder, the next step is to open the server, so I'm going to open a terminal here, so terminal, new Terminal. And it's always the same thing, it's php -S localhost on any number, okay? 4000, if you like, 4000, we can stay with 4000, okay?

[00:01:06]
So, we create index php first, and again it's a php, but actually what I want is html, and I can still use Emmet here. Again, Emmet is this quick thing to create an html, but it can be even, I mean, if you like it, it's fine, if not, we can just make it even better just with this.

[00:01:28]
This is Crypto Masters, and then H1, you will add CSS later to make it better. We won't care in this particular example about CSS, by the way, is that a valid HTML? it is valid HTML code, I don't need the HTML tag, I don't need the body tag, the head tag, they are completely optional.

[00:01:53]
I will just keep it like that so we can keep it shorter if you can't leave with that code, just use if the full HTML, but this is perfectly W3C valid HTML5 code, okay? The body is optional and everything else is optional in actually, but I know that it hurts, but so we can just focus on important.

[00:02:15]
So and everything will fit in one screen which is a good idea, what's the idea? I want to form, so I want to say to the user something like, hey, enter the amount of crypto, so I want to a form, okay? I'm going to write a semantic form from HTML, so it's a form, we have a label, that will say amount, but maybe I don't need the paragraph, I can just use this with an input.

[00:02:48]
>> Maximiliano Firtman: Okay, and then I will use a label with crypto, with a select, with a couple of options for crypto. So, you can make have Bitcoin, let's start with two Bitcoin or ether, that's the crypto on Ethereum, okay? The API that we will use accept both AI, it has more Solana and other cryptos, okay?

[00:03:15]
But you can add more later, this is playing HTML, very basic HTML from again from the 90s, it works today also, it's validated today. For the labels you actually need to apply the four attribute, I'm not sure if you know this, it's for accessibility purposes, so this can be amount, so I need the input to have its own amount.

[00:03:38]
And in this case, this is gonna be the crypto id crypto, we are not going to write JavaScript, we are not going to do client-side rendering. We're going to do server-side rendering so we're going to see how that works.
>> Maximiliano Firtman: Do you have any question on the HML?

[00:04:00]
Probably I will add some small CSS shop, but, I mean, it's not necessary, but also, I will need an input type submit, so it will submit the form, convert, things like that. The slide in, to input.
>> Maximiliano Firtman: Actually, let's work with the value, because I'm not using it, but I can use a button if you don't like input, type, method, I can use a button if you prefer.

[00:04:40]
>> Maximiliano Firtman: Both are exactly the same, so both are by the input or button can work, type submit will actually, when you press on that button, will submit the current form. And I don't know why my form disappear, so my first should look like this, okay? Do we have any PHP here?

[00:05:02]
No, not yet at least.
>> Maximiliano Firtman: Let me see that in action to see how it looks like, so local host 4000, it looks like new, I mean, it's not so bad, right? It's not so bad, so the idea is that I want to type something here, and I wanna click Convert, and somehow, I want to see the conversion, okay?

[00:05:29]
So, we're going to see how this works, and that will let us to introduce super global variables in PHP.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now