Loading video player...
All of you, welcome back to yet another
project for Solana mastery. In this
project, you're going to build your
first ever advanced fullstack messaging
app on Solana blockchain with multimedia
file support where you can send audio,
video, images, text chat and you can
also transfer fund in your chat. So let
me give you a complete walk through of
all the feature we have included and how
our Solana chat application would work.
So when the user will come back to our
application, this is what exactly they
will see. The very first section we have
is our header section where you will
find the logo which you can customize.
You will have a button which you can
click and you can connect your wallet.
Then we have our hero section where we
are displaying the details about our
project. So this is going to be the logo
of our branding. Here you will find the
Solana chat. It's a decentralized chat
application which execute on the Solana
blockchain. We have our titles which you
can customize. And here we have another
button which user can click and they can
connect. Now if you come back to the
feature here we are providing all the
features which we are offering in our
decentralized chart application. So we
have the secure decentralization which
every single thing all the transaction
of the data would be stored in the smart
contract. So no one can able to
manipulate or change it. We have a
lightning fast system because we have
developed this project on the Solana
chain. We have multiple feature like
sending media file adding friend
transfer money. That's all we have. So
the transaction is going to be very
quickly within 1 second. You can see
this is the lowest but it can go more
low to the fee. We have a 100%
decentralization and we are following
this bite of data transfer which is
super fast. So this is the complete
overview of our application and our
welcome page. Now let's connect our
wallet and let's get into our dashboard.
So I'll simply click on my wallet and I
will pick I have all of these wallet. So
I'll go with Phantom. And once you will
connect your wallet you will come back
to the dashboard. From there you can
able to chat with your friends. If you
don't have friend you can simply connect
and make friend. So here we have on the
dashboard section you will find that we
have a stunning dashboard and futuristic
look. We have the very first section we
have is the header section and here you
will find on the right hand side our
profile. So I have the image you can
upload your profile if you don't want to
upload. It's going to display first text
of your name which you can see this. So
we have our name. We have our world
address. We have our profile. This is
the icon we have added and if you want
to disconnect you can simply click here
and you would be disconnected. Let's
connect one more time. Click on phantom
and I'm connected and here I am in my
dashboard. So that's the header section
we have. On the left hand side we have
our sidebar. There you will find the
list of all the friends. So the very
first section we have is the message and
from here you can able to click and you
can able to add friend. So you can able
to give their vault address, name and
you can click on add friend but they
have to be added and registered themsel
then you can able to add them or you can
come back to the browser section and
here you will find list of all the user
which is available and which you are not
friend with. So this is your wallet but
when the user will register and you are
not friend with you're going to simply
select and find them and you can select
and you can add them. So just click it
and it will be selected and you can call
the function and you would be added as a
friend. So let's close this one. Here we
have the filter system. So you can
simply filter your friend and if you
want to go to the specific chat to that
particular user you can simply select
and you will be open that that specific
chart and you can start communicating.
So if I go with coder there you will
find that all the messages I have
exchanged all the messages I have sent
that's all is there. So this is the
message I have sent and here you will
find that I have exchanged the media
file I have sent the money I have sent
the audio file I have sent the video I
have sent the image file I have this
text file. So all the things which you
will transfer is going to be reflecting
here and you will find the name of the
user, how many friend he has and these
are the icons we have. So this is the
chat interface. From there you can able
to communicate. If you come back here,
here you will find multiple media file
options. So if you want to send message,
if you want to send image, you can
simply click here and you can simply
upload the image file. If you want to
upload video, you can click here and you
can upload the video file. If you want
to send music, you can simply select
here and you can send your media file,
audio file. And if you want to transfer
fun, you can simply click here. You can
give the amount which you want to
transfer and it would be transferred to
this particular user. So let's close
this one. And here we have the option.
If you want to see your profile, you can
simply click here and you will find the
details about your profile. If you want
to update the image of your profile, you
can do it. But I would suggest you just
keep it one profile at a time. It would
be better. And you will find the number
of user you are friend with. Your
account is active and that's the details
you will find. You can simply copy that
and you have copied your address. Let's
close this one. Now you can see that I'm
connected with the admin account. I will
also have the access for the admin as
well. So you can simply click here and
it will open the admin panel and then
you can able to find all the stats like
how many user we have in our smart
contract. The deployer address. This is
the account which I have used for
deploying the smart contract. Our
contract is got initialized. So when you
will deploy the contract after that you
have to initialize then the user can
able to register themsel you can see
which network we have deployed it will
work absolutely fine on the mainet as
well you will find all of these details
we have the users and how many friends
each one of them have so this is the
detail section we have you can simply
click on refresh and it's going to
refresh the data so I'll simply close
this one and that's how our chat
interface would look like now let me
perform every single thing in practical
and show you all the transaction and
let's do that so what I will I'll simply
come back here, come back to this and
right now I haven't sent any message. So
I'll simply send the message. So I'll
simply come back here in my chat and I'm
going to copy the text right from here.
So let's copy it. So I'll come back here
and let's send the message. I'll simply
come here, paste the message and click
on this send and it's going to perform
the transactions. You can see it's going
to call our phantom wallet and we have
to simply login first. I haven't logged
in
and I have to simply click on confirm.
Simply ignore this one because it's a
devet. So we have this stimulation
function which we are not executing. So
just a warning simply click on confirm
and the transaction in the process. Once
the transaction will complete you will
see the message will popped up and here
the message is successfully sent to that
particular user. Send the audio file,
video file or image. It's very easy.
I'll send a let's say image. I'll come
back here and this is the one I have.
I'll simply select click on open and I
will have this beautiful preview where I
can see that what I'm sending. I can
give a caption but this one is optional
but let's give this caption and I click
on this send and here I'm uploading the
dot data to the IPFS then I'm calling
the smart contract so it's a really
powerful strategy let's click here and I
have to simply click on this confirm and
the transaction is happening once the
transaction will complete the file would
be sent and you will find the media file
would be reflecting here so it's taking
a little bit time because we are loading
the data you can come back here and you
can simply come here one more time and
you will find the media file is loading
so what we are doing we are not blocking
the execution of the function we are
loading it synchronously so you will
find that we have sent this one if you
want to send the like video you can do
that you can simply click on video and
you can select the video so I have this
video I'll click on this open and here I
can have the preview or I can simply
give the text I'll say hey
video and you can type any message click
on this send and here we are doing the
transaction so we are calling our smart
contract IPFS and making the transaction
ction. So just wait soon the process
will complete. I have to simply click on
confirm to execute the transaction. So
here we have successfully completed our
transaction and you will find the video
which is there in the chat. I can simply
click here and I can play the video
which I have uploaded. In the same way I
can simply upload and transfer the audio
file. I can click here pick the audio
file send here. I can give that I'll say
give this text and click on the send.
And here I'm uploading it.
We are making the call to our smart
contract. Let's click on this. Click on
this confirm. And we are simply sending
the audio file which is reflecting in
our fine with the icons with the image.
So every single thing is looking fine.
And this one is dynamic. It will
automatically get a reflect which when
you are communicating with the user. So
I can simply come back here and if I
want to transfer the fund I can do that
very easily. So if I come back to my
phantom wallet and you can see that I do
have a little bit fund which I can do
the transfer. So I have 04. So let's do
the transfer. So I'll simply come back
here. I'll click on this and I'm going
to transfer let's say 0.1
and click on this send and it's going to
transfer the fund to this chat and the
user will reflect receive. Let's click
on this confirm and just a moment soon
the transaction will complete and we
have done the transfer of the fund. So
it's really powerful. I hope you have
understood that what are the feature and
functionality we have included. I can
simply come back here and I can go back
to the different account which is the
account number let's say two and in
which I have sent and received all the
messages. So I'll simply give a quick
reload. So it's going to simply reload
the data and here you can see I got this
one. Now I can come back here and you
will find that all the messages which I
have received. So I'll simply come back
here and here you will find that this is
the messages I have received.
This is the messages and audio file and
the images I have sent. If I come back
to my account number one, you will find
that all the messages which I have
recently sent, that's all is going to be
visible in my chat. So I'll simply give
a reload because I have changed my
account. And here you will find that I'm
on account number one. I'll click on
this. Let's say the blockchain coder.
You will find all of this text, the
audio file, every single thing is
perfectly aligned. So first we have to
send the text, then the image, then the
video, audio and the money. That's all
is there. If I want to response back, I
can simply response in back in the text.
I can simply click here and I can simply
call the function. So let me help here.
Click on this confirm and here we have
it. So we have to send the message. If I
want to send the image back, I can do
that very easily. I can simply come back
here and I can simply go back to the
images, pick the image, click on open
and here I can give the caption or I can
simply click on the send and the message
would be sent absolutely perfectly. And
here we are sending the message. Click
on this continue and click on confirm.
And the transaction is completed. And we
have completed the entire transaction.
So that's how you can easily able to
simply send the messages, receive the
messages. If you want to add friend, you
can simply come back here. You can add
it manually or you can simply come back
here. Here you will find the list of all
the users. You can simply select them
and you can simply click on this add
friend.
Got it? So that's how every single thing
will be working. I hope you have
understood that what are the feature and
functionality we have included and this
is the automated system. The moment you
will bring it up your chat it will going
to bring it down and you will have all
of this details. Looks absolutely
perfect. Now if I want to update my
profile so I'll simply do that very
easily. I can do one thing. I can come
back here and I can come back here and I
will go to my account number two in
which I haven't uploaded my profile. So
right now you can see I'm connected with
the account number two. Let me reload
the page and you will find that I'm
connected with account number two but I
haven't uploaded my profile. So it's
very easy. I can simply check the
messages. I can read it and if I want to
update my profile I can simply click
here and I can click here and I have the
image which I can simply upload. So I
can simply take this one click on open
and it's going to upload the image and
we're going to have it. So here it's
calling our smart contract. I have to
click it. Click on this confirm and the
transaction in the process. So once the
transaction will complete the profile
would be updated and here you got it
profile it looks absolutely fine. So
your profile is updated in the same way
if you come back to a different account
and if you want to update the profile so
you can but don't try to do the profile
update frequently because you have to
pay money for it. I hope you can
understand. So you can see it's changed.
If I come back here and if I change it I
can do that very easily. So this one is
I have already updated. If I come back
here, click here and if I change this to
a different profile, I'm making a call.
It's going to make a update and I have
to simply confirm the transaction. Click
on confirm and it's going to simply
update my profile and the profile is
updated. So I hope you have understood
that what are the feature functionality
we have included. Every single thing is
working absolutely fine like a like a
bread and butter. So it's really
powerful. Every single things got
updated and we have all of the chat is
available which we can read and see
that. So I hope you can understand that
how powerful application it is. Every
single thing is controlled by the smart
contract. It's a full stack Solana
mastery project which will help you to
learn every single thing about the
Solana development and contract
development. So that's a really powerful
every single event is happening
perfectly. Now let me provide you all
the assets which you need to develop
this application and if you want to
foster your development you can take the
final source code as well. So you can
come back to the blockchain coder there
you will find that we have more than 100
plus project and we have built more than
30 to 40 project dedicated to the
Solana. So make sure to log in come back
to the source code section and here you
will find all the 100 plus project we
have developed. We have many project for
the Solana which you can also have a
look. So make sure to check all of that.
Now you have to come back here you can
search for it. You can click on this
recent project and here we have it. So
click on this. Make sure to check this
one play to earn. It's a really powerful
game where you can allow user to play
and when they will win they will get the
amount double and when they will lose
you will get the fund. So this is the
one we have. Click here and you will
come back here. I'm going to attach the
final source code setup video right up
here which is this one I'm recording.
You can click on the starter file and it
will take you to GitHub and here you can
able to understand all the architecture
which we have utilized and how every
single thing would be working. So make
sure to clone the repository, save it.
So when the complete project will come,
you can simply follow it straight away.
Now let me show you that how you can do
the final code setup. So make sure to
take it. When you will take it, you will
give your valuable contribution to my
team to bring more tutorial like this.
When you will download the final source
code, you will get the zip file. Make
sure to extract the zip file and you
will get this folder in which you will
have the complete source code of the
project including the smart contract you
have seen in the demo. So I would
suggest you to install a zip extractor
and extract this folder and this is the
one you have to open in your VS code. So
I'll click on my VS code and I'll go
back to open. I'll go back to desktop
because there I have my folder. I'll
simply select and click on open. Now let
me give you a complete walk through of
all the folder and file structure and
the architecture we have included in
this particular project. So let me make
a little bit zoom and you will find that
this is the complete architecture and
all the folder structure we have for our
application. So the very first folder we
have is the component in which you will
find all the component we have designed
for this full stack solana chat
application. So the very first one we
have is the at friend then you will find
all the code. So every single thing is
dynamic. I would suggest you to test as
it is once you understand completely
after that do all the experiment from
your end. So this is the ad friend this
is the admin dashboard. This is the chat
window, friend list, header, IPFS,
image, layout, loader, media preview,
message input, user profile, welcome.
Every single thing is dynamic. So this
is the welcome. If you want to change
the description and titles, you can do
the customization based on your
requirement. So let's close this one. So
that's all the component we have. The
next one we have is the context in which
you will find the chat context which
allow us to communicate with the smart
contract we have deployed on the Solana
chain and we have all the functionality.
So make sure to have a look. It's a
really powerful and that's all the
connection and all the function call we
are doing right up here. So just keep it
as it is. You don't need to make any
changes. Every single thing is dynamic.
Let's close this one. Come back here. Go
back to the contract and there you will
have the chat dab rush smart contract.
So this one is a really powerful smart
contract we have developed and it has
all the feature. This will help you to
master how you have to write the rust
smart contract. So this is a huge
contract we have coded more than 500
lines of code we have added and it's a
really powerful. It has all the feature
like building the relation, getting the
data, having the data, writing, updating
that's all we have. So you can check all
of this try to understand. So this is
the one which we're going to deploy and
when you will deploy you will have a
different address which you have to
provide. So I'll I'll show you all the
setup which you have to do. So let's
close this one. Now come back to the lib
in which you will find the AB of our
smart contract. So when you will deploy
the contract, we'll get the idle file
and that's what we going to replace
here. So let's close this one. Close
this one. come back to the pages and
it's going to be a single page
application. So we have this app.js
where we have done all the setup for the
context management and the wallet
integration. So you will find that we
are using all the wellestablished
packages for the industry. You will find
the network configuration. So I have
deployed the contract to the devet and
that's what I have added and here we
have the wallet which I'm offering and
that's all the setup we have. So just
keep it as it is. Close this one. Come
back to the index.js JS and here you
will find the complete homepage where we
are injecting all the component
dynamically for the user and for the
admin that's all is there so just keep
it as it is close this one close this
one come back to in which you will find
this particular the blockchain coder
logo but you can keep all the assets
which you want to have it that's all you
can keep into the public folder and you
can simply call it so let's close this
one come back here go back to the style
folder inside that we'll have the global
CSS and here we have written the entire
custom CSS for our entire application
with all the custom models So I just
suggest you to test as it is and if you
really want to change the branding color
you can do it but make sure you should
have a understanding about it. So this
is the global color which you can simply
play around with. Let's close this one.
Come back to the utils. There you will
find the utility function we have. So
this is the helper function which allow
us to short the address format check the
validation copy. That's all we have. So
you don't need to make any changes. You
can see all of this gradient component
which we have utilized. Now if you come
back to the pinata IPFS there you will
find that we are using this pinata
provider for deploying our document to
the pinata IPFS which is a distributed
network different endpoint. So this is a
huge code we have coded don't need to
make any changes just keep it as it is.
Close this one. I'll tell you what are
the things which you have to provide. So
all the things which you have to provide
in this environment variable. So if you
come back here this is very important.
You have to put your variable. So the
very first thing is program ID. So when
you will deploy the contract you will
get the program ID and that's what you
have to provide when you will deploy the
smart contract and the account which
you're going to use you have to provide
the void address of that particular
account which you will use for deploying
the contract we are testing on devet so
I have activated that here you have to
provide your pinata credential API key
secret key and JWP token and the rest
thing is going to be as it is so we're
going to get it each one of these
variable together just wait let's close
this one come back to the get ignore
keep it as it is we have the next config
files just keep it as it is we have the
packages and files And this one is the
most powerful packages we have used.
It's very stable and it will work
absolutely fine no matter when you are
developing this project. It will work
after 5 years, 10 years. It will work
absolutely fine as long as you maintain
this package for this particular video.
So let's close this one. Come back to
the post CSS. Every single thing is
good. Come back to the readme file and
then you will find all the details about
the project and what are the things you
need to have. So that's all is given.
But make sure to follow this video till
then you will understand every single
thing. Let's close this one. Come back
to the Telvin config. So this is the
custom configuration we have for our
Telwin setup. That's just keep it as it
is. Close this one. Now I hope you have
understood that what are the things and
folder file structure we have designed
for our application. Now the very first
thing we have to do is to deploy our
smart contract. This is the one we have
to deploy and perform all the
transaction and that's what we're going
to do it. So this is all we have it. So
what I will do I'm going to come back to
the browser and let's deploy the
contract for. So let's come back here
and let's open a new tab and type Sana
Playground ID. Make sure to search this
because right now there is a lot of fake
Solana Playground. If you connect with
them, they're going to steal your fund.
So always search on Google, come back
here and this is the official one. So
click here and you will come back to
your project and you will see that I
have already this project. So I'll
simply delete this one and I'm going to
start from fresh so you can be on the
same stage where I am. So right now you
can see that I have the empty project.
So the very first thing I have to do is
to create a project. I'll click here and
I'm going to call this chat dab and I'm
going to use anchor framework. It's a
really powerful. Click on create and
it's going to create the project for
you. We got the project. Now the very
first thing we have to do is to get our
contacts. Come back here. Select all.
Copy. Come back here. Select all.
Replace. Now you have to paste. So make
sure to save it. And once you will save,
you will have your contract up in right
up here in the project. Now I'm going to
simply connect with my wallet. So I'm
going to use my internal wallet which I
already have in my phantom wallet. So
this is the wallet which I'm going to
use for deploying the contract. So
that's the first thing. Let's close this
one. Now what I will do, I'm going to
simply compile my contract. So before
you compile, make sure to give a quick
reload after pasting the contract. And
you will find that every single thing is
well settled. We are using the same
vault address. And this is going to be
the admin of our contract. Now I'll come
back here and let's run the build
command. The moment you will run is
going to change the program ID and it
will give you the updated one. So let's
click on this build and this might takes
a little bit time. So just wait once it
will compile the contract. We'll get the
idle file and we are ready to deploy our
smart contract. So just wait. And you
can see that I'm getting this error in
the compilation because I already made a
lot of requests to the compiler. Don't
need to worry about it. Whenever you get
this error, make sure to reload the page
and save it one more time. Come back
here and let's give a one more try. So
it's going to compile your contract.
Once you will have the compiled
contract, you are ready to deploy it. So
just wait and finally our contract has
got compiled. So whenever you take a
little bit time, make sure your contract
is going to be successfully compiled.
And we got the detail built
successfully. Once you were done with
that, you will see this program ID got
updated. Now we are ready to deploy our
contract. This button is enabled. So
let's click on this deploy and it's
going to deploy our smart contract. So
just wait. Let's click on hit enter and
it's deploying our smart contract. So
just wait
and finally our contract is deployed.
I'll simply click here. You can come
back to the explorer and there you can
able to see all the details that what
are the execution we have developed and
this is our program ID which we need. So
you can able to see that what are the
internal contract what are the models
that's all we have. So this is the
successful contract deploy. Now you can
come back here and now I would suggest
you to copy this complete code and
that's what you have to paste here
because this time this editor will be
changed. So I'll simply select this
remove and paste. That's the first
thing. We got our updated contract. Now
close this one. Close this one. Come
back to the AI. I'll simply delete this
AI because we have our new AI. I'm going
to simply minimize this one. Come back
here and let's try to export our program
ID. So this is the one you can copy from
here till or you can simply copy from
here as well. So I'll simply copy and
that's what I'm going to provide in our
environment variable. So here I have to
provide paste here we got our program
ID. Now we have to get our AI. So let's
close this one. Come back here in the
file and here you will find your idle
file. So you have can simply import
export your API. So click here and you
have exported. Now you can come back
here. Go to this. Come back download and
there I have it. Simply drag and drop in
the lift file. I'll save it and it will
be formatted. So we got the most
important things done like we got our
API, we got our contract deploy, we got
the program ID. Now we're going to
simply provide the admin address which
is this one I have used. So I'll simply
click here and I'm going to click and
copy this. I have copied. Now I can come
back here and I'm going to simply paste
here.
We got it. So we got this three details.
Now we have to get our pinata epi and
secret key before we execute our project
because this will allow the user to
upload the media file. So let's come
back here open a new tab. Type pinata
cloud. It's a really powerful platform
and it's free to use it. So login and
verify your account. When you will
verify your account successfully you
will have the dash. I already have my
account. So I will simply login straight
away. I'll click on login and once you
will login successfully you will get
into your dashboard and you will find
all of this. I'm going to click here and
now I have to create a new API key. So
if I come back to the API keys, I have
already created one but to create a new
one, you can simply click here and you
can call this chat dab and make sure to
have to enable this one. In that way you
can able to have all the access and
click on this create and it's going to
create a brand new API key. So this is
the API key. Simply copy and that's what
you have to paste here.
That's what you have to paste here.
Again I will come back here. I'll copy
the secret key and that's what I have to
paste here. Now I have to get my JWT
copy and that's what I have to paste
here. Again I'm telling you you have to
use your own because after this project
I'm going to delete this one. It's free
to create your account free to get your
APK and secret key. So make sure to
create your own. Don't use my I'm going
to delete this and it will not work. So
we got all the important environment
variable which looks absolutely fine.
I'll close this one. Now we have to do
the installation of the packages. So if
you come back here we have to install
all of these packages and execute. So
what I will do I'll simply close this
one open up my terminal and right now
you can see I'm on the main directory
Solana chatdap in the main directory if
I show you my node version I have the
latest node version so there is no
problem it will work absolutely fine
with the latest node version so make
sure to check your node version if I
check my npm
version it's absolutely fine now what I
will do I simply going to install the
packages simply type npm I hit enter and
it's going to do the installation this
might takes a little bit time depending
on your internet speeds. So just wait
just let it be installed completely. You
can see the installation is started but
we getting this warning depreciated
depreciated. Simply ignore that it's not
that important. We are focusing on
stability. So just keep it as it is.
Don't need to make any changes in the
package version otherwise it's going to
fail. So don't run any one of these
command. Got it? Now I'm going to simply
clear up my terminal. Now we are done
with the installation and you will find
our node module is there. We have our
packages file. Now we are ready to start
our application. To start you can type
npm rundev and hit enter. Our
application will start on local host
3000. You can simply copy this one. You
can minimize from here or you can do it
just like this. But don't delete it. So
I'll minimize this. Now I'll come back
to my browser. I'll close all of this.
Open tab. Let's close this one because
we don't need this anymore. I'll come
back here. Paste this URL and hit enter.
And you will find that our application
is working absolutely fine. And this is
the account which is the admin and I'm
connected with. So I'll come back here.
You can see I'm on the account number
two which is not the admin. So I'll
simply come back here. Go back to
account number three. And this is the
account which I have used for deploying
the contract. And it has enough fun.
I'll simply reload the page and you will
find that I'm connected with the admin
account and here I'm getting an option
called initialize. And that's the first
thing you have to do. Once you deploy
your contract you have to initialize it.
So I'll simply click on this initialize
program and it's going to call the
function and it's going to start our
initialization. Click on this confirm
and it's going to perform the
transaction. Once the transaction will
complete you would have the dashboard
and now every single thing is ready.
User can come and they can create the
account. So first you as an ad have to
start and initialize the contract. So I
got the initialization. Now I'm ready to
create my account. So I'll simply click
here and I'm going to give my name. So
I'll say Dat Hussein. I'll click on this
create account and you have to create
your account transaction and once the
transaction will complete you will have
this dashboard and right now you can see
that there's no user if you click on
this add friend if you come back here
you are the only one there's no user so
you can have to register other other
user has to register into this
application then you can able to add
them into your friend but you can come
back to your profile and if you want to
update your image you can click here
select the image click on open and you
will find it's uploading and here we
have uploaded to the IPFS successfully
calling our smart contract and once you
call it you will find that our profile
is updated successfully.
So that's how you can update your
profile. Now what I will do I'll simply
come back here go back to the different
account and I will try to register one
more user from a different account. So
here you can see I haven't created
account from this that's why I'm getting
this one. I'll click on this create
account and I can select here. So I'll
say the chain coder and click on this
create account and again I have to
simply confirm the transaction and my
account would be created and I will have
the actions of the dashboard and now I
can able to make the friend. So you can
see I have created my account my profile
everything is looking good. Now if I
click on this add friend or you can do
it from here. If you come back to the
browser and you will find this is the
user is reflecting this is you and this
is the admin. So you can simply select
here you will see it will automatically
fill out all the details. Now click on
this add friend and it's going to make a
call and this user will be added as a
friend. So click on confirm and the
transaction is in the process. Here you
have added this user as a friend and you
will find in your friend list. So you
can simply select here and now you are
ready to send the message. So I'll say
copy this text and I can paste here and
click on this send and here you have to
perform two transactions. So let's click
on confirm.
and click on confirm because the reason
how smart contract work on the Solana
blockchain because this is a chat
application where you are performing the
chat between two user. So when you will
send the very first message after
becoming a friend you have to confirm
two transaction because in the first
transaction we are creating your pet
account which will build the relation
after that you can simply call one
function at one time to send the
messages. So if I try to call one more
time send this message it will have only
one transaction. Okay I hope you have
understood the logic of the smart
contract we have included. So this is
the very very straightforward logic we
have on the Solana chain. So before you
perform and register yourself you have
to perform the create a account into the
contract and perform the transaction. So
that's what we have. Now I can send the
media file. So I'll select here send
this media file and I can give the
details. Click on this send and it's
going to perform the transaction. And
the media file would be send
successfully. I'll click here, click on
this confirm and the transaction is
happening. And we have sent the media
file. In the same way, I can send the
video file. It's pretty easy. I can
select here, upload it. Or I can go with
this without text and send it. And it
will be sent to the user. And here it's
sending. Let's click on this confirm.
And the transaction is in the process.
And we have sent the video file. If you
want to send the audio file, it's pretty
easy. Select here. You can give your
description. Paste here. and it would be
sent successfully. Let's click on this
confirm and the transaction is completed
and you have sent the message and that's
all the messages which you will find. If
you come back here, if I go back to the
account number three which is the admin
which is receiving all the messages.
I'll give a reload and every single
thing would be updated. If you come back
here, you can see it's reflecting here.
Click here and you will find all the
messages he sent you. If you want to
reply it back then simply give your text
and you can simply send the message and
it's going to perform the transaction.
So let's click on this confirm and the
transaction is sent to the smart contact
and it's working fine. You can check
your profile one friend you have if you
are you are admin so I can simply click
here and you will find all the details
it's initialized this is the two user
all of things is looking great. So I
hope you have understood this is really
powerful every single feature is working
absolutely smoothly and this will help
you to understand that how you can build
complex structure of the smart contract
on decentralized ecosystem when it's
come to Solana and scalability. So I
hope you have understood that how you
have to perform all the transaction, how
you can become a friend, how you can add
a create your account, how you can send
the messages in multiple file. That's
all is there. That's all is there. So
that's the only thing I want to cover in
this video. I hope you have understood
the complete architecture. Soon the
complete project will come. So you can
follow it. But if you want to take the
final source code and faster your
development, you can come back to the
blockchain coder, get the final source
code and it will give you a valuable
contribution to my team. So this is the
really powerful project which you have
to include in portfolio to understand
the structure and understanding about
the smart contract in Rust programming
language and how you can deal with the
Solana blockchain and all the important
packages which you have to know as a
Solana blockchain developer. So that's
the only thing from my end in this
video. I hope you have understood every
single thing. If you have any question
any doubt let me in the comment section
or you can shoot an email to our
official email id. We'll provide you
more details around it. With that I'm
ending this video. Have a wonderful day.
Bye-bye.
Source Code: https://www.theblockchaincoders.com/sourceCode/build-and-deploy-a-full-stack-solana-blockchain-chat-dapp-or-next.js-+-rust-+-anchor-+-web3.js-or-solana-app-development Blockchain Course: https://bit.ly/Pro-NFT-Marketplace All Project Code: https://www.theblockchaincoders.com/SourceCode Donate Please: https://linktr.ee/daulathussain 1 - 1 Consultancy: https://www.theblockchaincoders.com/consultancy Pro Blockchain Courses: https://www.theblockchaincoders.com/ Public Discord: https://discord.gg/Gah6YGuBFS Build & Deploy a Full-Stack Solana Blockchain Chat DApp | Next.js + Rust + Anchor + Web3.js | Solana App Development In this project, we’ll build and deploy a Chat DApp on the Solana Blockchain using Next.js, Rust, Anchor, and Web3.js. You’ll learn how to create on-chain chat functionality, connect wallets, send and store messages securely on Solana, and interact with your smart contract directly from the frontend. 📌 Timestamps 00:00:00 ➤ Introduction 00:00:26 ➤ Overview 00:05:19 ➤ Features Demo 00:12:41 ➤ Starter File 00:13:43 ➤ Final Source Code 00:19:08 ➤ Deployment 00:23:18 ➤ Environment Variables 00:24:46 ➤ Installation 00:25:43 ➤ Testing Live 🚀 Tech Stack: - Solana Blockchain - Rust + Anchor Framework - Next.js (Frontend) - Web3.js / Solana Wallet Adapter 🔗 What You’ll Learn: - Set up and deploy Solana smart contracts - Build chat logic using Anchor - Integrate Phantom wallet for authentication - Store and display blockchain-based chat messages - Fully deploy your decentralized chat app #Solana #Web3 #Nextjs #Anchor #Rust #BlockchainDevelopment #DApp #SolanaChatApp #CryptoDevelopment #SolanaTutorial #Web3JS Save NFT Marketplace PlayList: https://youtube.com/playlist?list=PLWUCKsxdKl0olgEF4OxXVk2B-jwpGqL5d API PlayList: https://youtube.com/playlist?list=PLWUCKsxdKl0oAFAVuRZxQSYC07UTcl_v_ Solidity PlayList: https://youtube.com/playlist?list=PLWUCKsxdKl0oksYr6IG_wRsaSUySQC0ck Complete JavaScript Course: https://youtube.com/playlist?list=PLWUCKsxdKl0qROhA0XO4_ek9bIwZ4j4Xr HTML Course Code: https://www.daulathussain.com/complete-html-course-daulat-hussain/ =================== HOSTING ++++++++++++++++++++ Best Hosting: https://clients.domainracer.com/aff.php?aff=28826 Follow Me: Instagram: https://www.instagram.com/daulathussain92/ Facebook: https://www.facebook.com/daulat.hussain.18 Twitter: https://x.com/TheBCoders Pinterest: https://in.pinterest.com/daulathussainhealthfitness/ Linkedin: https://www.linkedin.com/in/daulat-hussain/ Quora: https://www.quora.com/q/schahkxkdudpgjvh Facebook Group: https://www.facebook.com/groups/59011 Facebook Page: https://www.facebook.com/yourdhfitness Subscribe to My Channel: https://www.youtube.com/channel/UCz6_...