JSFiddle - React, Tailwind, and code Playground

by kanonji

HTML

<script src="//code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<link rel="stylesheet" href="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
<script src="//stackpath.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!doctype html>
<html lang="en">
  <head>
    <title>ダークシュナイダー</title>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
  </head>
  <body class="bg-light">
    <header>
      <div class="bg-success text-center py-2">
        <p class="text-light">ID掲示板・友達募集</p>
        <a href="http://www.yahoo.co.jp"><img src="img/logo.png"></a>
      </div>
    </header>
    <main class="px-2">
      <div class="text-center my-4">
          友達募集掲示板、LINE掲示板へようこそ！
      </div>
      <div class="text-center my-3">
          <a name="" id="" class="btn btn-warning w-75" href="#" role="button">掲示板に投稿する(。・_・。)ノ</a>
      </div>
      <div>
        <p class="text-success">ID掲示板の新着募集</p>
      </div>
      <div class="card my-1">
        <div class="card-body">
          <table class="table table-borderless">
            <tbody>
              <tr>
                <td style="width: 50px"><img src="img/icon_male.png" style="width: 40px; height: 40px;"></td>
                <td class="text-left"><h5 class="card-title">愛ふぉん太郎<br>東京都/30代</h5></td>
                <td class="text-right"><button type="button" class="btn btn-primary">IDをコピー</button></td>
              </tr>
              <tr>
               ...