Build and Deploy a Web 3.0 Cryptocurrency Exchange Decentralized Application

Поділитися
Вставка
  • Опубліковано 30 кві 2024
  • 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 UA-cam 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

КОМЕНТАРІ • 614

  • @huayan
    @huayan Рік тому +7

    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!!

  • @Vtrilla
    @Vtrilla Рік тому

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

  • @wailik8783
    @wailik8783 Рік тому +10

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

  • @cryptouncle848
    @cryptouncle848 Рік тому +55

    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.

  • @adimishra3046
    @adimishra3046 Рік тому +9

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

  • @aadilmohammed9759
    @aadilmohammed9759 Рік тому +25

    Found your channel today and I have to admit I'm impressed. I was always lost on what path I should take to get to what I want to become. Now my goals have been set straight and I'm sure ill land a job and earn my bread and butter thanks to you.

    • @javascriptmastery
      @javascriptmastery  Рік тому +1

      Awesome. Enjoy! 😊

    • @Urahara25
      @Urahara25 Рік тому

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

  • @akp2082
    @akp2082 Рік тому +6

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

  • @olaniranemmanuel2549
    @olaniranemmanuel2549 Рік тому +1

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

  • @homerogazze1000
    @homerogazze1000 Рік тому +9

    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
      @user-qt2mg1de7m Рік тому +1

      Thank you🙏🏽

    • @user-qt2mg1de7m
      @user-qt2mg1de7m Рік тому +1

      Your questions can come in⬆️⬆️

    • @CharlesBLim
      @CharlesBLim Рік тому +1

      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.

  • @ahmedmusawir
    @ahmedmusawir Рік тому +3

    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 ...

  • @felsv4188
    @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!

  • @TheAprc1
    @TheAprc1 Рік тому +3

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

  • @mikecodev
    @mikecodev Рік тому +7

    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
      @javascriptmastery  Рік тому +2

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

    • @danstockercranq
      @danstockercranq Рік тому +4

      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
      @mikecodev Рік тому +1

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

  • @edzonperez3604
    @edzonperez3604 Рік тому +6

    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

  • @praveen_sinnur
    @praveen_sinnur Рік тому +4

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

  • @alhaadiofficial9532
    @alhaadiofficial9532 Рік тому

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

  • @user-ec6ib5qc5q
    @user-ec6ib5qc5q Рік тому +3

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

  • @ktahir000
    @ktahir000 Рік тому +1

    Just what I needed. Perfect as always.

  • @joshsanders2479
    @joshsanders2479 Рік тому

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

  • @CHINGAZOS
    @CHINGAZOS Рік тому +1

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

  • @iilhamriz
    @iilhamriz Рік тому +2

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

  • @dhoscodhoscovi2957
    @dhoscodhoscovi2957 4 місяці тому +1

    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!

  • @riverplate2537
    @riverplate2537 Рік тому +4

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

  • @yyxx9309
    @yyxx9309 Рік тому +1

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

  • @rathodsandeep32
    @rathodsandeep32 Рік тому

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

  • @wilsonmela6343
    @wilsonmela6343 Рік тому +1

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

  • @mustafatahir5240
    @mustafatahir5240 Рік тому

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

  • @lordphemstar
    @lordphemstar Рік тому +4

    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 👏 👏

  • @v.demchenko
    @v.demchenko Рік тому

    Thank you! Man, your channel is amazing.

  • @josephboyadjian6965
    @josephboyadjian6965 Рік тому

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

  • @ethereumhitman9518
    @ethereumhitman9518 Рік тому +1

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

    • @w3cs598
      @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 😢

  • @laksh.a.y
    @laksh.a.y Рік тому +1

    Ayeee I was waiting for this Thank you so much man

  • @ayushdedhia25
    @ayushdedhia25 Рік тому +4

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

  • @thebks1
    @thebks1 Рік тому +3

    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.

  • @mounir101
    @mounir101 10 місяців тому

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

  • @mahadabdurahman
    @mahadabdurahman Рік тому +1

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

  • @chops1352
    @chops1352 Рік тому +1

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

  • @jiraiyasensei1914
    @jiraiyasensei1914 Рік тому +1

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

  • @Victor-wh9bs
    @Victor-wh9bs Рік тому +1

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

  • @letscode8320
    @letscode8320 Рік тому

    Just Amazing, I have no word for your expression

  • @achyuthreddy7335
    @achyuthreddy7335 Рік тому

    Your way of explaining is awesome...♥️

  • @ashishupadhyay938
    @ashishupadhyay938 Рік тому +1

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

  • @Inter-Blockchain-Service
    @Inter-Blockchain-Service 28 днів тому

    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

  • @malikforz9490
    @malikforz9490 Рік тому

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

  • @balogunkings2769
    @balogunkings2769 Рік тому +1

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

  • @jopadjr
    @jopadjr Рік тому

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

  • @sumanbhattacharjee5017
    @sumanbhattacharjee5017 Рік тому

    This is the video I was waiting for long time

  • @louayzaara1238
    @louayzaara1238 Рік тому +2

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

  • @id104335409
    @id104335409 Рік тому +2

    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.

  • @mehrdad1068
    @mehrdad1068 Рік тому +1

    Thank you for teaching this new knowledge🌱💚

  • @kamalchan9756
    @kamalchan9756 Рік тому +1

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

  • @miqannn8526
    @miqannn8526 Рік тому +1

    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
      @user-qt2mg1de7m Рік тому

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

  • @0xSLN
    @0xSLN Рік тому +1

    Many impressive tools! 🙏

  • @w3cs598
    @w3cs598 Рік тому +17

    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.

  • @sparkzgaming9038
    @sparkzgaming9038 Рік тому

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

  • @nonchain
    @nonchain Рік тому +5

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

  • @waifufx
    @waifufx Рік тому +3

    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.

  • @tommygialosai9701
    @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

  • @EfosaMichael
    @EfosaMichael Рік тому +1

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

  • @MuhammadHussain-codr
    @MuhammadHussain-codr 5 місяців тому

    Love your videos 🚀❤. Thank you so much!

  • @abzmantawil
    @abzmantawil Рік тому +1

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

  • @aderemiabiodunyusuf9511
    @aderemiabiodunyusuf9511 Рік тому +1

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

  • @speedy-wk7fu
    @speedy-wk7fu Рік тому

    Never fail to amaze bro thanks bro

  • @abelmarkos5753
    @abelmarkos5753 Рік тому +2

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

  • @amitp05
    @amitp05 Рік тому +1

    Great explanation and implementation!!!👍

  • @VixGuyOfficial
    @VixGuyOfficial Рік тому +4

    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
      @adeyemiadetomiwa6231 Рік тому

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

  • @poznianski
    @poznianski Рік тому +1

    The author is amazing man. Thank you!

  • @alisufiyan5133
    @alisufiyan5133 Рік тому +5

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

  • @haonline012
    @haonline012 10 місяців тому

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

  • @nehat786
    @nehat786 Рік тому +1

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

    • @javascriptmastery
      @javascriptmastery  Рік тому +1

      I'm glad to hear that, enjoy!

    • @nehat786
      @nehat786 Рік тому

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

  • @yellowbear6485
    @yellowbear6485 Рік тому +1

    yo tysm for these videos

  • @czarscrib3680
    @czarscrib3680 Рік тому +2

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

  • @ahmedharoun1991
    @ahmedharoun1991 Рік тому

    Awesome video, man!

  • @user-nc7bt6cb7m
    @user-nc7bt6cb7m Рік тому +1

    Omg. I waited for this!

  • @CopperEngineerEs
    @CopperEngineerEs Рік тому

    Amazing tutorial ❤❤❤

  • @yassiribrahim7521
    @yassiribrahim7521 Рік тому

    Phenomenal as usual

  • @deanshaked
    @deanshaked Рік тому +2

    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 😅

  • @sakugacodeworks
    @sakugacodeworks Рік тому +1

    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

  • @sky78710
    @sky78710 Рік тому +1

    Thank you for your effort .. please take us also to using typescript to create reusable components in react

  • @jonathanbriceno3865
    @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.

  • @brx-hashcode
    @brx-hashcode Рік тому +26

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

  • @shahzaibkhan8971
    @shahzaibkhan8971 Рік тому

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

  • @lem0n83
    @lem0n83 Рік тому +2

    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
      @user-qt2mg1de7m Рік тому

      Helpline📲📥⬆️
      Questions can come in⬆️

  • @oscarblasio8247
    @oscarblasio8247 Рік тому

    Genius Adrian💪💪💪🇹🇿

  • @DepthBySoul
    @DepthBySoul Рік тому

    this is amazing.

  • @frkx235
    @frkx235 Рік тому +1

    Great Content Again! Thanks

  • @cryptic_007
    @cryptic_007 Рік тому +1

    OMG!!! You're the best Man

  • @fMeyer8
    @fMeyer8 Рік тому +1

    Wow, web3 proj back!!!!!! 😍

  • @imvivekkushwaha
    @imvivekkushwaha Рік тому +2

    Yaa your web3 projects are osm

  • @willygonzal3z
    @willygonzal3z 7 місяців тому

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

  • @codenoob223
    @codenoob223 Рік тому

    You must made like 500k per year to release such a master piece for free :O

  • @singh2202
    @singh2202 Рік тому

    excellent work

  • @jackpaperhands
    @jackpaperhands Рік тому

    What a legend

  • @LeonGamingZone
    @LeonGamingZone Рік тому +1

    The best! Hugs from brazil!

  • @thithanham655
    @thithanham655 11 місяців тому

    Thank you

  • @DevSwayam
    @DevSwayam Рік тому

    Level up JSM 📈

  • @chokdeesam2365
    @chokdeesam2365 Рік тому +1

    Amazing content !!

  • @SanjayKumar-ru5vm
    @SanjayKumar-ru5vm Рік тому +1

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

  • @hussamalhinaty2340
    @hussamalhinaty2340 Рік тому +1

    Amazing effort 👌

  • @bobparker4404
    @bobparker4404 Рік тому

    thank you