This tutorial has a new version, check it out!

Loading CSS & JS Assets

Video not working?

It looks like your browser may not support the H264 codec. If you're using Linux, try a different browser or try installing the gstreamer0.10-ffmpeg gstreamer0.10-plugins-good packages.

Thanks! This saves us from needing to use Flash or encode videos in multiple formats. And that let's us get back to making more videos :). But as always, please feel free to message us.

We have an HTML layout, yay! Good for us!

But... it's super boring... and that's just no fun. Besides, I want to talk about assets!

If you download the code for this project, in the start/ directory, you'll find a tutorial/ directory. I've already copied this into my project. It holds some goodies that we need to help get things looking less ugly, and more interesting!

Copying web files

First, copy the 4 directories in web/... to web/: this includes some CSS, images, JS and vendor files for Bootstrap and FontAwesome:


These are boring, normal, traditional static files: we're not doing anything fancy with frontend assets in this screencast.

Go Deeper!

One way to get fancy is by using Gulp to process, minify and combine assets. See Gulp! Refreshment for Your Frontend Assets.

Ok, important thing: the web/ directory is the document root. In other words, anything in web/ can be accessed by the public. If I wanted to load up that favicon.ico, I'd use my hostname /favicon.ico - like http://localhost:8000/favicon.ico. If a file is outside of web, then it's not publicly accessible.

Including Static Assets

Ok, more work: go into the app/ directory and copy the new base.html.twig file. Paste that over the original and open it up:

<!DOCTYPE html>
<meta charset="utf-8">
<title>{% block title %}AquaNote!{% endblock %}</title>
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('vendor/bootstrap/css/bootstrap.min.css') }}">
<link rel="stylesheet" href="{{ asset('css/styles.css') }}">
<link rel="stylesheet" href="{{ asset('vendor/fontawesome/css/font-awesome.min.css') }}">
{% endblock %}
<link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
<div class="search-bar">
<form method="GET" action="" class="js-sea-search sea-search">
<input type="search" name="q" placeholder="Search Sea Creatures" autocomplete="off" class="search-input">
<header class="header">
<img class="logo-icon" src="{{ asset('images/aquanote-logo.png') }}">
<h1 class="logo">AquaNote</h1>
<ul class="navi">
<li class="search"><a href="#" class="js-header-search-toggle"><i class="fa fa-search"></i></a></li>
<li><a href="#">Login</a></li>
{% block body %}{% endblock %}
<div class="footer">
<p class="footer-text">Made with <span class="heart"><3</span> <a href="">KnpUniversity</a></p>
{% block javascripts %}
<script src="//"></script>
<script src="{{ asset('js/main.js') }}"></script>
{% endblock %}

Hey! We have some real-looking HTML! To bring this to life, we need to include some of those CSS and JS assets that we just put into web/. And here's the key: Symfony doesn't care about your assets... at all. It's not personal, it keeps things simple. You include CSS and JS files the way you always have: with tried-and-true link and script tags. These paths are relative to the web/ directory, because that's the document root.

The stylesheets and javascripts blocks

Ok ok, in reality there are two little-itty-bitty Symfony things to show you about assets. First, notice that the link tags live inside a block called stylesheets:

... lines 1 - 6
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('vendor/bootstrap/css/bootstrap.min.css') }}">
<link rel="stylesheet" href="{{ asset('css/styles.css') }}">
<link rel="stylesheet" href="{{ asset('vendor/fontawesome/css/font-awesome.min.css') }}">
{% endblock %}
... lines 12 - 41

Really, technically, that does... nothing! Seriously: you don't have to do this, it will make no difference... for now.

But, in the future, doing this will give you the power to add page-specific CSS by adding more link tags to the bottom of the stylesheets block from inside a child template. I'll show you that later. Just know that it's a good practice to put CSS inside of a block, like stylesheets.

Go Deeper!

How can you add page-specific CSS or JS files? See ReactJS talks to your API.

The same is true for script tags: I've got mine in a block called javascripts:

... lines 1 - 34
{% block javascripts %}
<script src="//"></script>
<script src="{{ asset('js/main.js') }}"></script>
{% endblock %}
... lines 39 - 41

The asset function

You're probably already looking at the second important Symfony thing about assets: the asset() function. Whenever you refer to a static file, you'll wrap the path in {{ asset() }}. This does... you guessed it! Nothing! Ok, that's not totally true. But it really doesn't do much, and you'd be just fine if you forgot it and hardcoded the path.

So what does asset() do? Well, if you eventually deploy and use a CDN, it will save your butt. With just one tiny config change, Symfony can prefix every static URL with your CDN host. So /css/styles.css becomes That's pretty awesome, so be good and use asset() in case you need it. You can also do some cool cache-busting stuff.

Other than the asset stuff, the base layout is just like before: it has a title block, a body block in the middle and some javascripts. We just added the pretty markup.

Updating show.html.twig

Let's finish this! Copy show.html.twig and overwrite our boring version:

{% extends 'base.html.twig' %}
{% block title %}Genus {{ name }}{% endblock %}
{% block body %}
<h2 class="genus-name">{{ name }}</h2>
<div class="sea-creature-container">
<div class="genus-photo"></div>
<div class="genus-details">
<dl class="genus-details-list">
<dt>Known Species:</dt>
<dt>Fun Fact:</dt>
<dd>Octopuses can change the color of their body in just three-tenths of a second!</dd>
<div class="notes-container">
<h2 class="notes-header">Notes</h2>
<div><i class="fa fa-plus plus-btn"></i></div>
<section id="cd-timeline">
{% for note in notes %}
<div class="cd-timeline-block">
<div class="cd-timeline-img">
<img src="{{ asset('images/leanna.jpeg') }}" class="img-circle" alt="Leanna!">
<div class="cd-timeline-content">
<h2><a href="#">AquaPelham</a></h2>
<p>{{ note }}</p>
<span class="cd-date">Dec. 10, 2015</span>
{% endfor %}
{% endblock %}

And yep, it's also similar to before - I swear I'm not trying to sneak in any magic! It still extends base.html.twig, prints out the genus name and loops over the notes. Oh, and hey! When I refer to the image - which is a static file - I'm using the asset() function.

Ok, ready for this? Refresh the page. Boom! So much prettier.

These days, you can do some pretty crazy things with assets via frontend tools like Gulp or PHP tools like Assetic. But you might not need any of these. If you can, keep it simple.

Leave a comment!

  • 2020-02-05 Diego Aguiar

    Hey George H

    Sorry for the late reply. By default Symfony will look inside app/Resources/views, then iniside src/AppBundle/Resources/views (and inside any other bundle you may have) and lastly, it will look inside third party bundles. I think you can configure more paths to look up by modifying your Twig config. Here you can read how:

    BTW, the structure changed considerable in Symfony4+


  • 2020-01-31 George H

    so for my project copied the modified base.html.twig in the genus folder without touching the default one in app/ressources/views which is why the page stayed ugly since the default one had no css on it whatsoever, so followup question, does a template always have to be in app/ressources/views? or can I put it somewhere else? because when I try putting it somewhere else an error shows up because it always look for it in app/ressources/views, even if I give the child template the full path in the {{ extends }}

  • 2020-01-31 Diego Aguiar

    Woops, I just got to this comment. The problem was related to what I said here?

  • 2020-01-30 Diego Aguiar

    Hey George H

    I just went through the starting steps of this tutorial and "kind of" hit the same problem as you. The thing (in my case) was that I was browsing the default page from the src/AppBundle/Controller/DefaultController.php. That controller renders the default template app/Resources/default/index.html.twig and down in the bottom, it overrides the stylesheets block without calling {{ parent() }} (which makes sense because it's just a default template that you should get rid off). So, try rendering another template that extends from the base.html.twig template without overriding its styles

    I hope it helps. Cheers!

  • 2020-01-30 George H

    I fixed it on my own, thanks anyway :)

  • 2020-01-29 George H

    OK so, I downloaded the whole project and it works fine, but I would like to know why the css and bootstrap does not render in mine, the only difference is that I created a bundle instead of using the default one, and use .yml instead of annotation as routing, could that be the problem?

  • 2020-01-29 George H

    I did not touch the files, I just copy pasted them like in the tutorial, I de-activated the addblocker and nothing changed :(

  • 2020-01-29 Diego Aguiar

    Hmm, this is odd. I just downloaded the project and all the asset files are there. Did you override the stylesheets twig block in the template? If that's not the case, I'm wondering if you are using some sort of add blocker that's blocking the assets in your browser. Try using a different one


  • 2020-01-28 George H

    no problem ill just do that in just a bit

  • 2020-01-28 Diego Aguiar

    Hey man, sorry my bad. I forgot to tell you that you need to refresh the page after opening the dev tools, so the network tab fills up, and I meant "console tab" not "source" (My bad again. I should not be so confident of my memory =/)

  • 2020-01-28 George H
  • 2020-01-28 Diego Aguiar

    Hey George H

    If you open the dev tools of your browser, in the network and source tabs, can you tell what you see?


  • 2020-01-28 George H

    Hello, well sorry to necro this, but for some reason the assets wont load at all, there is no octopus picture, no style at all, its still ugly, I tried changing/deleting a few things then putting them back to no avail, I restarted phpstorm and wamp with no luck as well

    the page works but its as if the css and the other assets are not there

    any ideas?

    I use symfony 3.4

  • 2018-03-06 Diego Aguiar

    Hey Adam Berred

    At the top of the page (at the upper right corner) we have a green button that says "Download", when you click on it, it will open a menu, then you have to click on "Course code" option and voilà!


  • 2018-03-06 Adam Berred

    Where can i download the project

  • 2017-10-09 Victor Bocharsky

    Hey Hamdi,

    Could you provide a bit more information for us to be able to help you? What are you doing when you see this error? Have you installed Composer dependencies with "composer install" command?


  • 2017-10-07 Hamdi Ali

    Fatal error: Unknown: Failed opening required 'D:\SymfonyProjects\myBlog\vendor\symfony\symfony\src\Symfony\Bundle\WebServerBundle/Resources/router.php' (include_path='.;C:\php\pear') in Unknown on line 0

  • 2017-07-13 weaverryan

    Yo @Marek!

    Here's another link to the tutorial directory that holds the CSS and js files from the code download: You'll find the CSS and JS in the web subdirectory.


  • 2017-07-13 Marek

    Can i get normal link to css and js files ? Becouse there i can download only some tar.gz file and i can ext it... So i cant move forward now :/ :) Thanks

  • 2017-06-12 Victor Bocharsky

    Hey Loes,

    Haha, not a problem ;) We also say shortcuts for Windows users when show how to do it in Mac, i.e. if there's a big difference between OS, we try to mention it. If I understand you correctly, to download the course code you need to press "Download" -> "Course Code" button in the right top corner of any course chapter page. We try to show how to do it in the first video of each course. But this feature is available for course owners and who has a paid subscription.


  • 2017-06-12 Loes Visser

    First of all, great tutorial! although, i'm might be one of the few that uses Windows haha. Did you explain somewhere how to download this folder? I can't find it.

  • 2017-05-08 Diego Aguiar

    Hey Tahkuri

    It depends on the symfony version you are using, if it's B.C, then the "console" file it's inside "app" folder, but for newer versions (I believe >= 2.8 ) it's inside "bin" folder


  • 2017-05-08 Tahkuri

    Shouldn't it be 'php bin/console cache:clear' ?

  • 2017-04-05 Victor Bocharsky

    Hey Victor,

    You're right, you have to run Symfony console through the `php` interpreter. Thanks for this note!


  • 2017-04-05 Victor Boutte'

    for windows users, from the working directory> php app/console cache:clear

  • 2017-03-08 weaverryan

    Might not be a bad idea and wouldn't be too hard at all! I've added it to our backlog so we can discuss internally. Thanks for the feedback!

  • 2017-03-07 Tony C

    I'm very pro linux, and I doubt Windows users will be in the majority. However, perhaps both formats could be included?

    Aside from this one issue, it's a very good tut. Thank you.

  • 2017-03-06 weaverryan

    Hey Tony!

    You're absolutely correct - this is a weird case where you start the tutorial from scratch instead of downloading the "start" directory code. I realize that can be a little confusing - I've tried to describe that in the opening paragraph - that you *will* need to actually download the course code at this point to get that directory. There's just no way around it, since we can't sneak that tutorial/ directory into your project any other way :).

    About the .tar.gz, that's very true about Windows. It is indeed tricky to get this right for everyone - .tar.gz is the format expected by most OSX or Linux users... but obviously .zip is easier on Windows! This is actually the first time we've gotten this feedback! And we're definitely not opposed to using zip instead, if that's easier for most - I'm just not sure! If we hear from some more Windows users about this, that'll go along way to informing us.


  • 2017-03-06 Tony C

    The beginning of this Tutorial (Chapter 1: Start Project) uses the symfony installer to create the app, which does not include the 'start' folder. Additionally, the 'download course code' is only available in tar.gz, but I'm developing on Windows. (Yes I know I can download 3rd party tools for this, perhaps the approach on this section should be adjusted to be a little more platform agnostic)

  • 2017-03-04 Ivan

    Before run project aqua_note clear cache C:\projects\aqua_note\var\cache\*
    (Windows 10)

  • 2017-02-17 weaverryan

    Ah, this is an edge-case issue! Because you're physically copying my layout file, Symfony doesn't know that it needs to re-compile Twig (the last modified time on my layout file is OLDER than your original, so it does not look like the file was updated). So, good tip!

  • 2017-02-16 Samar Samy

    wooooow it's a really fantastic tutorial . i whatched alot of symfony tutorials but i sware i nevere found like this one

  • 2017-01-16 Victor Bocharsky

    Great! I'm glad it work now. As always, easy mistakes are hard to reveal ;)


  • 2017-01-16 Halil Yaman

    Hi there,

    I have copied the Genus Controller from the downloaded documents which is:

    namespace AppBundle\Controller;

    use Sensio\Bundle\FrameworkExtraBundle\Configuration\Method;
    use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
    use Symfony\Bundle\FrameworkBundle\Controller\Controller;
    use Symfony\Component\HttpFoundation\JsonResponse;
    use Symfony\Component\HttpFoundation\Response;

    class GenusController extends Controller
    * @Route("/genus/{genusName}")
    public function showAction($genusName)
    return $this->render('genus/show.html.twig', array(
    'name' => $genusName,

    * @Route("/genus/{genusName}/notes", name="genus_show_notes")
    * @Method("GET")
    public function getNotesAction($genusName)
    $notes = [
    ['id' => 1, 'username' => 'AquaPelham', 'avatarUri' => '/images/leanna.jpeg', 'note' => 'Octopus asked me a riddle, outsmarted me', 'date' => 'Dec. 10, 2015'],
    ['id' => 2, 'username' => 'AquaWeaver', 'avatarUri' => '/images/ryan.jpeg', 'note' => 'I counted 8 legs... as they wrapped around me', 'date' => 'Dec. 1, 2015'],
    ['id' => 3, 'username' => 'AquaPelham', 'avatarUri' => '/images/leanna.jpeg', 'note' => 'Inked!', 'date' => 'Aug. 20, 2015'],
    $data = [
    'notes' => $notes

    return new JsonResponse($data);

    However I should not be updating this yet :)

    which should be:

    namespace AppBundle\Controller;
    use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
    use Symfony\Bundle\FrameworkBundle\Controller\Controller;
    use Symfony\Component\HttpFoundation\Response;
    class GenusController extends Controller
    * @Route("/genus/{genusName}")
    public function showAction($genusName)
    $notes = [
    'Octopus asked me a riddle, outsmarted me',
    'I counted 8 legs... as they wrapped around me',
    return $this->render('genus/show.html.twig', array(
    'name' => $genusName,
    'notes' => $notes

    it works fine now thanks :)

  • 2017-01-16 Victor Bocharsky

    Hey Halil,

    Wrapping notes with a quotes is a mistake - in this case Twig thinks about 'notes' as a string, so the correct example is: {% for note in notes %}. But if you get "Variable notes does not exist..." error in this case - you will need to check the render call in the controller, are you passing the $notes variable there as a second argument, like:

    return $this->render('your-template.html.twig', [
    'notes' => $notes,
    // other variables...

    Please, ensure you're passing the notes variable into the template and let me know if it help, but I don't think it's due to the windows environment.


  • 2017-01-16 Halil Yaman

    when i type : it renders the page as:

    {"notes":[{"id":1,"username":"AquaPelham","avatarUri":"\/images\/leanna.jpeg","note":"Octopus asked me a riddle, outsmarted me","date":"Dec. 10, 2015"},{"id":2,"username":"AquaWeaver","avatarUri":"\/images\/ryan.jpeg","note":"I counted 8 legs... as they wrapped around me","date":"Dec. 1, 2015"},{"id":3,"username":"AquaPelham","avatarUri":"\/images\/leanna.jpeg","note":"Inked!","date":"Aug. 20, 2015"}]}

  • 2017-01-16 Halil Yaman

    I work in windows enviorenment, I cleared the caches as "php bin/console cache:clear" and even manualy deleted the files in cache folder...

  • 2017-01-16 Halil Yaman

    Hello, thanks for the great tutorial, I received an error "Variable "notes" does not exist in genus\show.html.twig at line 25." which is : {% for note in notes %}. After changing the code to : " {% for note in 'notes' %} the page loaded but not as expected. The notes are missing.

  • 2016-12-01 Yoann

    +1 for Tadas :) It works better if you clear the cache !

  • 2016-11-04 weaverryan

    Hey @Assadiki!

    In this page, you should see a "Download" button in the upper right. Click that and the select "Course Code". This will download a file called symfony.tar.gz When you unzip this, you will see a start/ directory and a finish/ directory. Both of these have a tutorial/ directory inside if it (it has the same contents in both cases).

    Let me know if you find it!


  • 2016-11-04 Assadiki

    hello, how can I download the application, I don't find the "tutorial" folder, I don't know where I can do it. can you please share the donwload link? thanks

  • 2016-09-27 Victor Bocharsky

    Hey Tiago,

    Yes, sure! Just add the same block in your child template, i.e. add {% block meta-keywords %}overwrite base block content here!{% endblock %} to the home page template (which extends base template) and that's it! Do it with any parent block you want ;)


  • 2016-09-27 Tiago Farias

    Hi, a little ask.
    Can i change every party of base twig template by passing {% block [...] %} ?
    For example: in my home page i add {% block meta-keywords %}same{% endblock %}
    Thanks for this great course!

  • 2016-08-23 Victor Bocharsky

    Hey James,

    Thanks for your kind words! The most popular OS e-commerce project is Sylius. It has a lot of distributed bundles, including the cart bundle. But probably it's not ready for Symfony 3 yet. You could also check bundle, looks pretty popular on GitHub.


  • 2016-08-23 james

    Very good tutorial until the end! Is there any bundle for a shopping cart for Symfony 3?


  • 2016-07-16 nickmarinho

    After searching a lot, i found it, thanks.

  • 2016-07-16 weaverryan

    Hey Luciano! Check out my comment over here about that :)

  • 2016-07-15 nickmarinho

    I can't find tutorial directory, please help me

  • 2016-07-04 Tadas

    dont 4 get to write in console, from working directory ./bin/console cache:clear "... & Boom. Soooo much prettier ..."

  • 2016-06-29 weaverryan

    Yeaaaa! Super happy we got it working!

    So, in general, the explanation of app_dev.php and app.php is here:

    But, your solution of changing the .htaccess from app.php to app_dev.php *should* have also worked (you should have then been able to go to http://aqua_note/genus/octopus and it would have loaded through the app_dev.php file). So, you're thinking correctly :). My guess is that Apache is not properly reading the web/.htaccess file - which is most commonly caused by not having the "AllowOverride All" in your Apache VirtualHost.

    I hope that clears things up!


  • 2016-06-29 Ilya

    I'm sorry the problem was that I didn't install PHP Annotation plugin.
    Now It works fine!!!
    Many thanks to you!

  • 2016-06-29 Ilya

    Hi (one more time)
    Problems with app_dev.php keep following me =(

    On next lesson when I go to http://aqua_note/app_dev.php/genus/octupus/notes it gives
    "No route found for "GET /genus/octupus/notes"
    404 Not Found - NotFoundHttpException
    1 linked Exception: ResourceNotFoundException »"
    Logs (ERROR - Uncaught PHP Exception Symfony\Component\HttpKernel\Exception\NotFoundHttpException: "No route found for "GET /genus/octupus/notes"" at C:\Apache24\htdocs\aqua_note\var\cache\dev\classes.php line 2357 )

    When I go http://aqua_note/app.php/genus/octupus/notes It gives
    "Oops! An Error Occurred
    The server returned a "404 Not Found".
    Something is broken. Please let us know what you were doing when this error occurred. We will fix it as soon as possible. Sorry for any inconvenience caused. "

    When I go http://aqua_note/genus/octupus/notes It gives
    "Not Found

    The requested URL /genus/octupus/notes was not found on this server."

    Sorry for my obsession

  • 2016-06-28 Ilya

    Hey, Ryan
    I tried http://aqua_note/app_dev.php/genus/octopus and IT WORKS!!! So сan you briefly explain what was the problem? I tried change in htaaccess from to app_dev.php and it did't help
    I am very grateful for your help. I was suffering about 4 days with this issue.
    Thanks to all of you!

  • 2016-06-28 weaverryan

    Ah, this is a good sign! This error - No route found for "GET /" - is coming from Symfony, which means that it's hitting our app! And the error makes sense - at this point in the project, we haven't created a "homepage" yet.

    So, try going to http://yourhostname.local/app_dev.php/genus/octopus

    The key is having the app_dev.php in the URL. Without this, Apache will either (A) not know what to do or (B) will try to execute app.php, which boots symfony in the "prod" environment (we talk about that in the next course). The reason that you don't see me using app_dev.php in the URL during the screencasts is that the built-in web server is pre-configured to know to use app_dev.php.

    Let me know if this helps!

  • 2016-06-28 Ilya

    1. All progects in Apache24\htdocs
    2. It gives an error No route found for "GET /" 404 Not Found - NotFoundHttpException 1 linked Exception: ResourceNotFoundException ».
    Error from logs (ERROR - Uncaught PHP Exception Symfony\Component\HttpKernel\Exception\NotFoundHttpException: "No route found for "GET /"" at Apache24\htdocs\aqua_note\var\cache\dev\classes.php line 2357 )

  • 2016-06-26 weaverryan

    Hey Ilya!

    Hmm! Were those other projects Symfony projects? What happens if you try going to "http://yourhostname.local/app_dev.php"? If you don't have the proper rewrite rules, then you may be getting a 404 because Apache doesn't know what file to execute if none is in the URL. And if those other projects have an index.php file, then it might be working there because Apache knows to look for that file :).

    You were definitely right to add the above "use" statement! But I don't think it's the problem. Your error - "The requested URL /genus/octopus was not found on this server" is coming from your web server - not Symfony. If the @Route isn't configured properly, you would get an error from Symfony. What I mean is, we're not *yet* even hitting the Symfony app - so we can definitely say the problem is not (yet) with our code :).


  • 2016-06-24 Ilya

    I tested same vhosts on other project It WORKS!
    I'm thinkin about routing 'couse I remembered that when I was typing
    * @Route()
    in 3.1 First Page Wildcards PHP Storm didn't suggest autocomplete so I copy\paste line
    "use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;"
    Maybe that's the problem?

  • 2016-06-24 Ilya

    Victor, Hi
    Yes, I think problem in Apache. Maybe permissions...
    I tried to change vhosts as written with "Require all granted" and with\without htaaccess
    Main problem when DocumentRoot is "project_name/web/app_dev.php" css,js,images is not loaded to the browser
    when DocumentRoot is "project_name/web" I'm getting "Not Found

    The requested URL /genus/octupus was not found on this server."
    I'm using Apache 2.4.20 and PHP 7.0.7 on Windows 7

  • 2016-06-24 Victor Bocharsky

    Hey, Ilya!

    If assets loads properly with built-in PHP web server, but don't load on a real web server (Nginx, Apache, etc.) - so most probably you have a problem with your web server configuration. From your stackoverflow link I realized you have a problem with Apache config, right?

    Could you check your VirtualHost configuration with the Configuring a Web Server Symfony official docs? There's an example how to configure Apache web server properly for Symfony app.


  • 2016-06-24 Ilya

    I think the problem was in my vhost I finally found same issue on stack overflow
    but after that manipulation i got 404. And I don't understand where coul'd be problem now
    P.S. Thanks for your respond and sorry for my English

  • 2016-06-24 weaverryan

    Oh no!

    Let's see if we can fix this once and for all! If you can help me answer a few questions, I bet we can get to the bottom of it. I have a feeling that it's not your fault - just some small misconfiguration somewhere (and it could be our fault!)

    1) What assets are you not seeing exactly? For example, if you go to /genus/octopus - do you see the Octopus image? Do the CSS files load?

    2) Supposing the CSS files - like styles.css - are not loading, if you view the HTML source of your page and click the CSS link (which should open it in a new browser tab) - does that work? If not, can you paste the full URL from this new tab? Here's a screenshot of the "link" in the HTML source that I want you to click - this is in Chrome - other browsers may not make this a link (so use Chrome for this!)

    I'm sure we can work out the problem :).


  • 2016-06-23 Ilya

    I have the same issue, i cleared cache... but all files in web folder are 404 i cheked evrything million times and still got "failed to load resource: the server responded with a status of 404 (Not Found)" I'm using 3.1.1, whats wrong with symfony or problem in me?

  • 2016-06-14 weaverryan

    Hi Karolina!

    I know your solved your own problem, but I just wanted to answer your question/comment about Symfony projects just being folders :). In your case, it was failing to load the vendor/autoload.php file. The vendor/ directory is populated by Composer, so if you're ever missing anything in there, just run:

    composer install

    Or "php composer.phar install" - it depends on how you installed Composer. So, Symfony projects *are* just a directory, but somehow you lost the contents of your vendor/ directory, which is totally fine, as long as you re-install via Composer!


  • 2016-06-14 Saresa Smith

    Thanks a bunch!!

  • 2016-06-12 Karolina Milewska

    (self-reply, lol)
    It's OK now, all I needed to do next is shut down everything but Ubuntu (close PHPStorm, server, the other terminal, clear browser cache) :)

  • 2016-06-12 Karolina Milewska

    Hello! I had the same issue, so another time I made a backup of the plain project (without assets) and then reverted to it (just swapped the folders) when the asset loading didn't work yet again. But now I get console errors even trying to clear the cache :(

    PHP Warning: require(/home/karolina/.local/share/Trash/files/aqua_notes/app/../vendor/autoload.php): failed to open stream: No such file or directory in /home/karolina/.local/share/Trash/files/aqua_notes/app/autoload.php on line 11
    PHP Fatal error: require(): Failed opening required '/home/karolina/.local/share/Trash/files/aqua_notes/app/../vendor/autoload.php' (include_path='.:/usr/share/php') in /home/karolina/.local/share/Trash/files/aqua_notes/app/autoload.php on line 11

    (be damned someone who wrote on S.O. that SF projects are just folders...)
    What do I do to avoid going through all the steps to this point yet again? It would probably do me good to retype all from scratch but I have no time to do it again! :(

  • 2016-05-25 weaverryan

    Hey Chris!

    Thanks man! If you're a subscriber, you'll see a "Download" link on the upper right of this page. If not, you can also find the start code up on our GitHub page:


  • 2016-05-24 Chris Christian

    hi great works super tutorial !! where can i find your css, vendor, images, js and their content ?

  • 2016-04-01 Maciek

    Hi! Thanks for the great tutorial. You should mention about clearing the cache after copying the files.

  • 2016-03-13 aitorpc

    Thanks a lot! I worked after clearing the cache!

  • 2016-03-05 Eddy de Boer

    First time, for me neither, but I think clearing the cache helps: $ bin/console cache:clear

  • 2016-02-23 cescou

    It's working now. I did reload the base.html.twig and it worked just fine. Thank for your help.

  • 2016-02-23 weaverryan

    Hey there!

    Check a few things:

    1) After moving the files, you should have a web/css/styles.css file in your project. Is it there?
    2) In base.html.twig, you should have all the `link` tags that you see here:

    Also, if you use the Network tab of your browser's debugging tools, do you see that the CSS files are causing 404?s Or do they not show up at all?


  • 2016-02-23 cescou

    Css styles are not loading.I am working with version 3.0.2. I put the four folders from the start folder in tutorial.

  • 2016-02-01 Ivan


  • 2016-01-30 diegotham

    You can download the "Course Code" from the top right where it says "Download"

  • 2016-01-29 Ivan

    I have version 3.01 and don't have folder tutorial.
    Where can I take folders css, images and ect.?

  • 2016-01-10 weaverryan

    Hey Daniel!

    That's a loaded question - a lot of people have opinions on that. I personally have an `assets` directory at the root of my project (so not in web) and I use gulp to process and move everything into `web/`. The Symfony Demo actually uses app/Resources/assets, which makes a lot of sense, but it is a bit deeper in your directory structure: