How to include public resources in frontend plugin typo3

Question

I'm building a weather widget extension for typo3 6.1.4 using Extbase/Fluid. The extension skeleton was created with extension_builder

My question is : How can i include css and js files to the template ?

When trying to add a viewHelper i get this cryptic error

1297645190: Ext Direct error in "TYPO3\CMS\Core\ExtDirect\ExtDirectApi" with namespace: "TYPO3"
Try to clear the TYPO3 cache and / or use paramater no_cache=1 as parameter in URL typo3/ajax.php
Check also the following points:
- configuration in ext_localconf.php: registration key should be like TYPO3.MyExtension.Sample"
- URL typo3/ajax.php: namespace parameter should be like: "TYPO3.MyExtension"
- javascript: method\'s name should be like: "TYPO3.MyExtension.Sample.myMethod

I have another question closely related

Why does the backend module and the frontend plugin use the same template file ?

How to distinguish between the two ?

Answer 1

For your FrontendPlugin you probably want to add your JavaScript and CSS with TypoScript. In extbase extensions this is normally done in Configuration/TypoScript/setup.txt:

page.includeCSS.myExtension = EXT:my_extension/Resources/Public/Css/MyCss.css
page.includeJS.myExtension = EXT:my_extension/Resources/Public/JavaScript/MyJs.js

As for your 2nd question. You specified the same default Controller/Action for both your frontend plugin and your backend module.

array(
    'Weather' => 'list',
),

So both are using the same action wich is using its template.