Adding Alerts to Login, Signup & Notes Component of iNotebook | Complete React Course in Hindi #71
Вставка
- Опубліковано 11 жов 2024
- In this react course, we will see how to learn react using projects.
This is going to be a project-based course full of real-world react projects.
All the source code and other material will be uploaded on codewithharry.com as and when available!
►Checkout my English channel here: / @programmingwithharry
►Instagram: codewithharry
python, C, C++, Java, JavaScript and Other Cheetsheets [++]:
Playlist: • Coding CheatSheets 🧾 b...
►Learn in One Video[++]:
Python[15 Hr] - • Python Tutorial For Be...
Python Advance[3.5 Hr] - • Python Programming Cou...
Python[1 Hr] - • Learn Python In Hindi ...
Python[2 Hr] - • Python Tutorial In Hin...
Python[15 Min] - • 15 Minute Python Tutor...
JavaScript[1 Hr] - • JavaScript Tutorial
C[1.3 Hr]- • C Programming Tutorial...
php[1 Hr] - • Learn Php In One Video...
php[2.3 Hr] - • Php Tutorial for Begin...
php[Project]- • Login And Registration...
HTML[30 Min] - • HTML 5 Tutorial For Be...
CSS[8.5 Hr] - • CSS Tutorial In Hindi ...
CSS[1.4 Hr] - • CSS 3 Tutorial For Beg...
Wordpress[3.2 Hr] - • How To Make a WordPres...
Angular[2 Hr] - • Angular Tutorial in Hindi
Java[2.3 Hr] - • Java tutorial in hindi 🔥
Web Scraping[1 Hr] - • Web Scraping Tutorial ...
MongoDB[2 Hr] - • MongoDb Tutorial For B...
Numpy[1 Hr] - • Numpy Tutorial in Hindi
Android Dev[12 Hr]- • Android Development Tu...
Linux[1 Hr] - • Linux Tutorial For Beg...
JQuery[1.1 Hr] - • jQuery Tutorial For Be...
Git and GitHub[1.1 Hr] - • Git & GitHub Tutorial ...
►Complete course [playlist]:
React - • React Js Tutorials in ...
Python- • Python Tutorials For A...
OOP Python- • Object Oriented Progra...
Java - • Java Tutorials For Beg...
JavaScript- • JavaScript Tutorials I...
PHP- • PHP Tutorials in Hindi
C- • C Language Tutorials I...
C++- • C++ Tutorials In Hindi
Git & GitHub- • Git and GitHub Tutoria...
Android Dev- • Android Development Tu...
Python GUI- • Python GUI: Tkinter Tu...
Web Development- • Web Development Tutori...
Python Django - • Python Django Tutorial...
Projects Using HTML, CSS & Javascript- • Projects Using HTML, C...
Data Structure and Algo - • Data Structures and Al...
Python Practice programs - • Python Practice Progra...
Basic Python Programs- • [Hindi] Basic Python P...
General Python Errors- • [Solved] General Pytho...
PHP chatroom- • Realtime PHP Chatroom ...
Follow Me On Social Media
►Website (created using Django Rest & Angular) - www.codewithha...
►Facebook - / codewithharry
►Instagram - / codewithharry
Twitter - / haris_is_here
Comment "#HarryBhai" if you read this 😉😉
This course are so helpful to me
You are the only one who explains neatly I have seen other videos but they were not that understandable but your videos are so helpful
Thank you😃
Dear Harry everything is good but(ALERT SHOULD GET RESPONSE MESSAGE FROM DATABASE NOT JUST ON BUTTON CLICK).if problem in database connection or other problem then in anyway user will get alert messages on button click that like (user is deleter but in fact no user is deleted),thanks
Yes, good point.
i cant believe ki mene ye bina apki video dekhe implemnt kr diya
this react course is helpful
yes completed the task of displaying alert on edit and delete button. Thank you so much harry bhai. Your course is amazing
I buy a react course form udemy and watch his video for knowledge 😅😊seriously u r amazing sir, please always make content for us and leave long 😊😊
leave 😂😂. it should be "live" miss.
🙄😬 it's "live" not "leave"
Yea he will definitely “leave” long
Best teacher ever. Thank you so much bro
1.8 Million subscribers ki badhaiyan Harry bhai 💙🎉
3.05M he is growing like anything man
Today he is reached in 4M 😃
Now he has got 6.5M
2 videos in a day, harry is on fire 🔥🔥🚒🚒
Harry bhai when user press the delete button there should be some kind of Modal dialog box should be open in which there is some kind of warning that "you are going to delete this note. Are you sure? When user press yes then that particular note should be deleted otherwise not. Please add this functionality too. Thanks in advance
Good suggestion. Do this as a task.
we can pass show alert props in notestate which will make easier to show alert on crud operation of notes
Sir Mai Aapki video dekhna Abhi Abhi suru kiya hu and Aapki video kafhi achhi hai and Mai aapka bahot NDA fan ho gya hu tnx sir ir aap esi or video bnaaiye tnx sir
Bhai tum baki sari videos dekh lo
Hello harry Bhaiya big salute
We can also use sweetalert npm package for showing laert messages.
Place make javascript in one video of 15 hours
Yes, we really want it
Please bro
There is already a playlist for Javascript
Yesssssss
bhai bahut achi playlist. ma bahut kuch sikh raha hu. Thanks
Thanks Code With Harry for this React Mern Stack Course.
You is the best teacher in the world
thank you so much. I earned 100$ in one day even though I was on your 65th video. ❣
How??
Finally you are back great
I really like your video Harry Bhai
Harry Bhaiya OP
Harry bhai ❤️🔥😀
2 min me
Majja hi aagya harry bhai
Harri bhaiii plz make a video on signup and Login validation
Harry bahiya op bolte 🔥🔥
Thank you harry sir
why did we have to use destructuring to get showalert function in home.js but need not use it in login and signup components??
can someone explain that
your is code is working while using the alert
If soo please share the code
Sir can you make a video on communication Technology plz.
Love from Pakistan Harry
Thanks
Which Playlist should i follow Chai aur code or Code with harry????
both.. kuch samaj nhi aye toh chai aur code ke pass chale jao.. ya kisi ke bhi pass chale jao
I've completed upto lecture 5 of c++ from your course.
Am I now able to solve problems on hacker Earth/rank basics?
Because I find it hard while solving.
@Sahil Gupta there are some topics on hacker rank named input/output, hello world ,data types and basics of these is taught in the first 5 lectures so I am in little bit confusion that those questions should have been be solved by me.
But when I saw questions then they ask me to answer hello world in printf format (or whatever 😅) but this is not yet discussed in these lectures.
@Sahil Gupta Read the above one and then please clear my doubts, please.
filled the signup form full and even if the confirm password is not same as password, it is creating account .. surprised that no one noticed !!!!!!!
yes u r right
//copy the code in SignUp form and don't forget to the change the port no.
//use this for for checking password and confirm password are same or not---------
const handleSubmit = async (e) => {
e.preventDefault();
if (credentials.password === credentials.cpassword) {
const response = await fetch("localhost:2000/api/auth/createuser", {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ name: credentials.name, email: credentials.email, password: credentials.password })
});
const json = await response.json();
console.log(json);
if (json.success) {
localStorage.setItem('token', json.authtoken)
props.showAlert("Account Created Successfully", "success")
navigate("/");
}
else {
props.showAlert("Email Already exists !!! Try with Signing up", "danger")
}
}
else {
props.showAlert("Confirm Password does not match", "danger")
}
}
Is there any tutorial on if login in react project with username and password then it will automatically logged in in wordpress using sso ?
first
Bhaiya me first hu is baar
nodejs ki playlist harry bhai😁😁
Hello sir, mujhe apni app server pr upload krni h. Konsa cheap rhega or kitna usme free storage rhega. Plz reply krna. Plz plz.
Esta bien muchas gracias
code with harry come with sundeep maheshwarri!
Hello Harry bhai,
I tried to make the alert by using the context api, but i failed can you guide us to make the alert by using context api
Create the state for alert in context and pass
Alert and setAlert in value of context and use it to change value of it
@@manavdixit3355 tried the same
const showAlert = (msg, alertType) => {
console.log("message", msg);
setAlert((previousState) => {
return { ...previousState, message: msg, type: alertType };
});
console.log("Alert", alert);
setTimeout(() => {
setAlert(null);
}, 1500);
};
its not updating the alert state
harry bhai
HI HARRY YOU ARE FROM ODA CLASS
I KNOW YOU VERY WELL
how to make games for unity or unreal? which language we have to learn for unity and unreal
c sharp for unity and c++ for unreal
can you make gaming course for unity??
😭😭😭😭Sir 1 problem in c sir c program m jab m scanf function use kerk run ker raha toh vo input nahi raha but m jab terminal se run kerwa raha ho toh run ho raha help🤔🤔🤔🤔🤔🤔🤔🤔🤔
agr kisi ka limited infinte call type ka koi error a rha h to
Noteitem ke arrow function pe dhiyan dena
Nice
0:33 , Android messaging tone 😂
@CodeWithHarry Sir ko bhi login karega uaka I'd password kha safely store hoga
Hi All- i do not see git hub code after video 70. can anyone please post the link to access code. Thank you
Hi Harry , Can you please provide github source code for this application
jab server down hoga,tab ye bhi to message aana chahiye ki danger:internal server error
🔥🔥🔥
User blance ksy save hoga button se
Thumbnail kaha hain bhai!!
Heart phanko Harry bhi
Harry Oppppppppppp
Anyone plz tell How can I get Username on the notes page on Frontend?
bro maine khud se alert ke liye context bana liya
bhai will you guide me q ky mera wala error dy raha
can you share code?
👌👌👌
❤️
Showing alerts for Login/signup was fine, because we were getting those alert messages from our API call. Bro why you didn't use the same for showing alerts for all notes activities? Those who want to get ADD/EDIT/DELETE alert messages from server side, first give 'showAlert={showAlert}' prop to noteState.js (contextAPI) which is in app.js and then extract the message form response.json which we get in every API call in noteState.js. like this ===>
const serverResponse = await response.json();
if (serverResponse.success) {
props.showAlert(`${serverResponse.message}`, 'success');
} else {
if (serverResponse.message === undefined) {
props.showAlert(`Oops unable to update your note`, 'danger');
} else {
props.showAlert(`${serverResponse.message}`, 'danger');
}
}
yes correct. I added try catch block in notestate.js and based on that I was doing alert but your's is better and simple . Idk why I was making things difficult for myself🙃
WEll done yaar i was lookign for same thing
its not working for me it always goes in else condition can you please explain 1 time more
@@gagandeepsingh490 code please?
@@Moreynium const editNote = async (id, title, description, tag) => {
const response = await fetch(`${host}/api/notes/updatenote/${id}`, {
method: "PUT",
headers: {
"Content-Type": "application/json",
"auth-token": localStorage.getItem('token')
},
body: JSON.stringify({ title, description, tag }),
});
getNotes(response.json)
const serverResponse = await response.json();
if (serverResponse.success) {
props.showAlert(`${serverResponse.message}`, 'success');
} else {
if (serverResponse.message === undefined) {
props.showAlert(`Oops unable to update your note`, 'danger');
} else {
props.showAlert(`${serverResponse.message}`, 'danger');
}
}
}
ARUL SHARMA
JAIPUR
us how to make games in unity
Harry can u pin this comment?
Harry bhai dil do pls
First
sirr
First 🔥
sir I am having error like this in python if I install any library in python
pip install time
ERROR: Could not find a version that satisfies the requirement time (from versions: none)
ERROR: No matching distribution found for time
Google it, you will find a way
pro programmer bhai answer to kar dayn
hli
not first 😂
answer
5th comment
sirr?
1st
Give me ❤️❤️
1
sir
can you teach
Harry bhai pin karwa do yaar ye baar tou🙏🙏🙏🙏
first
Second
code commit krdo harry bhai video 69 ke aage ke
sir?? answer me please
Jee??
answer to kar dayn
please???
Please give me a heart
you always ignoring please answer meeee
First View
Harry bhai ko bolo java ke notes ek zip file me de please 😊🙏
word.toLowerCase is not a function
TypeError: word.toLowerCase is not a function
Need help! :)
//copy the code in SignUp form and don't forget to the change the port no.
//use this for for checking password and confirm password are same or not---------
const handleSubmit = async (e) => {
e.preventDefault();
if (credentials.password === credentials.cpassword) {
const response = await fetch("localhost:2000/api/auth/createuser", {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ name: credentials.name, email: credentials.email, password: credentials.password })
});
const json = await response.json();
console.log(json);
if (json.success) {
localStorage.setItem('token', json.authtoken)
props.showAlert("Account Created Successfully", "success")
navigate("/");
}
else {
props.showAlert("Email Already exists !!! Try with Signing up", "danger")
}
}
else {
props.showAlert("Confirm Password does not match", "danger")
}
}
Bro i get error props.showalert function is not a function
This course are so helpful to me
You are the only one who explains neatly I have seen other videos but they were not that understandable but your videos are so helpful
Thank you😃
Thanks
First
1
Second
First
First