Lesson 1
Creating Your First Symfony App
Introduction to Your First Symfony App

Welcome to the first lesson in our "Implementing MVC ToDo App with PHP Symfony" learning path. We'll start by exploring Symfony's fundamentals before diving into building a ToDo application using the MVC pattern.

In this lesson, we'll get a basic Symfony app up and running. We'll set up a project, understand its structure, examine a simple controller, and see how to render a message using Twig, Symfony’s template engine. By the end of this lesson, you'll have a working Symfony app and a solid understanding of its core components.

What is Symfony?

Symfony is a popular PHP framework used for building web applications. It provides a set of reusable PHP components and a structure that helps you organize your code efficiently. With Symfony, you can create scalable and maintainable applications quickly and with less effort.

Key Features of Symfony:

  • Flexibility: Symfony is highly customizable. It can be used for small websites as well as complex enterprise applications.
  • Robustness: It comes with a wide range of built-in features that make development faster and easier, such as routing, templating, and security.
  • Community: Symfony has a large and active community. This means you can find plenty of tutorials, plugins, and support.

By learning Symfony, you'll gain the skills to develop powerful PHP applications more efficiently.

Symfony and MVC Pattern

Symfony encourages the use of the MVC (Model-View-Controller) pattern, separating the application into three components:

  • Model: Manages the data and business logic.
  • View: Handles the presentation using Twig templates.
  • Controller: Processes requests and returns responses.

In this lesson, we focus on Controllers and Views, creating a simple controller that renders a Twig template. This foundational understanding is crucial as we progress in building our Symfony ToDo application.

Setting Up The Symfony Project

To get started, it's useful to know how to set up a Symfony project. In a pre-configured environment, Symfony might come pre-installed, but setting it up manually provides valuable insights.

You can create a new Symfony project using Composer, a dependency manager for PHP. Running the following command in your terminal creates a new Symfony project:

Bash
1composer create-project symfony/skeleton my_project

This command creates a new directory named my_project containing the basic structure of a Symfony application that's ready to be used.

Understanding The Project Structure

Once created, the Symfony project consists of several directories and files. Here's an overview of key components:

  • config/: This directory contains configuration files that define how the application behaves, such as database connections and service configurations.

  • src/: This directory is where the PHP code resides. Controllers, entities, and other PHP classes are placed here, making it the core part of the application's code.

  • templates/: This directory holds Twig templates, which structure how the website looks. HTML skeletons for rendering the web pages are managed here.

  • public/: This is the web root directory. The index.php file inside it is the entry point for the application, directing web traffic to the appropriate controllers.

Bundles PHP File

The config/bundles.php file acts like an app's registry, registering bundles that Symfony will use. Bundles are sets of reusable features encapsulated in a single package, like user authentication or email handling. Here’s an example configuration:

php
1<?php 2 3return [ 4 // Enables Symfony's core functionality 5 Symfony\Bundle\FrameworkBundle\FrameworkBundle::class => ['all' => true], 6 7 // Enables the Twig template engine 8 Symfony\Bundle\TwigBundle\TwigBundle::class => ['all' => true], 9];

In this file, Symfony registers the FrameworkBundle for core functionality and the TwigBundle to enable Twig for templating.

Defining the Routes

The config/routes.yaml file defines the routes, which map URLs to specific controllers and actions. When a user visits a URL, Symfony checks this file to determine which controller should handle the request. Here’s an example route configuration for this lesson:

YAML
1# Defines a route configuration 2index: 3 # Sets the URL path for this route 4 path: / 5 # Links the URL path to a specific method of a controller 6 controller: App\Controller\DefaultController::index

In this lesson, we focus on creating a simple route that maps the root URL to a controller, which we'll explore in more detail in upcoming lessons.

Default Controller Example

A controller is a PHP class that handles incoming requests and returns responses, directing user requests to the appropriate part of the application.

For this lesson, let's look at a basic example of a DefaultController.php file with DefaultController class, located in the src/Controller/ directory.

php
1<?php 2 3namespace App\Controller; 4 5// Base controller class 6use Symfony\Bundle\FrameworkBundle\Controller\AbstractController; 7// HTTP response class 8use Symfony\Component\HttpFoundation\Response; 9 10class DefaultController extends AbstractController 11{ 12 // Method to handle requests to the root URL 13 public function index(): Response 14 { 15 // Renders the Twig template base.html.twig and passes the message to it 16 return $this->render('base.html.twig', ['message' => 'Hello Symfony World!']); 17 } 18}

This example defines the DefaultController class, which extends AbstractController, providing access to several helper functions. The index method in the controller is mapped to handle requests to the root URL (/). When this method is called, it uses the render function to render the base.html.twig template with a message variable containing the text "Hello Symfony World!".

We'll cover more about controllers and their capabilities in later lessons. For now, focus on getting your first Symfony app running by following the above structure.

Using Twig To Render Templates

Twig is Symfony’s template engine, enabling the separation of HTML and PHP code. When the controller's index method renders a Twig template, the message variable is passed to the template and displayed.

An example Twig template might look like this:

HTML, XML
1<!DOCTYPE html> 2<html> 3<head> 4 <title>Welcome</title> 5</head> 6<body> 7 <!-- Displays the message passed from the controller --> 8 <h1>{{ message }}</h1> 9</body> 10</html>

This template renders an HTML page with a title "Welcome" and displays the text stored in the message variable inside an <h1> tag. Since the controller passes the message "Hello Symfony World!" to the template, this text will be displayed on the webpage when the root URL is accessed.

Running Your Symfony App

To get your Symfony app up and running, you can use PHP's built-in server by entering the following command:

Bash
1php -S localhost:3000 -t public

Here's what the command does:

  • php starts the PHP interpreter.
  • -S tells PHP to start its built-in web server.
  • localhost:3000 specifies that the server should run on your local machine (localhost) at port 3000.
  • -t public sets the document root to the public directory of your Symfony project. This means the server will serve files from the public folder. The index.php file inside this folder handles all incoming requests.

Using PHP's built-in server is simple, requires no extra installations, and is immediately available since it comes with PHP. In the CodeSignal environment, the server will start automatically on localhost:3000, so you're ready to begin without any extra setup!

Accessing Your Symfony Page

Once the server is running, you can view your Symfony application by navigating to http://localhost:3000 in your web browser. Here’s what will happen:

  1. Symfony will route the request to the / path, handled by the index action of the DefaultController.
  2. The DefaultController will render the base.html.twig template.
  3. The template will display the message "Hello Symfony World!".

The resulting response is a simple, elegant HTML page showing the message within an <h1> tag.

Summary And Next Steps

In this lesson, we've laid the groundwork for our Symfony app. We've covered:

  • What Symfony is and its key features.
  • How to set up a Symfony project.
  • The structure of a typical Symfony project.
  • Configuring bundles and defining routes.
  • Creating a default controller.
  • Using Twig to render templates.
  • Running and accessing your Symfony app on localhost:3000.

Use the CodeSignal IDE to practice the code examples provided. In the next lesson, we will dive deeper into creating more complex routes and handling user requests. Keep practicing, and you’ll become proficient in no time!

Enjoy this lesson? Now it's time to practice with Cosmo!
Practice is how you turn knowledge into actual skills.