Ryan,
Very nice tutorial and very useful. I'm in the throes of "duplicating" what you did to build my own toolchain (Python/Django/Vue/PyCharm/Anaconda and a few other things) and it's a bit of a beast.
The only thing I may have missed was the creation of a "production" instance of the front end to run without using 'npm run dev' and a corresponding 'manage.py collectstatic' or am I missing something. Maybe that's all hidden under the '/deploy' [I'm on Win10 :-( ]?
Total aside: I'm a retired geek trying to stay somewhat current. Best of luck with your teaching goal. We need good teachers!
--Don
Ryan is an engineer in the Sacramento Area with a focus in Python, Ruby, and Rust. Bash/Python Exercism mentor. Coding, physics, calculus, music, woodworking. Looking for work!
Hi! Thanks so much for reading, I’m glad it’s helping. There have been a lot of changes in the ecosystem since I wrote this, and I should probably go back and refresh it for new versions of the libraries (Django 2.0!). In theory, for production, you should build your JavaScript app into a bundle to be served as static files by your Django server. Does that help? Let me know if you need more guidance and I’ll see if I can write something more specific up. 😃 this stuff is hard, so don’t worry!
Ryan,
Just a bit of a follow-up. I've gone down the Vue rat hole pretty deeply and am in the throes of some pretty hard (at least for me) problems. Don't know if it is something you might want to develop a tutorial on, but I thought I'd give you the idea.
The first issue I ran into was the decision about the structure of my Vue/Vuex app. Do I start with the small and simple and attempt to grow/refactor as my problem grows or do I build a full blown component/module structure as a frame and fill it in. I chose the latter (in retrospect, maybe wrongly) on the theory that once I had the frame, it would be more straightforward to build everything else and I'd avoid a lot of rework later on.
After some false starts, I decided to set up the vuex.js examples (github.com/vuejs/vuex) and model mine on the shopping cart version. The approach worked well as I could do side-by-side editing and adapting.
The issue I've run into and the place where I think a tutorial would be very useful is in understanding the various ways to reference/call from module/component to another module/component. Specifically, most of the existing examples are pretty good about references using the operations within the html, but I've really struggled to be able to reference actions in one module from methods in another, from pure js (not in an action/method/data/...) in one module to elements in another. The issue seems to revolve around how Vue/Vuex and webpack set things up, but I've really about broken my pick trying to connect things.
Anyway, I may have fallen in my own traps, but I thought it might be a place where you could do a useful tutorial if you are so inclined.
Ryan is an engineer in the Sacramento Area with a focus in Python, Ruby, and Rust. Bash/Python Exercism mentor. Coding, physics, calculus, music, woodworking. Looking for work!
OK, that's some great insight. I'll be sure to try to get that figured out and worked in. Thanks for grinding through all of the tough stuff! I hope it starts to get easier!
Ryan,
Very nice tutorial and very useful. I'm in the throes of "duplicating" what you did to build my own toolchain (Python/Django/Vue/PyCharm/Anaconda and a few other things) and it's a bit of a beast.
The only thing I may have missed was the creation of a "production" instance of the front end to run without using 'npm run dev' and a corresponding 'manage.py collectstatic' or am I missing something. Maybe that's all hidden under the '/deploy' [I'm on Win10 :-( ]?
Total aside: I'm a retired geek trying to stay somewhat current. Best of luck with your teaching goal. We need good teachers!
--Don
Hi! Thanks so much for reading, I’m glad it’s helping. There have been a lot of changes in the ecosystem since I wrote this, and I should probably go back and refresh it for new versions of the libraries (Django 2.0!). In theory, for production, you should build your JavaScript app into a bundle to be served as static files by your Django server. Does that help? Let me know if you need more guidance and I’ll see if I can write something more specific up. 😃 this stuff is hard, so don’t worry!
Ryan,
Just a bit of a follow-up. I've gone down the Vue rat hole pretty deeply and am in the throes of some pretty hard (at least for me) problems. Don't know if it is something you might want to develop a tutorial on, but I thought I'd give you the idea.
The first issue I ran into was the decision about the structure of my Vue/Vuex app. Do I start with the small and simple and attempt to grow/refactor as my problem grows or do I build a full blown component/module structure as a frame and fill it in. I chose the latter (in retrospect, maybe wrongly) on the theory that once I had the frame, it would be more straightforward to build everything else and I'd avoid a lot of rework later on.
After some false starts, I decided to set up the vuex.js examples (github.com/vuejs/vuex) and model mine on the shopping cart version. The approach worked well as I could do side-by-side editing and adapting.
The issue I've run into and the place where I think a tutorial would be very useful is in understanding the various ways to reference/call from module/component to another module/component. Specifically, most of the existing examples are pretty good about references using the operations within the html, but I've really struggled to be able to reference actions in one module from methods in another, from pure js (not in an action/method/data/...) in one module to elements in another. The issue seems to revolve around how Vue/Vuex and webpack set things up, but I've really about broken my pick trying to connect things.
Anyway, I may have fallen in my own traps, but I thought it might be a place where you could do a useful tutorial if you are so inclined.
Good luck,
--Don
OK, that's some great insight. I'll be sure to try to get that figured out and worked in. Thanks for grinding through all of the tough stuff! I hope it starts to get easier!
I just discovered that 'mixins' apparently implement the functionality I've been struggling to create. Might be useful when you do your update.