Why and How I Used Vue.js for My Python/Django Web App (and why not React)

Sdílet
Vložit
  • čas přidán 28. 05. 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/ykdojo/csqa
    Django Rest Framework’s serializer library: www.django-rest-framework.org...
    Using Axios with Vue: vuejs.org/v2/cookbook/using-a...

Komentáře • 365

  • @flyingzipper
    @flyingzipper Před 4 lety +155

    If you could do tutorials on this topic it would be really awsome!

    • @CSDojo
      @CSDojo  Před 4 lety +72

      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 :)

    • @flyingzipper
      @flyingzipper Před 4 lety +8

      @@CSDojo Oh ! That would be even better !

    • @rabiatabassum5085
      @rabiatabassum5085 Před 4 lety

      on what topic a topic always has a name

    • @yadneshkhode3091
      @yadneshkhode3091 Před 4 lety +2

      @@CSDojo create advanced courses of any topic because basics can be found anywhere and everywhere

    • @mayankdandwani9951
      @mayankdandwani9951 Před 4 lety

      @@CSDojo Please create a complete tutorial series on this topic only

  • @DiaryOfMuhib
    @DiaryOfMuhib Před 4 lety +1

    So good to see you back making videos. Please consider continuing your series on data structure and algorithms.

  • @michaelarthurholloway9539

    Your delivery is clear, concise and very easy to follow. Thanks for the tutorial!

  • @JosephCaburnay
    @JosephCaburnay Před 4 lety +1

    This preview of how you did your work is really nice. Thank you so much. :)

  • @SantoshElangovan
    @SantoshElangovan Před 4 lety +1

    Missed your videos mate. Glad to see you back. And it's a good session on this video.

  • @vivekanandachowdhury6602

    Thank you so much for all your videos!! Appreciate you taking the time to make them!

  • @hyungtaecf
    @hyungtaecf Před 4 lety +3

    Thank you! It is really straight forward, exactly what I was looking for.

  • @markgilroy6170
    @markgilroy6170 Před 4 lety

    That delimiters problem really had me scratching my head. Glad i saw your video.

  • @jaylee4680
    @jaylee4680 Před 4 lety +30

    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.

    • @fvgoya
      @fvgoya Před 2 lety +4

      Good analogy.

    • @ilahazs
      @ilahazs Před 10 měsíci

      b-but i love react 😦

    • @manasr3969
      @manasr3969 Před 3 měsíci

      lol well said

  • @abhisheks.2553
    @abhisheks.2553 Před 4 lety +1

    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 CZcams always.
    lots of love,success and happiness to you.
    regards
    Abhishek Singh

  • @Fizz17
    @Fizz17 Před 4 lety +3

    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!

  • @ashutoshtripathi8927
    @ashutoshtripathi8927 Před 4 lety +33

    I missed you very much sir in programming.
    You are a great film maker on CZcams.
    Thanks us for your support.

    • @CSDojo
      @CSDojo  Před 4 lety +7

      Thank you! And sorry about the delay again... I'm going to try to post more often in the future though :)

    • @jamjam3448
      @jamjam3448 Před 4 lety +1

      @@CSDojo thanks

    • @anuragd398
      @anuragd398 Před 4 lety

      Ya

  • @wolfisraging
    @wolfisraging Před 4 lety +11

    I'm glad someone made a video bout this

  • @gireeshnasina3500
    @gireeshnasina3500 Před 4 lety +4

    I like the way of your explanation and clarity, tq

  • @timothyshen4063
    @timothyshen4063 Před 4 lety +1

    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.

  • @drmacsika
    @drmacsika Před 3 lety

    A very fruitful use of 20 minutes. Thanks.😊

  • @nowyouknow2249
    @nowyouknow2249 Před 4 lety +6

    Someone has been missing in action and enjoying Japanese sushi.
    Welcome back YK!

    • @CSDojo
      @CSDojo  Před 4 lety +2

      Haha thank you! I'm going to try to post more in the future :)

  • @tanaypatil5476
    @tanaypatil5476 Před 4 lety +1

    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.

  • @balazssrancsik1691
    @balazssrancsik1691 Před 3 lety +1

    This tutorial is golden. Thank you! I subscribed immediately :)

  • @sweatobertrinderknecht3480
    @sweatobertrinderknecht3480 Před 4 lety +12

    loving these *django* devlogs. could you improve the design and maybe consider using sth. like elasticsearch? would be amazing

  • @Mfarahkogak009
    @Mfarahkogak009 Před 4 lety +2

    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.

  • @onlinepanda4385
    @onlinepanda4385 Před 4 lety

    Glad you are back!

  • @chackomappila
    @chackomappila Před 4 lety

    You are my favourite youtuber . Everybody who does such things promotes their sponsors when videoing .But you stick to the context

  • @danielalejandrogilbarrera7108

    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

  • @shazam1334
    @shazam1334 Před 4 lety

    Bro....ur awesome man!!.....just feels better when I enter this channel man....ur awesome

  • @Mydramacloset
    @Mydramacloset Před 4 lety +2

    wa mbili, great content as usual man.

  • @mozescodes6618
    @mozescodes6618 Před 3 lety

    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!

  • @chronotriggerfan
    @chronotriggerfan Před 3 lety

    Insanely helpful, thank you!

  • @urtrend2551
    @urtrend2551 Před 4 lety +1

    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😕

  • @abhishekks6782
    @abhishekks6782 Před 4 lety

    @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. 🙏

  • @nguyenanghau9549
    @nguyenanghau9549 Před 4 lety

    I learned more knownleague by this video and more videos of you. I'm thank you very much.

  • @AhmadHassan-ss5un
    @AhmadHassan-ss5un Před 4 lety

    I created an forum SPA with Vue + Laravel, this video is really helpful to overcome some problems in my front-end

  • @colton3507
    @colton3507 Před 2 lety

    This is super helpful. Thank you!

  • @valversum
    @valversum Před 4 lety +2

    That was great! i love it!

  • @EdrisRanjbar
    @EdrisRanjbar Před 4 lety

    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

  • @dev-luisbenavidesandrade

    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.

  • @concrete4054
    @concrete4054 Před 4 lety +1

    Love the video👍
    Please more of vue and django

  • @AnthonyBecker9
    @AnthonyBecker9 Před 4 lety +1

    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!

  • @aarmanhossen3222
    @aarmanhossen3222 Před 4 lety +1

    Thank you, Sir, We want series tutorials Django and Vuejs.

  • @SomeshSamadder
    @SomeshSamadder Před 4 lety

    Again, you made my life easier...Thanks man 🙏🙏😇

  • @hamidreciol1457
    @hamidreciol1457 Před 4 lety

    Welcome back man we missed you a lot:)

  • @unl0ck998
    @unl0ck998 Před 2 lety

    Thanks for the vid, its exactly what i needed!

  • @issahosman5359
    @issahosman5359 Před 4 lety

    YK we missed you for a very long time

  • @endless827
    @endless827 Před 4 lety +1

    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.

  • @tusharsharma1234
    @tusharsharma1234 Před 4 lety

    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

  • @siaodprogrammer
    @siaodprogrammer Před 4 lety

    Welcome back! :) what you prefer node js django or laravel in web development?

  • @lawrencem-yuen2376
    @lawrencem-yuen2376 Před 4 lety +1

    LOVE THAT flower in the background , got one alike in my home

  • @CodeProps
    @CodeProps Před 4 lety +6

    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.

  • @denysivanov3364
    @denysivanov3364 Před 3 lety

    good explanations as usual.

  • @lucyledezma709
    @lucyledezma709 Před 4 lety +2

    Hi!!!. From Argentina!! I love to code!!!

  • @avi12
    @avi12 Před 4 lety +41

    8:38 A better approach would be to have:
    data: {
    message: "Hello ",
    username: "{{ username }}"
    },
    computed: {
    welcomeMessage() {
    return message + username;
    }
    }

    • @sadhlife
      @sadhlife Před 4 lety +1

      the username is a constant once the page is rendered, so I think it's alright that way too

  • @neerajmaran4804
    @neerajmaran4804 Před 4 lety

    Make video once week
    Love to see you
    More video on Python and django

  • @AcademyOmen
    @AcademyOmen Před 3 lety

    Thanks alot for this

  • @sainarasimha2451
    @sainarasimha2451 Před 4 lety +1

    Great content ❤️ from india 🙂

  • @mustafahany6264
    @mustafahany6264 Před 4 lety

    we are waiting your django tutorial . big fan of you from Egypt

  • @rafaelunag
    @rafaelunag Před 4 lety

    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?

  • @decoder6878
    @decoder6878 Před 3 lety

    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.

  • @ahackerplayzph4829
    @ahackerplayzph4829 Před 4 lety +17

    Cs dojo i missed you so much where have you been ? (Im missed your programming tutorials) I love your videos

    • @CSDojo
      @CSDojo  Před 4 lety +20

      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!

    • @ahackerplayzph4829
      @ahackerplayzph4829 Před 4 lety +6

      @@CSDojo umm can I ask a question can you make a video playlist about JavaScript? That would be really helpul

    • @hgtpmrinbetween3484
      @hgtpmrinbetween3484 Před 4 lety +3

      @@ahackerplayzph4829 that would be awesome if he did that for is fans

    • @ahackerplayzph4829
      @ahackerplayzph4829 Před 4 lety +1

      @@hgtpmrinbetween3484 yeah he removed the heart thought😞btw if you wanna talk just search my name in FB a page with appear ok thx

  • @ankitpandey8239
    @ankitpandey8239 Před 4 lety

    YK can you please upload new videos frequently....we need more youtubers like you
    Love from India

  • @bentleyinc7888
    @bentleyinc7888 Před 4 lety

    What computer language and books to learn that computer language do you recommend for sloving cryptographic ciphers like cicada 3301 and just ciphers in general I really like puzzles and problems like that but just dont know how to get started thanks

  • @umesh7345
    @umesh7345 Před 4 lety +1

    hello bro. You are a very good teacher. Thank u for ur videos

    • @CSDojo
      @CSDojo  Před 4 lety

      Thank you!

    • @umesh7345
      @umesh7345 Před 4 lety

      @@CSDojo Bro an you plz answer my insta questions about python.plz

  • @aritasoffia9807
    @aritasoffia9807 Před 4 lety

    Hi,
    Need some videos on Hammer IVR test automation tool. I couldn't find any useful docs or videos yet. So pls make some videos on this.

  • @robertmutua3267
    @robertmutua3267 Před 4 lety

    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()

  • @samueldepauw4704
    @samueldepauw4704 Před 4 lety

    Could you do a tutorial or a showcase on how to do software testing with python?

  • @jeethuutube
    @jeethuutube Před 4 lety

    Does writing programs in a book helps to learn faster than typing in a computer ?

  • @dikimuhamadsyidik9650
    @dikimuhamadsyidik9650 Před 3 lety

    Great videos YK

  • @lifeisjoyliveit7655
    @lifeisjoyliveit7655 Před 4 lety

    Your videos are really good. Can you upload video for design patterns?

  • @andogrando487
    @andogrando487 Před 3 lety

    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...

  • @JJ-ot3ps
    @JJ-ot3ps Před 2 lety

    great video, do you think ecommerce site work well with vue/nuxt and django?

  • @UEE_ARGHADEEPSAHA
    @UEE_ARGHADEEPSAHA Před 4 lety

    I'm watching your vedios for quite sometime but I have a question as a beginner that which code editor are you using for writting code can you suggest me a code editor to use especially for a beginner.

  • @zainkazi
    @zainkazi Před 4 lety

    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.

  • @aavlasti
    @aavlasti Před 3 lety

    Good job!

  • @cartoonf.r.o.g7571
    @cartoonf.r.o.g7571 Před 4 lety

    Hey man I wanted to know how can I automate simple tasks with python?

  • @linaalbaroudi651
    @linaalbaroudi651 Před 4 lety

    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 ?

  • @bhagwandas321
    @bhagwandas321 Před 4 lety

    You are the best ♥️♥️

  • @arieltabuzojr2434
    @arieltabuzojr2434 Před 4 lety

    Hi Sensei, I'm learning web development and I already know HTML CSS JS( btw I plan to learn frameworks after I created my project using pure languanges)
    Now, I'm thinking whats the best for web dev. PhP or Python or java ? Hope you can help me thanks !

  • @shaz-z506
    @shaz-z506 Před 3 lety

    Please create a series tutorial video on Django+Vue.js it will be really helpful

  • @johanhuge6524
    @johanhuge6524 Před 4 lety

    Is there a simple way to use a npm vuejs module with this method ? A lot of time some vuejs modules only have "npm install module-name" as installation instructions, and no easy way to include a script such as the dist/vue.js (in my case I'm trying to use vue-focus-lock)

  • @DefCantGame
    @DefCantGame Před 3 lety

    2021 thoughts on using drf or just building all in django no api

  • @joseestebanjuarezvelazquez9894

    Thanks! Thas was exactly what I wanned to know.
    Is this possible with compositionAPI instead optionsAPI with vue3?

  • @computerscience1152
    @computerscience1152 Před 3 lety +1

    Hey yk can please tell which is better.
    NODE js or Django or Flask for backends

  • @mohitlamba1022
    @mohitlamba1022 Před 4 lety +4

    Hi!
    Does vue.js also has this->binding issue that is a concern in most of my react apps.

    • @RaZziaN1
      @RaZziaN1 Před 4 lety +1

      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.

    • @bibibobs
      @bibibobs Před 4 lety +3

      Stop hopping frameworks and start to learn one properly, I'm not using `this` in React due to functional components and hooks

    • @acidicacid6328
      @acidicacid6328 Před 4 lety +2

      Just use arrow functions bruh

    • @VictorNascimentoo
      @VictorNascimentoo Před 4 lety

      The answer you are looking for is no.

    • @go371211
      @go371211 Před 4 lety

      React hooks don’t have the this binding problem

  • @editionnew9463
    @editionnew9463 Před 2 lety

    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?

  • @jaumemontane3305
    @jaumemontane3305 Před 2 lety

    Thanks!

  • @abrarzaheen4871
    @abrarzaheen4871 Před 4 lety

    Please try uploading videos every week......
    Missed u

  • @abssingh5831
    @abssingh5831 Před 4 lety +1

    Sir I am class 12 passed fresher my dream to become a great codar sir please keep guiding youth like me

  • @ulvidamirli2758
    @ulvidamirli2758 Před 3 lety

    Hi, Could you please make a new video on making exactly the same thing but this time with Django Async Views?

  • @arjunsharma1633
    @arjunsharma1633 Před 4 lety +1

    Can you suggest any other course i should take in collage instead of CSE if i want to persue coding as a career ?

    • @CSDojo
      @CSDojo  Před 4 lety +1

      (I'm assuming that you meant Computer Science when you said CSE here.)
      I think entrepreneurship-related courses and math courses (stats, linear algebra and calculus) might be helpful depending on what you want to do after college.
      In the end though, I think it's more important to do a lot of personal projects and try to understand what you're really interested in. So taking easy courses and spending more time in your personal time to do projects is another option.

    • @arjunsharma1633
      @arjunsharma1633 Před 4 lety +1

      @@CSDojo thank you for the reply (and yes i meant computer science) love your content it always helps !!
      (Btw my current project is a python text encryptor using random )

  • @bramburn
    @bramburn Před měsícem

    Like you i chose to use a cdn vue to get things done without using node

  • @jamjam3448
    @jamjam3448 Před 4 lety +4

    Is it better to use MERN stack or to combine Django with Reactjs?

    • @sainathsingineedi2922
      @sainathsingineedi2922 Před 4 lety +3

      I had the same question

    • @CSDojo
      @CSDojo  Před 4 lety +5

      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.

    • @sainathsingineedi2922
      @sainathsingineedi2922 Před 4 lety +1

      @@CSDojo looking forward to:)

    • @jamjam3448
      @jamjam3448 Před 4 lety +2

      @@CSDojo okay thanks

    • @ericblancas8113
      @ericblancas8113 Před 4 lety

      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

  • @shivuk4593
    @shivuk4593 Před 4 lety

    Sir what is the difference between data structure and database, both can store and manipulate data, I guess

  • @yogeshsomasundaram4187

    Thank you for your videos. i am still learning from your videos.
    i dont know if you read this comment.
    but if you do, just curious to know your thoughts on Web Assembly and its possible impact on Javascript and its future in the web development. Because W3C says, Web Assembly will work along with JS but not replace it. However, i doubt may be if the web assembly has the Capability to support JS like features like DOM access in future, then there may not be a need for JS. can Web assembly can support DOM like JS in future (which impact JS dominance in the web development ) ?
    i am not an expert in web development i am just started learning, so please excuse if this question sounds stupid or irrelevant. Thank you for all your videos.

  • @SriramKrish
    @SriramKrish Před 4 lety

    love Your Videos

    • @mkgeidam
      @mkgeidam Před 4 lety

      We are happy that u are back, missed a lot from you especially your data science and python programming tutorials, hope you will continue share your skills with us Thanks.

  • @Rahul-mf2we
    @Rahul-mf2we Před 4 lety +1

    Django vs flask which do you think is better? Flask is more recommended for beginners., I think

  • @remoreacts91
    @remoreacts91 Před 3 lety

    Can you please show us how to deal with the JSON serializing problem?

  • @fattuglee
    @fattuglee Před 4 lety

    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!!

  • @edwardseverinsen5598
    @edwardseverinsen5598 Před rokem

    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.

  • @schlepers
    @schlepers Před 3 lety

    Thx!

  • @shubhamsinghal6935
    @shubhamsinghal6935 Před 4 lety

    Should I take PCAP python certificate does it have any value and helps in getting job or not?

  • @mehakshaikh3622
    @mehakshaikh3622 Před 4 lety

    Hey cs dojo can u please tell me that if pycharm is better or Jupyter like wht is easy to use?