portfolio.github.io/fullstackprojects.html at main · runjiezhao1/portfolio.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Runjie Zhao Website</title>

    <!-- Bootstrap core CSS -->
    <link href="css/bootstrap.css" rel="stylesheet">
    <link href="css/wave.css" rel="stylesheet">
    <!-- Custom CSS for the '3 Col Portfolio' Template -->
    <link href="css/3-col-portfolio.css" rel="stylesheet">
  </head>

  <body>
    <nav class="navbar navbar-fixed-top navbar-inverse" role="navigation">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <!-- <a class="navbar-brand" href="http://startbootstrap.com">Start Bootstrap</a> -->
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse navbar-ex1-collapse">
          <ul class="nav navbar-nav">
            <li><a href="index.html">Home</a></li>
            <li><a href="education.html">Education</a></li>
            <li><a href="experiences.html">Experiences</a></li>
            <li><a href="projects.html">Projects</a></li>
            <li><a href="fullstackprojects.html">Web Projects</a></li>
            <li><a href="mlprojects.html">ML/AI Projects</a></li>
          </ul>
        </div>
      </div>
    </nav>

    <div class="container">

      <div class="row">

        <div class="col-lg-12">
          <h1 class="page-header">Web Projects</h1>
        </div>

      </div>
      <div class="row">
        <div class="column">
          <h3><b><a href="https://github.com/runjiezhao1/WebDB" style="color: black;" target="_blank"><u>Mini Spotify</u></a></h3>
          <h4>This personal project utilizes react.js to build a mini spotify website. The backend is created by datagrip using AWS RDS. This web application offers the basic functions such as
            suggesting the song, browsing the albums, search the specific song, and filter the song. Besides that, it provides the radar and bar chart to visualize the proerties of selected song.
          </h4>
        </div>
        <div class="column">
            <img class="img-responsive" src="img/webhome.png" width="300", height="1000" style="margin: auto;">
        </div>
      </div>
      <div class="row">
        <div class="column">
          <h3><b><a href="https://github.com/runjiezhao1/Mini-Yelp" style="color: black;" target="_blank"><u>Mini Yelp</u></a></h3>
          <h4>This a group project utilizes react.js to build a mini yelp website. The backend is created by datagrip using AWS RDS and used postman for testing. The web application
            allows the users to search for the business, check specific information about business, check popular user reviews and most recent reviews. It utilizes jest to automatically test
            on the backend.
          </h4>
          <h4>Co-authors: <a href="https://www.linkedin.com/in/haitian-zhou/">Haitian Zhou</a>, <a href="https://github.com/JiakXiang">Jiakun Xiang</a>, <a href="https://www.linkedin.com/in/ivy-yujia-xu-01b8a2138/">Yujia Xu</a></h4>
        </div>
        <div class="column">
            <img class="img-responsive" src="img/searchpage.png" width="300", height="1000" style="margin: auto;">
        </div>
      </div>


    </div>

    <div class="container">

    </div>

  </body>

</html>