Build & Deploy a React Todo App with Firebase | React Tutorial For Beginners

Поділитися
Вставка
  • Опубліковано 2 лис 2024

КОМЕНТАРІ • 129

  • @vinaysharma642
    @vinaysharma642 3 роки тому +3

    Wasted my 4hours of night, then found this...thanks for making🖐🔥

    • @indianappguy
      @indianappguy  3 роки тому

      Glad I could help do like and share

  • @bryanmedina736
    @bryanmedina736 3 роки тому +3

    This is by far the more intuitive tutorial of react I've ever seen, new sub here!

  • @sarveshmaurya2168
    @sarveshmaurya2168 3 роки тому

    small and effective video. Now I know firebase. thanks you....

  • @rafaXD05
    @rafaXD05 3 роки тому +3

    This is the most easy tutorial on TODO app. 💖
    Good work and nice explanation bro.
    I have made a ToDo app without firebase earlier.
    Now I have both projects with/without firebase 😎

  • @nadeemshareef7508
    @nadeemshareef7508 3 роки тому +3

    You gain a new subscriber... Looking forward to learning more from you.

  • @sonaligupta1266
    @sonaligupta1266 3 роки тому

    Thank you so much. I was having a problem understanding firebase basics before I ended up here.

  • @focus8070
    @focus8070 3 роки тому +2

    Great tutorial now have some understanding about firebase database connection thanks

  • @caskyjay9823
    @caskyjay9823 3 роки тому

    thank you for this. easiest startup anyone can ever get. You just gained a new subscriber

  • @HornOKPlease
    @HornOKPlease 3 роки тому +1

    So calm. Amazing experience!

  • @kamleshrode
    @kamleshrode 3 роки тому +1

    Very simply explained. Thanks for all the hardwork Sanskar. You are giving React Sanskar to folks :D

  • @infectedmushroom3488
    @infectedmushroom3488 3 роки тому +4

    Perfect!
    Exactly what I was looking for, thank you!
    Looking forward to learning more React from you :)

    • @indianappguy
      @indianappguy  3 роки тому

      Great

    • @indianappguy
      @indianappguy  3 роки тому

      Any particular thing I should make video on?

    • @infectedmushroom3488
      @infectedmushroom3488 3 роки тому

      @@indianappguy maybe a calculator using React, projects for beginners that are a bit advanced, thank you for asking for suggestions.

  • @oscardbg9654
    @oscardbg9654 3 роки тому +2

    Great video, i was geting an error on saving about undefined todo attribute. I solved it creating a handleChange function instead of inline onClick function

  • @jaggyjut
    @jaggyjut 3 роки тому

    This is one of the best reactjs Todo tutorials. Many Thanks.

  • @Artisticanand
    @Artisticanand 3 роки тому +2

    It will be so helpfull if you start react js full tutorial from scratch 👏

  • @fal8202
    @fal8202 3 роки тому +1

    Love the simplicity when you explain things. I find that watching you trying things out is very beneficial , still it would be good to prepare your CSS steps beforehand. :-) keep up this good work !

  • @dipakraut6058
    @dipakraut6058 3 роки тому

    Amazing Buddy🙌...eagerly waiting for the next videos

  • @aaryan3461
    @aaryan3461 3 роки тому

    New Sub. Great video man. Please make more react vids

  • @tejasl.7957
    @tejasl.7957 3 роки тому

    Amazing man. Keep making this kind of content 🙌🏻👏🏻

  • @vadapow
    @vadapow 3 роки тому

    That was one of the most beautifully explained tutorial dude. May the youtube algorithm bless you mate. Subbed❤️

  • @mtmusic6618
    @mtmusic6618 3 роки тому +1

    Perfect tutorial
    Exactly what I was looking for, thank you very much

  • @Toni-nw1dk
    @Toni-nw1dk 3 роки тому

    Thank you very much! Perfect Tutorial!

  • @ashwanisen6272
    @ashwanisen6272 3 роки тому +2

    Excellent sir

  • @BECNIKHILKUMAR
    @BECNIKHILKUMAR 3 роки тому +1

    Can anyone help i already work with mongoDB in past but here when I use firebase and create a database step it shows
    CANNOT ENABLE FIRESTORE TO YOUR PROJECT
    UNKNOWN ERROR OCCURED
    thanks in advance

  • @prasangsinghal7887
    @prasangsinghal7887 3 роки тому +1

    Great tut. But I noticed you pushed the firebase secrets(apikey, etc) which is not a best practice. I know that using cloud functions we can avoid doing this but haven't tried them. It would be good if you can make another tut for that.

  • @MrJatan90
    @MrJatan90 3 роки тому

    Amazing tutorial man, thank you so much!

    • @indianappguy
      @indianappguy  3 роки тому

      Glad it helped!, Do like and share

  • @indranilhalder6633
    @indranilhalder6633 3 роки тому +1

    Learnt a lot... awesome content

    • @indianappguy
      @indianappguy  3 роки тому

      Glad it was helpful!, Indrani do like and share will mean a lot to me

  • @MaksymMinenko
    @MaksymMinenko 3 роки тому

    What do you think about writing wrapper functions for firebase functionality?

  • @5most769
    @5most769 3 роки тому

    Awesome I loved it
    I sat the whole nyt n coded this n it works
    But I'm face a small problem
    The data is not reflecting soon
    Can u plzzz help me out in that

    • @indianappguy
      @indianappguy  3 роки тому

      not reflecting soon? i don't understand the problem please describe a little more

  • @benpreston4766
    @benpreston4766 3 роки тому

    This is a really excellent tutorial. Thanks!

    • @indianappguy
      @indianappguy  3 роки тому

      Glad you enjoyed it! do like and share and if you like to support the channel you can www.buymeacoffee.com/sanskartiwari

  • @tilldill
    @tilldill 3 роки тому +1

    Love this. How would you make this mobile friendly now? thanks

    • @indianappguy
      @indianappguy  3 роки тому

      will not be more than 4-5 lines of code if you can do please do share i will try when i get time

  • @suchitaghadge3071
    @suchitaghadge3071 3 роки тому

    Great content with a Good explanation

  • @farstep4011
    @farstep4011 3 роки тому

    Stunning! Thank you for sharing this!

    • @indianappguy
      @indianappguy  3 роки тому

      You are so welcome! do like and share

  • @ПавелИванович-ы7ц
    @ПавелИванович-ы7ц 3 роки тому +1

    Hi, great video, thanks!!! but how to add tasks in mobile?

    • @indianappguy
      @indianappguy  3 роки тому

      this should work in mobile with click of the next line button

  • @siriusvatsa
    @siriusvatsa 3 роки тому +2

    Beautiful !! , really nice look
    Can you please make the same APP with flutter :)

    • @indianappguy
      @indianappguy  3 роки тому +1

      I have made a todo web app with flutter alredy please check the channel

  • @olumesemathias6309
    @olumesemathias6309 2 роки тому

    Good morning please I watched your tutorial and liked it but the todolist App stores the todolist info for one user when another user from a different browser uses it,the browser renders the Todolist of the first user to him. The Todo info isn't separate for different users but the same info displayed when another user submits or enters information

    • @indianappguy
      @indianappguy  2 роки тому

      been a while but basically you need to add that to the function to get only the documents where user id is equal to yours

  • @pranjalchaplot
    @pranjalchaplot 3 роки тому +2

    more flutter video coming soon?

  • @sarveshmaurya2168
    @sarveshmaurya2168 3 роки тому

    please make a full and short video on material-ui as well, I am much confused in changing default components of material-ui please, please...

  • @premaaswani4228
    @premaaswani4228 3 роки тому +1

    Awesome Brother .

  • @AniketSingh-tj5si
    @AniketSingh-tj5si 3 роки тому

    Looking for more react tutorial 👍🏻

  • @pranjalchaplot
    @pranjalchaplot 3 роки тому

    How do I update the my webapp just do the changes and firebase deployed???

  • @hrithikgavankar7845
    @hrithikgavankar7845 2 роки тому +1

    Enjoywdddddddd!

  • @PraisPranav
    @PraisPranav 3 роки тому

    React videos are nice.

    • @indianappguy
      @indianappguy  3 роки тому

      I am glad you liked them Pranav do share

  • @davidalborov8483
    @davidalborov8483 3 роки тому +1

    Will u do video about messager notification ? It must need

  • @matthewbrown4572
    @matthewbrown4572 3 роки тому

    When I use setTodoInput(" ") to clear the input, it doesn't work. Any solutions?

  • @vishwatejapaka9881
    @vishwatejapaka9881 3 роки тому

    Please implement Google authentication functionality in this todo app,so that every user has his own to-do list! , it helps to understand all the things very well!

  • @tushartiwari265
    @tushartiwari265 3 роки тому +1

    please give the (youtube) timestamp where we sorted the list based on Todo Timestamp.

  • @bilelrahmouni01
    @bilelrahmouni01 3 роки тому +1

    thank you

  • @prashnought
    @prashnought 3 роки тому

    i followed up but later the entry order of the todos became erratic (the latest should be on top) but the new entries started apperaing in a random order

  • @viveklokhande8976
    @viveklokhande8976 3 роки тому

    i am getting error that local host refusing to connect
    any solution?

  • @usamaakbar4049
    @usamaakbar4049 2 роки тому +1

    when I refresh the page the all data wipe ..How to fix this?

  • @kalkedanarrso8160
    @kalkedanarrso8160 3 роки тому

    I was following coding as I was watching your this tutorial and I am facing this issue.
    ./node_modules/@firebase/firestore/dist/esm5/prebuilt-db9cc925-eb007c37.js
    Attempted import error: 'FetchXmlHttpFactory' is not exported from '@firebase/webchannel-wrapper' (imported as 'v').

    • @MrJatan90
      @MrJatan90 3 роки тому

      I am facing same issue. Did you get any solution?

  • @dipakraut6058
    @dipakraut6058 3 роки тому +1

    please next video on how to add a payment gateway in react

  • @laughtale1181
    @laughtale1181 3 роки тому

    thanks man

  • @hemantv1676
    @hemantv1676 3 роки тому

    how did you make text bold

    • @indianappguy
      @indianappguy  3 роки тому

      its simple just use font weight property api.flutter.dev/flutter/dart-ui/FontWeight-class.html

  • @jassrajput890
    @jassrajput890 3 роки тому

    Awesome

  • @rafaXD05
    @rafaXD05 3 роки тому

    I made some changes in my project. How can I reflect those changes in app ?

    • @indianappguy
      @indianappguy  3 роки тому +1

      npm run build > firebase login (make sure you are logged in with right account) > firebase deploy

    • @rafaXD05
      @rafaXD05 3 роки тому

      @@indianappguy yeah already done bro. Thanks🔥

  • @HxPathak
    @HxPathak 3 роки тому

    Hello ,sir your Flutter chat aap GitHub source codes has lot of error please check & re-upload

  • @shaikirfan3112
    @shaikirfan3112 3 роки тому

    Awesome but if I enter bank todo it is accepting how to resolve that issue.

  • @user-vx1sy4zv2r
    @user-vx1sy4zv2r 3 роки тому

    Bro how to create api and connect flutter

  • @hemantv1676
    @hemantv1676 3 роки тому

    Getting firebase installation problem on windows

  • @socka29
    @socka29 3 роки тому

    How to make changes after deploying the site? I tried firebase deploy but it didn't work. Please help

    • @indianappguy
      @indianappguy  3 роки тому +1

      firebase login > login with google in browser > firebase init > choose hosting > firebase deploy

  • @pranjalchaplot
    @pranjalchaplot 3 роки тому

    One thing that confused me for a long time is that template literals uses backtick, which is on the left of "1" on keyboard, instead of single quotation mark (') @21:09

    • @rafaXD05
      @rafaXD05 3 роки тому

      congrats bhai hahhaha

  • @abhaypatil5880
    @abhaypatil5880 3 роки тому

    Everything working fine If I write any todo It just shows in progress not actual todo

    • @indianappguy
      @indianappguy  3 роки тому +1

      you can update that to when creating todo pass done rather than in progress

  • @devangmathur8610
    @devangmathur8610 3 роки тому

    my text is not getting updated in firebase,can you please help

    • @indianappguy
      @indianappguy  3 роки тому +1

      need to go through the whole code either make a issue in the repo or share the error from debug console

  • @mayuri7843
    @mayuri7843 3 роки тому +2

    It would have been great if you would have included firebase authentication and login form also

    • @indianappguy
      @indianappguy  3 роки тому

      i have done other react project like creating insta clone which includes it

  • @ayushsanj4346
    @ayushsanj4346 3 роки тому +1

    Hii, It says useEffect not defined

    • @indianappguy
      @indianappguy  3 роки тому

      You need to import it

    • @indianappguy
      @indianappguy  3 роки тому

      I usually start writing and it auto suggest

    • @ayushsanj4346
      @ayushsanj4346 3 роки тому

      Yeah exactly, I got it earlier.

    • @ayushsanj4346
      @ayushsanj4346 3 роки тому

      @@indianappguy Hii It is taking blank values

    • @ayushsanj4346
      @ayushsanj4346 3 роки тому

      hello, are u there?
      It's taking blank values

  • @aditgaur1585
    @aditgaur1585 3 роки тому +1

    12:00 You could have provided alignItems: "center" to make them not to take the whole space...

  • @omkarshete2964
    @omkarshete2964 2 роки тому

    What is the {} syntax for props called? Because you didn't use props.xyz, you just included it in curls.
    Great tut btw, was looking for such a thing!

    • @indianappguy
      @indianappguy  2 роки тому

      yeah i used {} so you can just have a variable defined