ไม่สามารถเล่นวิดีโอนี้
ขออภัยในความไม่สะดวก
Why and How I Used Vue.js for My Python/Django Web App (and why not React)
ฝัง
- เผยแพร่เมื่อ 28 พ.ค. 2020
- Here’s why and how I used Vue.js for my Python/Django web app.
You can try using this website here: csqa.io/
And here’s the article I used for setting up Django with React for my previous project: / set-up-react-in-your-d...
Other Relevant Resources:
The source code of this project: github.com/ykd...
Django Rest Framework’s serializer library: www.django-res...
Using Axios with Vue: vuejs.org/v2/c...
If you could do tutorials on this topic it would be really awsome!
Not sure if I can get to it, but I'll definitely keep it in mind! I'm thinking of creating a web dev tutorial course or something - but we'll see. Thanks for your comment anyway :)
@@CSDojo Oh ! That would be even better !
on what topic a topic always has a name
@@CSDojo create advanced courses of any topic because basics can be found anywhere and everywhere
@@CSDojo Please create a complete tutorial series on this topic only
I absolutely agree on using vue rather than react. It's too complex. No need to use such complex tech. We just make a web page, not operating system.
Good analogy.
b-but i love react 😦
lol well said
I missed you very much sir in programming.
You are a great film maker on TH-cam.
Thanks us for your support.
Thank you! And sorry about the delay again... I'm going to try to post more often in the future though :)
@@CSDojo thanks
Ya
I honestly don't know how people can dislike your content... I'm watching your playlist on learning Python and I don't know how people can dislike it when it's SO well explained!
So good to see you back making videos. Please consider continuing your series on data structure and algorithms.
That delimiters problem really had me scratching my head. Glad i saw your video.
Just completed my dissertation project which is a project built by Django and Vue. These two are a really good combination. Especially with DRF and Axios.
8:38 A better approach would be to have:
data: {
message: "Hello ",
username: "{{ username }}"
},
computed: {
welcomeMessage() {
return message + username;
}
}
the username is a constant once the page is rendered, so I think it's alright that way too
loving these *django* devlogs. could you improve the design and maybe consider using sth. like elasticsearch? would be amazing
Your delivery is clear, concise and very easy to follow. Thanks for the tutorial!
Someone has been missing in action and enjoying Japanese sushi.
Welcome back YK!
Haha thank you! I'm going to try to post more in the future :)
Cs dojo i missed you so much where have you been ? (Im missed your programming tutorials) I love your videos
Hi, it took me a while to make this one because I was exploring different projects to work on and I had some other things to deal with. Sorry about the wait!
@@CSDojo umm can I ask a question can you make a video playlist about JavaScript? That would be really helpul
@@ahackerplayzph4829 that would be awesome if he did that for is fans
@@hgtpmrinbetween3484 yeah he removed the heart thought😞btw if you wanna talk just search my name in FB a page with appear ok thx
Vue and Django is my preferred tech stack too while building web applications, feel like Vue is too underrated compared to big guns like React and Angular.
You are my favourite youtuber . Everybody who does such things promotes their sponsors when videoing .But you stick to the context
Oh boy, I didn't realize I would need to set up a Node.js server to use React. That would definitely be a pain. You may have just saved me a couple of weeks my dude. Thank you!
I'm glad someone made a video bout this
This preview of how you did your work is really nice. Thank you so much. :)
Thank you so much Bro for coming back and making videos. I was waiting for your videos from almost an year.
"Everyday you wake up, you change the world"
you're the one who truly suits the quote.
Bro please be on TH-cam always.
lots of love,success and happiness to you.
regards
Abhishek Singh
Missed your videos mate. Glad to see you back. And it's a good session on this video.
Good job explaining everything 👌, Ive never used Vue or Django, but I was able to understand everything in this video very easily, which made me kinda wanna learn them even more, although currently I'm using react and node stack.
learn django!!
For the search functionality, make it dynamic. Send ajax requests on key up. Use Q to filter the query set. I use this functionality to filter articles on my website:
search_text = request.POST.get('search_text')
search_posts = Article.objects.filter(
Q(title__icontains=search_text) |
Q(body__icontains=search_text) |
Q(category__icontains=search_text)
).distinct()
Thank you! It is really straight forward, exactly what I was looking for.
I like the way of your explanation and clarity, tq
A very fruitful use of 20 minutes. Thanks.😊
Dude you have no idea how on point this tutorial exactly answered the questions that I had about vue and using it on my project. god bless!!!1
Thank you so much for all your videos!! Appreciate you taking the time to make them!
Glad to see this video from you. I use django and want to learn vue. It's good to see that people prefer django + vue. It'll be better if you can create tutorials.
I created an forum SPA with Vue + Laravel, this video is really helpful to overcome some problems in my front-end
as a back-end developer this video gave me a good idea about VUE js and how it works simply. I like to learn it and use in my projects. Thanks
Thanks for the explanation, was very useful by my side over all I would like to highlight it is the delimiters, that both framework Vue.js and Django, uses the same characters.
Bro....ur awesome man!!.....just feels better when I enter this channel man....ur awesome
This tutorial is golden. Thank you! I subscribed immediately :)
@CS Dojo your videos are really awesome as well as your explanation.
I have a question to you.
What made you to stop solving problems which are asking in Company interviews, I never seen anyone explaining things like you.You are blessed with that talent. As you said you are filling the gaps and it is helping many people to crack their interviews.
Please continue doing that, consider this as my humble request. 🙏
Thank you, Sir, We want series tutorials Django and Vuejs.
Thanks a lot really insightful I am inclined to combine Django and Vuejs into my own project down the line just have to polish up on my Vuejs. More videos like this would be appreciated!
Love the video👍
Please more of vue and django
1:12 back in the day that was rhe norm to refresh the whole page. We would use anchors to scroll back to the page. More page views = more ad impressions
I missed you cause you're the only one who give us the wonderful experience ,I'm glad to watch you ,we all know what is takes to do a great video like this ,it makes anyone loves programming and does this til the sun goes by ,and maybe all trough the night time😌.
l say the truth.I had problems with programmig,I'm 15 years and
I try to make the connection between study and programming
You help out great, your ways are simple for all classes,so thanks veryy mmmuch and this what can I do😕
wa mbili, great content as usual man.
This is super helpful. Thank you!
Glad you are back!
You don't need to have Node.js server, Babbel(I guess you meant Babel), Webpack if you don't want to, you can have a link to React from CDN and do the same you do with Vue. And IMHO it's kind of wrong to tell that you use one technology/framework over another on "hello world"-ish projects.
Correct
I learned more knownleague by this video and more videos of you. I'm thank you very much.
LOVE THAT flower in the background , got one alike in my home
Welcome back! :) what you prefer node js django or laravel in web development?
I am just wondering why there is a need to use any front-end framework, doesn't Django have the capability of creating views?
It has nothing to do with creating views. The reason you use Vue is for reactivity for example switches, checkboxes, sorting data without hitting the database etc etc
Welcome back man we missed you a lot:)
Thank you!
YK we missed you for a very long time
Django vs flask which do you think is better? Flask is more recommended for beginners., I think
Can you make a video about what is API and its uses, benefits and core concepts. This topic is always confusing for me. Will be grateful for a video on API from an easy explainer like you.
hey, great tutorial. thank you. You were using the Vue via CDN, right? Is that okay for the production project? I mean, as far as I know, the Vue project kinda has its own server with Node (NPM). Thanks.
Thanks for the vid, its exactly what i needed!
hello bro. You are a very good teacher. Thank u for ur videos
Thank you!
@@CSDojo Bro an you plz answer my insta questions about python.plz
You could use react by adding 2 scripts, for react and react-dom and you are done. If you want to use jsx with react you could add another script which is a babel one.
Ah yes, transpiling in the browser and ruining the performance and loading insane amount of JavaScript, just to use React. Amazing solution
Is it better to use MERN stack or to combine Django with Reactjs?
I had the same question
I'm actually not super familiar with the MERN stack -- but I'm thinking of building a new web app with it sometime soon to see.
@@CSDojo looking forward to:)
@@CSDojo okay thanks
both are very powerful stacks, its just depends on how you plan to use the architecture and also what sort of project you're planning to build
Insanely helpful, thank you!
Please make a video on 3D reconstruction from multiple 2D images and creating point cloud using python.
And tips on improving terrain separation of point cloud.
Sir I am class 12 passed fresher my dream to become a great codar sir please keep guiding youth like me
Please create a series tutorial video on Django+Vue.js it will be really helpful
we are waiting your django tutorial . big fan of you from Egypt
Why not use vanilla JS if you just want to use JS for such small portions of your website? Then you don’t have to load the whole Vue framework into your page
I'd like to point out that we can achieve that same functionality with ajax (much simpler) without vue...
True, I only use a framework if the django app is API based(mostly with DRF). I love using jQuery only if it's not an SPA
you did mention something about google search, honestly, I have been trying to learn how to implement and so far, I am getting the proper syntax. Is it possible to dedicate a short video explaining how it can be applied?
Please make a video about native mobile application vs flutter or RN application. What will be the future of mobile development?
I'm enjoying Vue thus far. The only hang up for me at the moment is using the same Vue app for multiple instances of essentially the same "object" on a webpage. For instance: Having a ListView in Django that displays multiple blog posts per page, with the body of their text being truncated to say 30 words and using Vue to expand the post body upon clicking.
What I've had to do so far to work around this is use the {% for %} tag in my Django template and create a unique Vue app per blog post on the page. Which because I'm only showing 3 per page using pagination, doesn't have a noticeable performance impact, but seems hacky and like it may be a problem down the line.
Thus far I have not a found a concrete answer for using multiple instances of the same "app" in Vue across multiple elements. Being able to use a Vue app like a class with predetermined data variable names with assignable contents would be the whole package tbh. I just can't seem to find anyone talking about how to do this which honestly baffles me.
That was great! i love it!
Again, you made my life easier...Thanks man 🙏🙏😇
good explanations as usual.
Please make a video on that topic
How to get internship as Mobile App developer after learning React Native, make complete video.If you'll do it'll super helpful because there is no video on TH-cam according to this title that I've mentioned in above.I'm waiting.
Just curious what the advantage would be of doing it this way as opposed to just deploying an SPA in VUE and consuming a DRF api for all the data? Ultimately that separation just feels cleaner to me...
3:00 you don't have to learn Babbel or webpack if you want to setup react app, you can use the create-react-app that will handle that for you.
What about the node.js server? Still necessary?
Yes but u need to correct the 1days ago thing
Hey yk can please tell which is better.
NODE js or Django or Flask for backends
Like you i chose to use a cdn vue to get things done without using node
Make video once week
Love to see you
More video on Python and django
Really nice video, I have a question using vue.js you have just replaced a single page so that it can be used for multiple routes without reloading the browser, that means rest of your webpages are routed by the backend. My question is can we do the the same in angular too? I just want a single page's route management by angular and other pages route management using node/express
you are too busy to manage youtube but you left your job for it...don't forgot (i think you are doing some sort of side buisness) wish you very good luck #dojo gang # Love from India
Of course, thank you for reminding me. And sorry about the wait again.
why are you irregular please upload more video you are one of top programming channel on you tube i don't wanna see you behind other
another approach of using vue would be separate front end and back end completely, use Vue to do all the front end things and get api data from Django, Django only works as an api provider
Can you please show us how to deal with the JSON serializing problem?
Thanks! Thas was exactly what I wanned to know.
Is this possible with compositionAPI instead optionsAPI with vue3?
Hi!!!. From Argentina!! I love to code!!!
Please do a web dev tutorial course and that would be helpful @CS dojo
Thank you, I've actually been getting lots of requests for this, so I think I'll make something like that at some point. I have no idea when I'll be able to make it though 😅
I am a software engineering student and i have 2 months to prepare for my graduation project. Would you please make a video on How to come up with a good idea and what are the approaches to self learning to get my idea to a fully working software ?
Hi
How i clear cache in vue js.
Cache is creating to much problem for me, somethime my function run or sometime not.
I have to use private browse every time.
Plz someone help me.
Could you do complete tutorial on React please, you have a nice voice so we can understand everything, I would be very happy if you cover entire React in couple of videos
Great videos YK
Great content ❤️ from india 🙂
we tried Vuejs + Django... the project was really great. the major issue we encountered is that we're not able to deploy the web app to Azure successfully 🙁
Hi!
Does vue.js also has this->binding issue that is a concern in most of my react apps.
You can use both hooks and functional components and for the most part you can forget about this problems. Hell even simple arrow functions will simplify it most of the time.
Stop hopping frameworks and start to learn one properly, I'm not using `this` in React due to functional components and hooks
Just use arrow functions bruh
The answer you are looking for is no.
React hooks don’t have the this binding problem
I am not sure but it okay to put application without bundling and transpile. Because am I going to make this application with use `var` not sure. It is good for quickstart but for the production ready apps I'm not sure.
I am also trying to integrate Vue and Django. and I am able to achieve it. But the main problem is with Vue Components. How can I set up a template for a Vue Component? The template variable in Vue component does takes the HTML but as string I want to specify the file path, but Django handles HTML differently and no path is giving me any good. Can you make a video for that too??
Why did you decide to use Django over Django rest? Would it not have been easier to use restful endpoints with the requests?
Sorry if this is a noob question!!
I think you forgot that u can use react with just cdn link just like you did with vue
Please try uploading videos every week......
Missed u
why you didn't go with pure javasccript fetch or use ajax request for upvote only?
Do you have any tips on setting up Vue components in a Django/Flask project? Still a noob to Vue but I find it rather powerful and lightweight, but so far I've only seen tutorials that use webpack and basically run Node in order use Vue components. Would you know a nice way of integrating them in a Django/Flask project?
Could you do a tutorial or a showcase on how to do software testing with python?
Sir ...kindly make video how to start working on salesforce by trailhead ...your knowledge is very important . Kindly reply and tell ...
Hi can you make a full python playlist for beginners from scratch! That would be appreciated
I already have it :) Was there anything you felt like was missing from that series?
@@CSDojo Functions were missing. String manipulation. But maybe I'm talking intermediate or advanced so maybe make a video for that please, that would be appreciated! Also I am learning html and css so that too would be appreciated
Obito Uchiha okay, thank you for letting me know. I was thinking of making something about map, filter and reduce, but maybe that’s not what you we’re thinking of
@@theyellowflash100 what else you want? Keep listing them and ask for super fast replies. Maybe less anime watching and more googling, kid.
@@CSDojo I dont know what that is. Do you have something I can contact you on btw? And thanks for replying!