In my previous post, I wrote about setting up the User module in Wobu. Backend work started to take good shape. After a while, I was at crossroads 🚦.

When I started developing Wobu, I wanted to focus on the backend first and decided to keep the frontend light and simple. I started to use django template framework with just plain old HTML but with Tailwind CSS being the only change.

I developed the first few pages using those. When the complexity of the pages started to increase, I was in a double mind. I had a casual discussion with my favorite python community regarding my app at this stage. Post the discussion, it got me thinking to move to a javascript framework as there seemed to be a lot of advantages. Especially when done in the initial stages of development.

Strong suggestions came in favor of Vue.js when compared to React and Angular. Gentle learning curve, smaller footprint, and flexibility while integrating with existing projects are a few reasons why Vue seemed to stand out. At least it seemed to fit the bill concerning what I'm building.

I wouldn't call myself an expert when it comes to js frontend frameworks, thus wanted to take this as an opportunity and shift gears.

After doing quite some reading on integrating these two frameworks, there seemed to be multiple approaches. I resigned to integrate them directly rather than an API approach primarily because of the reason that I didn't want to miss out on the power of django's template framework. The app I'm building is not frontend-heavy, atleast in the initial phase. Whereas, the backend has a lot of work.

Hence, wherever I need it to be reactive, I plan to build Vue components. In pages where it's more a read-only type, I will stick to good old django templates, thereby capitalizing on the power of both. Another advantage is, development can happen hand in hand.

I did some quick searches on good tutorials and courses and came across a good one on Udemy. The instructor did a neat job of teaching the crucial points and cutting the chase.

I took a lot of notes while watching the course content. I decided to share them in the form of a separate post thereby it can be used by anyone interested in integrating django and vue directly.

Whenever I pick up a new technology or an aspect of it, I apply that to build something that I can relate to. In this case, I created a super simple app called BookReview. Just a one-pager with a provision to add a Book title, author of the book, a review about the book, and store the same in the database.

I did not apply them directly in Wobu. Trial first, then comes all reals ⚽

Read here for my notes on the actual integration. Hope you find it useful 💛

Will be back soon with another post, until then ciao 👋