Python + JavaScript - Full Stack App Tutorial

แชร์
ฝัง
  • เผยแพร่เมื่อ 23 พ.ย. 2024

ความคิดเห็น • 176

  • @TechWithTim
    @TechWithTim  9 หลายเดือนก่อน +20

    Join a free Skool community with over 7000 developers where you can network and learn! www.skool.com/software-developer-academy/about

    • @fredrick_muasya28
      @fredrick_muasya28 9 หลายเดือนก่อน +1

      Hi you have been a source or inspiration can you please and please make a project of using sqllite and sql.js to help for browser database usage
      Thank you please reply I am a big fan kindly help me thank you for your time

    • @Chameleonll
      @Chameleonll 3 หลายเดือนก่อน

      Hey, I had a question when watching the video. Do you think it would make sense to add try/except blocks for update_contact and delete_contact just like we did for create_contact, just in case there are some issues with db connection or something? Thank you in advance! :)

  • @patrickprucha5522
    @patrickprucha5522 9 หลายเดือนก่อน +17

    Thanks for the video. I like the way you explain the stuff. I'm at an impass. 62 years old, on linux and created a bunch of scripts working in tandem to carry out the maintenance of my computers and network. However, i am trying to jump into python. I was switching between perl and python and actually c. I have programmed in fortran, cobol, pascal, access and even foxpro to build databases apps.
    I would like to follow the path of Master programmer by Dr. Chuck...so have decided to go into python, using my bash scripts to whet my appetite on python. This is the hardest step to go past.
    In any case i do like how you present your videos. Very down to earth, understandable, and easy to follow. So for that, Thank You and Excellent job! Cheers!

  • @ReeveJonathanA
    @ReeveJonathanA 9 หลายเดือนก่อน +28

    Tim this was perfectly timed. I’m a beginner developer and I know the basics of Python, JS and React but I’ve been struggling to put them together to build something full stack.
    Thank you so much for this! ❤

    • @carsonjamesiv2512
      @carsonjamesiv2512 9 หลายเดือนก่อน +1

      I agree with your comment.🎉

  • @joe2271
    @joe2271 9 หลายเดือนก่อน +98

    HOLY CRAP!! I asked you for this last week. Thanks Tim, almost feel like it was answering my request! All kidding aside, thanks for doing this and gonna go through it now.

    • @lucaskellerlive
      @lucaskellerlive 9 หลายเดือนก่อน

      Dudes a dog

    • @code2compass
      @code2compass 9 หลายเดือนก่อน

      bullDog I'd rather say!@@lucaskellerlive

    • @avenisource
      @avenisource 9 หลายเดือนก่อน +2

      Every time I'm on TH-cam for entertainment and i come along a video of Tech with Tim i must open it. I just love this Channel. ❤

    • @thatsathishkumar
      @thatsathishkumar 8 หลายเดือนก่อน +1

      I asked it a year before

    • @naudiawright1886
      @naudiawright1886 4 หลายเดือนก่อน

      What if I am having trouble installing the flask framework?

  • @joelmarkjmj
    @joelmarkjmj 3 หลายเดือนก่อน +5

    Finally, I completed my very first full-stack app! I tried many, but this is the first one in which I've succeeded and learned a lot.

  • @caleblwright1
    @caleblwright1 8 หลายเดือนก่อน +7

    Great tutorial. If you are having trouble importing the flask packages (like I did), do some digging on python environments. Best practice is to create a new virtual environment for each project because Python isn't great at dependency management. Once you create the virtual environment, activate it and import the flask packages into the venv you just created. That should fix your problem!

    • @unopinionated1823
      @unopinionated1823 8 หลายเดือนก่อน +1

      Great advice, Caleb. I found Visual Studio Code to be super helful in this regard. It was easy to create a new virtual environment, and you can do this and switch your interpreters with one command at the bottom of the IDE.

  • @skooma103
    @skooma103 9 หลายเดือนก่อน +7

    Hey Tim, I've followed your content for years. You were one of the people who sparked my interest in programming. Thankyou for all your hard work and keep up the great work. You're genuinely one of the best content creators on this platform.

  • @coffeewmike
    @coffeewmike 3 หลายเดือนก่อน

    Most people I have seen online try to design the front end first and then the backend. This tutorial actually makes sense and is super helpful!

  • @MichaelMei-d3p
    @MichaelMei-d3p 9 หลายเดือนก่อน +4

    Hey Tim! Just want you to know that your tutorial videos are so helpful and useful in expanding programming skills. I love how you keep it simple and open-ended for personal creativity to come into play. Thank you lots!

  • @bobk9117
    @bobk9117 9 หลายเดือนก่อน +4

    Thanks Tim, it's week 1 of my capstone project class and this is exactly what I needed. I can't believe my luck

  • @spencercooper367
    @spencercooper367 9 หลายเดือนก่อน +3

    Since I encountered your video last year I continue to feel passionate about Ilearning this. Thanks for always publishing fruitful and meaningful content that go in-depth. Tim your name and the names of other will surely be mentioned when I have fully grown.

  • @Movie-galore-it5fy
    @Movie-galore-it5fy 2 หลายเดือนก่อน

    Simple, straight and such a dry code! this was very much needed...Thankyou so much Tim

  • @parthkabra8880
    @parthkabra8880 9 หลายเดือนก่อน +1

    I struggled learning this on my own, they way you explained it was outstanding

  • @alimihakeem841
    @alimihakeem841 9 หลายเดือนก่อน +1

    Absolutely a nice projects. Thanks for this. I'm currently learning flask, so this project will give me a starter template in building full stack application

  • @jsto6056
    @jsto6056 8 หลายเดือนก่อน

    Great work on this. This is a perfect example of a FS app base modal for anyone to use. Thanks. Could have used this years ago myself.

  • @pth55
    @pth55 9 หลายเดือนก่อน +1

    Please continue making these type of beginner friendly videos.
    Thanks ❤

  • @saiabhyankarsridhar
    @saiabhyankarsridhar 4 หลายเดือนก่อน

    sir thanks alot was struggling to use flask to create api for using it on my app it was simple and elegant thanks again

  • @harishv2210
    @harishv2210 หลายเดือนก่อน

    Thank you for this videos, i learnt a lot this is my first semi full stack project that i coded along with you. And now i am trying to deploy this project in aws cloud. let see how i figure to deploy. Once Again Thank You ❤

  • @aspeno5613
    @aspeno5613 5 หลายเดือนก่อน

    This is super helpful, thank you. I appreciate that you didn't waste hours on the front end 😅

  • @spicylimer
    @spicylimer 6 หลายเดือนก่อน

    That has been an awesome video! Playing around with flask for a couple of weeks and now looking at this video, I retyped 1:1 the code while watching the video and learning. Such an awesome content!

  • @NSA.
    @NSA. 2 หลายเดือนก่อน

    this is actually very good especally if you already know
    py js
    and the basics of flask
    thanks

  • @music4life467
    @music4life467 8 หลายเดือนก่อน +1

    it almost year i use python as backend to my javascript,, it very easy to use like ml or other lib of python, using it in react js and also plain javascript.. a month ago i create basic widget or controls library for my plain js

  • @mikeandersen8535
    @mikeandersen8535 6 หลายเดือนก่อน

    Stumbled upon this video searching for more information to help me create a mockup for an idea I have, which I have decided to make with flask and a web frontend. Wish I have found this one first, because that would have saved me some time. Great work and you are very good at explaining the tings I need to learn.
    Did a lot of web-related programming back in the 1990s, but oh my how much have changed since then! Even how things are named. It even took me a while to understand that "Route" was nothing else than what we called "Path". So if you are up for a challenge: Create the application from this video with only the tools and technology available in 1996, and then do a comparison of then and now. Could be a cool video, and maybe you recognise more techniques that are the same today as they were then (but with other names)?

  • @hasibulalamprionto2010
    @hasibulalamprionto2010 29 วันที่ผ่านมา

    That's a nice explaination, tim!! please make react and fastapi version of it!!

  • @YousifMohammed-uk4zi
    @YousifMohammed-uk4zi 7 หลายเดือนก่อน

    Very well structured video i loved the way you explained everything, please make more videos of these with more complex DB. thanks

  • @johnadriandodge
    @johnadriandodge 9 หลายเดือนก่อน

    Shalom Mr. TwT, thank you for sharing this.
    Generally, I get so swept away by the visual GUI GUI nifty neat style effects, and all the bells and whistles which accompany that, I quickly lose sight of the meat and potatoes of the functionality.
    I am glad you made a decision to bypass that noise, and focus on what matters most of the given app.
    After all, an app most certainly can function not looking nice, but it can look the best, yet not function at all!
    Thanks again Mr. TwT!
    Here is a thought...
    Tech Niche Tim: TNT!

  • @luisdavidbarranzuelacastil1844
    @luisdavidbarranzuelacastil1844 7 หลายเดือนก่อน

    Master TIM, thank you so much for doing this!, blessings!

  • @maikelvanvliet2716
    @maikelvanvliet2716 8 หลายเดือนก่อน +1

    Really nice tutorial! Can we have a pt.2 tutorial where we go deeper and make a website where people can register, login and change their records after they are logged in?

  • @TizianoMontenegro07
    @TizianoMontenegro07 หลายเดือนก่อน

    great video, everything that you was been doing you explained it very nice

  • @vinodsagar2412
    @vinodsagar2412 8 หลายเดือนก่อน

    Hello Tim , Thanks for your awesome video and i started working on it

  • @nikhuge6580
    @nikhuge6580 9 หลายเดือนก่อน

    This is really great.I really like to see more small fullstack projects like these...

  • @arunpravin3579
    @arunpravin3579 9 หลายเดือนก่อน +2

    Vera level so good please upload python+JavaScript tim

  • @ntahetony-blaise6386
    @ntahetony-blaise6386 9 หลายเดือนก่อน

    Thank you for this amazing video, Tim!

  • @Mecagothits
    @Mecagothits 6 หลายเดือนก่อน

    This one is actually Tim’s best video

  • @AlejandroMéndez-j6j
    @AlejandroMéndez-j6j 8 หลายเดือนก่อน

    Btw, I'm using mac and I use pip, not pip3.
    P.D. Nice tutorial. This will help me to work on many personal projects.

  • @thanhquangtranhuu1177
    @thanhquangtranhuu1177 8 หลายเดือนก่อน

    Thank you so much Tim, You Are The Man! 🥰

  • @jasonting1586
    @jasonting1586 6 หลายเดือนก่อน

    Great tutorial with actual implementations. Thanks for the quality video!

  • @majestif
    @majestif 9 หลายเดือนก่อน

    A tutorial with Flask + HTMX would be much appreciated!

  • @mdelim3128
    @mdelim3128 9 หลายเดือนก่อน

    NICE TIM THIS IS WHAT I WAS LOOKING FOR TO BIND ALL AND HOW TO MAKE IT

  • @p21072
    @p21072 9 หลายเดือนก่อน +3

    Hey Tim can you make a tutorial for building a fullstack website using react redux and django it would be really helpfull

  • @iamqqu
    @iamqqu 9 หลายเดือนก่อน

    Absolutely great video Tim, this clears a lot of cobwebs

  • @kosi5
    @kosi5 7 หลายเดือนก่อน

    Thank you! this was really informative. You are a great teacher :)

  • @danielpeck1310
    @danielpeck1310 6 หลายเดือนก่อน +1

    can you do a video on how to deploy flask + react?

  • @codingpandas
    @codingpandas 9 หลายเดือนก่อน

    Have learned alot from you tim, thanks for the quality content🥰

  • @BossNerd
    @BossNerd 9 หลายเดือนก่อน +1

    It would be cool if you did this same project in pyscript and then compare the two as a measure of how well pyscript is coming along.

  • @nomadti8591
    @nomadti8591 9 หลายเดือนก่อน

    Just what I was looking for!! Thanks so much!

  • @CrazzzyCreativeCorner
    @CrazzzyCreativeCorner 5 หลายเดือนก่อน

    Really amazing work Tim, just wanted to request you one small thing. Instead of the flickering can you do soft display of the captions? Not sure about others, but its kind of annoying. :(

  • @kudrah
    @kudrah 9 หลายเดือนก่อน

    This is exactly what I wanted. Thanks

  • @thesnedit5406
    @thesnedit5406 9 หลายเดือนก่อน

    Please make a django and react course. Those two comprise one of the best tech stack

  • @HyperbolicHarmony
    @HyperbolicHarmony 8 หลายเดือนก่อน +1

    Hi Tim! I was wondering: what is the best python IDE? I've been using Pycharm, but it is very difficult to get packages and such things. Do you have any advice?

    • @iosule3719
      @iosule3719 7 หลายเดือนก่อน

      sublime text- super light weight

  • @andresbonelli
    @andresbonelli 8 หลายเดือนก่อน

    This is an amazing tutorial, concise and to the point, have you thought of following with a tutorial on how to deploy this proyect online? (you can even use some of your sponsors loke Linode or such as an example!)

  • @nathanfirebase
    @nathanfirebase 6 หลายเดือนก่อน +1

    is it possible to do it without react and use DOM?

  • @bklynpeter
    @bklynpeter 7 หลายเดือนก่อน

    Overall, fantastic. One major question though. While this works great when you can start up your frontend and backend in a dev environment, ultimately if this was a real web app, wouldn't the backend need to deliver the frontend to the client when you first landed on the page? Maybe you could explore this in a follow-up video?

  • @AdamsChizzy
    @AdamsChizzy 9 หลายเดือนก่อน

    Wow just what I needed
    Thanks tim

  • @pietraderdetective8953
    @pietraderdetective8953 9 หลายเดือนก่อน

    Was excited to see you doing some frontend with React.
    Then i saw the looks of the demo project...ngl it took away my interest to do the project.

    • @TechWithTim
      @TechWithTim  9 หลายเดือนก่อน +1

      Fair enough, the idea is to let you style it on your own. Unless you want to watch me do css for 2 hours?

  • @thux2828
    @thux2828 หลายเดือนก่อน

    With create_contact(), if an exception occurs committing changes, should I flush the staging area in case it affects a future commit? Like db.session.rollback()?

  • @Alphalm100
    @Alphalm100 9 หลายเดือนก่อน +1

    How do we protect our api not to be accessed from different URLs?

  • @myhificloud
    @myhificloud 9 หลายเดือนก่อน

    This is fantastic. Thank you for this.

  • @しょう-i8w
    @しょう-i8w 4 หลายเดือนก่อน

    thanks from Japan

  • @Thecodemaster463
    @Thecodemaster463 2 หลายเดือนก่อน

    Please can we get one next JS, and it would also be really helpful if you gave one with a sql database like Postgres or MySQL

  • @penujahansith2688
    @penujahansith2688 9 หลายเดือนก่อน

    yooooo! the perfectely matched tutorial 🔥 sending... love from Sri Lanka ❤❤❤

  • @garrettsmith315
    @garrettsmith315 9 หลายเดือนก่อน +1

    Ask and you shall receive!!!!! Now that we have seen React, it would be interesting to see a comparison video to a different front-end framework!!!!!!!!

  • @TheAraz95
    @TheAraz95 9 หลายเดือนก่อน

    Great one! Do one for FastAPI backend and React frontend ❤️

  • @vella166
    @vella166 9 หลายเดือนก่อน +5

    Nice video🔥

  • @ValeriPenchev
    @ValeriPenchev 7 หลายเดือนก่อน

    Hi, first of all - great video, thanks for it!
    I have the following python backend question - why are not database intereactions in try-catch blocks and only the add_contact is?

  • @keremcd
    @keremcd 29 วันที่ผ่านมา

    Thanks Tim!

  • @drushkyy2017
    @drushkyy2017 8 หลายเดือนก่อน

    can you explain how languages talk to each other? im confused how they fit together.

  • @edisongarcia94
    @edisongarcia94 9 หลายเดือนก่อน

    Thanks for the helpful and interesting video!

  • @TrilioniME
    @TrilioniME 7 หลายเดือนก่อน

    FastAPI + React example please. Thank you for Flask and Django.

  • @146vj
    @146vj 6 หลายเดือนก่อน

    great work... how can I deploy this app on Vercel or similar platforms. Thanks

  • @DevlogBill
    @DevlogBill 5 หลายเดือนก่อน

    Hi Tim, I have a couple of months experience with Django creating basic crud apps. But I noticed Django isn't the greatest when it comes to creating quickly a restful API, it is actually kind of tuff. I only have experience with Django. Silly question but are there similarities in the code structure between Django, Flask & FastAPI? Or are they miles apart from each other?

  • @rahuldas6109
    @rahuldas6109 6 หลายเดือนก่อน

    Can we use two backend servers and connect two backend server? Like if I am using expo react-native then can I use NodeJs & Flask while connecting javascript & python code for some functions?

  • @WebDeveloper682
    @WebDeveloper682 7 หลายเดือนก่อน

    thank you for this tutorial but how to deploy both of them together

  • @TheGeekSurgeon
    @TheGeekSurgeon 5 หลายเดือนก่อน

    @TechWithTim do you have any video's on fixing CORS : errors I have done this project running into this issue?

  • @iosule3719
    @iosule3719 7 หลายเดือนก่อน

    Hi Tim i hope i get a response to this question. Ive seen your other video series about using python+flask sqlalchemy without using JavaScript, so my question is since u are using python and JavaScript in this video and GitHub doesn't host site Python sites, will GitHub host sites with JavaScript and python? like the type u did in this video

  • @adilfarq3784
    @adilfarq3784 9 หลายเดือนก่อน

    Go and react project needed 🎉

  • @OnePieceShortGamer
    @OnePieceShortGamer 8 หลายเดือนก่อน +1

    u need to use __init__ to the class 16:18 timestamp (not reqired tho)

  • @tecnom7133
    @tecnom7133 2 หลายเดือนก่อน

    Great Job man

  • @StoiccOSRS
    @StoiccOSRS 8 หลายเดือนก่อน

    How did you get your text to be all of those colors? I installed 'prettier' but I don't like the color scheme of it. I like the one that you have

  • @Guimatics
    @Guimatics 4 หลายเดือนก่อน

    I got to 54:30 and I dont have anything showing on the front end. I also have an error for not being able to find the logo in app jsx

  • @joshuakibona3247
    @joshuakibona3247 8 หลายเดือนก่อน

    can you please do a fastAPI and nextjs with AUTH flows, And how to implement RBAC

  • @Akshat2108
    @Akshat2108 9 หลายเดือนก่อน

    Yessss..... FINALLY WHAT I NEEDED

  • @techDesign-hy8nr
    @techDesign-hy8nr 6 หลายเดือนก่อน

    nice video , how about if u want to connect to the frontend remotly from other network ? will react get access to fetch data from the backend ? or will Flask bock this ? error: access to fetch at.......has been blocked by CORS policy: The request client is not a secure context and the resource is in more-private address space `local`.

  • @Kiran23456
    @Kiran23456 4 หลายเดือนก่อน

    Is react flask and mysql is better than MERN STACK??

  • @burntfried
    @burntfried 9 หลายเดือนก่อน +1

    How do you publish Python backend to a server? Does it just go in the public/html folder like PHP does?

    • @TechWithTim
      @TechWithTim  9 หลายเดือนก่อน

      It’s a bit of a different process, I have various deployment videos on my channel showing how to deploy a flask app.

  • @ernie345
    @ernie345 9 หลายเดือนก่อน +2

    Great content 🎉

  • @cheerio4742
    @cheerio4742 9 หลายเดือนก่อน

    WOW just the video i need Thank you so much. can you make a Django + React Vite w/ deployment process in it?

  • @twerner5496
    @twerner5496 หลายเดือนก่อน

    Thanks Tim

  • @sasukev9
    @sasukev9 7 หลายเดือนก่อน

    At the end of the video when wanting to use the fetch button, I get an ERROR TO FETCH, I checked the URL and the fetch method.. everything seems fine, what could it be?
    CREATE and UPDATE works, delete is the only one that does not

  • @bahae06
    @bahae06 8 หลายเดือนก่อน

    i think you’re using an old version of flask sqlalchemy? correct if that’s wrong

  • @noy5626
    @noy5626 3 หลายเดือนก่อน

    Fire tutorial! 🔥👍💯

  • @user-skxfwmm
    @user-skxfwmm 9 หลายเดือนก่อน

    Hi Tim, this is exactly what i'm looking for. Putting things together, having the whole picture of the app. But I actually find myself a little bit struggled when i go along the tutorial, i feel like it is because i'm not that familiar with flask and those back-end knowledge yet. Do you have any advice of what should i do? That would be really appreciated. Once again, thanks for the video.

    • @TechWithTim
      @TechWithTim  9 หลายเดือนก่อน +1

      I have a ton of flask tutorials on my channel they’re more beginner friendly why don’t u check those out!

    • @user-skxfwmm
      @user-skxfwmm 9 หลายเดือนก่อน

      @@TechWithTim Exactly what I'm doing right now😂 sorry for the dumb question

  • @ngalvez7034
    @ngalvez7034 4 หลายเดือนก่อน

    Can you do a video on CSRF Tokens? I am trying to create users for my website and keep getting a failed fetch csrf token

  • @Jeffkaranja-k1l
    @Jeffkaranja-k1l 8 หลายเดือนก่อน

    Would you be able to do a tutorial on reflex?

  • @shuncho7844
    @shuncho7844 8 หลายเดือนก่อน

    Can I ask what theme and font you are using because its a lot clearer than mine on vscode

  • @lytz
    @lytz 9 หลายเดือนก่อน

    Any recommendations on where to start to get the skills and insights needed to understand a bit more of this video.

    • @TechWithTim
      @TechWithTim  9 หลายเดือนก่อน +1

      I have all kinds of beginner tutorials on my channel for both JavaScript and Python. I would make sure you have a good understanding of both of those languages

  • @davidcharles-daniel4362
    @davidcharles-daniel4362 9 หลายเดือนก่อน

    Thanks a lot for the video.

  • @rockerzhackers799
    @rockerzhackers799 9 หลายเดือนก่อน +1

    Do another with django and react

  • @dotsdigi
    @dotsdigi 9 หลายเดือนก่อน

    Damn finally I've caught up with you! Nice video as usual🔥

  • @TheNishi42
    @TheNishi42 9 หลายเดือนก่อน

    Would have a complete project if you would have consider index.html and some config for hard-coded urls in jsx