4
votes

I have a model in my Django App as below. I am using ReactJs as frontend and pass data using Django Rest Framework.

class Ingredient(models.Model):
    MUNITS_CHOICES = (
        ('kg', 'Kilogram'),
        ('ltr', 'Liter'),
        ('pcs', 'Pieces'),
    )

    name = models.CharField(max_length=200,unique=True,null=False)
    slug = models.SlugField(unique=True)
    munit = models.CharField(max_length=10,choices=MUNITS_CHOICES,default=KILOGRAM)
    rate = models.DecimalField(max_digits=19, decimal_places=2,validators=[MinValueValidator(0)],default=0)
    typeofingredient = models.ForeignKey(TypeOfIngredient, related_name='typeof_ingredient',null=True, blank=True,on_delete=models.PROTECT)
    density_kg_per_lt = models.DecimalField(max_digits=19, decimal_places=2,verbose_name='Density (kg/lt)',null=True,blank=True,validators=[MinValueValidator(0)])
    updated = models.DateTimeField(auto_now=True, auto_now_add=False)
    timestamp = models.DateTimeField(auto_now=False, auto_now_add=True)

As you see the model fields have lot of parameters like max_length, choices, ForeignKey(which is also kind of choices), DecimalField, CharField, DateTimeField etc

I was creating and rendering forms using Django Forms. Also the validaton is done in the Form class. The advantage of this is the form is inserted very easily in the template using {{ form }}. and it takes care of all the parameters like max_length, choices, fieldtypes etc. Also we can validate the form and the errors are send back etc. So most the job is done automatically.

But since i am using DRF i created a serializer class to create or update:

class IngredientCreateUpdateSerializer(ModelSerializer):
    class Meta:
        model = Ingredient
        fields = [
            'name',
            'munit',
            'rate',
            'typeofingredient',
            'density_kg_per_lt',
        ]

Here again i have to write the validation logic which i have done in the form.

Now to create the HTML form in the reactjs i have to manually look at each form parameter (like fieldtype, required etc) and create the form, and then link the api endpoint to create/update on submit button. Also the choices for select field have to passes as seperate endpoints.

Solution 1 Needed: Create form api

So is there a form api which will pass all the fields and their parameters like max_length, required, choices for select field, choices for foreignfields to the reactjs. So that i get some blueprint to create the form in reactJs. Later even if i change the model or parameters everything can be taken care of by the api.

Solution 2 Needed: Can validation logic be common for serializer and forms

Will i have to write the validation code for serializer class also or is there a way i can link with the form class which i have already used.

I am mainly looking for Solution 1

: Because solution 2 is more of typing the validation twice which is fine.

1

1 Answers

-1
votes

I read through your solution scenarios. I work with Django-reactjs. To make things simple for yourself,.

Make do with this templating https://github.com/Frojd/django-react-templatetags

You mention of model class parameters. It can suffix, since you are interested in passing the model parameters to the frontend.

Another option is : React, with the help of Webpack (module bundler) & Babel (transpiler), will bundle and transpile your Javascript into single or multiple files that will be placed in the entry HTML page. Learn Webpack, Babel, Javascript and React and Redux (a state container). I believe you won't use Django templating but instead allow React to render the front-end.

Should you have anyother questions do let me know