I have to make a website for a school project using html, css, php and sql , I have been struggling with this for the past few weeks and I still have absolutely no idea where to start. and whenever i ask my teachers for extra information they simply say "google it" i tried that alot but i'm not really gaining any knowlegde trough tutorials or pages of text on forums. Right now the thing that i could use is some help on how to make a static html page what i can later use to put a game database in. i'm not sure if anyone can answer my question in the way i asked it but i hope someone could try and help me. 🙂
#Start of a project
barren wadi
torpid vortex
@barren wadi Have you used html, css, php or sql before?
barren wadi
i tried using html but i just kept getting stuck at pretty much the start
torpid vortex
So you're brand new to web development and your teachers are expecting you to build a full-blown website that's linked to a database?
Have you been given a timeline for this project? @barren wadi
barren wadi
So you're brand new to web development and your teachers are expecting you to bu...
yeah well the first step they are saying i should do i create a static welcome page
the timeline for the full project is 8 weeks from now
torpid vortex
ngl that kinda makes me angry, expecting a beginner to put together a full-stack website in 8 weeks.
Anyway, static welcome page to start with. First you'll need a code editor. I'd recommend Visual Studio Code for this (it's free and works on all platforms).
barren wadi
yeah i have worked with python before so i have all of that setup
torpid vortex
Ok cool. You'll also want the "Live Server" VSCode extention
barren wadi
alr got that
torpid vortex
Cool. Open a new project folder in VSCode, and for now you'll only need 2 files:
index.html
style.css
The html file is your entry point, it has all the text for the webpage. The css file is your stylesheet, which is how you make the text on your website look how you want it to (change the colours, make the text bigger, etc.)
barren wadi
yeah i already have those setup
wait mayby i could send you my github so u can see what i have already and what i dont
torpid vortex
Sure, let's do that
torpid vortex
No worries
barren wadi
torpid vortex
https://github.com/JongeManMetBaard/MaReAl
Ok cool. First problem then. Anything you want to show up on the page needs to go inside the <body> tags, like this
torpid vortex
Only stuff you want to show up on the page. The <head> tag is for metadata (data about the website)
Show me what you've done please
barren wadi
torpid vortex
Good
Now, in VSCode, click the little "Go Live" button in the bottom right corner to start the Live Server extention
torpid vortex
That's fine
barren wadi
great
torpid vortex
Working?
barren wadi
it didn't do that but i already have it open in my browser
oak sigil
torpid vortex
Hey @oak sigil how's it going?
torpid vortex
@barren wadi is your project showing up in the web browser?
barren wadi
yeah
torpid vortex
Good. The beautiful thing about live server is that as long as its running, any changes you make to the project will automatically update the web browser
barren wadi
the thing with the server extention is that u dont have to refresh whenever u saved, pretty nice
yeah
oak sigil
@barren wadi what kind of static page you want to create any design available?
barren wadi
just a simple welcoming page pretty much
torpid vortex
Once you have that static page up and running, what's the next step?
barren wadi
ehm i whould say that connecting the database whould be a good thing to do next? and then the page for the list of games in it
oak sigil
in php?
torpid vortex
You can't just connect a database to a webpage. First you'll need to convert your html project to php
barren wadi
yeah eventually it has to be in php
barren wadi
You can't just connect a database to a webpage. First you'll need to convert you...
yeah okay, then first convert the design to php
torpid vortex
Yep, which is a little trickier. Give me a sec I'm pulling up some resources for you to follow
barren wadi
oki, thanks!
torpid vortex
What operating system are you running on?
barren wadi
Windows if that is what you mean
torpid vortex
I do
@barren wadi Does your school have a php server for you to use, or are you expected to set that up yourself? (php doesn't run on its own in the web browser)
barren wadi
i got ampps for that
torpid vortex
Ok cool. In that case in theory you should be able to just change your index.html file to be a index.php file and run it on your ampps server
barren wadi
ohw rlly, that's great
torpid vortex
Try it out, see what happens
barren wadi
ehm well is it alright if i try and figure that out tomorrow? the static welcome page is due for tomorrow so i kinda wanna focus on finishing that first
torpid vortex
Sure no worries.
barren wadi
i think what i'd like to have is a page setup like this, it doesn't have to look as good ofc but a layout that somewhat looks like that
torpid vortex
By tomorrow?
torpid vortex
Ok, what do you need help with?
barren wadi
i'm gonna first try and search it on google before i'm gonna ask u
dont wanna waste ur time that bad haha
torpid vortex
shrugs if you like. I'm free all today so can help anytime. Just ping me 🙂
barren wadi
sure will man. thanks for wanting to help me 🙂
i do have one question, i can't seem to be able to change classes in my css file @torpid vortex
torpid vortex
i do have one question, i can't seem to be able to change classes in my css file...
not sure what you mean, sorry
barren wadi
i got this class
this is in my index.html
barren wadi
but this does nothing
and this in my style.css
torpid vortex
Can you update your git repo with your code and I'll take a closer look please
barren wadi
one sec
done @rare patio
oops
sorry
@torpid vortex
nevermind @torpid vortex made it work
torpid vortex
Yeah, works absolutely fine
oak sigil
@torpid vortex do you know discord js?
torpid vortex
@barren wadi It's a little rough but here's some stuff that will help you with the CSS https://discord.com/channels/684009642984341525/1033703781046681630
torpid vortex
<@258270304944652288> do you know discord js?
Never used the discord API before, why?
oak sigil
got struck 🥲
barren wadi
<@748969844245790842> It's a little rough but here's some stuff that will help y...
i'll look into it
torpid vortex
@oak sigil I'd recommend making a new post in #1029446840778764360 with all the info so people can take a look
torpid vortex
Could be getting framerate limited by the API. Discord is very wary of bots that make lots of API calls and put limits in place to slow them down.
oak sigil
Maybe
torpid vortex
@barren wadi How are you getting on with your project?
barren wadi
Hi man, yeah so far so good. I have not touched it today or yesterday since i had other things to do. But it's decently clear for us what to do now. We now got a week to connect the webpage to the sql database and to let that show aswell, we also gotta make a footer in php wich changes related to the date it is. But i think that me and my friends can finish this week. And if we run into any problems about the sql database connection and stuff like that i always could ask you if you know any way or solution for it. @torpid vortex
Thanks for checking up with me!
torpid vortex
Thanks for checking up with me!
No worries, good luck with the project
barren wadi
@torpid vortex hi man, do you have some free time right now?
torpid vortex
Hey, I'm here, what's up?
barren wadi
i'm right now trying to connect my php code with the database i made. that seems to work just fine but whenever i try to actually get something from the db it gives an error message
torpid vortex
What's the error message?
barren wadi
i used the code from a guy on yt so i could get an understanding of how things worked
torpid vortex
A dangerous thing to do - using someone else's code without fully understanding it
barren wadi
mhm okey
torpid vortex
Show me the code please
torpid vortex
Let me check something - been awhile since I did SQL queries
barren wadi
no problem 🙂
torpid vortex
Try this:
$query = "SELECT * FROM games";
And see if that gives you anything. This statement simply says "grab everything from the games table"
torpid vortex
What's the error now?
barren wadi
and above where i was creating the query there was some html code to but that also stopped working, might not be anything important though
torpid vortex
and above where i was creating the query there was some html code to but that al...
That's fine, it will probably come back when we get this php working
barren wadi
yeah thought so
torpid vortex
Please try commenting out all the php except the query, and then below the query do:
echo $query;
See if that gives you anything to work with
torpid vortex
Hmmm. Show me your updated code please
barren wadi
torpid vortex
Yep, thought so. I always forget to add ; to the end of php lines (I'm too used to javascript where you don't need them haha). Every php line needs to end with ;
torpid vortex
It's something you have to get used to. Anytime you see a Parse error like that it's usually because you have forgotten the ;
barren wadi
but now that i have changed it the error message didn't change actually
torpid vortex
Ok, let's try something else.
barren wadi
could it be something the way i connected to the db?
i'm pretty sure the guy from the yt vid used different code for it
torpid vortex
Maybe. Take a look through this article - there is a specific php query method I wasn't aware of (most of my php experience is using Wordpress which has its own functions for this kind of thing) https://www.simplilearn.com/tutorials/php-tutorial/select-query-in-php
The query syntax itself is fine, but we might need to wrap it inside the mysqli_query function for it to work
barren wadi
what do you mean with "mysqli_query function"
torpid vortex
Yes. Here's the php documentation for it https://www.php.net/manual/en/mysqli.query.php
barren wadi
my brain hurts
torpid vortex
Then take a break
barren wadi
just trying to take in all of the lines of code haha
torpid vortex
Are you at school right now?
barren wadi
yeah
torpid vortex
How much time do you have to work on this?
barren wadi
you mean today or in total?
torpid vortex
Right now, before your next lesson or other stuff you need to do
barren wadi
well i dont have any other lessons today, this is kinda the only thing i do on school. i do gotta go home in like 1.5 hours or so
but after that if needed i can continue at home
torpid vortex
Ok. In that case, close your laptop/pc and take a 15 minute break. Go for a walk, listen to some music and clear your mind. When you come back I'll be here and we can go through the code examples together
torpid vortex
Good. See you in a bit
barren wadi
alright, i'm back @torpid vortex
torpid vortex
Ok, how are you feeling now?
barren wadi
pretty good
torpid vortex
👍
barren wadi
i was thinking btw that it could be cuz of the way i connected the code with my db
torpid vortex
Maybe.
barren wadi
my teachers said i whould have to use PDO or something
this is btw the way i connected it
torpid vortex
Does the IF statement in this code return true or false?
barren wadi
right now not since the html like i said earlier also doesn't work, but before that i used to say connected
torpid vortex
Ok good. So now, going back to our query, let's try using that mysqli_query method
barren wadi
and wich one do you mean then? the site says there is an "object-oriented style" and an "procedural style"
torpid vortex
Since you created an object with your database connection, let's go object-orientated
barren wadi
public mysqli::query(string $query, int $result_mode = MYSQLI_STORE_RESULT): mysqli_result|bool
so this line of code then
torpid vortex
$results = $conn->query("SELECT * FROM games", MYSQLI_USE_RESULT);
echo $results;
i think i understood u wrong when u said this haha
torpid vortex
Oh yeah, echo only works on strings and numbers, not objects. Try var_dump($results)
barren wadi
that does the same thing as echo then pretty much? just with variables instead of strings
torpid vortex
Ok good, we're getting somewhere
barren wadi
atleast not an error
torpid vortex
So now we know the sql query is working
barren wadi
alright so now the part where it get's processed
torpid vortex
Yes. You'll want to use a Foreach loop to go through all the search results, then split them up into separate variables and put them on the screen.
barren wadi
so i am able to use the code from before wich i commented out?
torpid vortex
Try this:
foreach($results as $key => $value) {
echo "$key => $value\n";
};
could you try and explain separate parts of the code so i can understand it?
got this code rn
torpid vortex
Sure. We're using a foreach loop, which means we're looping through all the object properties and doing something for each property. In this case, we're just printing out the key and the value for each property
barren wadi
got this error
torpid vortex
Remember the ; is needed at the end of var_dump line
barren wadi
🤦♂️
ight it printing everything now
go on with what u where saying
if there was anything left
torpid vortex
That's pretty much it I think
barren wadi
so the => in the echo is just to paste them next to each other
torpid vortex
Yes
barren wadi
and the \n at the end?
torpid vortex
That's the new line character. Take it away and all the text will appear on the same line
barren wadi
ah i get it
alright well it's printing all the 25 rows
it does show this error message
torpid vortex
Yep, that makes sense. If you take a look at your var_dump display, the [] means it's an array. php has automatically changed those to strings for you to display them within the loop
barren wadi
ohw yeah then it makes sense
so now i got all the information from each and every row
torpid vortex
Now you have to decide which information you want, and how to display it
barren wadi
well for starters i think to just have a imagine show up is enough, if i can make that work today
torpid vortex
Ok, so we need to tweak our query a bit for that https://www.w3schools.com/sql/sql_select.asp Take a look at this page and see if you can figure out how to get just the properties you want
barren wadi
one sec i gotta go give a visit to the toilet
back
let me take a look at that page
torpid vortex
👍
barren wadi
i did some of the exercises aswell and i think i get everything
so if i want to select the name of a game i just have to "SELECT name FROM games"
torpid vortex
You got it
barren wadi
so this doesn't mess with anything i have done before this like with the query
torpid vortex
What do you mean?
barren wadi
here i also select stuff, and it kinda seems like it's the same code. but there is nothing wrong with basically writing that code again
torpid vortex
Oh yeah, should be fine
barren wadi
alright great
so then when i need to select an imagine i need to use the query for the source for the imagine
digital epoch
Guys, I really think you should give to Mist at least one purple heart, he really went above and beyond to help you out. Mist, nice job, you rock 👏👏👏
barren wadi
a purple heart?
torpid vortex
It's usually better to do just a single query if you can - The fewer requests you make to the database, the faster your website will work for the user
torpid vortex
Guys, I really think you should give to Mist at least one purple heart, he reall...
Thanks 
digital epoch
a purple heart?
Yeah, you select the message that was helpful and find purple heart emoji, it will appear underneath the message if you do it correctly, just like the one above
barren wadi
but yeah i truly really appreciate what you are doing mist! don't know why or were u are getting the time from to help me but nevertheless i am really thankful for it!
Although @torpid vortex i do have to leave right now, whenever i'm home and got time i will continue with this. Again thanks for all the time u put in!
torpid vortex
No worries. I'm here if you need me 🙂