Build and Deploy a React Admin Dashboard With Real time Data, Charts, Events, Kanban, CRM, and More

[@javascriptmastery]

refine is an open-source project, so show your support by giving it a star ⭐ github.com/refinedev/refine

[@NeoGeoKage]

Do I need any prior experience with JavaScript or React specifically to follow along?

[@mhraihan7422]

yes you should @@NeoGeoKage

[@SFFACTS]

you make wordpress type cms for blog website plz i request you

[@NeoGeoKage]

I'm not sure if the likes are people saying yes or not.

[@AvinashsinghPatel-r6n]

SIR PLZ suggest me some projects for my college final year. plz humble request

[@SyphonMechanic]

I'm starting my first day as a dev next week. I've never used refine before. The engineer recommended it for our dashboard and I'm supposed to work on the full stack. My man THANK YOU SOOO MUCH. BLESS YOU.

[@javascriptmastery]

Good luck!

[@Masculine884]

bro did you started your project with refine?

[@SyphonMechanic]

@Masculine884 yeah and the DX is amazing. Literally all I need are 3 tabs; refine docs, localhost and ui lib.

[@twootwo202]

Insane how this Croatian dude continues to impress me with bangers in a consistent manner 👏

[@javascriptmastery]

Enjoy! 🎉

[@john00Doe]

I found out about this project, while wrestling with the old admin dashboard project you created a year ago and it was a bit complicated for me due to some old dependencies and syncfusion issues, and also I was trying to create it with Vite and it was a headache troubleshooting the configuration and the code actually blow up on my face and made a miss that can't be resolved on the console, and after all of that, I suddenly found out your new up to date admin dashboard project uploaded before 7 days ago, Thank you so much for your hardwork, You're a Hero for all of us!

[@rhino_interactive]

This as been a GREAT course and thank you for that but I feel that are a few bits missing so I put up a list: - can't sign up new users - the price for the companies are not updating after saving - can't add/delete/update new events in Upcoming Events section or Latest Activities section - can't modify the actual database - most important how we can create multiple users and sync the data between them Overall can't make it personal/custom to our needs. Take this with a pinch of salt, because those thing might be missing due to the fact that this course is not suppose to have everything in one go. THANKS A LOT for this amazing course!

[@Andi0391]

true, would have been more useful to use even a local JSON as db and expand from there

[@meghabathla7167]

hey, I'm facing the same issues. The pricing is not updated which is most important to show. Have you figured it out? Pls, let me know if you've got it.

[@francisnjugunaldc]

Your content is better than All paid courses❤🎉

[@javascriptmastery]

That's the goal! 🎉

[@arpiliad7739]

Love your videos so much. Watching this was like an xkcd chart- I felt real dumb at first, feeling less and less dumb as time went on. Then, when you fixed "unnassigned"(sp) like that without cmd+f, I felt MUCH smarter for about 40 seconds... ... aaaaand back to feeling real dumb again! But really, you're teaching me so much. Every time I go through your tutorials I'm so much better at React. I think I'll build my own dashboard later and reference your video! Phenomenal. I have no idea how much prep this must take but the fact that it is FREE is INSANE. This could be a full $100 course on udemy easily. I would love to see more on GraphQL and NestJS from you. Amazing teacher.

[@johnpaulpineda2476]

You are such a gem in the community. Thank you for your contribution brother!

[@javascriptmastery]

I appreciate that!

[@keitho6974]

I just found your channel today, haven't even had the chance to get started yet but already subscribed and shared with a few like minded coworkers. I cant wait to dive in

[@deus-lovult]

It is appreciated that you continue to upload react material to continue learning, much success this year

[@javascriptmastery]

Thank you! You too!

[@echelachristopher6532]

I'm in awe of what you do. Thanks for making me a better developer.

[@javascriptmastery]

Happy to hear that!

[@nicolaskorner9351]

Always feels like you read my mind. Just discovered refine in the last days and thought I want to try this out! Now you're here. Thanks!

[@javascriptmastery]

It's amazing!

[@GB-vz8pk]

I was just about to start another admin project you uploaded a year ago. What a coincidence ! Thank you so much for amazing quality of video!!!! I love your projects.

[@javascriptmastery]

That's awesome!

[@nickwoodward819]

Got a link? Don't really care about graphql

[@javascriptmastery]

@@nickwoodward819 grapqhl is not emphasised in the video. You can follow and build using any database or technology

[@OPGAMER.]

wow! That real-time synchronization feature is amazing. Thanks Adrian.

[@javascriptmastery]

You're welcome!

[@soltsdev]

dude, your videos are so easy and understandable to watch. I like it. Thanks

[@javascriptmastery]

Glad you like them!

[@PemaWangchuk-w7y]

Thank You Adrian for making such course free. Best regards from Bhutan.

[@javascriptmastery]

My pleasure!

[@Pulsemastery]

Thanks a lot Adrian you Post the video as you promised an I have been waiting until this day thanks 🙏🏾 🎉😂

[@javascriptmastery]

No problem 👍

[@denizorsel1029]

I would like to thank you for your content. It is quite packed for almost 6 hours yet you retained the energy with some cuts while delivering what the project required. It is definitely not for the beginners eventhough they could just follow step by step and reach the final result but sheer amount of concepts and opinionated nature of a framework included therein makes it look more complex then it actually is in humble beginnings. The way you set things up in advance (providers) are elegant yet once again requires a good command of javascript and react as you initially mentioned.

[@justin9494]

did u finish it?

[@justin9494]

Got an internship and they're asking me to build a dashboard. Thanks for this!

[@vikaspai294]

Are there any openings? I'd love to apply. Thank You

[@Gunjan-ho3bv]

SAME 😀

[@LordShadow01]

did you complete this dashboard ,was it easy to follow?

[@songskool568]

@@LordShadow01 @justin9494 is is easy to follow

[@mariakaravazaki4608]

Great work, started today and is amazing content and the way the instructor explains everything, Refine is amazing too! Thank you so much for this 😀

[@ParmidaShoeibzadeh-os2is]

I'm so excited for this brilliant video ! Thank You so much Adrian

[@javascriptmastery]

Hope you enjoy it!

[@AfonsoFilipeJr]

Finally a good project with Refine. Many Thanks

[@javascriptmastery]

You are welcome

[@anteboto4541]

Svaka čast, najbolji channel za učenje programiranje. 👍👍

[@javascriptmastery]

Hvala Ante!

[@syedadeeb770]

Did you seriously read my mind, this is exactly what I wanted

[@javascriptmastery]

Enjoy!

[@spinoff2011]

By far the best tutorials on youtube!!! Huge thanks!!👏👏

[@javascriptmastery]

Wow, thanks!

[@shawnmuraya9975]

thank you for the updated rerfine frame work 😁

[@javascriptmastery]

No problem 👍

[@muhammedoganay]

Your content is awesome! Very useful. Kudos! How about a full featured news website with cds, management dashboard and a users (authors) dashboard for entering new content to the site for next video?

[@javascriptmastery]

Great suggestion!

[@williamroger562]

Excelente desarrollo con React para integrar con IOT , realizando captura de datos en tiempo real de sensores y controlando actuadores, muchas gracias por darnos conocimiento de alta calidad.🎉😊

[@javascriptmastery]

Great idea!

[@pandashangout]

Those of you stuck at "Update Login" 42:00 In the auth.ts file, on line 17, needs to be changed to url: `${API_URL}/login`, method: 'post', headers: { }, for the login function to work properly

[@devanshbehl6109]

Hi , even after changing this i am still facing the same issue , can you please guide if you have made any other changes too.

[@eyleenjaen1509]

Hi! I have the same issue, i tried to do that, but it doesn't work

[@pandashangout]

@@eyleenjaen1509 I ended up dropping this project altogether. Refine keeps updating their tools so it made it hard to continue with this project.

[@pandashangout]

@@devanshbehl6109 I ended up dropping this project altogether. Refine keeps updating their tools so it made it hard to continue with this project.

[@maxwelmutuku8394]

thank you so much 😍

[@jubayerhridoy1582]

Hello Adrian, I have watched a lot of videos from your channel. I have learned basics very well. Your videos are great. But, if you seperate the codes for each part that will be great. I mean, for part1 1 commit, for part 2 another commit. Then, people like me will start from the commit for the things we want to learn from your videos. I hope, you understood what i am trying to say.

[@naseemsaffy]

That's what i want.Thanks adrian for providing such a lovely content❤

[@javascriptmastery]

Enjoy! 😊

[@strugglingElds]

This is exactly what I'm looking for! This is a beast! Thank you!

[@Ivan-pd3yk]

Great video!! The only thing i've struggled with is that the volume is a bit low and sometimes is difficult to follow, it would be great if you turn up the volume a little, but anyway nice tutorial!

[@superhumandose]

You know, it would be great if you could make a second channel just talking about the current landscape in developement. Some of us a freaking out about the current state of the job market and whether learning developement is even worth it now. Don't get me wrong, even though I do not have a dev jon, I love to code but ultimately I want to do it professionally but with what's happening now, how can we have a chance.

[@javascriptmastery]

Cool idea!

[@mohamed_younes77]

I've learned too much from you man thanks I'm looking forward to start this project

[@javascriptmastery]

Good luck!

[@gmako6]

You made me a confident full stack developer brother ever since i started a journey with you

[@hunin27]

Thanks bro!! This course should be around 100$ but you are giving it to us for free!!

[@javascriptmastery]

Everything for JS Masters! :D

[@blacklittle9244]

thank you for your and your team efforts, I learn a lot form each of your tutorial🤜

[@javascriptmastery]

Happy to hear that!

[@yugal8627]

Amazing amazing amazing Adrian🔥🔥, you are the hope of New Developers. Also make a video on Figma and NGINX. Keep it up...🙂

[@javascriptmastery]

Thanks! Will do!

[@PemaWangchuk-w7y]

Started learning using VS Code. Reached at 54.25 It is working perfectly.

[@javascriptmastery]

Thanks for sharing!

[@asishpanda3547]

How long did u reach , and did it work fine. ??

[@mehdichamiani6838]

Great as usual, I love Croatia ❤ Love from Iran 🇮🇷

[@javascriptmastery]

Love to Iran ❤️

[@JJTradess]

This is incredible can’t wait to work on this project !!

[@EfosaMichael]

You know the drill… like then watch… awesome stuff man 🎉

[@javascriptmastery]

You rock!

[@userj-s2000]

Another amazing project, congratulations

[@javascriptmastery]

Thank you! Cheers!

[@jasmeetbrar8609]

This is actually real cool! I am wondering if you’re going to make tutorials with shadcn/ui? :D

[@tsuki_balabala]

finally new update, Nice video my guy!

[@javascriptmastery]

Appreciate it!

[@khouchanemahmoud9475]

Awsome! Always providing best learning projects

[@javascriptmastery]

Thank you!

[@ernst367]

Incredible like always!!! Thanks again for this video

[@javascriptmastery]

My pleasure!

[@EnglishPracticeTime]

I was learning React now Refine :( I mean Refine is awesome but the learning curve is crazy Thank you for the curse buddy

[@kahanMilli]

Finished. Thankyou so much for this!!!!

[@dreamsachiever212]

I was waiting for this since you first announced it in a couple of weeks by email! Don't know if it's mentioned in the video but what is considered best practice /industry standard? hosting the react admin panel on the same domain/subdomain or complete separate domain? I am building a directory app and would then build an admin dahsboard for it for analytics, monitoring listings publishing ,activities and so on...

[@javascriptmastery]

Best practice often favors hosting your React admin panel on a subdomain of your main application, rather than a completely separate domain

[@hugo_dev]

always love your work

[@javascriptmastery]

Thank you! Cheers!

[@salmaahmed7789]

Amazing as usual!!!! pls build an e-learning platform with progress bar and courses. No one has teached that before and no one will like you ❤❤

[@javascriptmastery]

Great suggestion!

[@asjadnasim]

​@@javascriptmastery I would sincerely appreciate your assistance if you make that learning project . Thank you for your consideration.

[@kadir_ozyurek]

Hi Adrian!I'm doing same things like you.But 54:00 when i came up ı have a issue.I only see the home text.Cannot see the test text.Why ı cant see the layout.I cant find it

[@eyleenjaen1509]

Hi! I got the same issue. Did you fix it?

[@kadir_ozyurek]

@@eyleenjaen1509 no bro.I give up

[@DanhNguyễn-g8b]

Hi, did you fix it ?

[@marcelojavierjaimes5723]

I got the same problem too

[@jaguara1]

You forgot to teach how to use GraphQL locally, as obviously no one will leave the dev API, how do I make a copy of the schema generated by Refine?

[@genesisyt9662]

The day i get so good to build this kinda project. I will be living a dream

[@erazulisalmtaosif2557]

I always wait for your video. ❤

[@javascriptmastery]

You're the best!

[@brendanmilton5025]

Looks like an amazing tutorial! Does Refine use it's own database? Can you choose which database to use.

[@Gunjan-ho3bv]

Hi, Did you figure out the answer?

[@hooooman.]

Please make a video on the topic "how to land on your first job", everything from learning, when to start applying, job search portals, GitHub/ LinkedIn/Resume guide, interview preparation and tactics , skills to maximize package etc. with your typical way of explanation and animation. Only you can do that video in a professional as well as beginner frndly manner.Hope you consider my request

[@javascriptmastery]

Great suggestion!

[@ashutoshgupta2758]

Hi , really bro u are doing awesome work and spreading lots of knowledge.. One request to you plz make a video of react native app with using typescript

[@sourabhsingh4515]

Really needed this thank you buddy

[@javascriptmastery]

No problem 👍

[@AjaySingh-jz8qx]

That is so so amazing bro can you bring up more graph ql stuff in future please😊😊

[@javascriptmastery]

Great idea!

[@santutsk]

I am facing an error while trying to register. I entered my email id with password, and upon clicking the button I got this error: "Cannot destructure property 'success' of 'undefined' as it is undefined.".

[@hanighazi]

man you killed it 🔥🔥!

[@ВикторКурышев-ч3р]

1) Your VS code recomend you line endings, what extention you use? 2) Please do not type at the bottom of the screen, when I pause the video to follow you, youtube bottom interface gets over the code and it gets difficult to read. Thank you so much for your video. It is very usefull

[@adeeshsharma6716]

Is the sync between tabs managed by Refine itself or this tutorial separately walks through the setup to achieve sync among tabs? I recently had to work on a task that needs data to be broadcasted between tabs/browsers to maintain a synced state, so just wanted to know if I can get value for that specific task? :) Ps: the demo looks great 🎉

[@javascriptmastery]

It's managed by refine directly 👌

[@sanketuchiha6513]

today is my first day at job and they told me to create dash board and here I am

[@justin9494]

how are u doing?

[@JeremieNODZO]

Thanks for this great tutorial💪💪💪. Good Job !🔥

[@javascriptmastery]

Glad you liked it!

[@NoHandles2654]

Build Begginer friendly javascript projects and explain Everthing from step in depth👏

[@sanjaydotpro]

It was such a great explanation, can you please also add a video showcasing the latest expo router v3 and build a small react-native app?

[@jawherdhaou617]

god bless you sir , you litterly save my day with this project ♥♥♥

[@javascriptmastery]

Enjoy! 😊

[@Sumi-ql3wj]

Thank you so much for your effort brother🤗

[@javascriptmastery]

It's my pleasure

[@mahmoudbarmawi4112]

oh, wow great work! ♥ Can you make a crash course for Flutter?

[@javascriptmastery]

I prefer React Native

[@korngsamnang]

"Hi there" never get old😊

[@javascriptmastery]

Glad to hear that!

[@davidwright450]

One more amazing product❤❤❤

[@javascriptmastery]

Glad you think so!

[@sohanchakraborty7141]

that's a solid a project man thnx buddy

[@javascriptmastery]

Glad you like it

[@kinleyrabgay7106]

Thank you for the informative video 🥳

[@javascriptmastery]

Third! 🎉🥉

[@seealso6580]

Thank you so much for building such a awesome apps

[@javascriptmastery]

It's my pleasure

[@faizanahmed9304]

Thanks Adrian!

[@javascriptmastery]

My pleasure!

[@sang4005]

You never disappoint

[@javascriptmastery]

Thanks

[@brancode404]

WOW again a nice big great project ? Why didn't you use Next JS Here Brother?

[@javascriptmastery]

Not necessary for a dashboard, and to switch things up a bit

[@mulagidev]

Great work 🔥

[@javascriptmastery]

Thanks 🔥

[@rayenhidri584]

First, thx for the great job that you do Can you do another one in pure react (jsx and json server in preference) ?

[@javascriptmastery]

You can try modifying this one to fit that goal

[@AbdulmujeebAhmad-c9n]

I'm having issues with the authentication, the one provided for dev purpose wasn't working. Do I need to perform further config?

[@Coding_with_Adil]

Same issue here

[@mrlord8519]

​@@Coding_with_Adilif issue is resolved please post solution here

[@marcosmandamba3296]

I Hope you one day bring a content about microfrontend✍!

[@javascriptmastery]

Cool idea!

[@rdnexta]

hi JSM, you are great. thank you for giving valuable content. can you say me? can i use this project in my saas. i really need some component. hope i get reply soon.

[@wendreslucas5415]

First of all, thank you for such a rich and professional content. I didn't realize you mentioned it, but can you provide the backend repository?

[@marcosmandamba3296]

Really good 👏content!

[@javascriptmastery]

Thank you 🙌

[@chrisj21b]

Great tutorial as always, have you considered doing any good projects using HTMX too? It's not a replacement for React or other frameworks, but it seems to be a good approach as it's gaining quite a bit of traction. It would be good for the channel and even for the library since there are no tutorials for complex applications made with HTMX.

[@javascriptmastery]

Great idea!

[@abdelrahmanzaitoun4402]

the previous refine dashboard was really outdated and not that useful to today's standards. Thanks for the updated version i have been waiting for it

[@javascriptmastery]

You're welcome!

[@gabrielm4979]

Hey bro, I was taking a look a this project you're building in this video. I'm a react student, with a couple o little projects of experience. In the last project I made, I worked with Shadcn UI because I really like how easy it can be to build websites rapidly. And because I was also watching the video of the cms made with next and Payload Cms, I wanted to ask you if it's possible to implement shadcn ui in these two kind of projects. My biggest concern is that since we're using prebuild layouts from tools like Payload CMS and Refine, they then can not be replaced later with a custom layout or design. I would be really thankful if you could please clear my doubts. Thanks!

[@NishantNarola]

The latest activities in responsive is messed up. Any fix for that? By the way great video. Loved it the intro. Just starting out to build it

[@levitheworst]

This gotta be the Real Madrid of JavaScript

[@harsimothukuri155]

Excellent content❤

[@TheGrigerz]

thank man, you save my days

[@ИльяКим-м3н]

Damn this channel is amazing

[@meheraabarvy4134]

Thanks for your effort.

[@javascriptmastery]

My pleasure

[@ohith3291]

Hi, i have a doubt , How did you made it real time, does making it realtime in production make it expensive??

[@javascriptmastery]

Refine handles that for you!

[@shaharslan3372]

Great video 🫡

[@GermofGames]

Mint Site Creation Video ❤