Skip to content

Cyfrin/full-stack-web3-cu

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

15 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

Fullstack Web3 & Blockchain, AI Vibe Coding - Beginner to Expert Crash Course

Learn javascript, the tooling needed for a web3 dapp, the power to win a hackathon, and level up your career

Stargazers Forks Contributors Issues GPLv3 License

This repository houses course resources and discussions for the course.

Please refer to this for an in-depth explanation of the content:

  • Website - Join Cyfrin Updraft and enjoy 50+ hours of smart contract development courses
  • Twitter/X - Stay updated with the latest course releases
  • LinkedIn - Add Updraft to your learning experiences
  • Discord - Join a community of 3000+ developers and auditors
  • Newsletter - Weekly security research tips and resources to level up your career
  • Codehawks - Smart contracts auditing competitions to help secure web3

Cyfrin Updraft Courses:

  • Coming soon...

Table of Contents

What will you learn?

  • How to vibe code your way to victory
  • Build an MVP of a full-stack web3 application good enough to win a hackathon

Prerequisites

Requirements

  • Blockchain basics Cyfrin Updraft Course
    • You've downloaded MetaMask
    • You understand what a blockchain is
    • You understand what a smart contract is

Nice to have

  • Some javascript experience
  • Some solidity experience (Solidity 101)
  • Some AI prompting experience

Tools

Tools we cover in this course

Support

AI Frens

Top picks:

Also good:

Best Practices

  • Follow the repository: While going through the course be 100% certain to follow along with the github repository. If you run into an issue check the chronological-updates in the repo.
  • Be Active in the community: Ask questions and engage with other developers going through the course in the discussions tab, be sure to go and say hello or gm! This space is different from the other industries, you don't have to be secretive; communicate, network and learn with others :)
  • Learn at your own pace: It doesn't matter if it takes you a day, a week, a month or even a year. Progress >>> Perfection
  • Take Breaks: You will exhaust your mind and recall less if you go all out and watch the entire course in one sitting. Suggested Strategy every 25 minutes take a 5 min break, and every 2 hours take a longer 30 min break
  • Refer to Documentation: Things are constantly being updated, so whenever Patrick opens up some documentation, open it on your end and maybe even have the code sample next to you.
  • Use ChatGPT and/or the course chat

Sections

Section 1: HTML/JS - Buy Me A Coffee

πŸ’» Code: https://github.com/Cyfrin/html-ts-coffee-cu

A minimal app where we show you the basics of building a website to interact with web3!

Challenges

  1. Write down why you want to take this course
  2. Create a button that console.log's the response of getAddressToAmountFunded

Section 2: React/NextJS Static Site - Token Airdropper UI

πŸ’» Code: https://github.com/Cyfrin/ts-tsender-ui-cu

A completely static app you can deploy to IPFS or Fleek to interact with a smart contract! This is actually a live site as well!

Challenges

  1. Add quality of life features to the app:
    1. Should have a little spinner while the app is both sending a transaction to the chain, and has MetaMask popped up
    2. Should save to local storage the inputs (so when someone refreshes, they don't lose their inputs)
    3. Should have a little box at the bottom for details about the token
  2. Deploy your site to fleek!
    1. Tweet it out!

Site: t-sender.com

Section 3: React/NextJS Dynamic Site - NFT Marketplace

πŸ’» Code: https://github.com/Cyfrin/ts-nft-marketplace-cu

A dynamic site where we teach you how to interact with services with your app, like:

And more!

Challenges

  1. Deploy your DYNAMIC site to fleek
  2. Add your own feature to the app!

(back to top) ⬆️

Congratulations

🎊🎊🎊🎊🎊🎊🎊🎊🎊🎊🎊🎊 Completed all The Course! 🎊🎊🎊🎊🎊🎊🎊🎊🎊🎊🎊🎊

Where do I go now?

Learning More

Community

Hackathons

Be sure to check out project grant programs!

And make today an amazing day!

(back to top) ⬆️

Disclosures

Transparency is important! So we want to disclose any potential conflicts that might have affected my judgement so you can pick tools that are right for you. Patrick is co-founder of Alpha Chain, a blockchain infrastructure company. Alpha Chain runs Chainlink, Ethereum, Binance, Polygon, Harmony, Solana, Moonbeam, and Moonriver blockchain services. Patrick is the co-founder of Cyfrin, and they do smart contract security & auditing services. Patrick is also the co-founder of Chain Accel, who is an advisor on the Peeranha project.

Because of all this, I have added alternatives to each section where we suggest a tool.

Sponsors

A huge thank you to our sponsors. These are the groups and technologies:

(back to top) ⬆️

Thank you

Thanks to everyone who is taking, participating in, and working on this course. It's been a passion project and a data dump of everything I've learnt in the web3 space to get you up to speed quickly. Also, a big thank you to Cyfrin & Chain Accel for encouraging this course to come to light, and many, many, many people from the community.

And thanks to the Cyfrin team for making this possible!

License

Cyfrin Updraft content is open-sourced licensed as GPLv3.

Cyfrin Twitter Cyfrin YouTube Cyfrin LinkedIn

(back to top) ⬆️