Static resources with Morepath
==============================
Introduction
------------
A modern client-side web application is built around JavaScript and
CSS. A web server is responsible for serving these and other types
of static content such as images to the client.
Morepath does not include in itself a way to serve these static
resources. Instead it leaves the task to other WSGI components you can
integrate with the Morepath WSGI component. Examples of such systems
that can be integrated through WSGI are BowerStatic_, Fanstatic_,
Webassets_, and webob.static_.
Examples will focus on BowerStatic integration to demonstrate a method
for serving JavaScript and CSS. To demonstrate a method for serving
other static resources such as an image we will use webob.static.
We recommend you read the BowerStatic documentation, but we provide a
small example of how to integrate it here that should help you get
started. You can find all the example code in the `github repo`_.
.. _BowerStatic: https://bowerstatic.readthedocs.io
.. _Fanstatic: https://fanstatic.org
.. _Webassets: https://webassets.readthedocs.io/
.. _`github repo`: https://github.com/morepath/morepath_static
.. _webob.static: https://docs.pylonsproject.org/projects/webob/en/stable/api/static.html
Application layout
------------------
To integrate BowerStatic with Morepath we can use the `more.static`_
extension.
.. _`more.static`: https://pypi.python.org/pypi/more.static
First we need to include ``more.static`` as a dependency of our code
in ``setup.py``. Once it is installed, we can create a Morepath
application that subclasses from ``more.static.StaticApp`` to get its
functionality::
from more.static import StaticApp
class App(StaticApp):
pass
We give it a simple HTML page on the root HTML that contains a
```` section in its HTML::
@App.path(path='/')
class Root:
pass
@App.html(model=Root)
def root_default(self, request):
return (""
"jquery is inserted in the HTML source")
It's important to use ``@App.html`` as opposed to ``@App.view``, as
that sets the content-header to ``text/html``, something that
BowerStatic checks before it inserts any ```` or ``