Metadata-Version: 2.1
Name: djangovue
Version: 0.0.11
Summary: A set of helper tags and form widgets for making django and vue play nicely.
Home-page: https://gitlab.com/BradleyKirton/djangovue/
License: MIT
Keywords: django,vue
Author: Bradley Stuart Kirton
Author-email: bradleykirton@gmail.com
Requires-Python: >=3.6,<4.0
Classifier: Development Status :: 4 - Beta
Classifier: Environment :: Web Environment
Classifier: Framework :: Django
Classifier: Framework :: Django :: 2.1
Classifier: Intended Audience :: Developers
Classifier: License :: OSI Approved :: MIT License
Classifier: Operating System :: OS Independent
Classifier: Programming Language :: Python :: 3
Classifier: Programming Language :: Python :: 3.6
Classifier: Programming Language :: Python :: 3.7
Classifier: Topic :: Software Development :: Libraries
Classifier: Topic :: Utilities
Requires-Dist: django (>=2.1,<3.0)
Project-URL: Repository, https://gitlab.com/BradleyKirton/djangovue/
Description-Content-Type: text/markdown

# djangovue

[![Code style: black](https://img.shields.io/badge/code%20style-black-000000.svg)](https://github.com/ambv/black)

A set of helper tags and form widgets for making django and vue play nicely.

# Installation

```bash
pip install djangovue
```

# Tags Example

```python
class IndexView(TemplateView):
  template = 'index.html'

  def get_context_data(self, **kwargs):
    context = super().get_context_data(**kwargs)
    context['message'] = 'Hello from Django'
    return context
```


```html
{% load djangovue %}

{% load_vuejs %}

{% djangovue on %}
  <div id="app">
    <p>
      {{ message }}
  </p>
  {% djangovue off %}
    <p>
    {{ message }}
  </p>
  {% enddjangovue off %}

  </div>
  
  <script>
    new Vue({
      el: '#app',
      data: {
        message: 'Hello from Vue'
      }
    });
  </script>
{% enddjangovue%}
```

# Widgets Example

```python
from django import forms
from djangovue import widgets


class UserForm(forms.Form):
    username = forms.CharField(
        max_length=30,
        widget=widgets.TextInput(
            model="user.username",
            modifier=widgets.TextInput.LAZY,
            attrs={":disabled": "disable"},
        ),
    )
    first_name = forms.CharField(
        max_length=30,
        widget=widgets.TextInput(
            model="user.first_name", attrs={":disabled": "disable"}
        ),
    )
    last_name = forms.CharField(
        max_length=30,
        widget=widgets.TextInput(
            model="user.last_name", attrs={":disabled": "disable"}
        ),
    )
    gender = forms.ChoiceField(
        choices=[("male", "Male"), ("female", "Female")],
        widget=widgets.RadioSelect(
            attrs={"v-model": "user.gender", ":disabled": "disable"}
        ),
    )
    disable = forms.BooleanField(
        required=False, widget=widgets.CheckboxInput() # v-model will automatically be set to `disable`
    )
```

# Development

Should you wish to develop the library there are some helper functions within the Makefile to get you started.

```bash
make install # Installs the project dependencies including the node modules required for the DjangoVue Vue plugin
make bundle # Transpiles and bundles the DjangoVue.ts file
make test # Runs tests
make black # Applies black formatting to the project
```

Once installed run the following to view the examples:

```bash
cd djangovue/examples
poetry run ./manage.py runserver
```

Note this project uses [Poetry](https://poetry.eustace.io/) for packaging and managing dependencies.

