JS GameDev Summit

JS GameDev Summit 2022

Web3 gaming enables decentralized identity and finance, allowing game developers to bypass centralized platforms. It is driven by wallets, ERC20 tokens, and NFTs. Web3 games focus on collaborative world-building, ownership, and open-source collaboration. The challenge is achieving decentralization while addressing economic and technological limitations. Web3 aims to redefine the gaming industry by using economic tools and exploring new genres like RPG and RTS games.

Web 3 Gaming: What it is and Why it Matters

Paul Gadi

React Advanced

React Advanced 2021

This workshop covers building a React dApp and programming payments in smart contracts. It explores Web3 technology, Rweave protocol, Solana network, and Metamask. Participants learn to install dependencies, set up a Hard Hat environment, and deploy contracts to a local network. They also interact with the Ethereum network, deploy token contracts, and send tokens using MetaMask. The workshop highlights the use cases of blockchain technology, the permanence of data on the blockchain, and the potential for crypto integration in gaming and social media platforms.

In this workshop, you'll learn how to build your first full stack dapp on the Ethereum blockchain, reading and writing data to the network, and connecting a front end application to the contract you've deployed. By the end of the workshop, you'll understand how to set up a full stack development environment, run a local node, and interact with any smart contract using React, HardHat, and Ethers.js. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

Web3 Workshop - Building Your First Dapp

Nader Dabit

React Summit

React Summit 2024

Juno is a platform that replicates cloud serverless concepts on the blockchain, providing authentication, data storage, file storage, hosting, analytics, and serverless functions. The workshop covers the process of creating an account, initializing projects and satellites, implementing user sign-in and authentication, data storage and listing, file upload and privacy, deploying the application on the web, using Juno analytics, local development setup, extending functionality with smart contract hooks, building the back-end and handling HTTP requests, and generating wallet addresses and contact information.

In this session, we will build and deploy a decentralized application from scratch and delve into its additional features, all while minimizing the complexity typically associated with learning blockchain technology.By the end of this session, I hope attendees will not only have a clearer understanding of blockchain development, but also realize that building in this space can be surprisingly straightforward and enjoyable.My goal is to share my enthusiasm for open-source development and the potential of Web3.

Learn to Build on WEB3 Like It’s WEB2

David Dal Busco

React Summit US

React Summit US 2023

Web 3 is about decentralization, using blockchain, cryptography, and consensus algorithms. It allows users to have more control over their data and assets. The current state of Web 3 is complex and frustrating, but efforts are being made to improve usability. Layer 2 chains and account abstraction are improving scalability and user experience. Web 3 provides financial solutions for all and enables transactions in restrictive environments.

This talk will be centered around improving user experiences in web3 by abstracting away blockchain interactions.

Building Friendly User Experiences in Web3

Rahat Chowdhury

JS Nation

JSNation 2023

This workshop explores JRPC and how to build JRPC microservices to convert cryptocurrencies in Node.js. It covers the low-level aspects of gRPC and its integration with Node.js, emphasizing its performance benefits over traditional REST APIs. The workshop includes demonstrations of generating protocol buffer types, protocol buffer transformation and serialization, creating server and client with gRPC, and building a cryptocurrency converter using multiple providers. It also discusses the comparison between REST, GraphQL, and gRPC in terms of coupling, verbosity, and discoverability.

The workshop overviews key architecture principles, design patterns, and technologies used to build microservices in the Node.js stack. It covers the theory of the GRPC framework and protocol buffers mechanism, as well as techniques and specifics of building isolated services using the monorepo approach with lerna and yarn workspaces, TypeScript. The workshop includes a live practical assignment to create a currency converter application that follows microservices paradigms. It fits the best developers who want to learn and practice GRPC microservices pattern with the Node.js platform. Prerequistes:- Good understanding of JavaScript or TypeScript- Experience with Node.js and writing Backend applications- <a href="https://nodejs.org/en/download/" target="_blank">Preinstall Node.js, npm</a>- <a href="https://grpc.io/docs/protoc-installation/" target="_blank">Preinstall Protocol Buffer Compiler</a>- We prefer to use VSCode for a better experience with JavaScript and TypeScript (other IDEs are also ok)

How to Convert Crypto Currencies With GRPC Microservices in Node.js

Alex Korzhikov

Andrew Reddikh

Simon introduces the basics of blockchain and smart contracts, including decentralization and immutability. The Graph is an indexing protocol that serves as the data layer of web three, providing a solution to challenges with blockchain data. The CryptoPunk example demonstrates the use of subgraphs as a database for specific protocols. The importance of data accuracy and trust in the blockchain is highlighted. The Graph's business model is based on query fees and allows for easy querying and retrieval of NFTs.

Curious about how data works in the world of blockchain? Join Simon in an engaging session about The Graph, the decentralized indexing protocol that makes it easy for blockchain developers to search and query blockchain data.  Table of the contents:- Understanding blockchain data- Anatomy of a smart contract- Indexing blockchain data with The Graph- Accessing data on The Graph- Recommended subgraphs- Writing subgraphs overview

Querying Blockchain Data with GraphQL

Simon Emanuel Schmid

TestJS Summit

TestJS Summit 2022

In this Talk, Rafaela discusses Web3, its decentralized and token-based model, and the architecture based on smart contracts. Testing Web3 poses challenges due to the need for third-party providers like MetaMask. Approaches such as mocking the Web3 flow and using end-to-end testing tools like Taskafar are suggested. The trade-offs in Web3 testing include test speed and dependency on third-party apps. Balancing unit, integration, and end-to-end tasks is crucial for a robust testing strategy.

We will go through a brief explanation of what is Web3 and the architecture of a web3 application. Then we will talk about how to end-to-end test, its challenges, some test tools that are available, and a demo using cypress and metamask.Agenda: What is Web3; The Architecture of a Web3 Application; Web3 E2E Tests Introduction; Web3 E2E Tests Challenges; E2E Test Tools; Demo.

E2E Tests for Web3 Applications

Rafaela Azevedo

JSNation 2022

Hyperverse simplifies blockchain development by providing modular on-chain smart contracts for all major blockchains. Fungible tokens are interchangeable, while non-fungible tokens have unique characteristics. Developers can build Web3 apps using JavaScript libraries and connect wallets using RainbowKit for UI. Interacting with contracts is done through imported modules and the Hyperverse provider. The ERC721 smart module allows for NFT minting and token transfers. The Hyperverse documentation provides step-by-step guides for building Web3 apps and integrating modules like stake and rewards. Joining Discord and fast camps are available for support and learning opportunities.

The workshop is designed to help Web2 developers start building for Web3 using the Hyperverse. The Hyperverse is an open marketplace of community-built, audited, easy to discover smart modules. Our goal - to make it easy for JavaScript developers to build Web3 apps without writing a single line of smart contract code. Think “npm for smart contracts.”Learn more about the Hyperverse <a href="https://www.decentology.com/hyperverse" target="_self">here</a>.We will go over all the blockchain/crypto basics you need to know to start building on the Hyperverse, so you do not need to have any previous knowledge about the Web3 space. You just need to have JavaScript experience.

Build Web3 apps with Javascript

Shain Dholakiya

React Summit 2022

Today's workshop covered various topics including an introduction to Web3 and smart contracts, an overview of blockchain technology, the birth of Bitcoin and its impact on blockchain, an introduction to Ethereum, Polygon, and wallets, and the process of connecting wallets and interacting with smart contracts. The workshop also included practical exercises on setting up Metamask, exploring block explorers, and interacting with a smart contract. Participants learned about the importance of the secret recovery phrase, the structure of blocks in a blockchain, and the role of gas fees in incentivizing miners. Overall, the workshop provided a comprehensive overview of Web3 development and blockchain technology.

There are many journeys we can take into becoming a web3 developer. Not all journeys require learning a completely new language and becoming a smart contract developer. In this workshop we will learn how to build our own React UI on top of any existing smart contracts on the Polygon Proof of Stake Blockchain. We will explore a basic overview of blockchains and learn about the advantages of building on Polygon. We will also gain an understanding of what Smart Contracts are, learn how to find existing ones, and learn tools that help us interact with them from a React application.

How to Build UI's for Smart Contracts

Today's Workshop focused on building Web3 apps with React using JavaScript, without the need for smart contract code. The Hyperverse was introduced as a community-built, open, and audited platform for modular smart contracts. The Workshop covered topics such as blockchain basics, digital signatures, wallets, fees, and token types. A demo of a Web3 application was showcased, along with the process of confirming transactions and starting a battle between tribes. The Workshop also discussed initializing Hyperverse and modules, connecting wallets, joining and leaving tribes, creating custom tribes, and implementing battle functionality and ERC-721 tokens.

The workshop is designed to help Web2 developers start building for Web3 using the Hyperverse. The Hyperverse is an open marketplace of community-built, audited, easy to discover smart modules. Our goal - to make it easy for React developers to build Web3 apps without writing a single line of smart contract code. Think “npm for smart contracts.” Learn more about the Hyperverse <a href="https://www.decentology.com/hyperverse">here</a>. We will go over all the blockchain/crypto basics you need to know to start building on the Hyperverse, so you do not need to have any previous knowledge about the Web3 space. You just need to have React experience.

Build Web3 apps with React 

This talk covers an introduction to Web 3 and smart contracts, including deployment and bytecode compilation. It also discusses interacting with blockchain wallets, using RPC endpoints and block explorers, and accessing smart contract data. The talk emphasizes the use of ABIs and JavaScript libraries like ethers for interacting with smart contracts. It mentions the shift in mindset from HTTP requests to using ABI code and libraries for front-end development in Web 3. The talk concludes by mentioning Web3UI and tools like PolygonScan and Etherscan for building on the blockchain.

There is a lot of hype and interest around diving into the Web3 space, and it can be hard to manage the information overload and the emphasis on learning new languages to work on smart contracts. Many developers in the frontend space ask, “How much of this new information do I need to transition into web3?” The truth is as a React developer, the skills I know are essential in web3. Let’s add some context around how to leverage those existing skills to succeed in this new space. In this talk, we’re going to explore how to build the correct context and the technologies to understand to help you dive into web3 as a front-end developer. We’ll go over popular packages like Ethers, which can be used in React applications to interact with wallets and existing smart contracts. We will also explore how you can leverage your Javascript skills to build full-stack dApps using managed services like Moralis and Thirdweb. Let’s demystify some of the concepts in web3 and leverage our existing skills to start building.

A Frontend Developer’s Guide to Web3

Hello, my name is Russ Fustino, and welcome to Build Blockchain DApps Using JavaScript. We'll cover Algorand blockchain, layer one, setup your development environment, creating a simple DApp, verification, and UI controls from pipeline. Blockchain tools are now accessible to anyone for creating liquidity pooling, staking, and more. The Italian Society of Authors and Publishers is using NFTs on the Algorand blockchain to identify copyrights. Algorand accounts, ASAs, Atomic Transactions, Algorand Smart Contracts, and reporting with Indexer are part of the solution. Creating NFTs can be done using visual tools like Algodesk.io and wallets like Algosigner and MyAlgoWallet. Algorand atomic transfers guarantee the exchange of goods and facilitate decentralized applications. Smart signatures approve spending transactions and smart contracts facilitate global and local storage. DApp architecture includes a UI front end, payment transactions between accounts, asset transactions for NFTs and Fungible Tokens, and application calls for smart contracts. Various SDKs and tools are available, such as AlgoDesk.io, Algorand Studio, and Algodia. Reach is a high-level language and compiler for deploying DApps to the blockchain. Verification and audits play a crucial role in preventing locked away tokens. The Pipeline UI offers controls and components for easy integration into solutions.

Have we found nirvana for Blockchain developers? This session will focus on building blockchain dApps (distributed Apps) with one set of source code and deploy to multiple blockchains! The session will cover getting started with Reach and being able to deploy the same solution to multiple blockchains including Algorand, Ethereum, and Conflux. New to Reach? We will cover how to set up your development environment as well as walk through a simple app frontend and backend. Finally, we will look one the huge benefits of Reach in the built-in verification process. Reach provides automatic verifications to ensure that your program does not lose, lock away, or overspend funds and guarantees that your applications are free from this entire category of errors.

Build Blockchain dApps using JavaScript

Russell Fustino

Today we will discuss the Web3JS library, its history, maintenance, and community involvement. The upcoming version 4 aims to address challenges faced in version 1 by introducing native TypeScript support, reduced size, improved code readability, and increased test coverage. Version 4 also introduces a new validator for easier Ethereum data validation and allows developers to customize how they handle numbers and bytes. It brings a dynamic data format for custom formatting and introduces TypeScript for contracts without transpiling. The API in version 4 is easy to extend and has future improvements and refactoring.

Will discuss the challenges faced in Web3.js project.Some opensource contribution statistics.Current refactoring objectives we are working on to make web3.js better.Release timeline.Overview of future plans.

Web3.js - Past, Present & Future

Nazar Hussain

Decentology provides developer tools for building React component-based blockchain applications without writing blockchain code. Web3 development is beneficial for applications with game engines, microtransactions, mobile payments, mediator contracts, business logic applications, simple authentication, and payments. They advocate for open source and allow developers to add a small royalty fee to paid transactions.

What are the opportunities available to web devs in web3? What problems are they likely to face transitioning to web3? How the Decentology's Hyperverse solves these problems and can help them avail of these opportunities.

Reacting to Web3

Jonathan Sheely

The Talk discusses building decentralized applications (DApps) with React and explores the benefits of smart contract technology. It highlights the characteristics and infrastructure of Web 3 applications, including decentralized indexing, off-chain data storage, and decentralized file storage. The Talk also covers identity in Web 3, with a focus on self-sovereign identity and the use of blockchain for identity verification. The process of building a DApp with React and Hard Hat is explained, along with deploying contracts and interacting with them. Overall, the Talk provides insights into the world of DApps and the technologies involved.

Decentralized apps (dApps) are continuing to gain momentum in the industry. These developers are also now some of the highest paid in the entire trade. Building decentralized apps is a paradigm shift that requires a different way of thinking than apps built with traditional centralized infrastructure, tooling, and services – taking into consideration things like game theory, decentralized serverless infrastructure, and cryptoeconomics. As a React developer, I initially had a hard time understanding this entirely new (to me) ecosystem, how everything fit together, and the mental model needed to understand and be a productive full stack developer in this space (and why I would consider it in the first place). In this talk, I'll give a comprehensive overview of the space, how you can get started building these types of applications, and the entire tech stack broken apart then put back together to show how everything works. <a href="https://www.froala.com/wysiwyg-editor?pb=1"> </a>

#web3