Project 7 - React Dashboard Authentication | 10 React Projects for Beginners
HTML-код
- Опубликовано: 2 июн 2024
- Discover the best React project series ever created for beginners! Follow along as we guide you through 10 engaging projects that use Figma design to create stunning UI. From building a to-do list app to a weather app, you'll learn the fundamentals of React while developing real-world web apps. With our step-by-step tutorials, you'll become a React pro in no time! So join us now and unlock the secrets of building awesome web apps with React and Figma
Chapters
00:00 - Project Introduction
01:40 - Project Setup
12:36 - Signup Page
33:08 - How to use formik for form in react
43:08 - Form Validation using Yup
51:31 - Sign in Page
01:00:43 - Email Register Verify Page
01:09:24 - Register Success page
01:12:26 - Forgot Password Page
01:19:21 - Forgot Password Sent Page
01:27:39 - Reset Password Success Page
01:29:59 - Reset Password Page
01:33:12 - Authentication Intro
01:34:21 - React Query Setup
01:34:21 - Axios Setup
01:40:26 - Api Function Setup
01:46:35 - useQuery Hook
01:48:00 - User Authentication on Frontend
02:51:43 - Protect Routes
Project 7 Starter - github.com/anshuopinion/React...
Project 6 - React Crypto Dashboard Figma Design
www.figma.com/file/rephrU2FVg...
Project 7 Finished - React Crypto Dashboard AUTH - github.com/anshuopinion/React...
HTML Course
• HTML Course Hindi - B...
CSS Course
• CSS Course Hindi - Be...
Html and CSS practice Projects
• HTML CSS 10 Practice P...
Javascript Course
• Javascript for beginne...
Linkedin - / anshuopinion
Telegram Channel - telegram.me/dosomecodinghelp
Instagram - / dosomecoding
Github - github.com/anshuopinion
![DRAGON BALL: Sparking! ZERO - Fused Warriors Trailer [BUDOKAI TENKAICHI Series]](http://i.ytimg.com/vi/84p4Lvyfyes/mqdefault.jpg)
after all I feel so good to see that you provide quality not quantity
Thanks ❤
Thank you sir, you are really awesome. Please upload the Project-8 as soon as possible.
Can you please suggest which react ui library I should go with as a beginner for my projects
Your teaching is awesome. I am sure this channel will reach 1M subscribers soon.
I am having 7+yrs of experience in Ui(html, css, JavaScript, jquery). Recently I started react and your explanation n task provided is so good.
Thanks
Apart from react what did u used to make dashboard?
you are awesome❤🔥
Please create more such awesome contents
Bhaiya I'm currently working on mern but i want to learn app development but I'm too much confuse in react native or flutter .plz suggest me what should learn in flutter or react natice you are my last hope . Plz explain on the base of job and salary
please continue the series and upload more videos
sir me ap ki videos dekh k a rha o likn is project me zip ko download karny k bad folder me dalna k bad cd server select krny k bad npm i kam nahi kr rha error a rhy a can you solve?
nice project and Thank you sir, you are really awesome. Please upload the Project-8 as soon as possible.
Please make video on advance filter like clicking on filter button show filter with check box and show selected filter with remove option
sir backend(server) ka data setup ni ho rha "npm i " not working, python 2 error
superb bro. plzz create more video . support form bangladesh.
Waiting For The Next 3 Project Sir ❤❤❤❤
Next react series video kab aye ga 8 wala
what intellisence extension do you use ?
Hello sir, Figma Design me inspect ka css show nhi h
Bro, where did you go?
Please complete all the projects series, plss plss
cant wait for project 8
postman.json file backend apis can you check this file which you have uploaded. Backend apis are not working .
Please make a playlist for Figma
Very nice ❤
bahi next project kab tak upload ho jai ga ?
Bade lambe....
intezaar ke baad aaye.❤ chalo late aaye achhe content ke saath aaye. Good project🎉
Your way of teaching is very well, this video was uploaded around 5 months ago, and there are 3 more projects are remaining of this playlist bro please come back and make more videos, many students are waiting for you.
Sir can you give me tips how you are making these projects means you are watching and doing coding or you first try yourself? Or any other method ?
@@real_vincenzo I started of 3 projects, which I did myself after watching their videos and now i watching videos along with making projects. but after completing these projects I have decided to do again these projects with myself only.
@@user-ze5bq9gz3x Thanks sir. How long did it take you to finish this video?
@@real_vincenzo Not matter, how long you are watching videos just make yourself confident, whenever you are not completely able to complete these projects yourself without any help I suggest you to watch videos and learn the syntax and logics, and it's not necessary the logics of videos must be same try to complete projects with your own logics.
@@user-ze5bq9gz3x thanks sir any other tips you have ?
After a long time.❤
database can I manage my users?
Sir, there are 7 projects, I request you please provide another three projects.
bro please bring the next 2 projects of a website that is E-commerce and fully responsive please it will help us and please make sure the project is fully on advanced level that clear our react all concepts like context api fetch api hooks redux e t c
waiting for your replying and help
missing your react projects from last 5 months bro
Thanks bro...❤
Waiting for project-8,9,10.....
Okay
Hi,
I want 8th react project with next JS instead of vite
Bhaiya vite+react app ko github pe push kaise karte hai ek video bana dijiye na achhe se samjhakar
sir please continue the series
Hello sir please make a Project no- 9,10 build netflix and disney Plus clone using, reactjs, redux, firebase, and styled-components ..?
great
very nice video sir💖
I am getting an error .nodeman
App crashed.can anyone help.me
unable to deploy it on vercel '
Thanks
hi sir i am waiting remaing project please upload it i have to practic and become strong in react
ماشاء الله عليك يا صديقي احلى لايك ❤❤ مطبخ ام معاذ المطبخ الريفى في انتظار حضرتك
Plz make one e-commerce website full functionaly
Please Upload the Project number 8
Osm series bhiya
Next project date bro ??
Next project Kab?
Next project plz upload
bhai ar bhi projects bnao...keval 8 hi bnaye hai...
plz sir upload more projects plzzzzzz
Kindly Firebase se authentication and project banao 👍👍
Bro we need more projects
Hey bro please help me my serer is crashing. please help.
Node.js v20.10.0
[nodemon] app crashed - waiting for file changes before starting...NotImplementedError: Unable to connect database
at E:\React\project-7\server\dist\app.js:38:37
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Node.js v20.10.0
[nodemon] app crashed - waiting for file changes before starting...
i am also facing the same problem, can anyone suggest how to fix it?
Waiting for next project 😢😢
i was watching your this tutorial i watched till 8 minute 31 second and followed all steps but when i ran a command npm run dev (nodemon crashes again and again) if you can guide
You need env variable
@@dosomecoding sir i have created .env file sir do you have some other platform where you can check and help me to resolve my issue ?? i will be thankful to you
C:\Users\Akhlaq computer\React-Practice-Project\project-7\server\dist\app.js:39
throw (0, http_errors 1.default) (581, "Unable to connect database");
Not ImplementedError: Unable to connect database at C:\Users\Akhlaq computer\React-Practice-Project\project-7\server\dist\app.js:39:37
Node.js v18.15.8
[nodemon] app crashed - waiting for file changes before starting... I
Env file attach according to your given instruction please guide
You need to use your env variable
Get your own database url
@@dosomecoding dear I add my own db but this problem appear
Please give timestamp also
Nodeman app crashed help me sir
Bhaiya react k badd backend m java use karna chata hu theek rahega kya
Bus api shai rehna chiye
@@dosomecoding ok sir
where are remaining project buddy?
Sir how many react project a fresher guy should do/practice to get a job in react😢.
5-6 and make one own project
[nodemon] app crashed - waiting for file changes before starting... why this showing
You need to add env
@@dosomecoding i created .env file and copy paste those how you told to do on video
@@dosomecoding its showing unable to connect database
Bro make a music website using react
sir next video?
Brother please make it more clear how you made it responsive in the next video.
okay
Bhiya plz make a protifol using react
Okay 👍
@@dosomecoding ha bhaiya at the end ek mast portfolio web app banana taki usme sare 10 projects dal sake fir job ke liye apply kr denge
Tailwind i so easy ..please sir it request you start a good thing ....
Next 3 projects ?
can you please make this using redux toolkit in react
Sure in next project
Next project????
2:16:00
Bro, where is Project-8 ? 🥺🥺🥺🥺
2:16
Sir waiting for 8th project.
It will come soon
how to slove it
throw (0, http_errors_1.default)(501, "Unable to connect database");
^
NotImplementedError: Unable to connect database
at C:\Users\Dinesh lokhande\Downloads\React-10-Projects-master\React-10-Projects-master\project-7\server\dist\app.js:38:37
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Node.js v20.5.1
[nodemon] app crashed - waiting for file changes before starting...
Env missing
already added sir
Kindly add timestamp😊
Okay
jiski video achi hoti h usko bolna nahi aata, jiski video theek thaak h uski itna zayada acha bolna aata h kya yaar
Khana kya chate ho bhai
Meri video shai lagi ki bekar
@@dosomecoding aree yaar aapka knowledge boht acha h bas aapka accent samjh nahi aa rha tha mujhe sorry but i am being honest
throw (0, http_errors_1.default)(501, "Unable to connect database");
^
NotImplementedError: Unable to connect database
at C:\Users\Dinesh lokhande\Downloads\React-10-Projects-master\React-10-Projects-master\project-7\server\dist\app.js:38:37
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
Node.js v20.5.1
[nodemon] app crashed - waiting for file changes before starting... how to slove this error
Same here Did you get ,did you solve this error?
@@anonymous5946 yes i solved
apply dp and then return
@@reroyallover9169 in path url? I have no idea about mango db
(node:15852) [MONGOOSE] DeprecationWarning: Mongoose: the `strictQuery` option will be switched back to `false` by default in Mongoose 7. Use `mongoose.set('strictQuery', false);` if you want to prepare for this change. Or use `mongoose.set('strictQuery', true);` to suppress this warning.
(Use `node --trace-deprecation ...` to show where the warning was created)
D:\projects\ReactJS\10 react project ansul\p7-dashboardAuth\server\dist\app.js:38
throw (0, http_errors_1.default)(501, "Unable to connect database");
You need to put data base url
Add db url in env
2
Signin.jsx:58 Error: "password" is required
at Object.signinuser [as mutationFn] (userquery.js?t=1689792388050:13:11)
Please check source code
This is working:
{
data?.map((food)=>{
{console.log(food.text)}
})
}
But this is not working :
{
data?.map((food)=>{
{food.text}
})
}
from Foody Zone project sir please reply
This should work
But sir it is not working tried so many times in different ways
@@dosomecoding sir i cannot proceed further because of this error. can you please tell another alternative of this so that I can complete this project and start making the next one..
@@raisaqibmukhtar1181
{
data?.map((food) => {
return {food.text};
})
}
Try this.
Admin and user Login kaise kare Ek firebase ke project mein bhayiaa please reply
2:04:00