Google Keep App clone with ReactJS in Hindi | React Project in Hindi #50

Поделиться
HTML-код
  • Опубликовано: 6 фев 2025
  • Welcome, I am building a Google Keep App Clone with pure React js in Hindi in 2020.
    ➡️ Source Code Link: www.thapatechn...
    ************ Must Watch Videos For Web Development ************
    ➡️ Hooks in React JS in Hindi | useState in Hook in React JS: • #30: Hooks in React J...
    ➡️ Array Destructuring in ES6 in JavaScript in Hindi 2020: • ES6 Tutorial #5: Array...
    ➡️ Object Destructuring in ES6 in JavaScript in Hindi: • ES6 Tutorial #7: Objec...
    ➡️ React DevTools & Source Code Link: www.thapatechn...
    ➡️ ReactJS Tutorial in Hindi 2020 Playlist Link: • React JS Tutorial in H...
    ➡️ ReactJS JavaScript Array Map Method in Hindi with Example: • ReactJS JavaScript Arr...
    ➡️ Fat Arrow Function in JavaScript in Hindi 2020: • ES6 Tutorial #8: Fat A...
    ➡️ #23: Array in React JS in Hindi | React JS Project Netflix App #2 in Hindi in 2020
    ➡️ Array in JavaScript in Hindi: • JavaScript Tutorial in...
    ➡️ #22: React JS Project Netflix App Part #1 in Hindi in 2020: • #22: Props in React Js...

    ➡️ Install VS Code for ReactJS LINK: www.thapatechn...
    ➡️ Check Complete Reactjs in One video here 👇 • ReactJS For Beginners ...
    ➡️ HTML in One Video: • Learn HTML in One Vide...
    ➡️ CSS in One video: • Learn Complete CSS In ...
    ➡️ CSS FlexBox in 30 Minutes: • CSS FlexBox in 30 Minu...
    ➡️ JavaScript in One video: • JavaScript in One Vide...
    ➡️ ECMAScript 6 in One Video: • ES5 & ES6 | ECMAScript...
    ➡️ HTML5 in one video: • HTML5 Tutorial in One ...
    ➡️ CSS3 in one video: • Learn Complete CSS3 In...
    ➡️ Bootstrap4 in One video: • Bootstrap 4 in One Vid...
    ➡️ Jquery in One video: • jQuery in One Video in...
    ➡️ JSON in one video: • JSON in One Video in H...
    ➡️ ReactJS in one video: • ReactJS For Beginners ...
    ➡️ PHP in One Video: • PHP TUTORIAL IN ONE VI...
    ➡️ NodeJS in one video: / ipnwakoibt
    ➡️ MySQL in one video: • Complete SQL & MySQL i...
    ********** CLICK HERE TO WATCH ************
    ➡️ Fetch API in JavaScript: • Fetch API in JavaScrip...
    ➡️ AJAX tutorial for beginners in Hindi: • AJAX tutorial for begi...
    ➡️ Template literals (Template strings) in ES6 in JavaScript in Hindi: • ES6 Tutorial #3: Templ...
    ➡️ Async Await in JavaScript in Hindi: • Async Await in JavaScr...
    ➡️ Promises in JavaScript in Hindi: • Master The Promises in...
    ➡️ Callback Hell in JavaScript: • Callback Hell in JavaS...
    ➡️ Advanced JavaScript in Hindi Playlist: • Advanced JavaScript Tu...
    ➡️ ECMAScript Tutorial in Hindi 2020: • Modern JavaScript ES6 ...
    ➡️ ES5 & ES6 | ECMAScript 6 in One Video in Hindi: • ES5 & ES6 | ECMAScript...
    ➡️ JavaScript Game Development Series in 2020: • JavaScript Game Develo...
    ➡️ Source Code Link: www.thapatechn...
    ➡️ Top 5 Programming Languages in 2020: • Top 5 Programming Lang...
    ➡️ Ludo Game JavaScript Link: • JavaScript Game in Hin...
    ➡️Plz show some love to My Siter RUclips Channel and Plz Subscribe Link: / @mayabeautyvlogs878
    **************** MUST WATCH VIDEOS *****************
    ➡️ How to become a Full Stack Developer 2020: • How to become a Full S...
    ➡️ How To Become a Web Developer 2020: • How To Become a Web De...
    ➡️ How JavaScript Works: • How JavaScript Works i...
    ➡️ Follow me on Instagram: / vinodthapa55
    Make Website Responsive Using Media Queries in One Video in Hindi | Web Design Tutorial in Hindi
    ➡️ Link: • Make Website Responsiv...
    Guys, Please support my channel by SUBSCRIBE to my channel and share my videos in your Social Network TimeLines.
    Don't Forget to Follow me on all Social Network,
    Website Link: www.thapatechn...
    Instagram Link: / vinodthapa55
    Facebook Link: / vinodthapa55
    Twitter Link: / vb55thapa
    Facebook ThapaTechnical Page Link: www.facebook.c...

Комментарии • 389

  • @ThapaTechnical
    @ThapaTechnical  4 года назад +25

    I really hope u all enjoyed my video on Google Keep App Clone with pure React js in Hindi in 2020.
    ➡️ ReactJS Tutorial in Hindi 2020 Playlist Link: ruclips.net/p/PLwGdqUZWnOp3aROg4wypcRhZqJG3ajZWJ
    ➡️ Source Code Link: www.thapatechnical.com/2019/08/how-to-get-source-code.html

    • @dewtome9220
      @dewtome9220 4 года назад

      appka vo node js in one hour vala video acha tha par kafi jise rah gayi thi usmein isliye jaise app ne reactjs pe series banai vaise hi node js aur express pe bhi banyo pls

    • @hridoybanik639
      @hridoybanik639 4 года назад +1

      Plz make video on about google maps in reactjs

    • @sumitbisht5049
      @sumitbisht5049 4 года назад

      I loved it, all your video's are amazing. Please create a complete tutorial series on angular 8, many of my friends want to learn it.

    • @nitishbhardwaj8878
      @nitishbhardwaj8878 4 года назад

      Hii bro mujhe kuch help chaiye apkiii

    • @kanikabagri247
      @kanikabagri247 4 года назад +1

      Sir, Please make tutorial on Redux as well. This is my humble request to you. I would be extremely thankful to you, Sir.

  • @fearflik
    @fearflik Год назад +30

    css code -
    *{
    box-sizing:border-box;
    padding: 0;
    margin: 0;

    }
    .header{
    width: 100%;
    line-height: 100px;
    background-color: #f5ba13;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-left: 50px;
    color: white;
    box-shadow: 5px 3px 15px -5px rgba(0,0,0,0.3);
    }
    .main_note{
    width: 500px;
    padding: 15px 10px 5px 10px;
    margin: 20px auto;
    }
    .my_notes h1{
    color: #34495e;
    }
    .my_notes p{
    color: grey;
    }
    .form{
    min-height: 50px;
    color: #ecf0f1;
    padding: 15px 10px 5px 10px;
    box-shadow: 3px 5px 15px -5px rgba(0,0,0,0.5);
    border-radius: 10px;
    position: relative;
    }
    input{
    width: 100%;
    line-height: 30px;
    background: transparent;
    border: none;
    outline: none;
    font-size: 1.5rem;
    margin: 10px 0;
    font-weight: bold;
    }
    textarea{
    width: 100%;
    line-height: 30px;
    background: transparent;
    border: none;
    outline: none;
    font-size: 1rem;
    margin: 10px 0;
    }
    .MuiButton-root{
    width: 30px;
    height: 50px;
    position: absolute;
    bottom: -28px;
    left: 400px;
    cursor: pointer;
    background-color: #fff !important;
    border-radius: 50% !important;
    }
    .MuiButton-root .plus-sign{
    font-size: 45px !important;
    font-weight: 900;
    color: #f4b000;
    cursor: pointer;
    z-index: 222;
    background: transparent;
    }
    .MuiButton-root:hover{
    background-color: #f4b400;
    }
    .MuiButton-root:hover .plus-sign{
    color: #fff;
    background: transparent;
    }
    .note{
    background: #fff;
    border-radius: 7px;
    box-shadow: 0 2px 5px;
    padding: 10px;
    width: 240px;
    margin: 16px;
    float: left;
    }
    .note h1{
    font-size: 1.1em;
    margin-bottom: 6px;
    }
    .note p{
    font-size: 1.1em;
    margin-bottom: 10px;
    white-space: pre-wrap;
    word-wrap: break-word;
    }
    .note .btn{
    position: relative;
    float: right;
    margin-right: 10px;
    border: none;
    width: 50px;
    color:#f4b400 ;
    height: 50px;
    background: transparent;
    cursor: pointer;
    outline: none;
    border-radius: 50%;
    }
    .deleteIcon{
    width: 0.7em;
    height: 0.7em;
    }
    .note .btn:hover{
    background-color: #f5ba13;
    }
    .note .btn:hover .deleteIcon{
    color: #fff;
    }
    footer{
    width: 100%;
    position: absolute;
    bottom: 0;
    }

  • @adityaojha2701
    @adityaojha2701 3 года назад +8

    Really liked the way how you first taught basic To-Do-App then came to this project.

  • @nihitverma584
    @nihitverma584 Год назад +2

    I dont think anyone can expalin this easy.
    Very informative video. Thank you 😀

  • @mayankverma3684
    @mayankverma3684 2 года назад

    thankyou sir ji bahut Mehnat Karna pada Purane videos, Dekhe tab jake Aaj Achhe se to do list Bana paya hu.

  • @rahulnath3244
    @rahulnath3244 4 года назад +4

    Congratulations sir in React js 50 video ........

  • @publicevents3467
    @publicevents3467 Год назад

    nice job vinod sir I'm watching your react series, you explained much better any other than that. but by watching this video I got that your birthday is in January!

  • @EWorldHub
    @EWorldHub 4 года назад +1

    Superb.... Best Tutorial

  • @rjdon6742
    @rjdon6742 4 года назад +4

    Bro if u have time then plzz make the video on ecommerce....
    Way of teaching is excellent 👌
    I understand ur all concept how u elaborate all concept in detail..
    Thnx brother 👍

  • @ayushsingh-wk9ft
    @ayushsingh-wk9ft Год назад +4

    *{
    box-sizing:border-box;
    padding: 0;
    margin: 0;

    }
    .header{
    width: 100%;
    line-height: 100px;
    background-color: #f5ba13;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-left: 50px;
    color: white;
    box-shadow: 5px 3px 15px -5px rgba(0,0,0,0.3);
    }
    .main_note{
    width: 500px;
    padding: 15px 10px 5px 10px;
    margin: 20px auto;
    }
    .my_notes h1{
    color: #34495e;
    }
    .my_notes p{
    color: grey;
    }
    .form{
    min-height: 50px;
    color: #ecf0f1;
    padding: 15px 10px 5px 10px;
    box-shadow: 3px 5px 15px -5px rgba(0,0,0,0.5);
    border-radius: 10px;
    position: relative;
    }
    input{
    width: 100%;
    line-height: 30px;
    background: transparent;
    border: none;
    outline: none;
    font-size: 1.5rem;
    margin: 10px 0;
    font-weight: bold;
    }
    textarea{
    width: 100%;
    line-height: 30px;
    background: transparent;
    border: none;
    outline: none;
    font-size: 1rem;
    margin: 10px 0;
    }
    .MuiButton-root{
    width: 30px;
    height: 50px;
    position: absolute;
    bottom: -28px;
    left: 400px;
    cursor: pointer;
    background-color: #fff !important;
    border-radius: 50% !important;
    }
    .MuiButton-root .plus-sign{
    font-size: 45px !important;
    font-weight: 900;
    color: #f4b000;
    cursor: pointer;
    z-index: 222;
    background: transparent;
    }
    .MuiButton-root:hover{
    background-color: #f4b400;
    }
    .MuiButton-root:hover .plus-sign{
    color: #fff;
    background: transparent;
    }
    .note{
    background: #fff;
    border-radius: 7px;
    box-shadow: 0 2px 5px;
    padding: 10px;
    width: 240px;
    margin: 16px;
    float: left;
    }
    .note h1{
    font-size: 1.1em;
    margin-bottom: 6px;
    }
    .note p{
    font-size: 1.1em;
    margin-bottom: 10px;
    white-space: pre-wrap;
    word-wrap: break-word;
    }
    .note .btn{
    position: relative;
    float: right;
    margin-right: 10px;
    border: none;
    width: 50px;
    color:#f4b400 ;
    height: 50px;
    background: transparent;
    cursor: pointer;
    outline: none;
    border-radius: 50%;
    }
    .deleteIcon{
    width: 0.7em;
    height: 0.7em;
    }
    .note .btn:hover{
    background-color: #f5ba13;
    }
    .note .btn:hover .deleteIcon{
    color: #fff;
    }
    footer{
    width: 100%;
    position: absolute;
    bottom: 0;
    }

  • @Shoaib_Khan9272
    @Shoaib_Khan9272 Год назад +2

    I am on 20:21 and i have created the project and now i dont wanna watch the full video .Shouls i watch or not??

  • @arjunzundala8247
    @arjunzundala8247 4 года назад +1

    Aap ke sare videos bahot achhe hote hai
    Agaar aap android pe videos banaenge to bahoy sikhne ko milenga
    Please please please android pe video banaie....me apko pehle bhi request kar chuka hu.....please

  • @iAm_Rohit_Raj
    @iAm_Rohit_Raj Год назад +2

    10:30
    Move that "image" folder to public directory, then we can access that image folder without importing it.

  • @RahulKumar-t6g4d
    @RahulKumar-t6g4d Год назад

    Thank you Thapa ji for doing this awesome project with a simple explanation.

  • @pratiksaria5830
    @pratiksaria5830 4 года назад

    Khatra Video cha Thapa Dai.

  • @rajatsaraswat64
    @rajatsaraswat64 6 месяцев назад

    Code k aapko alg se payment Krna h
    Kmaal h aapka to sir
    Esa mene khi nhi dekha h

  • @themystefyingfacts5115
    @themystefyingfacts5115 4 года назад +5

    Great bro.
    Love from nepal.plz heart this comment

  • @qutbuddinkhan3155
    @qutbuddinkhan3155 3 года назад +1

    Thanks From Balrampur UP India

  • @atharvakulkarni2024
    @atharvakulkarni2024 3 года назад +13

    Project should be complete from scratch including styling and all

  • @neelpatel4012
    @neelpatel4012 4 года назад +1

    It's to complex and so root method
    By the way your playlist on react is to good😚

  • @shaheensiddiqui1952
    @shaheensiddiqui1952 3 года назад

    sir you are to much help full for us
    thankyou so much sir
    we greatefull to you

  • @darshanadey4696
    @darshanadey4696 4 года назад +7

    Hi Vinod, this is such an awesome video on google keep but please make css part available for us to practice it.

    • @dhrumilpatel2905
      @dhrumilpatel2905 4 года назад +17

      * {
      box-sizing: border-box;
      padding: 0;
      margin: 0;
      font-family: "Josefin Sans", "Arial Narrow";
      }
      .header {
      width: 100%;
      line-height: 100px;
      background-color: #f5ba13;
      display: flex;
      justify-content: start;
      align-items: center;
      padding-left: 50px;
      color: white;
      box-shadow: 5px 3px 15px -5px black;
      }
      .main_note {
      width: 500px;
      padding: 15px 10px 5px 10px;
      margin: 20px auto;
      }
      .my_notes h1 {
      color: #34495e;
      }
      .my_notes p {
      color: gray;
      }
      form {
      min-height: 50px;
      color: white;
      padding: 15px 10px 5px 10px;
      box-shadow: 3px 5px 15px -5px black;
      border-radius: 10px;
      position: relative;
      }
      input {
      width: 100%;
      line-height: 30px;
      background: transparent;
      border: none;
      outline: none;
      font-size: 1.5rem;
      margin: 10px 0;
      font-weight: bold;
      }
      textarea {
      width: 100%;
      line-height: 30px;
      background: transparent;
      border: none;
      outline: none;
      font-size: 1rem;
      margin: 10px 0;
      }
      .MuiButton-root {
      width: 30px;
      height: 50px;
      position: absolute;
      bottom: -28px;
      left: 400px;
      cursor: pointer;
      background-color: #fff !important ;
      box-shadow: 5px 5px 15px -5px black;
      border-radius: 50% !important;
      }
      .MuiButton-root .plus_sign {
      font-size: 45px !important;
      font-weight: 900;
      color: #f4b400;
      cursor: pointer;
      z-index: 222;
      background: transparent;
      }
      .MuiButton-root:hover {
      background: #f4b400 !important;
      }
      .MuiButton-root:hover .plus_sign {
      /* background: #f4b400 !important; */
      color: #fff;
      background: transparent;
      }
      .note {
      background: #fff;
      border-radius: 7px;
      box-shadow: 0px 2px 5px #ccc;
      padding: 10px;
      width: 240px;
      margin: 16px;
      float: left;
      }
      .note h1 {
      font-size: 1.1em;
      margin-bottom: 6px;
      }
      .note p {
      font-size: 1.1em;
      margin-bottom: 10px;
      white-space: pre-wrap;
      word-wrap: break-word;
      }
      .note .btn {
      position: relative;
      float: right;
      margin-right: 10px;
      color: #f4b400;
      border: none;
      width: 50px;
      height: 50px;
      background: transparent;
      cursor: pointer;
      outline: none;
      box-shadow: 3px 3px 15px -10px rgba(0, 0, 0, alpha);
      border-radius: 50%;
      }
      .deleteIcon {
      width: 0.7em;
      height: 0.7em;
      }
      .note .btn:hover {
      background-color: #f5ba13;
      }
      .note .btn:hover .deleteIcon {
      color: #fff;
      }
      footer {
      width: 100%;
      position: absolute;
      bottom: 0;
      text-align: center;
      }

    • @darshanadey4696
      @darshanadey4696 4 года назад

      @@dhrumilpatel2905 Thankyou so much for the help.

    • @muhammadjawad9341
      @muhammadjawad9341 4 года назад

      Check mine with some modifications learned from thapa :
      ruclips.net/video/JzI1QjjJPf8/видео.html

    • @awadheshsharma7872
      @awadheshsharma7872 3 года назад

      @@dhrumilpatel2905 thanks bhai

    • @udaypatil1250
      @udaypatil1250 3 года назад

      @@dhrumilpatel2905 ty

  • @DEEPANSHU_NAG
    @DEEPANSHU_NAG 4 года назад +2

    Awesome explanation 👏🏻💯✌🏻
    Thanks 🙏🏻

    • @akhilkumarsingh5041
      @akhilkumarsingh5041 4 года назад +1

      source code 99rs ka hai kisi ko collab karna hai 10 log hio jaye.. to 10 rs ka padega source-code.. reply karo fast .. 10 person jinke pass g pay ya phonepe

  • @syedsaad317
    @syedsaad317 3 года назад

    awesome thapa bhai... i made the interface (not ditto) but i faced error in js because i tried to make this like the previous list.. but thanks to you and this video i made it ..❤😍

  • @kamaljyothibattula1687
    @kamaljyothibattula1687 2 года назад

    bcz of you u
    have learnt lot of things thank you

  • @prashantkumar627
    @prashantkumar627 Год назад

    Great ❤

  • @John12685
    @John12685 4 года назад +3

    Good job Sir. pls keep it up and bring some more projects. May be one or two some relatively complex and large as well

  • @khushbukumari6000
    @khushbukumari6000 2 года назад

    Thank u so much sir your all video very helpful for me

  • @Superak07
    @Superak07 2 года назад +3

    if anyone getting the refresh problem while clicking on submit button, You can prevent it by writing event.preventDefault() as the first line of your onClick function. this problem occur due to default behaviour of button on submit

  • @BhaiBhai-kf8ct
    @BhaiBhai-kf8ct Год назад

    @Thapa Bro Awesome Bro keep it up

  • @thegauravsoni
    @thegauravsoni 3 года назад

    Font awesome bachpan se use kr rhe hai hahaha . paida hote he coding thodi kerne lge the na hmm chintu hai hahahahahah

  • @AshutoshSingh-ym9vi
    @AshutoshSingh-ym9vi 8 месяцев назад

    Awesome project

  • @mahaburrahman1666
    @mahaburrahman1666 3 года назад

    Love ❤ this expression :) 3 2 1 ...Boom😊

  • @aasrivastava5851
    @aasrivastava5851 4 года назад +3

    Hey Vinod Bhai there are no videos on submitting data to the server. And or performing CRUD operation from server side data.

  • @anirbanrubel
    @anirbanrubel 4 года назад +3

    Nice tutorial.. Can you make some video on firebase.. Saving data into firebase from front end then retrieve those data from firebase into admin panel.

  • @anujrastogi3564
    @anujrastogi3564 4 года назад +2

    Please make video on the topic How to Login with Facebook or Google
    Please make the video on that topic
    Make video fast because i have to add it on my website.
    I am waiting for it.

  • @anshumansharma1069
    @anshumansharma1069 2 года назад +1

    thank you so much sir ❤️🥺

  • @rajbannasa7662
    @rajbannasa7662 3 года назад

    we want more project sir , thank you so much sir

  • @thelasttimeitookashowerwas7069
    @thelasttimeitookashowerwas7069 4 года назад +23

    this is nothing but an improved ui for todoapps :/

  • @MANPREETSINGH-ft9hd
    @MANPREETSINGH-ft9hd 4 года назад +2

    This is great and you also bro

  • @amirhassan6549
    @amirhassan6549 3 года назад

    Ye to very nice hy
    ye to meri pasand hy

  • @agniveerAI
    @agniveerAI 3 года назад +3

    Inside file app.jsx, in line number 21,the function should " return " some value . I think u forgot to mention that..otherwise great vide

  • @programmer1783
    @programmer1783 4 года назад

    thanks you bro for such great productive video

  • @parimalpatil0709
    @parimalpatil0709 3 года назад

    U r Just insaaaaaaaane !!!!!!!!!!!!

    • @mohith_poojary
      @mohith_poojary Год назад

      I assume u may have good experience over React so i am asking doubt which i am facing now and i couldn't solve.
      making project on ecommerce platform fetching data from json file through axios.get(), but it wont update variable immediately which couses error reaching further line due to unavailability of data at initial loading but works fine after i make changes in catagory section though i have mentioned empty dependecy in useffect.
      How do i make it update immediately do that when it reaches next line it should update immmediately and process further as per the required data

    • @parimalpatil0709
      @parimalpatil0709 Год назад

      @@mohith_poojary try==> " variable?" // somecode

  • @krishnasswisdom
    @krishnasswisdom 4 года назад

    Sir i am from bangladesh love you sir.

  • @surajjadli1747
    @surajjadli1747 4 года назад +6

    starting with v7.9.0 we dont need to import React from react

  • @abcool0801
    @abcool0801 4 года назад +2

    Bro i think its time to introduce context, i am really excited for that

    • @akhilkumarsingh5041
      @akhilkumarsingh5041 4 года назад +1

      source code 99rs ka hai kisi ko collab karna hai 10 log hio jaye.. to 10 rs ka padega source-code.. reply karo fast .. 10 person jinke pass g pay ya phonepe

    • @abhijeetshikharvlog1444
      @abhijeetshikharvlog1444 4 года назад

      Go for Redux

    • @krishnakant8374
      @krishnakant8374 3 года назад

      @@akhilkumarsingh5041 hi bro. source code chahiye mujhe

    • @mohith_poojary
      @mohith_poojary Год назад

      I assume u may have good experience over React so i am asking doubt which i am facing now and i couldn't solve.
      making project on ecommerce platform fetching data from json file through axios.get(), but it wont update variable immediately which couses error reaching further line due to unavailability of data at initial loading but works fine after i make changes in catagory section though i have mentioned empty dependecy in useffect.
      How do i make it update immediately do that when it reaches next line it should update immmediately and process further as per the required data

  • @surajali1101
    @surajali1101 3 года назад

    love you yaar...

  • @leadingedgebusinesssolutions
    @leadingedgebusinesssolutions 4 года назад

    i'm following your tutorial series . i just want you make a vedio in which you customize a theme for example make management system first tell the requirement what are the requirements to develop a management system. your have good content for making website taught enough for fronend.

  • @Raga_Rahul
    @Raga_Rahul 4 года назад +2

    Awesome.. but why not hold data permanently.

  • @seemapatel4405
    @seemapatel4405 4 года назад

    All videos are awesome.
    It's very helpful for me
    Please app new videos class bases banao na nd lifecycle

    • @muhammadjawad9341
      @muhammadjawad9341 4 года назад

      Check mine with some modifications learned from thapa :
      ruclips.net/video/JzI1QjjJPf8/видео.html

  • @sailendrachettri8521
    @sailendrachettri8521 3 года назад +1

    Now we are moving to the advance concepts :)

  • @akhileshmishra5559
    @akhileshmishra5559 3 года назад +2

    52:36 can we use arrow function with in an element .... Without writing it spaerately..😊

  • @prasiddh283
    @prasiddh283 Год назад

    Whoever facing the problem of refresh page automatically:
    Update the function which we have written in CreateNote
    Const addEvent(event)=>{
    event.preventDefault();
    props.passNote(note);
    };

  • @kamaljyothibattula1687
    @kamaljyothibattula1687 2 года назад +1

    but only minus is u need to explain the css part to bcz without css exaplantion it is not good

  • @PrakashYadav-ur8or
    @PrakashYadav-ur8or Год назад

    Your lectures are awesome but this one is incomplete without css part.

  • @RaviPrakash-ix9dd
    @RaviPrakash-ix9dd 2 года назад +1

    To all if facing the refresh problem when clicking add button put event.preventDefault() in a that function

  • @ArbazKhan-gn4xo
    @ArbazKhan-gn4xo 3 года назад +1

    if anyone facing array of map is not defined after delete any note then write array filter method inside return statement

  • @shelendrasingh2301
    @shelendrasingh2301 4 года назад

    Awesome video sir.....

    • @mohith_poojary
      @mohith_poojary Год назад

      I assume u may have good experience over React so i am asking doubt which i am facing now and i couldn't solve.
      making project on ecommerce platform fetching data from json file through axios.get(), but it wont update variable immediately which couses error reaching further line due to unavailability of data at initial loading but works fine after i make changes in catagory section though i have mentioned empty dependecy in useffect.
      How do i make it update immediately do that when it reaches next line it should update immmediately and process further as per the required data

  • @navinkandpal6767
    @navinkandpal6767 3 года назад

    Awesome 👍

  • @rajbannasa7662
    @rajbannasa7662 3 года назад

    thank you so much sir for ur efforts

  • @karansiddhpura7814
    @karansiddhpura7814 4 года назад

    Bhai ager new project banana ho tao fir se terminal me jake new project create karna padega na?

  • @ucduong2288
    @ucduong2288 4 года назад +2

    You can edit item ??or Use localstorage help me from 🇻🇳

  • @samqureshi9415
    @samqureshi9415 4 года назад +1

    Bus aab bade bade projects k video he expect kar rahe hai .

  • @kanishkasaraf1646
    @kanishkasaraf1646 Год назад

    appne createNote component me form tag ka use kiya h ?

  • @kamalsharma2839
    @kamalsharma2839 2 года назад +2

    Can somebody explain how we are able to use className in custom elements of Material UI, though that isn't possible in React? As far as I know we can use className in JSX but not custom elements

  • @nirmalmondal07
    @nirmalmondal07 4 года назад +1

    Sir social media icon ko login page mai kaise manage kare usmai ek video hona chahiye

    • @nirmalmondal07
      @nirmalmondal07 4 года назад

      Main icon insert kiya to kuch icon chota Or kuch icon bahut bada aa raha hai

  • @saifsiddiqui8017
    @saifsiddiqui8017 3 года назад

    I wish you wouldn't added bootstrap in this series , you kind of mix up the things

  • @okeyshourovroy2769
    @okeyshourovroy2769 4 года назад

    Very helpful. Please make some more Projects

  • @mohith_poojary
    @mohith_poojary Год назад

    I assume u may have good experience over React so i am asking doubt which i am facing now and i couldn't solve.
    making project on ecommerce platform fetching data from json file through axios.get(), but it wont update variable immediately which couses error reaching further line due to unavailability of data at initial loading but works fine after i make changes in catagory section though i have mentioned empty dependecy in useffect.
    How do i make it update immediately do that when it reaches next line it should update immmediately and process further as per the required data

  • @manasvirunwal5634
    @manasvirunwal5634 3 года назад

    Sir... You're great... Pls react native pe playlist banaiye na Sir

  • @SumitSingh-ux6zd
    @SumitSingh-ux6zd Год назад +1

    Any idea why it happens when I click to add after writing title and content, note component opens and close automatically in half seconds. I tried many times after writing the code same to same but it happens again and again. Please help if anyone know about this problem.

  • @prasadpoul555
    @prasadpoul555 Год назад +1

    if you are getting error simply use
    setAddItem((olddata)=>
    olddata.filter((currdata,indx) => {
    return indx !== id;
    })
    insted of
    setAddItem((olddata)=> {
    olddata.filter((currdata,indx) => {
    return indx !== id;
    })
    }

    • @mohith_poojary
      @mohith_poojary Год назад

      I assume u may have good experience over React so i am asking doubt which i am facing now and i couldn't solve.
      making project on ecommerce platform fetching data from json file through axios.get(), but it wont update variable immediately which couses error reaching further line due to unavailability of data at initial loading but works fine after i make changes in catagory section though i have mentioned empty dependecy in useffect.
      How do i make it update immediately do that when it reaches next line it should update immmediately and process further as per the required data

  • @creativeakshara8438
    @creativeakshara8438 4 года назад +2

    Bhai Please 🙏 Make Canvas Tutorials Also please 🙏 🙏🙏
    Please reply 🙏🙏

    • @mohith_poojary
      @mohith_poojary Год назад

      I assume u may have good experience over React so i am asking doubt which i am facing now and i couldn't solve.
      making project on ecommerce platform fetching data from json file through axios.get(), but it wont update variable immediately which couses error reaching further line due to unavailability of data at initial loading but works fine after i make changes in catagory section though i have mentioned empty dependecy in useffect.
      How do i make it update immediately do that when it reaches next line it should update immmediately and process further as per the required data

  • @effectivelines8152
    @effectivelines8152 4 года назад

    Amazing work

  • @fatimashehzadi8604
    @fatimashehzadi8604 3 года назад +1

    Sir! Thankyou for great video can i get extension name you installed for auto implying parenthesis and semi- colon at the end of expression
    thanks in advance

  • @dewtome9220
    @dewtome9220 4 года назад +1

    bhaiya pls ek node js pe series banyo
    aur experss ki bhi taki hum mern stack development sikh sake

  • @rachit2982
    @rachit2982 2 года назад

    I am facing a problem at 46:07 where when i click + icon it does make a note but the page gets refreshed automatically

    • @Superak07
      @Superak07 2 года назад

      ya same problem! did you found any solution?

    • @vanshshah7781
      @vanshshah7781 2 года назад

      use preventDefault()

  • @debashisadash4611
    @debashisadash4611 4 года назад

    bro super yarr please upload some heavy projects.

  • @anikettiwari6885
    @anikettiwari6885 4 года назад +1

    @thapa Sir I have one doubt why can't we check the value of note variable inside the setAddItem function. What I mean is I tried to place the debugger inside the setAddItem and just wanted to check the value of the note. But when I try to do it, it throws an error. Even though if I access note variable outside the setAddItem it works fine why is it? The reason why I am asking this questionbecause the return [...prevVal, note] statement works perfectly fine but when adding a debugger and checking the value of "note" it is throwing an error
    const addNote = (note) => {
    setAddItem((prevVal) => {
    debugger
    return [...prevVal, note]
    })
    }

    • @muhammadjawad9341
      @muhammadjawad9341 4 года назад

      Check mine with some modifications learned from thapa :
      ruclips.net/video/JzI1QjjJPf8/видео.html

  • @umerislamictv
    @umerislamictv Год назад

    apne her video mea kaha hay keh code discraption mea given hay ,jeb hum waha jaye to wo nahi melta

  • @ljubicasamardzic7819
    @ljubicasamardzic7819 4 года назад +1

    It would be great if you created another video to cover changing the note title or content.

    • @muhammadjawad9341
      @muhammadjawad9341 4 года назад

      Check mine with some modifications learned from thapa :
      ruclips.net/video/JzI1QjjJPf8/видео.html

  • @Deepakkumar-kt6lz
    @Deepakkumar-kt6lz 3 года назад +1

    when i click on add(+) button without filling note show empty array . how to remove this thing

    • @shubhambhoir6559
      @shubhambhoir6559 2 года назад

      use useRef hook by that u can fix this problem or add a condition over there

    • @deeptidip9864
      @deeptidip9864 Год назад

      ​@@shubhambhoir6559 condition is not working.. can u send me the code

  • @srijansinha6921
    @srijansinha6921 3 года назад +1

    just putting { } curly brackets after (oldvalue) under onDelete functions is causing error. Why? Its like
    under onDelete function if its setAddItem((oldValue) => { oldValue.filter(...etc etc)} is wrong but setAddItem((oldValue) => oldValue.filter(...etc etc) is right because the latter just don't have curly brackets. Why?

    • @lokesh5371
      @lokesh5371 2 года назад

      Same doubt i was stuck in this from 2 hours just read your comment and problem solved but could not get the reason behind it.

    • @kamalsharma2839
      @kamalsharma2839 2 года назад

      I think you should have used return after start of curly braces and it should have worked fine.

    • @kamalsharma2839
      @kamalsharma2839 2 года назад

      @@lokesh5371 I think you should have used return after start of curly braces and it should have worked fine.

    • @coolcyberlife2425
      @coolcyberlife2425 2 года назад

      If u any of u know why this happening by now ...pls pls try to return your comments

    • @honeysengar2627
      @honeysengar2627 2 года назад

      @@coolcyberlife2425 what i think is if you are using curly braces then setAddItem needs a return method and when using
      () you dont need to return

  • @nehayadav2537
    @nehayadav2537 2 года назад

    Please tell how to add local storage to see the previos notes we have created

  • @ZaraJaved606
    @ZaraJaved606 Год назад

    i need help my note div is creating 2 similar div i dont know why

  • @jaydevkalariya373
    @jaydevkalariya373 Год назад

    After doing refresh all notes are vanishes,is this problem is with my code only or all suffers from this problem?

  • @__Y1a2s3h4__
    @__Y1a2s3h4__ 4 года назад

    Why you didn't used es6, react,redux vscode extension? Btw great video

  • @bspanda98
    @bspanda98 4 года назад +2

    Please make a website using firebase db please bro i view your all videos and subscriber too

  • @prernasaxena9412
    @prernasaxena9412 2 года назад

    Hey can you please make a video to implement share button as well.

  • @mazharimam9216
    @mazharimam9216 3 года назад

    i have only one doubt why we have used name like const name...though we want only values therefore we used that event.target.value but why name

  • @BengaliRoamers
    @BengaliRoamers 2 года назад +1

    kya bhai ek css code ke lie v paise chahie..why we need to pay to get the css source code, it shud be available for free or while u r making a project u shud explain the css what u have done..😡

  • @darshanadey4696
    @darshanadey4696 4 года назад +1

    Hi...please make more websites and web applications using react and redux...

  • @SAADKHAN-qh3bp
    @SAADKHAN-qh3bp 3 года назад

    bro file save krna pa auto set kasy ota ha
    kia extansion ha is ki?
    plzzz bta den

  • @amritraj658
    @amritraj658 4 года назад +1

    If I refresh page all data is cleared... To prevent from this what I have to do....

  • @kavyapokharel4714
    @kavyapokharel4714 4 года назад

    Hey bro, appreciate your videos. Also, I really wanted you to make a video on how to mak website secure, (ie. from http to https )

  • @souravbhagat1358
    @souravbhagat1358 4 года назад

    Bhaiya please make a vidoes lectures on Angular or Even Java programming...if possible

  • @mohdaman7958
    @mohdaman7958 Год назад

    sie app kinta padeho aur kitne years ka experition hai

  • @AtechSeva
    @AtechSeva 2 года назад

    plz use wordwrap in vs code for better understanding

  • @pk-pm5is
    @pk-pm5is 4 года назад

    good viedo