Up next in 10
[1/9] - Beginners Symfony 4 Tutorial - Getting Started With Symfony 4
12K views
Feb 14, 2023
Symfony 4 is here. There's no better time to start learning. Let's get right into it. We're going to create our project using the symfony/website-skeleton. This is a close approximation to what you might have had should you have installed the Symfony Standard Edition back in Symfony 2 or Symfony 3. You'll learn how this is different to the symfony/skeleton. There's a ton to cover, you can read the full write up here: https://www.codereviewvideos.com/course/symfony-4-beginners-tutorial/video/getting-started-with-symfony-4
View Video Transcript
0:00
Hello YouTube, I'm Chris from CodreviewVios.com
0:03
Before watching this video, I'd like to let you know that I have over 500 similar videos available on my site, codreviewvios
0:10
If you love Symphony, then you'll feel right at home here. I'll show you how to build both websites and JSON APIs, and then we're going to talk to those JSON APIs using React and Redux
0:20
There's courses on Docker and Ansible, as well as loads on deployment and test-driven development and behavior-driven development
0:27
If you enjoy this video, please like and subscribe, and as ever, thanks for watching
0:31
Hi, I'm Chris from Coddreviewvios.com and welcome to this beginner's practical hands-on with Symphony 4
0:37
In this tutorial series, we're going to cover how to download Symphony 4 and get your Symphony site up and running
0:42
We're going to look at how we can create pages, which will touch on using routing, controllers and twig templates
0:48
We'll create our first Symphony form and we'll use that form to capture some visitor information, such as the name, email address and data birth
0:55
and we'll look at how we can convert this forum data into an email message
1:00
which will send with Gmail. Now, if you don't have Gmail, there are alternatives available
1:05
and I'll show you how to set up those, and we'll finish off by setting up our very first service
1:10
Working with services is something you will do frequently when working with Symphony, so I think it'll be useful to you to get hands-on
1:16
by creating your own services sooner rather than later. So this is going to be a very hands-on course rather than a lot of theory
1:22
and we're not intending this to be an exhaustive dive into every, for Symphony feature. I want you to think of this as a beginner-friendly exploration of
1:30
Symphony 4 and we're going to prioritize fun and hands-on practical experience, but we're still going
1:35
to learn a lot along the way. There's tons to cover, so let's jump right in. There are some
1:39
prerequisites for working with Symphony 4. You're going to need at least PHP 7.1.3, and you
1:45
will also need Composer installed. We won't be working with a database in this series, and with the way
1:51
that we're going to install Symphony 4, we do get a built-in web server also. So you won't need
1:55
to set up Apache or EngineX or anything like that at this stage. I'm just going to clear that off with Control and L
2:01
and then I'm going to type in Composer, Create, hyphen project. And I'm going to create this project based off the symphony slash website dash skeleton
2:10
And then I'm going to give it my project name, which is going to be Let's Explore Symphony 4
2:15
Now, you can give your project the name anything that you like. That's what we're going with here
2:20
We're basing our project off the Symphony website skeleton, because that's really close approximation to what we would have got
2:27
if we had installed the symphony standard edition for symphony two or symphony three
2:31
That's to say that we'll have access immediately to things like routing and twig and doctrine and monologue
2:37
But there is a much more slimmed down version called the symphony skeleton
2:41
so that we're using the symphony website skeleton. There is also the symphony skeleton
2:45
And the symphony skeleton is like a very bare bones project, which is really useful if you build in like a command line app or you know
2:52
specifically which dependencies that you want and you don want anything else brought in What I would say is if you looking to build a website with Symphony then start with the website skeleton as it going to give you most everything that you need Now the installation process is finished and when it finishes it gives you some instructions
3:08
as to what to do. So some files have been created and whatnot, review, edit and commit them
3:13
That's okay, we'll look at it in a moment. Then what's next? Run your application and it gives some instructions here
3:18
So I'll take a copy of that, just highlighting it and command C on a Mac there. And then it says browse to our local host once we've got that website
3:24
server up and running. We also recommends that we run the command Composer require server for a
3:29
better web server. So we're going to do that almost immediately. We've got some configuration
3:33
advice, modify our database URL. Well, we don't have a database in this project. That'll come in
3:38
the next project. So we're just going to ignore that for now. Then we've got some stuff about testing
3:42
and again, that'll come in a future project too. So as a quick heads up, just because we've downloaded
3:47
our project into this Let's Explore Symphony 4 directory, we're still in the development directory
3:52
so we need to switch into Let's Explore Symphony 4. I was going to control L there as well to clear it off
3:58
And so if I do a Git status now, you can see our project is actually set up for Git
4:03
and it's so far saying that all these files are untracked. And as we just saw, it was recommending that we review, edit and commit these files
4:11
So I'll just start off by doing a Git add on everything. I'll do a Git commit with a message of init
4:18
And again, a Control and L to clear off the screen there. Now we took a copy of that web server command, so I'm just going to paste that in, and then it says, we're listening on HGTP-1-2701, port 8,000, and we can browse to that
4:31
And somewhat unusually, whilst it does work, we are getting this 404 page
4:35
But there's some nice things going on here. Firstly, we actually have a working web server up and running, and something must be happening to be able to see this error page
4:44
We can click on the web debug toolbar. We can browse around in here and find out what the exception was, look in the log
4:51
And what we can see here is that there's no route found for the slash
4:55
So we're sending in a get request to the slash or the root page of our site
5:00
And Symphony doesn't know how to handle that at the moment. Now again, if we went back to the symphony skeleton, not the website skeleton
5:06
but if we'd just installed the skeleton, then we wouldn't even have a router. We wouldn't have the web debug toolbar
5:11
We'd have to do a composer require on each of these pieces in order to set them up to begin with
5:17
So I'm just going to come back here. I'm going to press Control C like it recommends to come
5:21
quit and before I do anything else, I'm going to clear that off again and we'll do a
5:24
PHP bin console. I'll just hit return here and we can see a list of all the available symphony console
5:31
commands that come configured with symphony four out of the box. And if you've ever used symphony before in a local development environment, you may be used
5:39
to running the command PHP or just bin console. You don't need the PHP at the start, but I will use them interchangeably
5:46
So you may just be used to running the command bin console, server, start, like that
5:51
and it says there's no commands defining that server namespace. Okay so a few moments ago when we installed Symphony 4 one of the recommended follow items was to run the command Composer Require Server which installs the Symphony Web Server bundle
6:05
And in doing that, we're going to get access to all those server commands that you may be used to
6:09
So let's do that now. So we'll do a Composer Require server, and I'm going to do dash-dev at the end
6:15
as we should never need the web server in a production environment. Not entirely sure of why they miss off that
6:21
in the generated output. Okay, so again, control. I'll just clear that off
6:26
And if I do a PHP bin console, we now have these commands in the server namespace
6:32
So what that means is we can run at the command, server start. That brings up our web server
6:39
And it's the same thing, basically, but we didn't have to type in that PHP
6:44
uppercase, S, etc., etc., command that I'm never going to remember in a million years
6:49
And again, I'm just going to up arrow a couple of times there to get back to that original command
6:53
and I can do a stop. and a status and anything else like that that you'd like to do
6:58
I do actually want it started, so I'm going to start it back up. There's one extra thing to cover here before we jump into PHP Storm
7:04
and start writing a bit of code, and I'm just going to do a PHP bin console debug router
7:09
There's a handy command that shows you all the configured routes in our project. And what we could see before is that there's no route found for get of slash
7:17
And so these are all the configured routes in our project, and we can see that one of them doesn't have the path of just slash
7:23
So in order to fix that error, what we need to do is define something that tells Symphony that, hey, when we're trying to access this slash route, do this
7:33
So what I'm about to show you is something that you probably wouldn't do that often
7:36
And even though this is the very first thing that you're going to do with Symphony for, this is really quite geeky
7:41
And it's quite an interesting thing, honestly, it's quite a useful thing to know that you can do
7:45
But the chances of you ever really having to do it are quite slim. And you may be wondering then why on earth I'm showing it here
7:50
Well, firstly, it's quite geeky and it's quite interesting. Secondly, there's always more than one way to do anything
7:57
So it's nice to know that multiple ways exist, and this is one such way
8:01
And thirdly, this gives us an opportunity to look at a different type of routing than you would probably normally use in Symphony 4 as well
8:07
So we're going to look at YAML routing to begin with, but most of the time moving forwards, we'll just use annotation routing
8:13
And if you're just thinking, what on earth you're talking about at this point, then hopefully it will all become a little bit clearer
8:18
But this actually allows us to get started without doing that much, and that's the biggest reason that I'm showing here
8:23
So the first thing is we're going to need a new template. We need to show something when we hit that route
8:28
So I'm just going to start off by creating a new template in here, which I'm just going to call hello page.hdml.twig
8:35
You can, of course, call it anything you like. PhP Storm's trying to be helpful there
8:39
and telling me that I want to add a load of stuff, which probably don't, actually. It would probably be better to jump into Gitignore in here
8:45
and add the dot idea folder to the Gitignore because that's just a load of stuff that comes with PHP Storm
8:52
that you don't need to share. with everyone Anyway let get rid of all these warnings and errors and so on And I just going to define a very simple template that says hello code review videos That my template done Convention generally for twig templates lowercase and use a underscore for your spaces
9:10
We'll get onto a bit more stuff around templates as we go through this short tutorial
9:14
Now simply defining a template isn't enough. We need to tell symphony that, hey, when we access this slash, this route, whatever route it is
9:21
that needs to do something. And in our case, what we're going to do is do the bare minute. to get this template rendered and returned as the response to the user
9:29
So we're going to open up under config. We want the root.comal file
9:33
I'm just going to get rid of all of that. You can leave that in. It's just a comment. I'm just going to call it Hello page
9:38
That's the name of our route. We'll see that again in a moment. We need to tell it the path
9:43
And so we've been talking about the slash. You could give this any other path
9:47
So, you know, some path or whatever or some nested path. It doesn't really matter
9:52
But whatever you put in there is what you're going to need to hit in your browser in a moment
9:57
And this is where things get a little bit geeky. So we're going to define a controller, but we've not created our own controller, and we're
10:03
going to get onto that. But again, to keep things as simple as possible, what I'm going to do is reuse one that
10:08
comes with Symphony. So under Symphony bundle, framework bundle, there's a controller called the template controller
10:15
And we can call the template action on that template controller to render out just a
10:19
template without having to define our own controller. And as I say, this is very geeky
10:23
is, in fact, it's beyond geeky, it's kind of nerdy. And the usefulness of this in a day-to-day project is quite slim
10:29
but it does mean that we don't need to define our own controller to begin with. Then we need to define a defaults
10:34
and I'm going to say our template is going to be Hello Page, HTML Twig
10:40
That should be enough. Let's jump back here, and we can check what's available in our router
10:46
We can see our newly defined Hello pages here. It accepts any method
10:50
We're only going to be sending in a get request. Don't need to worry about HTTP and HTTPS and all that, but crucially, it's going to hit when we hit the site route, the slash
11:00
So if we go back now, just give that a refresh, we can see our template is getting rendered
11:05
And we could come back and we could change this to be anything I like
11:11
Again, now this hello page points to anything I like, so I might as well just take a copy of that
11:16
I'm not the biggest fan of typing. And there we go. That still works, but if we now browse back
11:22
to the slash then that's broken again because we've just changed that path. Okay, so we've done the bare minimum to get our website up and running
11:28
I'm going to change this back actually for the moment just so that we have something when we
11:32
browse to this website. I might as well get rid of that one as well. But of course, in a real project or in the real world, you're going to need to do a bit
11:40
more than this, like in the vast majority of times. And so whilst that is quite nerdy and quite interesting to know, it's also not really
11:48
that useful. More than likely, you're going to want to define your own controller and do stuff
11:52
in there. So we're going to get onto that in the very next video