🔧 JinjaForge A Jinja2 Rendering Web App
Web App for rending jinja templates
Sharing one of the first web apps I made. I have the site hosted and you can test it out without an account but will need one to save data. I called it JinjaForge. It's a website that can render Jinja templates with an editor for the template and its data, all right next to each other so you can build and test a template to use elsewhere or just plain use the site for daily tasks you want to automate. I was heavily inspired by the github repo td4a.
📝 What is Jinja?
Jinja is a templating language, which is a way to generate text dynamically. That text can be, words for an email, code, network commands, anything. You can embed code within the text that programmatically generates the text. It's useful for IT operations and programming. For example, you could use it to generate a configuration file for a network device, a report, or a web page. I use it a lot for network configuration files. Sometimes you'll have network commands you need to run often but that have slight differences between each run. You can use Jinja to generate the commands with the slight differences based on some data.
🌐 JinjaForge.com
I have some examples on the site when you first visit it and you're not signed in. Here it is - JinjaForge.com
The data and template are already filled in so you can see how it works, just click Render Template to get the result.
👥 How to Use
The left most column is the "data" column. It's where you can input the data (in JSON or YAML format) that will be used in the template. The middle column is the "template" column. It's where you can write the Jinja template. The right most column is the "output" column. It's where the rendered template will be displayed after clicking the render button. The black bars between the columns can be dragged to resize the columns. The templates must have unique names when saving, saving a template with the same name will overwrite the old one.
🔑 Register
You can click login to sign in or create an account. Here's a registration link as well - JinjaForge.com/register. Once registered and signed in you can save your data and templates.
📚 A Jinja Tutorial
I don't want to go into too much about jinja and the syntax to it. This tutorial I found is pretty good - Jinja2 Tutorial
🛠️ How I Built This
Going into how I built this, firstly I'll say there are jinja render sites out there that have accomplished the same thing. None of them I found allow you to save data however. The site is hosted on Google's firebase, with their auth, functions, and database. It's written with just plain javascript, html, css and then python on the backend. I didn't use any frameworks for front end UI to make it a single page application or anything.
🖥️ Frontend
The site itself is pretty straight forward. It contains User login and register. A main page to conduct the jinja rendering. A page to delete your account or change your password. Then a page to send a contact message to the developer, me. The 3 column text editors on the main page use Codemirror for line numbers and syntax highlighting.
🎉 Conclusion
Like I mentioned one of the first web applications I made. I learned a lot from it and it lead me to make better web applications. I still use it to this day for my own tasks. I hope you find it useful as well. If you have any questions or comments, let me know. Thanks for reading! 🙏