Build React CRUD Admin panel with Ant Design | Refine Tutorial | React Admin Crash Course

Published: 24 November 2022
on channel: Dipesh Malvia
60,177
791

In this video we will build a React admin panel for a Content Management system app. We will learn how to consume Rest API and add CRUD functionality using Refine which is a react based framework and we will also use Ant design components with refine for designing our admin panel.

⭐️ Refine - React Framework⭐️
Refine is a 100% open-source, headless React framework for CRUD apps, So you can quickly build internal tools, admin panels, and dashboards while remaining flexible.
GitHub: https://github.com/refinedev/refine

⭐️ Support my channel⭐️
https://www.buymeacoffee.com/dipeshma...

⭐️ Tutorial reference links⭐️
Example source code: https://github.com/refinedev/refine/t...
Example tutorial: https://refine.dev/docs/tutorials/ant...

🔥 Video contents... ENJOY 👇
0:00:00 - Intro
0:00:24 - Project Demo
0:02:44 - Refine Overview
0:04:04 - Project Setup with Superplate-cli
0:05:50 - Bootstrapping the Application
0:08:40 - Fake Rest API
0:09:19 - Adding Resources
0:11:01 - Create pages & Interfaces
0:14:46 - Creating a List Page
0:17:04 - Handling Relationships
0:20:40 - Adding Search & Filters
0:23:19 - Showing a Single Record
0:25:50 - Editing a Record
0:27:56 - Creating a Record
0:29:11 - Deleting a Record
0:31:10 - Outro

⭐️ React Roadmap for Developers ⭐️
How to Learn React JS ? -    • React JS Roadmap for Developers | React Le...  
React in One Project -    • Learn React JS with Project in 2 Hours  | ...  
React Redux Toolkit Tutorial -    • React Redux Toolkit with Project | Redux A...  
Learn React Redux with Project -    • Learn React Redux with Project | Redux Axi...  
What is Redux ? -    • Understanding Redux Concept in 5 Minutes |...  
Learn React Redux Thunk with Project -    • Learn React Redux Thunk with Project | Red...  
Learn React Hooks -    • Learn React JS Hooks | React Hooks Tutoria...  

⭐️ JavaScript ⭐️
🔗 JavaScript Crash Course -    • JavaScript Tutorial for Beginners | JavaSc...  
🔗 Async Await in JavaScript Tutorial -    • Async Await in JavaScript Tutorial  
🔗 Async JavaScript Promises Tutorial -    • Async JavaScript Promises Tutorial  
🔗 Async JavaScript Callback Functions -    • Async JavaScript Callback Functions, Error...  
🔗 Async Vs Sync Programming -    • Asynchronous Vs Synchronous Programming | ...  

🔗 Social Medias 🔗
Twitter:   / imdmalvia  
Facebook:   / programmingwithdipesh  
Instagram:   / dipeshmalvia  
LinkedIn:   / dmalvia  

⭐️ Tags ⭐️
React CRUD Admin Panel
Build React Admin App From Scratch
React CRUD Admin Panel Tutorial
How to Build Admin Panel in React.js

⭐️ Hashtags ⭐️
#react #admin #beginners #tutorial

Disclaimer:
It doesn't feel good to have a disclaimer in every video but this is how the world is right now.
All videos are for educational purposes and use them wisely. Any video may have a slight mistake, please make decisions based on your research. This video is not forcing anything on you.


On this page of the site you can watch the video online Build React CRUD Admin panel with Ant Design | Refine Tutorial | React Admin Crash Course with a duration of hours minute second in good quality, which was uploaded by the user Dipesh Malvia 24 November 2022, share the link with friends and acquaintances, this video has already been watched 60,177 times on youtube and it was liked by 791 viewers. Enjoy your viewing!