Skip to content

Repository of decentralized DApps developed on blockchain with The Internet Computer. (Web3 Apps on the Internet Computer - full-stack applications)

Notifications You must be signed in to change notification settings

artursniegowski/Intro_to_WEB3_DApps_with_Internet_Computer

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

24 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

DApps — decentralized apps developed with The Internet Computer, which is a world computer blockchain that can host a social network or large enterprise system and removes the need for centralized IT.

This is a repository of projects exploring the development of decentralized apps with Internet Computer incorporating blockchain technology.

Documentation available online:

If you want to start working on your project right away, you might want to try the following commands:

cd hello/
dfx help
dfx canister --help

Running the project locally

If you want to test your project locally, you can use the following commands:

# Starts the replica, running in the background
dfx start --background

# Deploys your canisters to the replica and generates your candid interface
dfx deploy

Once the job completes, your application will be available at http://localhost:4943?canisterId={asset_canister_id}.

Additionally, if you are making frontend changes, you can start a development server with

npm start

Which will start a server at http://localhost:8080, proxying API requests to the replica at port 4943.

Note on frontend environment variables

If you are hosting frontend code somewhere without using DFX, you may need to make one of the following adjustments to ensure your project does not fetch the root key in production:

  • setNODE_ENV to production if you are using Webpack
  • use your own preferred method to replace process.env.NODE_ENV in the autogenerated declarations
  • Write your own createActor constructor

PROJECTS:

hello_01

This is the starter project from Internet Computer: https://internetcomputer.org/docs/current/developer-docs/quickstart/hello10mins. It simply renders text from the input HTML tag on the screen after pressing the button. This is a perfect place to start, set up your environment, and get familiar with the structure.

dbank_02

This is a banking app where the user starts with a deposit of $300 and can perform transactions by adding and taking out money. Each time the user performs a transaction, the sum will be adjusted together with a compound function that is dependent on the time between transactions; this is implemented on the backend side with Motoko to show how to add additional functionality and better understand the interaction between the frontend and backend with the development of DApps with Intern Computer.

dkeeper_app_03

This web app presents the option of making dynamic lists. On the home page, the user will see an input saying "Take a note..." and after navigating the cursor in this field, the note will expand and give the option for the user to fill in the title and the content of the note. With a plus button, the note can be added to the home page. Each note that was added can also be deleted with the "trash bin" button. This decentralized app shows how to connect frontend developed with React.js and backend developed in motoko (Interent Computer). All data is stored and manged on a canister, and after refreshing the website it will still be availabe because it is stored on the backend.

token_04

This web app represents an example of creating your own token and how to implement it on a blockchain with the Iternet Computer. The token name is Arturion, and it will have the basic functionality of receiving and transferring tokens. The supply of tokens is hardcoded at 1 billion, and all of it will be transferred to the owner at the start of the canister. Before we start using the program, we need to specify the principal id of the owner in the main.mo file! Next, we want to use the canister to transfer money / payouts to the authenticated users (faucet functionality), so after the canister is running, we have to transfer tokens (from the owner account) to it from the command line (as described in the section "Charge the Canister"). Every user who visits the website will have the option of getting authenticated with their Internet identity by DFINITY (https://www.youtube.com/watch?v=oxEr8UzGeBo&ab_channel=DFINITY). After creating an anchor and being authorized, the user will be allowed to collect 10,000 tokens by pressing the Gime Gime button (only once). Each user's information and balance will be stored on the ledger. These tokens will be transferred from the main canister. This website will also give the option of transferring the tokens to a different account, but we have to specify the principal ID of the account to transfer. This web app is a great example of how to build decentralized apps with Internet Comuter, utilizing the Motoko programming language on the back end and React.js on the front end, and authenticating users with Internet Identity. 

opentmarketplace_05

This project will imitate most of the functionality of the OpenSea website, where users can mint, list, and sell NFTs (non-fungible tokens) on ICP. It is basically like a NFT e-commerce site. It is a very complex project built with React.js on the frontend and Motoko and the Internet Computer on the backend. The final website, the "Open Market Place" has a lot of features. There is a section (route: /collection ) where we can view the NFTs that the user owns, and the user can sell these NFTs by clicking on "sell" and then setting a price in ARTURIONS, the ARTURION coin, which anyone can claim now from the previous project (these are the tokens created with the previous project token_04 - which is required to distribute the tokens and use them to buy on the website). Once these items are sold, you will be able to see them on the /discover route, where they are listed for people to buy. You cannot purchase an item that you have listed for sale, but you may purchase items owned by others. You will be able to only pay in ARTURION coins, and you will be able to purchase these individual NFTs, which you will then see. There is also the option of minting your own NFTs, which will result in a unique canister on the Internet Computer blockchain. The canisters will contain all of the data for your image file that you just minted. And once they are minted, you will be able to see them in your collection. You will have the option of keeping them or listing them for sale. This is a perfect example of creating canisters, buying and selling NFTs through the transfer of third party tokens (here we will use the ARTURION coins, that we created early on), and managing all of the e-commerce requirements of the website. In order to use this project, it is imperative that you first finish and make sure the previous project is working (token_04), because we will use the tokens (ARTURIONS) created in that project to buy NFTs on our website. The images you can mint are in the CryptoDunks folder; of course, you can add more. 

About

Repository of decentralized DApps developed on blockchain with The Internet Computer. (Web3 Apps on the Internet Computer - full-stack applications)

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published