Development workflow for Pyramid/Cornice REST Service + AngularJS GUI

[Achim Domma]

Hi,

I want to develop a REST service using Pyramid + Cornice. The UI should be implemented in AngularJS. I'm quite happy with my "normal" Pyramid/Python workflow using virtualenvs, pserve for local development, ... The tool of choice in the Javascript world seems to be http://yeoman.io/ The service and the ui are of course seperated in theory, but they build one project and I want to manage them together. Service and UI will be served from the same domain, so that I don't have to care about cross domain access stuff like CORS. I would like to have the same for my development system, so I would have to "build" the Javasript files into my Pyramid project.

I just wonder if somebody else has some recommendations how to organize that kind of project. I found no template or scaffold which seems to fit the use case, but I assume I'm not the first person with this problem. Any starting point would be very apprecidated!

cheers,
Achim

[Tres Seaver]

-----BEGIN PGP SIGNED MESSAGE-----
Hash: SHA1

On 04/22/2014 08:53 AM, Achim Domma wrote:

> Service and UI will be served from the same domain, so that I don't
> have to care about cross domain access stuff like CORS. I would like
> to have the same for my development system, so I would have to
> "build" the Javasript files into my Pyramid project.

You don't necessarily need to have the front-end artifacts in the same
place. For instance, I've added a minimal Python stub to the JS/CSS
checkout for one project. It has a 'setup.py':

$ cd /path/to/frontend
$ cat setup.py
from setuptools import find_packages
from setuptools import setup

setup(name='frontend',
version="0.1",
description='Angular frontend',
packages=find_packages(),
include_package_data=True,
zip_safe=False,
)

and an almost-empty Python package:

$ cat frontend/__init__.py
def includeme(config):
config.add_static_view(name='frontend', path='../src')
# Let other apps reuse our library aassets.
config.add_static_view(name='lib', path='../src/lib')

The Angular app is in 'src', and the external dependecies are in
'src/lib'.

I then pull in its static views via 'config.include("frontend")' in
my Pyramid app.


Tres.
- --
===================================================================
Tres Seaver +1 540-429-0999 tse...@palladion.com
Palladion Software "Excellence by Design" http://palladion.com
-----BEGIN PGP SIGNATURE-----
Version: GnuPG v1.4.11 (GNU/Linux)
Comment: Using GnuPG with Thunderbird - http://www.enigmail.net/

iEYEARECAAYFAlNWi+IACgkQ+gerLs4ltQ7m/QCgrmgrPKwfcYzAhuWK3zjYQX32
qTgAoKiLrG23wOJLNuQgq4aC68vu6wuH
=rGSg
-----END PGP SIGNATURE-----

[Paul Everitt]

Tres and I used this on a recent project. I also used Angular's mock httpService to write most of the REST API (GET/POST/PUT/DELETE) as an in-browser mocked service. Tres then came back and converted everything to Cornice once the customer liked how it acted. Worked quite well.

I would be interested in making an Angular-Pyramid scaffold. I just can't tell if it should be friendly to Angular people (Grunt/Bower/npm etc.) or Pyramid people regarding bootstrapping.

--Paul

[Michael Merickel]

I'm looking forward to trying out https://github.com/reebalazs/buildout.javascript.yeoman or some variant of such to easily bootstrap a project with all the necessary fixins. Perhaps it's worth looking at.

--
You received this message because you are subscribed to the Google Groups "pylons-discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to pylons-discus...@googlegroups.com.
To post to this group, send email to pylons-...@googlegroups.com.
Visit this group at http://groups.google.com/group/pylons-discuss.
For more options, visit https://groups.google.com/d/optout.

[Vincent Catalano]

I recently configured my Pyramid application to use Yeoman. I had to move a few directories around and change a few of the build configuration parameters, but this is what my folder structure looked like:

+-myapp/

  +-alembic/

  +-myapp/

  | +-app/

  |   +-auth/

  |   +-admin/

  | +-models/

  | +-static/

  |   +-assets/

  |     +-bower_components/

  |   +-scripts/

  |     +-app/

  |       +-auth/

  |       +-admin/

  |   +-styles/

  |   +-images/

  | +-templates/

  | +-tests/

  | +-__init__.py

  +-node_modules/

  +-test/

  +-.yo-rc.json

  +-.bower.json

  +-Gruntfile.js

  +-development.ini

  +-production.ini

  +-setup.py

I wanted make sure that the bower_components folder is served from the 'static' folder since it contains most the vendor JS libraries. The custom application Javascript lies within the 'scripts/app' folder. Since I still use Pyramid views for most my pages I had to make sure I changed my Mako templates to point to the appropriate CSS files. I also don't currently utilize the build:js options for the .html files. Instead, I use a conditional block in my base Mako templates that will load the production or development Javascript and CSS according to my current environment.

If I wanted to use Pyramid as an entirely RESTful application, I would follow pretty much the same structure.

-Vincent

[Blaise Laflamme]

I would use a separate repo for the backend and the frontend and use buildout to compose the environment. The buildout project would then install your repos and setup locally your frontend tools using ree's buildout conf. Then you'll still use your package & bower json files as you would do. You'll then be able to use grunt dev server for your front end development or, like Tres proposed, add an includeme function and make your frontend package easily addable to your backend app and expose it as static files.

[tre...@gmail.com]

This thread was quite helpful as I split a project exactly along this line.  Thanks!  

And here's a repo that demonstrates this path along with the special pyramid hack to serve the angular app from the server root:

https://github.com/treerao/angular-pyramid-seed