lessons.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <title>Vyper.fun Lessons | Learn Vyper by building a Pokémon Game</title>

    <link
      rel="apple-tou  ch-icon"
      sizes="180x180"
      href="./media/vyper-logo-transparent.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="32x32"
      href="./media/vyper-logo-transparent.png"
    />
    <link
      rel="icon"
      type="image/png"
      sizes="16x16"
      href="./media/vyper-logo-transparent.png"
    />
    <link rel="manifest" href="./media/favicons/site.webmanifest" />

        <meta property="og:title" content="Vyper.fun" />
    <meta
      property="og:description"
      content="Learn Vyper by building a Pokemon Game. Study structure of a contract, types, variables and constants, statements, control structures, scoping and declarations, built-in functions, interfaces, event logging, natspec metadata"
    />
    <meta property="og:image" content="https://learn.vyperlang.org/media/vyper-fun.png" />
    <meta property="og:url" content="https://learn.vyperlang.org" />

    <meta name="twitter:title" content="Vyper.fun" />
    <meta
      name="twitter:description"
      content="Learn Vyper by building a Pokemon Game. Study structure of a contract, types, variables and constants, statements, control structures, scoping and declarations, built-in functions, interfaces, event logging, natspec metadata"
    />
    <meta
      name="twitter:image"
      content="https://learn.vyperlang.org/media/vyper-fun.png"
    />
    <meta name="twitter:card" content="summary_large_image" />

    <!-- Global site tag (gtag.js) - Google Analytics -->
    <script
      async
      src="https://www.googletagmanager.com/gtag/js?id=UA-131093663-3"
    ></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag() {
        dataLayer.push(arguments);
      }
      gtag('js', new Date());

      gtag('config', 'UA-131093663-3');
    </script>

    <!-- CSS Dependencies -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
    <link rel="stylesheet" href="./resource/css/shards.min.css">
  </head>
  <body>
    <center>
        <br />
        <h1>Vyper.fun Lessons</h1>
        <br />
        <div class="container">
<div class="row">
  <div class=".col-12 col-sm-4 .col-md-4 .col-lg-4 .col-xl-4">
              <div class="card" style="width: 20rem;">
        <img class="card-img-top" src="https://i.pinimg.com/originals/22/3a/7f/223a7fb14d9eac792fc29446bb2cf30d.png" alt="Card image cap">
        <div class="card-body">
            <h4 class="card-title">Lesson 0: Solidity vs Vyper <br/>(coming soon)</h4>
            <p class="card-text">Learn the pros and cons of using Vyper and Solidity.</p>
            <a href="#" class="btn btn-primary">Get Started &rarr;</a>
        </div>
        </div>
  </div>
<div class=".col-12 col-sm-4 .col-md-4 .col-lg-4 .col-xl-4">
              <div class="card" style="width: 20rem;">
        <img class="card-img-top" src="https://cdn.dribbble.com/users/2712/screenshots/2853053/pikachu-_1.0_.png?compress=1&resize=400x300" alt="Card image cap">
        <div class="card-body">
            <h4 class="card-title">Lesson 1: Your first Pokémon</h4>
            <p class="card-text">In this chapter, you will learn the basics of Vyper to create your first pokemon.</p>
            <a href="/#/1/introduction" class="btn btn-primary">Get Started &rarr;</a>
        </div>
        </div>
  </div>
  <div class=".col-12 col-sm-4 .col-md-4 .col-lg-4 .col-xl-4">
              <div class="card" style="width: 20rem;">
        <img class="card-img-top" src="https://cdn.dribbble.com/users/1605843/screenshots/3351502/hello-01.png?compress=1&resize=400x300" alt="Card image cap">
        <div class="card-body">
            <h4 class="card-title">Lesson 2: Catch 'em All</h4>
            <p class="card-text">In this chapter, we will learn the more advanced concepts of Vyper to create pokemon trainers.</p>
            <a href="/#/2/introduction" class="btn btn-primary">Get Started &rarr;</a>
        </div>
        </div>
  </div>
</div>
<br />
<div class="row">
<div class=".col-12 col-sm-4 .col-md-4 .col-lg-4 .col-xl-4">
              <div class="card" style="width: 20rem;">
        <img class="card-img-top" src="https://cdn.dribbble.com/users/594316/screenshots/14114966/gaming_icon_set-01_4x.jpg?compress=1&resize=400x300" alt="Card image cap">
        <div class="card-body">
            <h4 class="card-title">Lesson 3: Trade your Pokémon<br> (coming soon)</h4>
            <p class="card-text">Learn how to trade your Pokémons using ERC 721 token standard.</p>
            <a href="/./WELCOME" class="btn btn-primary">Get Started &rarr;</a>
        </div>
        </div>
  </div>
  <div class=".col-12 col-sm-4 .col-md-4 .col-lg-4 .col-xl-4">
              <div class="card" style="width: 20rem;">
        <img class="card-img-top" src="https://cdn.dribbble.com/users/112047/screenshots/6464854/brock-drib_4x.jpg?compress=1&resize=400x300" alt="Card image cap">
        <div class="card-body">
            <h4 class="card-title">Lesson 4: Become a Pokémon master<br> (coming soon)</h4>
            <p class="card-text">Battle with Pokémons and compete with other Pokémon trainers.</p>
            <a href="/./WELCOME" class="btn btn-primary">Get Started &rarr;</a>
        </div>
        </div>
  </div>
  <div class=".col-12 col-sm-4 .col-md-4 .col-lg-4 .col-xl-4">
              <div class="card" style="width: 20rem;">
        <img class="card-img-top" src="https://i.pinimg.com/originals/57/ad/e2/57ade25c3f3d160ffa623dfcd097c482.png" alt="Card image cap">
        <div class="card-body">
            <h4 class="card-title">Lesson 5: Advanced Vyper Concepts<br> (coming soon)</h4>
            <p class="card-text">Learn the immutability of contracts, loops, selfdestruct, gas optimization.</p>
            <a href="/./WELCOME" class="btn btn-primary">Get Started &rarr;</a>
        </div>
        </div>
  </div>
</div>
<br />
<div class="row">
  <div class=".col-12 col-sm-4 .col-md-4 .col-lg-4 .col-xl-4">
              <div class="card" style="width: 20rem;">
        <img class="card-img-top" src="https://i.pinimg.com/564x/8b/43/40/8b4340a5951de27e3dff6bea242f1b0e.jpg" alt="Card image cap">
        <div class="card-body">
            <h4 class="card-title">Lesson 6: Deploy your contracts<br> (coming soon)</h4>
            <p class="card-text">Learn how to use eth-brownie to compile, deploy, and test your contracts.</p>
            <a href="/./WELCOME" class="btn btn-primary">Get Started &rarr;</a>
        </div>
        </div>
  </div>
<div class=".col-12 col-sm-4 .col-md-4 .col-lg-4 .col-xl-4">
              <div class="card" style="width: 20rem;">
        <img class="card-img-top" src="https://i.pinimg.com/originals/dc/63/78/dc6378bffe909ef130017bd8969b2c1b.png" alt="Card image cap">
        <div class="card-body">
            <h4 class="card-title">Lesson 7: Build a Pokémon Dapp<br> (coming soon)</h4>
            <p class="card-text">Learn how to integrate your contracts to a React app to create a complete dApp.</p>
            <a href="/./WELCOME" class="btn btn-primary">Get Started &rarr;</a>
        </div>
        </div>
  </div>
</div>
</div>
<br />
<br />
<h6>Built by <a href="https://twitter.com/vasa_develop" target="_blank">vasa</a></h6>
<br />
</center>

    <!-- Optional JavaScript -->
    <!-- JavaScript Dependencies: jQuery, Popper.js, Bootstrap JS, Shards JS -->
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
    <script src="./resource/js/shards.min.js"></script>
  </body>
</html