Create your First Home Page in Symfony
Environment Setup – Automatic Clear Cache
At the end of installation process will have: C:\wamp64\www\symfonytest>cd first_test_symfony
Inside the folder will be the folder structure of my project:
– app
– bin
– src
– tests
– var
– vendor
– web
– composer.json
– LICENSE etc…
Open your broser at: http://localhost/symfonytest/first_test_symfony/web/ to see the welcome page
Go to web\app.php and change the line:
$kernel = new AppKernel(‘prod’, false);
to
$kernel = new AppKernel(‘prod’, true);
This will activate – (‘prod’, true) – the production environment, this mean cache will not be saved, you can change file and reload in browser on the fly and see changes.
If – (‘prod’, false) – you can not reload from browser code changes
Go to var\cache\dev and var\cache\prod to see cache files for ‘dev’ and ‘prod’ environment.
Net Beans IDE
1. Run Net Beans IDE
2. File> New Project> PHP> PHp Application with Existing Sources> NEXT> Browse: C:\wamp64\www\symfonytest>first_test_symfony
HTML Render
1. Controller Request
Go to src\AppBundle\Controller\ -> here you will find all php codes for controllers
Open src\AppBundle\Controller\DeafaultController.php
Change the render page to indexmy.html.twig
return $this->render('default/indexmy.html.twig ...
2. .twig.html
Go to app\Resources\views\default\
and create indexmy.html.twig
{% extends 'base.html.twig' %}
{% block body %}
<h1>This is my first home page</h1>
{% endblock %}
{% block stylesheets %}
<style>
h1 { font-size: 36px; }
</style>
{% endblock %}
Notice that {% extends ‘base.html.twig’ %}
Go to app\Resources\views\base.html.twig
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title> {% block title %}Welcome{% endblock %}</title>
{% block stylesheets %}{% endblock %}
<link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
</head>
<body>
{% block body %}{% endblock %}
{% block javascripts %}{% endblock %}
</body>
</html>
The process is:
return $this->render(‘default/indexmy.html.twig: -> call html.twig template -> extend base.html.twig
The rendered code inside the browser will be:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"><meta charset="UTF-8">
<title>Welcome!</title>
<style>
h1 { font-size: 36px; }
</style>
<link rel="icon" type="image/x-icon" href="http://localhost/symfonytest/first_test_symfony/web/favicon.ico">
</head>
<body>
<h1>This is my first home page</h1>
</body>
</html>
We can write:
{% extends 'base.html.twig' %}
{% block body %}
<h1>This is my first home page</h1>
<strong>Test</strong> HTML tags
<br>
<a href="http://www.lucedigitale.com">Visit Luce Digitale</a>
<br>
{% include 'my_code.html.twig' %}
{% endblock %}
{% block stylesheets %}
<style>
h1 { font-size: 36px; }
</style>
{% endblock %}
Notice:
{% include ‘my_code.html.twig’ %} -> include a HTML code from a file in app\Resources\views\my_code.html.twig
Warning: you can not write native php code inside a .twig template, you need create an Extension Class (official docs at: http://symfony.com/doc/current/templating/twig_extension.html)