---------------------------------------------------------------------------------- In this video, we implement the job application feature for our Job Portal project built with Next.js, TypeScript, Prisma ORM, and MySQL.
When a user clicks Apply Now, a modal opens where their uploaded resume is pre-selected, they can write a cover letter, and submit the application.
Using Next.js Server Actions, we:
• Send form data from the modal to the server • Validate inputs using Zod • Check if the user has already applied • Prevent duplicate applications • Store the application data in the Job Applications table using Prisma • Revalidate the page and update the Apply → Applied button
This is a real-world full-stack feature used in modern job platforms.
In the next video, we will build the Applied Jobs page where applicants can see all the jobs they have applied for. 🚀 ------------------------------------------------------------------------------------ 🔗 Useful Playlists
⌛TIMELINE⏳ 0:00 Insert Apply Job Data to Database 1:25 Support the Channel ❤️ 1:42 Passing Form Data to Server Action 2:35 Writing Server Action to Store Application 3:15 Data Validation Using Zod 5:00 Check if User Already Applied 5:55 Insert Data into Job Applications Table 6:45 Revalidate Page After Application 7:21 Apply Button → Applied Button Logic 7:45 Next Video Preview (Applied Jobs Page)
AI Generated·May contain errors
Hello what's up guys Welcome to Nexus and
MySQL's job portal application Today is day
number 88 and finally today we'll complete
the apply now section
Yes our UI part is done
The dialogue you can see is also complete
The data you can see is also complete
Only one thing remains
And that is when you are selected by default
And if you enter anything here
And when you click on apply now
this is your resume ID
not the name of the file or resume just the ID
and the string I wrote in the cover letter
if I see
application submitted successfully
Then we have this already applied
If you click Apply Now this page
gets revalidated And here
If I click on Job Applicant
Then the data appears as follows
So Job ID
Applicant ID Resume ID
Cover letter and by default
Normal ID
How it is stored here
We will complete it today
Once this is done
We will see in the next video
How you can see
The current applicant has applied
We will show it here
You can understand how awesome it is
Without any delay let's start the video
But before that
If you haven't checked out the other videos yet
Then please do it
If you haven't subscribed to the channel yet
Then please do it
I get a lot of courage when you subscribe
So I can keep uploading videos like this
That's your part
Whenever someone
submits a form we
capture its data—just
look at the form I'
ve already submitted
it and on submit
we receive the data
via React Hook Form
Here you can view the data
And you can think of it this
way: this is our
data by the way
you need to specify the type of
data such as job ID or resume ID
And then I'm going to
write the cover letter
like this—we have the
data right here by default
Provided by React Hook Form And we are calling this function
Basically a server action
Apply for job action
And I'm passing this data
Job ID Resume ID and
then the cover letter
If you see here
Don't forget to write UseServerHook
It is very important
It is very simple
I will guide you step by step
First of all
To apply
We need to know
Is that person present or not
Is the user already registered or not
Is he logged in or not
So I obtained the current user data
And in case that user is not present
Then we'returning like this
If you want
By the way
It's displaying like this
That's why you can't see any double calibrations
If the user isn't present
Then it means he is
not logged in After
that we got the
data here We applied
the schema No
tension
Not here we
need to validate our
data Apply job schema
Job ID must be a number or not
Resume ID
Is it a number or not
In yesterday's video we converted it to a number
We need a number here
The cover letter is optional
But it should still be present or no
Whatever it is
Here we passed
If everything is correct you'll receive the data
By the way
If you get the result or response
And if it's true you'll get the data
If it's false you'll get an error
Here we've named the data as an alias
Validated data
In case there's any error
During validation
Such as a cover ID or resume ID
If you're holding the string
True or false Except
for the number
If there is any issue
We will display
the message Correct it
If the data is valid
Then we're breaking it
down like this: Job ID
Resume ID Cover Letter When we receive
the data
we need
to check whether
that person has already
applied or not In case
we've already done it
In yesterday's video
we still need to check
and make sure the
data isn't duplicated
even if the person
has already done it—we
don't want the same
user's data added twice
In this table
In the job
application table Basically
Applicant ID 3
Should have identical data
One applicant per job application
Can apply for only
one job Correct
So db select from your job
application Table
Where we have this end operator
And we are using two equal operators
Means both conditions must be true
Only then will it be satisfied
Otherwise it will not
In a job application
If the applicant's ID
Identical to our user ID
Number one
And second
If the job ID
Matches our job application
If both are the
same it means the
person has already
applied for this
job and in that
case you've already
applied and entered your information
Otherwise if all this is confirmed we simply need to
insert the data into our job application
table so await db
insert with the name of your
table followed by the values : Job ID Applicant ID Resume
ID and then the cover letter
See how easy it is to understand that
we have ID Job ID
Applicant ID Resume ID
and Cover Letter—if
we see it like this
then we can understand
why it's happening
What’s the reasoning behind it and why
did we write
it this way We’revalidating—
revalidate means that
the moment I click
Apply Now you should have
noticed this here
You can see it has already been
applied because it is undergoing revalidation which
causes the page to be validated
again resulting in it being checked once more This
page Job ID—basically this page
has had the rule applied and
here we have completed the process
If the value is true
apply the model here if
the "has applied" value is true then you can
see it is already applied
so this is how it's
happening and as soon
as this part is completed
Application submitted successfully
Do you remember
The green toast
In case something goes wrong
Then the application fails to submit
So guys that's it
I hope you enjoyed the video
Where finally this is also completed
Tomorrow we'
ll find out how you can create an applied
page—so what did you think
Please share your comments
Don't worry I hope you
learned a lot because
there was something
new in every video If
you liked the video
like it subscribe to the
channel see you in
the next one—take care