Загрузка...

Next.js + MySQL UPSERT | Update Applicant Profile Form (React Hook Form)

📂 Source Code
👉 GitHub Repo: https://github.com/thapatechnical/job-portal-nextjs

----------------------------------------------------------------------------------
In this video, we build a real-world Applicant Profile Settings Page in our Job Portal Application using Next.js and MySQL.

Users may:
• Fill profile for the first time
• Update their existing profile later

Instead of creating two separate forms (Create + Update), we implement a powerful UPSERT logic.

You’ll learn:

What is UPSERT in MySQL

How to use INSERT ... ON DUPLICATE KEY UPDATE

How to detect whether to insert or update

How to toggle button text (Save Profile / Update Profile)

How to use isDirty and isSubmitting from React Hook Form

When to disable the submit button

Writing clean backend logic for real production apps

This is a must-watch if you want to become a serious full-stack developer.
------------------------------------------------------------------------------------
🔗 Useful Playlists

📘 Next.js Full Stack Playlist:
https://youtube.com/playlist?list=PLwGdqUZWnOp0lwvSBaIzzgV9X0ZiZ-42O&si=aQ_TNBNNx5L7V_bn

⚛️ React.js Playlist:
https://youtube.com/playlist?list=PLwGdqUZWnOp1Rab71vx2zMF6qpwGDB2Z1&si=sDZRxsYNetYmojKd

💻 TypeScript Playlist:
https://youtube.com/playlist?list=PLwGdqUZWnOp0xfHQFmlL52b_6-QZ0mnk_&si=c4jfsd5ElDC1p0A5
------------------------------------------------------------------------------------
💸 Get All My YouTube Videos' Source Code for just ₹199! Grab Now - https://thapatechnical.shop/source-code

📺 Watch the complete Node.JS Playlist here :https://youtube.com/playlist?list=PLwGdqUZWnOp3KELplHtc-RnJ5xTUPqdgH&si=_ob8F88HYxCdspup

🔥 Access Source Code, PPT & Notes here for Free : https://www.thapatechnical.com/2024/11/introduction-to-nodejs.html
------------------------------------------------------------------------

🚀 Boost Your Skills with these Pre-Requisite Videos:

🔗 Best HTML Course - https://youtu.be/5ccq_nLHneE
🔗 Best CSS Course - https://youtu.be/MSICFljRcb4
🔗 JavaScript Basics Course Part 1 - https://youtu.be/13gLB6hDHR8
🔗 JavaScript Advanced Course Part 2 - https://youtu.be/YwsOCN8woA8

------------------------------------------------------------------------
💸 Build Your Own E-commerce Website for Free! - https://www.thapatechnical.com/2024/03/build-complete-ecommerce-website-using.html

------------------------------------------------------------------------
✌️ Join Us!

🚀 Become a Member: Unlock perks, free source code, and more Join Now : https://www.youtube.com/channel/UCwfaAHy4zQUb2APNOGXUCCA/join
📷 Connect on Instagram: https://www.instagram.com/thapatechnical
🗨️ Join Our Discord Server: Hang out with fellow programmers Discord Link: https://discord.gg/MdScmCsua6

------------------------------------------------------------------------

⌛TIMELINE⏳
0:00 Adding Update Function to Applicant Profile
1:20 What is UPSERT in MySQL?
1:52 Support the Channel ❤️
2:10 Creating the UPSERT Backend Function
3:35 Important Concepts Before Writing UPSERT
5:10 UPSERT Code Explained Step by Step
6:30 How to Check Insert vs Update in Database
9:05 Changing Button Text (Save / Update Profile)
11:20 isDirty & isSubmitting in React Hook Form
12:35 When to Disable Submit Button
13:30 Dynamic Button Text Logic

Видео Next.js + MySQL UPSERT | Update Applicant Profile Form (React Hook Form) канала Thapa Technical
Яндекс.Метрика
Все заметки Новая заметка Страницу в заметки
Страницу в закладки Мои закладки
На информационно-развлекательном портале SALDA.WS применяются cookie-файлы. Нажимая кнопку Принять, вы подтверждаете свое согласие на их использование.
О CookiesНапомнить позжеПринять