templates/about.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>SWEatshop.tech</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400" rel="stylesheet">
<link rel="stylesheet" href="/static/css/styles.processed.css"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>
<script src="https://unpkg.com/isotope-layout@3/dist/isotope.pkgd.js"></script>
<link rel="shortcut icon" href="/static/img/favicon.ico">
</head>
<body>
<div class="bg-ut">
<nav class="navbar fixed-top navbar-toggleable-md navbar-inverse bg-inverse-opacity">
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<a class="navbar-brand" href="index.html"><img alt="Brand" src="../static/img/sweatshop-logo.png" style="width: 200px;">
</a>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="#">About<span class="sr-only">(current)</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="companies.html">Companies</a>
</li>
<li class="nav-item">
<a class="nav-link" href="people.html">People</a>
</li>
<li class="nav-item">
<a class="nav-link" href="investors.html">Investors</a>
</li>
<li class="nav-item">
<a class="nav-link" href="schools.html">Schools</a>
</li>
<li class="nav-item">
<a class="nav-link" href="visualization.html">Visualization</a>
</li>
<li><a href="#search"><img src="http://www.freeiconspng.com/uploads/search-icon-png-4.png" style="height: 35px;"></a></li>
</ul>
</div>
<div class="blur"></div>
</nav>
<div class="container" style="min-height: 94vh; padding-bottom: 8rem; padding-top: 14rem; display: table">
<div class="vertical-center">
<div class="card rounded-opacity" style="margin-bottom: 0rem; align-self: center">
<div class="member-group">
<h1 class="cover-heading" style="color: white;">What we’ve done</h1>
<div class="member">
<div class="member-info">
<member-header>Total commits : 533<br /><br /></member-header>
<member-header>Total issues : 103<br /><br /></member-header>
<member-header>Total unit tests : 20<br /><br /></member-header>
<member-header>Total additions : 10,651<br /><br /></member-header>
<member-header>Total deletions : 1065<br /><br /></member-header>
</div>
</div>
<div class="member">
<div class="member-info">
<a class="button" href="https://github.com/sweatshoptech/idb/">
<member-header>
Github Repo
</member-header>
</a>
<br />
<a class="button" href="https://github.com/sweatshoptech/idb/issues">
<member-header>
Github Issue Tracker
</member-header>
</a>
<br />
<a class="button" href="http://docs.sweatshop.apiary.io">
<member-header>
Apiary
</member-header>
</a>
<br />
<a class="button" href="report.html">
<member-header>
Technical Report
</member-header>
</a>
<br />
<a class="button" href="run-tests">
<member-header>
Run Tests
</member-header>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="padding-top: 0; background-color: white; height: 100%;">
<h1 class="cover-heading">Who we are</h1>
<div class="container" style="margin-bottom: 10rem;">
<div class="card rounded">
<div class="container" style="padding-left: 3rem; padding-right: 3rem; color: white;">
<div class="row">
<div class="col-sm-12 col-lg-6 col-xl-4">
<img class="profile--image" src="http://vishnut.me/CS373/profpic.jpg">
<div class="member-info">
<member-name>Vishnu Thiagarajan <br /><br /></member-name>
<member-body> Hi, My name is Vishnu and I am a second year Computer Science major (classified as a Senior) at the University of Texas at Austin. I love food and doggo memes. <br /><br /></member-body>
<member-header> Major Responsibilities <br /><br /></member-header>
<member-body> Mostly the Flask backend, the SQLAlchemy Database, the API, the Hosting/DB Setup, and some front-end <br /><br /></member-body>
<member-header>commits : 191 <br /><br /></member-header>
<member-header>issues : 74<br /><br /></member-header>
<member-header>unit tests : 5</member-header>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-4">
<img class="profile--image" src="../static/img/raunak.jpg">
<div class="member-info">
<member-name> Raunak Srivastava <br /><br /></member-name>
<member-body> Hi, I am a third year Computer Science major at UT. I am extremely passionate about making education more easily accessible through technology.<br /><br /></member-body>
<member-header> Major Responsibilities <br /><br /></member-header>
<member-body> Mostly front-end design and implementation, along with some of the back-end. <br /><br /></member-body>
<member-header>commits : 114<br /><br /></member-header>
<member-header>issues : 30<br /><br /></member-header>
<member-header>unit tests : 0</member-header>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-4">
<img class="profile--image" src="../static/img/aditya.jpg">
<div class="member-info">
<member-name> Aditya Palnitkar <br /><br /></member-name>
<member-body> Hi! My name is Aditya, and I am a Junior Computer Science major at UT. I'm a huge aviation geek and I'm currently working on my private pilot's license. <br /><br /></member-body>
<member-header> Major Responsibilities <br /><br /></member-header>
<member-body> A bit of both front-end and back-end <br /><br /><br /><br /></member-body>
<member-header>commits : 7<br /><br /></member-header>
<member-header>issues : 10<br /><br /></member-header>
<member-header>unit tests : 15</member-header>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-4">
<img class="profile--image" src="../static/img/brenda.jpg">
<div class="member-info">
<member-name> Brenda Salazar <br /><br /></member-name>
<member-body> Hola, I am a Junior Computer Science major at UT \m/ (Hook 'em Horns). I am cofounder and vicepresident of HACS (Hispanic Association for Computer Scientists) at UT and hope to leave a legacy in the CS department. <br /><br /></member-body>
<member-header> Major Responsibilities <br /><br /></member-header>
<member-body> Primarily front-end and some backend <br /><br /></member-body>
<member-header>commits : 35<br /><br /></member-header>
<member-header>issues : 9<br /><br /></member-header>
<member-header>unit tests : 0</member-header>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-4">
<img class="profile--image" src="../static/img/Vignesh.jpg">
<div class="member-info">
<member-name> Vignesh Kumar <br /><br /></member-name>
<member-body> Hi, I'm a Junior in University of Texas at Austin and I'm a Computer Science Major. I am extremely passionate in data-driven technologies and I'll be interning at Bank of America this summer.<br /><br /><br /></member-body>
<member-header> Major Responsibilities <br /><br /></member-header>
<member-body> Database and Backend <br /><br /></member-body>
<member-header>commits : 27<br /><br /></member-header>
<member-header>issues : 23<br /><br /></member-header>
<member-header>unit tests : 3</member-header>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-4">
<img class="profile--image" src="../static/img/aaron.jpg">
<div class="member-info">
<member-name> Aaron Chang <br /><br /></member-name>
<member-body> Hi, I'm classified as a Junior at UT Austin, and I'm majoring in Computer Science. My main interests are cybersecurity and supercomputing, and I’ll be interning at BP’s Center for High Performance Computing this summer. <br /><br /></member-body>
<member-header> Major Responsibilities <br /><br /></member-header>
<member-body> Mostly backend, some work with frontend <br /><br /></member-body>
<member-header>commits : 69<br /><br /></member-header>
<member-header>issues : 31<br /><br /></member-header>
<member-header>unit tests : 20</member-header>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div style="padding-top: 0; margin-top: 0; background-color: black; height: 100%;">
<h1 style="padding: 100px; font-size: 350%; color: white">What we used</h1><br />
<div style="margin-bottom: 0rem; padding-left: 3rem; padding-right: 3rem; color: white">
<div class="row tools">
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://data.crunchbase.com">
<img class="logo--image" src="../static/img/crunchbase.jpg" alt="HTML Logo">
</a>
<div class="member-info">
<member-name> Data <br /><br /></member-name>
<member-body> We used the CrunchBase API to scrape most of our data for this web application. We also used the ClearBit API for scraping logos and the IP-API API to scrape locations. </member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://developer.mozilla.org/en-US/docs/Web/HTML">
<img class="logo--image" src="../static/img/html.png" alt="HTML Logo">
</a>
<div class="member-info">
<member-name> HTML 5 <br /><br /></member-name>
<member-body> HTML 5 is the 5th version of HTML. We use HTML with Bootstrap and ReactJS to design and organize the components on the front-end of the web application.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://developer.mozilla.org/en-US/docs/Web/CSS">
<img class="logo--image" src="../static/img/css.png" alt="CSS Logo">
</a>
<div class="member-info">
<member-name> CSS 3 <br /><br /></member-name>
<member-body> CSS 3 is the 3rd version of CSS. We use CSS with Bootstrap included to style the web application in a more visually engaging way.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="http://getbootstrap.com/">
<img class="logo--image" src="../static/img/bootstrap.png" alt="Bootstrap Logo">
</a>
<div class="member-info">
<member-name> Bootstrap <br /><br /></member-name>
<member-body> Bootstrap is a free and open-source front-end web framework for designing websites and web applications. It contains HTML and CSS based design templates. Bootstrap was utilized to create the homepage carousel as well as display our data in a grid like manner.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://facebook.github.io/react/">
<img class="logo--image" src="../static/img/react-logo.png" alt="React Logo">
</a>
<div class="member-info">
<member-name> ReactJS <br /><br /></member-name>
<member-body> ReactJS is an open-source JavaScript framework for building user interfaces.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="http://isotope.metafizzy.co/">
<img class="logo--image" src="../static/img/isotope.png" alt="Isotope Logo">
</a>
<div class="member-info">
<member-name> Isotope <br /><br /></member-name>
<member-body> Isotope is an open source package that we utilized in order to create the grid like interface. It also adds sorting and filtering functionality. </member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://aws.amazon.com/s3/">
<img class="logo--image" src="../static/img/awss3.png" alt="AWS S3 Logo">
</a>
<div class="member-info">
<member-name> AWS S3 <br /><br /></member-name>
<member-body> AWS S3 is a stororage for the Internet designed to make web-scale computing easier for developers. AWS S3 is where the SWEatshop is hosted. </member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://aws.amazon.com/ec2/">
<img class="logo--image landscape" src="../static/img/awsec2.png" alt="AWS EC2 Logo">
</a>
<div class="member-info">
<member-name> AWS EC2 <br /><br /></member-name>
<member-body> Elastic Compute Cloud is a web service that provides computing capacity from Amazon's cloud. We use it create a virtual machine that contains our files for this site. </member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://aws.amazon.com/elasticbeanstalk/">
<img class="logo--image landscape" src="../static/img/awseb.png" alt="AWS Elastic Beanstalk Logo">
</a>
<div class="member-info">
<member-name>AWS Elastic Beanstalk<br /><br /></member-name>
<member-body>Elastic Beanstalk is used to deploy our web application developed on an Apache server. </member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://www.sqlalchemy.org/">
<img class="logo--image" src="../static/img/sqla.png" alt="SQLAlchemy Logo">
</a>
<div class="member-info">
<member-name> SQL Alchemy <br /><br /></member-name>
<member-body> SQLAlchemy is an open source SQL toolkit and object-relational mapper (ORM) for the python language. We utilize SQLAlchemy in order to connected the front-end with our Postgresql database. SQLAlchemy is essentially used to retrieve data from our database and populate our HTML pages. </member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://www.postgresql.org/">
<img class="logo--image" src="../static/img/psql.png" alt="PostgreSQL Logo">
</a>
<div class="member-info">
<member-name> PostgreSQL <br /><br /></member-name>
<member-body> PostgreSQL is an object-relational database. We utilize PostgreSQL as a place to keep and organize our data models.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://docs.python.org/2/">
<img class="logo--image" src="../static/img/python.png" alt="Python Logo">
</a>
<div class="member-info">
<member-name> Python <br /><br /></member-name>
<member-body> Python is an interpreted, object-oriented, high-level programming language with dynamic semantics. We leverage Python for the backend of the web application by using Flask and SQLAlchemy to connect the frontend and database to our backend.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="http://flask.pocoo.org/">
<img class="logo--image" src="../static/img/flask.png" alt="Flask Logo">
</a>
<div class="member-info">
<member-name> Flask <br /><br /></member-name>
<member-body> Flask is a micro web framework written in Python. It allows us to connect our HTML templates to specific routes for our URL address.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://www.namecheap.com/">
<img class="logo--image" src="../static/img/namecheap.png" alt="Namecheap Logo">
</a>
<div class="member-info">
<member-name> Namecheap <br /><br /></member-name>
<member-body> Vendor from which we obtained the sweatshop.tech domain. We then set the IP and DNS to point to our AWS EC2 instance.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference">
<img class="logo--image" src="../static/img/github.png" alt="Javascript Logo">
</a>
<div class="member-info">
<member-name> Github <br /><br /></member-name>
<member-body> Github is a web-based Git (version control repository) that we utilize to maintain the source code, track issues/features, and assign issues/features to each of the team members.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://www.slack.com/">
<img class="logo--image" src="https://upload.wikimedia.org/wikipedia/commons/7/76/Slack_Icon.png" alt="Slack Logo">
</a>
<div class="member-info">
<member-name> Slack <br /><br /></member-name>
<member-body> Slack is one of the communication tools utilzed by the team members. There are several channels (chatrooms) such as #frontend, #backend, and #db to discuss the different portions of the web application. Slack is also connected to the Github repository and to our Trello board to frequently and easily monitor progress.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://www.trello.com/">
<img class="logo--image" src="../static/img/trello.png" alt="Trello Logo">
</a>
<div class="member-info">
<member-name> Trello <br /><br /></member-name>
<member-body> A project management application utilized to list and separate all necessary tasks for the web application. It provides a way to assign tasks and track progress. Trello is connected to our Slack channels.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://apiary.io/">
<img class="logo--image" src="../static/img/apiary.png" alt="Apiary Logo">
</a>
<div class="member-info">
<member-name> Apiary <br /><br /></member-name>
<member-body> Apiary is a Github tool that allows us to document our API easily and efficiently and be connected to our Github to provide further documentation for our web application.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://developers.google.com/maps/">
<img class="logo--image landscape" src="../static/img/googlemaps.png" alt="Google Maps Logo">
</a>
<div class="member-info">
<member-name>Google Maps API<br /><br /></member-name>
<member-body>The Google Maps API is an aplication programming interface that allows developers to use Google Maps services in their applications. We utilized the Google Maps API in order to embed the location of our models (companies, people, investors, and schools) in each instance page in the form of an interactive map. </member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="https://clearbit.com/logo">
<img class="logo--image landscape" src="../static/img/clearbit.png" alt="ClearBit Logo">
</a>
<div class="member-info">
<member-name>ClearBit API<br /><br /></member-name>
<member-body>The ClearBit API allowed us to scrape the web for school logos since they weren't provided in the 2013 SQL dump. </member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="http://jinja.pocoo.org/docs/2.9/">
<img class="logo--image landscape" src="../static/img/jinja2-logo.png" alt="Jinja2 Logo">
</a>
<div class="member-info">
<member-name>Jinja2<br /><br /></member-name>
<member-body>Jinja 2 allowed us to dynamically fill our HTML with information passed through flask.</member-body>
</div>
</div>
<div class="col-sm-12 col-lg-6 col-xl-3">
<a href="http://ip-api.com/">
<img class="logo--image landscape" src="../static/img/ip-api.png" alt="IP-API Logo">
</a>
<div class="member-info">
<member-name>IP Geolocation API<br /><br /></member-name>
<member-body>IP API allows us to obtain location information about from URLs. We utilize it to fill in some of the gaps in our database that do not have a location but do have a URL.</member-body>
</div>
</div>
</div>
</div>
<div class="outro">
© SWEatshop 2017
</div>
</div>
</body>
<div id="search">
<button type="button" class="close">×</button>
<form action="/search" method="get">
<input type="search" name="query" value="" placeholder="type keyword(s) here" />
<button type="submit" class="btn btn-primary">Search</button>
</form>
</div>
<script>
$(function () {
$('a[href="#search"]').on('click', function(event) {
event.preventDefault();
$('#search').addClass('open');
$('#search > form > input[type="search"]').focus();
});
$('#search, #search button.close').on('click keyup', function(event) {
if (event.target == this || event.target.className == 'close' || event.keyCode == 27) {
$(this).removeClass('open');
}
});
});
</script>
</html>