Back to Browse

Membuat CRUD App dengan ReactJS | NextJS | MongoDB | TailwindCSS🔥

1.1K views
Jan 4, 2025
2:23:44

Hallo Semuanya, Selamat Datang di Channel Ngoding Mastery... Pada video kali ini, kita akan membuat sebuah CRUD APP dengan ReactJs NextJs TailwindCSS MongoDB/Mongoose React-Toastify dan komponen lainnya. - Yang akan kita Pelajari - 1. Belajar NextJs dalam membangun CRUD Application. 2. Belajar membangun CRUD APP dengan Database MongoDB/MongoDB Atlas. 3. Belajar membuat fungsi CREATE, READ, UPDATE dan DELETE di NextJS. 4. Belajar Integrasi API ke FRONTEND. 5. Belajar Menambahkan Class ketika Statusnya memiliki Value yang berbeda. 6. Belajar Menambahkan Element ketika Data tidak ada. 7. Belajar Menambahkan Icon dengan REMIX ICON. 8. dan lain sebagainya. - timeline- 00:00 - Opening 00:49 - Overview Project yang dibuat 05:13 - Software Pendukung 06:57 - Starter Project (Instal NextJs, Ubah Style dan Title) 11:02 - Membuat File - File Components & add container 16:43 - Membuat Element Navbar 21:22 - Membuat Element AddTask 30:11 - Membuat Element TaskList 38:32 - Membuat Element EditTask 41:47 - Connect Database 49:31 - Task Model 51:49 - Create Data (Backend) 1:05:39 - Get All Data (Backend) 1:08:19 - Get Single Data (Backend) 1:14:55 - Edit Data (Backend) 1:20:40 - Delete Data (Backend) 1:25:08 - API ke Frontend (Create Data) 1:34:22 - Install React-Toastify 1:42:49 - API ke Frontend (Get All Data) 1:56:17 - API ke Frontend (Delete Data) 2:00:55 - Menampikan Data Tidak Ada 2:04:57 - API ke Frontend (Get Single Data dan Edit Data) 2:22:27 - Closing - WER TEKEWER KEWER😁☕ - https://saweria.co/dikydev27 - Playlist PORTFOLIO Website - https://www.youtube.com/watch?v=C_4x_N8SMSY&list=PLxLtIf3VX_3C7ooq2RuEo7XEeZ-G6omxD - Playlist React Js Website - https://www.youtube.com/watch?v=r9kAp2zeU5s&list=PLxLtIf3VX_3A5RJFRZTtdHCLcA69el96o - Playlist Tailwind CSS Website - https://www.youtube.com/watch?v=-o_tBBtLS4U&list=PLxLtIf3VX_3C-Oe5VtgUBmONbScnGBYPB - Playlist NGOJEK (NGOding proJEK) - https://www.youtube.com/watch?v=WgSCJSG1lOw&list=PLxLtIf3VX_3BnAbuL-XDaPmq6AkL41K6g - Playlist Website LANDING PAGE Responsive - https://www.youtube.com/watch?v=hXPb8v4SFbI&list=PLxLtIf3VX_3D8y0acpsIzIlME_5J_6Ns6 - Playlist Library CSS & JAVASCRIPT - https://www.youtube.com/watch?v=hErSquN7vS0&list=PLxLtIf3VX_3C7p1royoHxX0KFflbhUFAH - Playlist BOOTSTRAP Website - https://www.youtube.com/watch?v=rK92ZoMMU7U&list=PLxLtIf3VX_3BHLe9ijLFzX9o7N2f3dUfB - Playlist HTML CSS JS Website - https://www.youtube.com/watch?v=eYFN_TL8Ycw&list=PLxLtIf3VX_3ALfhQfe37qKRPk4eJquGrU - Playlist REST API (Node Js, Express Js, MongodDB) - https://www.youtube.com/watch?v=6vMWoJsG4YQ&list=PLxLtIf3VX_3BMqiadv2dATYotfYKq0SjJ - Playlist GITHUB - https://www.youtube.com/watch?v=s0bNDmqlHO0&list=PLxLtIf3VX_3CtzHU1jnGR-iuyqh08W1NW - Playlist Website Responsive Sederhana - https://www.youtube.com/watch?v=AQP80QaYhK8&list=PLxLtIf3VX_3At0wacILmuuSm_06as1oNy https://nodejs.org/en https://nextjs.org/ https://tailwindcss.com/ https://www.mongodb.com/ https://remixicon.com/ https://www.npmjs.com/ https://fkhadra.github.io/react-toastify/introduction/ ------------------------------------------------------------------------------- Like and Subscribe Jika Teman - Teman Suka 😁 ------------------------------------------------------------------------------- #crud #nextjs #nextjstutorial #tailwindcss #mongodb #mongodbtutorial #mongoose #api #restapi #restfulapi #fullstackdeveloper #reactjs #reactjscrud #crudreactjs

Download

1 formats

Video Formats

360pmp4224.7 MB

Right-click 'Download' and select 'Save Link As' if the file opens in a new tab.

Membuat CRUD App dengan ReactJS | NextJS | MongoDB | TailwindCSS🔥 | NatokHD