Search
Generic filters
Share on facebook
Share on twitter
Share on linkedin

Moralis Projects – Learn to Build a Web3 Airbnb Clone

Welcome to this week’s installment of Moralis Projects!

If you didn’t already know, Moralis Projects represent the best way to build Web3 apps. You can build alongside the community and claim your NFT reward in our Moralis Projects Discord after completing your project! New Moralis Projects drop every Saturday.

This week, we’ll be walking you through how to create a Web3 Airbnb clone!

https://www.youtube.com/watch?v=rj-Mb-xz1Os

First Steps

This week’s Moralis Project will be premiering April 7th on YouTube. Be sure to go like the video and subscribe to the channel to get notified of all future premiers. All necessary steps to build your Web3 Airbnb clone will be outlined in the video.

Prerequisites

  1. Web Programming using ReactJS
  2. Knowledge of and experience using wallet like MetaMask
  3. Basic Solidity Understanding (you can learn this on the go)

This Week’s Challenge – Web3 Airbnb Clone

This week’s Project will have you building a decentralized alternative for Airbnb. Utilizing the Web3 UIKit, React and Google Maps you will build a frontend clone that looks and feels like the Airbnb website. You will also create your very own smart contract to store the details of rentals and handle purchase of any new bookings on the blockchain of your choice. To connect your react app and smart contract you will be using Moralis for smart contract syncing, executing smart contract functions and storing details in the DB for easy access.

Need Help?

There is an official Discord channel on the Moralis Discord Server dedicated to  each Moralis Project. This channel can be used to connect with others building each week’s projects, to ask questions, and present your builds. There will be a Moralis Tech Support wizard helping out as well if you’ve got any questions or need any assistance.

Be sure to join the Discord server to take part in the conversation! 

Then be sure to set up notifications in projects-notifications and jump into this week’s channel; #web3-airbnb.

If you prefer, the Moralis Forum we also have a designated thread for this week’s build, for more comprehensive discussion.

Can You Improve Our Projects?

All Moralis Projects are starter tutorials designed to give you a strong push in the right direction on your Web3 development journey. Also, if you want to go even further and build a more ambitious project based on what you learned in a Moralis Project, we highly encourage it!

If you find mistakes in any Moralis Projects, feel free to share them with the community and even suggest merge requests in the final build repos, to get you some extra brownie points.

How to Get Started

The starter code required for this week’s build may be cloned from the youtube-tutorials GitHub Repository.

git clone https://github.com/MoralisWeb3/youtube-tutorials.git

After cloning the repo, be sure to navigate to the correct folder.

https://codepen.io/rashmosh/pen/VwyVvwr

And finally you can install all the project dependencies by running the command

cd youtube-tutorials
cd Airbnb-starter
Yarn 

If you want to have a browse at the final build (including the solidity contract and moralis sync event instructions) you can find it by following this link.

Graduation 

Now, you’re ready to rock and follow along the tutorial! Make sure that you’ve joined our Discord, and feel free to ask if you’ve got any questions! If you complete the project, you’ll be able to claim a special Moralis Buidler Airbnb NFT, from the community engineers on Moralis Discord! And it would be silly to not boast about it on social media.

April 15, 2022
Moralis Blog
Moralis Blog
Become a Moralis Mage
Get the latest information about Moralis Web3 in your email
Search
Generic filters
Related Articles
Become a Web3 Expert
Subscribe to our newsletter and get our E-book Web3 Speed run for FREE