I am working with a web designer, she is able to produce a working static website, with html and css files from tools such as Webflow. How could we work together, so she would be able to directly create the Django’s html templates, so we could live without a frontend developer? Is there any tool that is designer friendly but still useable out-of-the-box without any manual conversions?
1 Like
Welcome @bana513 !
First, to directly answer your question, I’m fairly certain that the answer is “no” - at least not to the degree that you may be looking for. Part of the issue is going to be how closely tied templates are to views, context processors, tags, and filters.
This is actually a more intricate problem and issue than you may think.
For some other thoughts on this topic, see the relatively recent thread at Django design philosophies DTL - confirm if should update . (The topic started out talking about an update on the d
ocs, but then morphed into a discussion on roles within the development process.)
1 Like
Yes these tools do exist. There are two options:
Bootstrap Studio (approx. $50 perpetual license)
- WYSIWYG:
-
No hinderance to you as coder. You can inject code in BSS, or link external JS, or even insert custom HTML blocks. Same goes for images, CSS.
-
Export script exists (mine): GitHub - enjoysmath/BootstrapStudioToDjango: Convert a bootstrap studio file in a django (Jinja like) template.
This is under active use and development by me, and don’t trust the instructions. If interested, ping me and I’ll set you up with it. This script is debuggable naturally using WingWare PRO, or probably even PyCharm etc if you’d like to extend & repair it on your own.
Figma
The montly/yearly cost of this IIRC is much more than BSS.
-
There exists a Figma-to-Django exporter called Anima and there might be one other, I found in my research when I considered using it.
-
Why I didn’t use it but still now might use it, is because of their “Breakpoint” system for creating responsive apps (any screen size = responsive). In Figma, you have to create a new screen for each screen size you want to support and to me that seemed like more work than BSS’s approach which is the web standard of CSS media queries.
I highly recommend BSS, but Figma seems like it has some frontend editing UX ease that surpasses BSS. BSS is for fullstack coders IMO, but if your frontend person can just collaborate with you, then you’ve got the stack covered.
Some things such as Crispy forms would cause you in the BSS-to-Django approach to have to put in simply a placeholder where the form goes, which then gets replaced by a Django template include line by the export script. The included template contains the Crispy form. Stuff like that.
What I really want is full codability + boilerplate ease. I can never remember how to recreate a Django login system, let alone social auth stuff. Wouldn’t it be great if someone created some boilerplate components in the BSS community library for doing just that? That is they would have the BSS component built, but the export script knows what it is and auto-gens some code; including and not limited to modifying your URL routes so that your site just works (many things; except of course your specialized algorithms). The idea is that it would enable you to focus on the critical, distinguishing parts of your site from the outset.
Oh yeah, when you use this tool the way I envision, you don’t touch the generated templates, so that you can continuously edit the frontend throughout your project’s lifecycle. BSSToDjango is currently a one-way street.