Build and Deploy a Web 3.0 Cryptocurrency Exchange Decentralized Application

Рет қаралды 361,935

Күн бұрын

Master Web3 development by building Uniswap - a decentralized cryptocurrency exchange React application with metamask pairing, live smart contract data fetching, and most importantly, the ability to create your own ERC20 tokens, swap them and more!
⭐ Cranq - cranq.io
Become a Web3.0 Pioneer by Building an Advanced NFT Marketplace App:
💻 JS Mastery Pro - jsmastery.pro/youtube
✅ A special KZfaq discount code is automatically applied!
📙 The Web 3.0 Developer Roadmap
: resource.jsmastery.pro/web3.0...
📙 The Ultimate Solidity CheatSheet
: resource.jsmastery.pro/solidi...
📚 Materials/References:
GitHub Code (give it a star ⭐): github.com/adrianhajdin/proje...
Alchemy - www.alchemy.com/
Alchemy Faucet - goerlifaucet.com/
Contracts folder: minhaskamal.github.io/DownGit...
Starter src folder: minhaskamal.github.io/DownGit...
CRANQ Checkpoint 1: minhaskamal.github.io/DownGit...
CRANQ Checkpoint 2: minhaskamal.github.io/DownGit...
Create Your ERC20 Tokens: www.smartcontracts.tools/toke...
In this course, you’ll learn:
- React functional components and their reusability
- React file and folder structure
- We’ll use custom hooks and utility functions to manage the state of our application
- You’ll learn to create, compile and deploy your own smart contracts on the blockchain!
- You’ll achieve mastery using Tailwind and make the app responsive on all devices
- And most importantly, you’ll learn how to use Cranq, a graphical and intuitive IDE that’ll allow us to compile and deploy our smart contracts.
💻 Join JSM on Discord - / discord
🐦 Follow JSM on Twitter - / jsmasterypro
🖼️ Follow JSM Instagram - / javascriptmastery
💼 Business Inquiries: contact@jsmastery.pro
👇 Time Stamps
00:00:00 Intro
00:06:34 Cranq Setup
00:12:30 MetaMask Setup
00:15:05 Alchemy Setup
00:20:03 Cranq Part One - Factory
00:30:58 Cranq Part Two - Router
00:44:55 Cranq Part Three - Liquidity
00:54:49 Create Your ERC20 Tokens
01:10:39 Frontend Setup
1:19:54 Layout
1:41:54 Web3 Logic
2:08:41 Exchange, Inputs, and Balance
3:15:31 Deployment

Пікірлер: 602

@akp2082 Жыл бұрын

Much Awaited another WEB 3 project from Adrian .Thank you as always for putting such wonderful content again.

@javascriptmastery Жыл бұрын

Thank you!

@huydh Жыл бұрын

In one of your previous videos, I commented about the stock clips being distractive. Today I've you to say that I like your taste for video editing much better now. Your tutorials are more focus, meaningful and concise than ever before. Thank you for your hard work!!

@adimishra3046 Жыл бұрын

Was really looking for web3 projects and here it is!! Thank you so much Adrian ❤️ pls bring more web3 videos 🔥

@javascriptmastery Жыл бұрын

More to come!

@DevSwayam Жыл бұрын

Have you completed the whole project?

@cryptouncle848 Жыл бұрын

The way you explain is astonishing. So many aspects of the project to explain such a way that anyone can understand is a wonderful skill. Thank you very much for the video. Please keep the good work going.

@javascriptmastery Жыл бұрын

Thank you so much! It means a lot!

@estebanaguirre4550 Жыл бұрын

@exploringcrypto6609 Жыл бұрын

@Urahara25 Жыл бұрын

@@javascriptmastery " couldnt find the binary git"...when I typed yarn create eth-app ./

@weirdvidzz Жыл бұрын

@@Urahara25 same

@Vtrilla Жыл бұрын

Your tutorials have thought me more than my 4 years as a computer science ... thank you so much !!!

@ahmedmusawir Жыл бұрын

This is where I give up on Blockchain ... I was getting Solidity Coding, Smart Contracts, etc. from the previous courses ... but CRANQ went completely over my head ... If I have to use CRANQ to work with Blockchain, I will blow my brains out ...

@mikecodev Жыл бұрын

If someone is struggling with Cranq in ubuntu based distros (app starts and crashes) what worked for me was editing the .desktop file (sudo nano /usr/share/applications/cranq.desktop in pop_os 22.04) and modifying the Exec command adding two args (Exec=cranq --in-progress-gpu --no-sandbox %U) Found the solution using journalctl -r after cranq crash and googling the results. I belive it have something to do with nvidia drivers, not sure tho. Hope this helps somebody :) Thanks for these awesome tutorials Adrian!

@javascriptmastery Жыл бұрын

Thank you for sharing the insights, it's greatly appreciated!

@danstockercranq Жыл бұрын

Hi Mike, I'm Dan from CRANQ. Thanks for finding this issue - and especially for the workaround! 😎 We're looking into it, and it seems to have to do with the Electron version we're using. I'll post here once a fix is released.

@mikecodev Жыл бұрын

@@danstockercranq Hey Dan! Glad to hear that you are trying to fix it. And congratulations for your software!

@felsv4188 Жыл бұрын

Your tutorial is the best, very well technically explained and understood by beginners like me, your voice is superb as well, easy to understand and love listening to, doesnt disturb the flow of information being expressed!

@olaniranemmanuel2549 Жыл бұрын

So awesome Your builds are amazing and your teachings are on point. Love the way you break it down

@TheAprc1 Жыл бұрын

JSM, you’re the man, man! Super excited about this one, thanks again for these incredible uploads!!

@javascriptmastery Жыл бұрын

Thank you so much Adi!

@homerogazze1000 Жыл бұрын

Why doesn't this video get more recognition?! You are amazing, your explanations are very good and you have a lot of knowledge on the subject. I hope you can continue with these tutorials.

@user-qt2mg1de7m Жыл бұрын

Thank you🙏🏽

@user-qt2mg1de7m Жыл бұрын

Your questions can come in⬆️⬆️

@CharlesBLim Жыл бұрын

Much better this way, so we can take advantage and be ahead of the pack. lol, Yeah this video, and almost all his video is quite fascinating I find it hard to understand hooks in the past but his tutorials makes it easy for me to understand and follow along.

@wailik8783 Жыл бұрын

Never miss a single tutorial from you ! 🙌🏻 Thank you so so much sir !

@javascriptmastery Жыл бұрын

Always welcome

@yyxx9309 Жыл бұрын

MAN, Why are you so goooood!!!! LOVED making this app with you & learnt so much!!

@edzonperez3604 Жыл бұрын

I always wanted to learn a little about Web3, but the tutorials are hard to follow, thanks again Adrian for sharing your knowledge with us, you are the best

@javascriptmastery Жыл бұрын

Thank you! 😊

@id104335409 Жыл бұрын

Nobody in the comments said anything about Cranq???? Very hard to take that in. I wanted to know what people think about it? Yes, no? To me it is like going in class for a test and realizing you were studying all day from the wrong books. Just when I thought I found the first 100% complete video on the subject you come out and say Hey, I have a new interesting way to write contracts. It makes it incompatible with all the other videos teaching people how to use Ethers.js hardhat etc.

@alhaadiofficial9532 Жыл бұрын

I discovered this Chanel at beginning of my coding journey, and it really helped me so much

@w3cs598 Жыл бұрын

In CRANQ, whenever you put a string in quotes (" ") in the KEY of an item getter node, the program fails to run. But if you just type in the name of the key without quotes, the program will run as usual. This is just something to look out for, which might also help others who may run into similar problems.

@riturajchoudhary8408 9 ай бұрын

thanks bro, it really helped me

@shubhangimishra6696 9 ай бұрын

thankyou it helped a lottttttt

@iilhamriz Жыл бұрын

Awesome, we need more tutorial web3, nft minting, dex, marketplace and more, thankyou JSM

@user-ec6ib5qc5q Жыл бұрын

Great job!! Your efforts to create content about new techs are top, as always.

@javascriptmastery Жыл бұрын

Thank you!

@praveen_sinnur Жыл бұрын

I`m sure I`ll be landing my dream job by this year end, thank you my master for your valuable tutorials.

@mustafatahir5240 Жыл бұрын

Its brilliant. Waiting for ur next video. Really its amazing . It includes advance level concept which explained very simply. Thanks and stay blessed

@Inter-Blockchain-Services Ай бұрын

Galactica Network is pushing the boundaries of privacy and governance in the Web3 space, marking a significant shift in our approach to digital sovereignty. The Cypher Book is not just an innovative tool but a true passport to a future where our identity and data remain entirely under our control. Eager to see how this technology will evolve and revolutionize our online interactions. Kudos to the entire Galactica team for this remarkable breakthrough

@lordphemstar Жыл бұрын

This is what i have been looking for all these while.. Appreciate your work bro... Thanks so much for sharing this information with us.. Blessings 👏 👏

@javascriptmastery Жыл бұрын

My pleasure

@dhoscodhoscovi2957 4 ай бұрын

I am not sure why this account is not in explosive mode. You're the top g my guy. I appreciate your contrib to the society!

@CHINGAZOS Жыл бұрын

The only place I go for expert teaching, mind expanding !

@ktahir000 Жыл бұрын

Just what I needed. Perfect as always.

@ayushdedhia25 Жыл бұрын

Another banger web3 project 🔥 that's awesome 🙏🏻 Thank You JSM :-)

@javascriptmastery Жыл бұрын

More to come!

@riverplate2537 Жыл бұрын

Please keep posting tutorials related to web 3.0, your content is gold!

@user-qt2mg1de7m Жыл бұрын

🙏🏽

@user-qt2mg1de7m Жыл бұрын

Your questions can come in⬆️⬆️⬆️

@wilsonmela6343 Жыл бұрын

Wow wow wow, this is a must do project for me. So excited. Thank you Adrian.

@javascriptmastery Жыл бұрын

Hope you enjoy it!

@mounir101 11 ай бұрын

This is absolutly priceless and I'm confused how to thank you. JM. BTW. I like your tuts so much.

@joshsanders2479 Жыл бұрын

I love React + Tailwind CSS tutorial like this one. It is awesome.

@laksh.a.y Жыл бұрын

Ayeee I was waiting for this Thank you so much man

@javascriptmastery Жыл бұрын

Thanks! 😊

@rathodsandeep32 Жыл бұрын

Your efforts, your work,can be seen in us.

@v.demchenko Жыл бұрын

Thank you! Man, your channel is amazing.

@achyuthreddy7335 Жыл бұрын

Your way of explaining is awesome...♥️

@Victor-wh9bs Жыл бұрын

Wooow. Super impressed. Everything explain understandable way.🔥 Thanku so much. I love this yt channel ❤

@javascriptmastery Жыл бұрын

My pleasure 😊

@balogunkings2769 Жыл бұрын

JSM, your works are top tier. I love them. With Love From Nigeria.

@javascriptmastery Жыл бұрын

Thank you so much!

@brx-hashcode Жыл бұрын

I’ve thought that I’m the first 😅😅. Level up JSM 🚀

@javascriptmastery Жыл бұрын

Thank you! ❤️

@ethereumhitman9518 Жыл бұрын

YOU are a live saver. i’ve been losing it trying to find one that works, and this one did. thankyou so much

@w3cs598 Жыл бұрын

Congrats on getting it to work. Did you run into the issue at 1:36:00 where the Connect Wallet button was unable to be clicked? Something is blocking the button from being clicked. The cursor is not changing to pointer either 😢

@josephboyadjian6965 Жыл бұрын

Your know-how is just amazing, I learned so much through your videos thank you !

@nonchain Жыл бұрын

Thanks for sharing your knowledge for FREE Man you really changed my life with those tutorials YOU ARE AWESOME

@javascriptmastery Жыл бұрын

Thank you!! ❤️

@sumanbhattacharjee5017 Жыл бұрын

This is the video I was waiting for long time

@ashishupadhyay938 Жыл бұрын

I was waiting for your video eagerly thank you it helped me for making my project

@javascriptmastery Жыл бұрын

Thank you! 😊

@kamalchan9756 Жыл бұрын

congrats for 400K bro and you are the best love you

@javascriptmastery Жыл бұрын

Thank you! ❤️

@thebks1 Жыл бұрын

Please make more of the web3 videos as it is helping me a lot in my on personal project. Thank You soo much for putting out such amazing work for free.

@user-qt2mg1de7m Жыл бұрын

You’re welcome 🙏🏽

@user-qt2mg1de7m Жыл бұрын

Send a direct message to lay complaints or ask questions🙏🏽

@jiraiyasensei1914 Жыл бұрын

Came at the right time. Thanks a lot for this!

@javascriptmastery Жыл бұрын

Enjoy!

@letscode8320 Жыл бұрын

Just Amazing, I have no word for your expression

@mahadabdurahman Жыл бұрын

I love you man.. so much knowledge at the write time. Thanks 🙏🙏

@javascriptmastery Жыл бұрын

I appreciate that!

@alisufiyan5133 Жыл бұрын

The Content on Web 3.0 really sets you higher from other youtubers, always great content

@javascriptmastery Жыл бұрын

Thank you! 😊

@tshepomasilo4188 29 күн бұрын

WOW! this is a mind blowiing tutorial ever

@chops1352 Жыл бұрын

bro havent even started but so excited to spend the weekend doing this!!

@javascriptmastery Жыл бұрын

Awesome, enjoy!

@waifufx Жыл бұрын

YOU SEE, That is why I like JSM there is always update of video after some days or weeks now he is at 400k+. I can wait to get a job under these principles i have learnt from you Thank you JSM.

@javascriptmastery Жыл бұрын

More to come!

@waifufx Жыл бұрын

@@javascriptmasteryYes Sir Respect Sir

@SanjayKumar-ru5vm Жыл бұрын

Last video I asked for this and you said, more videos are coming soon!. And now it's here thanks alot mate❤

@anmolsen2409 Жыл бұрын

great video but have an error while running cranq...in factory compilation and deployment . When we drill down it has an error in multiplexer and deploy contract .Even after importing your cranq checkpoin1 and changing config .

@danstockercranq Жыл бұрын

Hi, we found that this is an error in the logger, the contracts should deploy regardless. If the rest of the top-level nodes are green, and the contracts show up on Etherscan, you're good to go. We're fixing the multiplexer issue in the meantime.

@aderemiabiodunyusuf9511 Жыл бұрын

Great! Your videos and work are amazingly awesome 😎 and world class.

@javascriptmastery Жыл бұрын

Thank you very much!

@MuhammadHussain-codr 6 ай бұрын

Love your videos 🚀❤. Thank you so much!

@VixGuyOfficial Жыл бұрын

AMAZING tutorial! Who else are getting errors in CRANQ (in "compile and deploy Factory" and "compile and deploy Router" nodes)? The whole program in CRANQ is still able to run and finish with corrrect confirmation on Ethscan. But those two nodes are red instead of green. Anyone has similar issues?

@adeyemiadetomiwa6231 Жыл бұрын

@Máté Bodor Experiencing the same error here, it from the contract input in Multiplexer node

@ahmedharoun1991 Жыл бұрын

Awesome video, man!

@abzmantawil Жыл бұрын

another fantastic tutorial. Thnaks for giving it free for us.👍👍👍

@javascriptmastery Жыл бұрын

Glad you like it! 😊

@miqannn8526 Жыл бұрын

I love the way you teach and explain to people how to do a Uniswap. But can you do more about this topic like "Add liquidity to pool for swapping tokens"? I really hope that you can teach me as everyone here! Thank you so much sir.

@user-qt2mg1de7m Жыл бұрын

Thank you🙏🏽 you can send a direct message ⬆️⬆️⬆️

@mehrdad1068 Жыл бұрын

Thank you for teaching this new knowledge🌱💚

@javascriptmastery Жыл бұрын

You are so welcome

@EfosaMichael Жыл бұрын

You know the drill... like, then watch! This guy is... AWESOME!!

@javascriptmastery Жыл бұрын

Wow, thanks!

@0xSLN Жыл бұрын

Many impressive tools! 🙏

@sohanbanerjee9029 Жыл бұрын

I'm facing this problem, can anyone help me out with this. Factory compilation error { "error": "Returned error: insufficient funds for gas * price + value" }

@roshanraturi1040 Жыл бұрын

Same

@sakugacodeworks Жыл бұрын

If you're having an error with yarn commands try running powershell as an administrator then typing: Set-ExecutionPolicy -ExecutionPolicy RemoteSigned It fixed the error for me

@amitp05 Жыл бұрын

Great explanation and implementation!!!👍

@javascriptmastery Жыл бұрын

Thank you!

@speedy-wk7fu Жыл бұрын

Never fail to amaze bro thanks bro

@jopadjr Жыл бұрын

5.3k+...Thanks. Great work !!!

@czarscrib3680 Жыл бұрын

You're always on time, you're the best

@javascriptmastery Жыл бұрын

Thank you!

@sparkzgaming9038 Жыл бұрын

Please make a series or a video on Frontend. Make a series that master us as a Frontend developer! Love your work❤️

@user-nc7bt6cb7m Жыл бұрын

Omg. I waited for this!

@javascriptmastery Жыл бұрын

You got it! :)

@yellowbear6485 Жыл бұрын

yo tysm for these videos

@yassiribrahim7521 Жыл бұрын

Phenomenal as usual

@s1dev Жыл бұрын

How to add more tokens to swap like USDT, AVAX, SOL, ADA etc

@abelmarkos5753 Жыл бұрын

Hell js mastery and thank you for the great content It will be very nice if you do some more MERN Tutorial

@dailycashloot 2 ай бұрын

Sir Cranq Website is different What i have seen in your video

@nehat786 Жыл бұрын

This going to be amazing sir and I was waiting this kind of course react with blockchain

@javascriptmastery Жыл бұрын

I'm glad to hear that, enjoy!

@nehat786 Жыл бұрын

Love you sir! May Allah bless you with long and happy life.

@haonline012 11 ай бұрын

nice information. i hope i can do that. thank you so much

@louayzaara1238 Жыл бұрын

Man you really changed my life with those tutorials & helped me build a great portfolio that can grant me a job

@javascriptmastery Жыл бұрын

I'm so glad to hear that! 😊

@poznianski Жыл бұрын

The author is amazing man. Thank you!

@javascriptmastery Жыл бұрын

Thanks!

@frkx235 Жыл бұрын

Great Content Again! Thanks

@javascriptmastery Жыл бұрын

Appreciate it!

@CopperEngineerEs Жыл бұрын

Amazing tutorial ❤❤❤

@wordword7184 Жыл бұрын

Best KZfaq channel on earth 🌎 Road to 1M subs

@javascriptmastery Жыл бұрын

Thank you! 😊

@lem0n83 Жыл бұрын

Your voice and the way you explain is crazy! Really good job. Can you maybe explain how to start with css? I’m learning in the last 2 weeks html but with css im still struggling..

@user-qt2mg1de7m Жыл бұрын

Helpline📲📥⬆️ Questions can come in⬆️

@user-hj5xs5tm2z Жыл бұрын

Who can help with listing on exchanges?

@katherineemelianova6044 Жыл бұрын

we worked with listing help

@tommygialosai9701 Жыл бұрын

I've been trying to get to understand soft Production and a DAW with a guide that's not made more complicated and tNice tutorials Nice tutorialts the right

@LeonGamingZone Жыл бұрын

The best! Hugs from brazil!

@javascriptmastery Жыл бұрын

Hugs to Brazil!

@malikforz9490 Жыл бұрын

that cranq file saved me from abandoning the project lol ! thank you so much !

@muzammil_makandar8347 18 күн бұрын

Can you acknowledge how the cranq works?

@willygonzal3z 8 ай бұрын

Awesome video, I learn a lot with, now I try to reply 👏👏👏

@chokdeesam2365 Жыл бұрын

Amazing content !!

@javascriptmastery Жыл бұрын

Thanks! :D

@sakibcoder Жыл бұрын

channel deserve 1M sub

@javascriptmastery Жыл бұрын

Thank you!

@shahzaibkhan8971 Жыл бұрын

Smash that like button guys we need another tutorial from JSM 💙

@deanshaked Жыл бұрын

Hi there, Thank you for the awesome project, it's a bit far-fetched for me but it encouraged me to explore things I didn't know :) By the way, check out 1:56:55 You call a factoryInfo property that doesn't exist, I've even sampled from your repo and it's the same over there 😅

@saqibaltaf5318 Жыл бұрын

hi you have code for this video?

@Freelifetraveling779 Жыл бұрын

on section 25:03mn i am RUN than error on " Input data contains invalid value for 'settings'. Please check type! " What should i solve this problem please?

@singh2202 Жыл бұрын

excellent work

@DevSwayam Жыл бұрын

Level up JSM 📈

@hussamalhinaty2340 Жыл бұрын

Amazing effort 👌

@javascriptmastery Жыл бұрын

Appreciate it!

@jonathanbriceno3865 Жыл бұрын

Extraordinary video Master. I admire you a lot, I have learned a lot since I watch your videos, I hope to have your level someday. You could make a clone of the tesla page, it would be great to see your approach on that project. Greetings from Venezuela.