| <!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 name="description" content="Portfolio website for Jeffery Russell a computer science student at RIT"> | |
|     <meta name="author" content="Jeffery Russell"> | |
| 
 | |
|     <title>Jeffery Russell</title> | |
| 
 | |
|     <!-- Bootstrap core CSS --> | |
|     <link href="css/bootstrap.min.css" rel="stylesheet"> | |
| 
 | |
|     <!-- Custom fonts for this template --> | |
|     <link href="css/font-awesome.min.css" rel="stylesheet" type="text/css"> | |
|     <link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css"> | |
|     <link href="https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic" | |
|           rel="stylesheet" type="text/css"> | |
| 
 | |
|     <!-- Custom styles for this template --> | |
|     <link href="css/freelancer.min.css" rel="stylesheet"> | |
| 
 | |
|   </head> | |
| 
 | |
|   <body id="page-top"> | |
| 
 | |
|     <!-- Navigation --> | |
|     <nav class="navbar navbar-expand-lg navbar-light fixed-top" id="mainNav"> | |
|       <div class="container"> | |
|         <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" | |
|                 data-target="#navbarResponsive" aria-controls="navbarResponsive" | |
|                 aria-expanded="false" aria-label="Toggle navigation"> | |
|           Menu | |
|           <i class="fa fa-bars"></i> | |
|         </button> | |
|         <div class="collapse navbar-collapse" id="navbarResponsive"> | |
|           <ul class="navbar-nav mr-auto"> | |
|             <li class="nav-item"> | |
|               <a class="nav-link js-scroll-trigger" href="#portfolio">Portfolio</a> | |
|             </li> | |
|             <li class="nav-item"> | |
|               <a class="nav-link js-scroll-trigger" href="#about">About</a> | |
|             </li> | |
|             <li class="nav-item"> | |
|               <a class="nav-link js-scroll-trigger" href="#contact">Contact</a> | |
|             </li> | |
|             <li class="nav-item"> | |
|               <a class="nav-link js-scroll-trigger" href="Jeffery_Russell_Resume.pdf">Resume</a> | |
|             </li> | |
|           </ul> | |
|           <ul class="navbar-nav navbar-right"> | |
|             <li  class="nav-item"> | |
|               <a class="nav-link js-scroll-trigger" href="https://jrtechs.net">Blog</a> | |
|             </li> | |
|             <li  class="nav-item"> | |
|               <a class="nav-link js-scroll-trigger" href="https://github.com/jrtechs">Github</a> | |
|             </li> | |
|             <li  class="nav-item"> | |
|               <a class="nav-link js-scroll-trigger" href="https://www.youtube.com/c/JrtechsNet">Youtube</a> | |
|             </li> | |
|           </ul> | |
|         </div> | |
|       </div> | |
|     </nav> | |
| 
 | |
|     <!-- Header --> | |
|     <header class="masthead"> | |
|       <div class="container"> | |
| 
 | |
|         <div class="intro-text"> | |
|           <span class="name">Jeffery Russell</span> | |
|           <hr class="star-light"> | |
|           <span class="skills">Computer Science Student at RIT</span> | |
|         </div> | |
|       </div> | |
|     </header> | |
| 
 | |
|     <!-- Portfolio Grid Section --> | |
|     <section id="portfolio"> | |
|       <div class="container"> | |
|         <h2 class="text-center">Portfolio</h2> | |
|         <hr class="star-primary"> | |
|         <h3 class="text-center">Click Picture to Show Project Details</h3> | |
|         <div class="row"> | |
| 
 | |
|           <!--Steam Friends Graph--> | |
|           <div class="col-sm-4 portfolio-item"> | |
|             <a class="portfolio-link" href="#portfolioSteamGraph" data-toggle="modal"> | |
|               <div class="caption"> | |
|                 <div class="caption-content"> | |
|                   <i class="fa fa-search-plus fa-3x"></i> | |
|                 </div> | |
|               </div> | |
|               <img class="img-fluid" src="img/portfolio/steamGraph.png" alt="Steam graph"> | |
|             </a> | |
|           </div> | |
| 
 | |
|           <!--Pioneer web app--> | |
|           <div class="col-sm-4 portfolio-item"> | |
|             <a class="portfolio-link" href="#portfolioPioneer" data-toggle="modal"> | |
|               <div class="caption"> | |
|                 <div class="caption-content"> | |
|                   <i class="fa fa-search-plus fa-3x"></i> | |
|                 </div> | |
|               </div> | |
|               <img class="img-fluid" src="img/portfolio/pioneer.png" alt=""> | |
|             </a> | |
|           </div> | |
| 
 | |
|           <!--Floppy drives--> | |
|           <div class="col-sm-4 portfolio-item"> | |
|             <a class="portfolio-link" href="#portfolioFloppy" data-toggle="modal"> | |
|               <div class="caption"> | |
|                 <div class="caption-content"> | |
|                   <i class="fa fa-search-plus fa-3x"></i> | |
|                 </div> | |
|               </div> | |
|               <img class="img-fluid" src="img/portfolio/floppy.jpg" alt="image of floppy music drives"> | |
|             </a> | |
|           </div> | |
| 
 | |
|           <!--Hoffends web app--> | |
|           <div class="col-sm-4 portfolio-item"> | |
|             <a class="portfolio-link" href="#portfolioHoffends" data-toggle="modal"> | |
|               <div class="caption"> | |
|                 <div class="caption-content"> | |
|                   <i class="fa fa-search-plus fa-3x"></i> | |
|                 </div> | |
|               </div> | |
|               <img class="img-fluid" src="img/portfolio/hoffends.png" alt="img of hoffends employee app"> | |
|             </a> | |
|           </div> | |
| 
 | |
|           <!--Blog--> | |
|           <div class="col-sm-4 portfolio-item"> | |
|             <a class="portfolio-link" href="#portfolioJrtechs" data-toggle="modal"> | |
|               <div class="caption"> | |
|                 <div class="caption-content"> | |
|                   <i class="fa fa-search-plus fa-3x"></i> | |
|                 </div> | |
|               </div> | |
|               <img class="img-fluid" src="img/portfolio/jrtechs.net.png" alt="img of wordpress blog"> | |
|             </a> | |
|           </div> | |
| 
 | |
|           <!--Bryce's Quotes website--> | |
|           <div class="col-sm-4 portfolio-item"> | |
|             <a class="portfolio-link" href="#portfolioQuotes" data-toggle="modal"> | |
|               <div class="caption"> | |
|                 <div class="caption-content"> | |
|                   <i class="fa fa-search-plus fa-3x"></i> | |
|                 </div> | |
|               </div> | |
|               <img class="img-fluid" src="img/portfolio/quotes.png" alt=""> | |
|             </a> | |
|           </div> | |
| 
 | |
|           <!--Tanks Java Game--> | |
|           <div class="col-sm-4 portfolio-item"> | |
|             <a class="portfolio-link" href="#portfolioTanks" data-toggle="modal"> | |
|               <div class="caption"> | |
|                 <div class="caption-content"> | |
|                   <i class="fa fa-search-plus fa-3x"></i> | |
|                 </div> | |
|               </div> | |
|               <img class="img-fluid" src="img/portfolio/tanks.png" alt=""> | |
|             </a> | |
|           </div> | |
| 
 | |
|           <!--Brick Hack 4 whats the trend--> | |
|           <div class="col-sm-4 portfolio-item"> | |
|             <a class="portfolio-link" href="#brickHack4" data-toggle="modal"> | |
|               <div class="caption"> | |
|                 <div class="caption-content"> | |
|                   <i class="fa fa-search-plus fa-3x"></i> | |
|                 </div> | |
|               </div> | |
|               <img class="img-fluid" src="img/portfolio/trend.jpg" alt=""> | |
|             </a> | |
|           </div> | |
| 
 | |
|           <!--Tiger-OS website--> | |
|           <div class="col-sm-4 portfolio-item"> | |
|             <a class="portfolio-link" href="#tigerOSWebsite" data-toggle="modal"> | |
|               <div class="caption"> | |
|                 <div class="caption-content"> | |
|                   <i class="fa fa-search-plus fa-3x"></i> | |
|                 </div> | |
|               </div> | |
|               <img class="img-fluid" src="img/portfolio/tiger-os.png" alt=""> | |
|             </a> | |
|           </div> | |
| 
 | |
| 
 | |
|           <!--Panda Games--> | |
|           <div class="col-sm-4 portfolio-item"> | |
|             <a class="portfolio-link" href="#pandaGames" data-toggle="modal"> | |
|               <div class="caption"> | |
|                 <div class="caption-content"> | |
|                   <i class="fa fa-search-plus fa-3x"></i> | |
|                 </div> | |
|               </div> | |
|               <img class="img-fluid" src="img/portfolio/clubpanda.png" alt=""> | |
|             </a> | |
|           </div> | |
| 
 | |
|           <!--Bash Manager--> | |
|           <div class="col-sm-4 portfolio-item"> | |
|             <a class="portfolio-link" href="#bashManager" data-toggle="modal"> | |
|               <div class="caption"> | |
|                 <div class="caption-content"> | |
|                   <i class="fa fa-search-plus fa-3x"></i> | |
|                 </div> | |
|               </div> | |
|               <img class="img-fluid" src="img/portfolio/bash_manager.png" alt=""> | |
|             </a> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </section> | |
| 
 | |
|     <!-- About Section --> | |
|     <section class="success" id="about"> | |
|       <div class="container"> | |
|         <h2 class="text-center">About</h2> | |
|         <hr class="star-light"> | |
|         <div class="row"> | |
|           <div class="col-lg-4 ml-auto"> | |
|             <p>I am currently a sophomore studying Computer Science Rochester Institute of Technology. I am a very | |
|             outgoing person who enjoys collaborating and working with others. Feel free to check out my github and | |
|             other websites to see what I have been working on.</p> | |
| 
 | |
|           </div> | |
|           <div class="col-lg-4 mr-auto"> | |
|               <!-- | |
|             <p>I am very passionate about coding and the open source community. Over the course of my life I | |
|               have strove to learn more. Currently I know 9 programming languages: PHP, Java, Python, SQL, HTML, | |
|               Bash, Java Script, C and VB. </p> | |
|               --> | |
|               <p>I am a self proclaimed geek; I have been programming since I salvaged parts to build a computer when | |
|                   I was in 6th grade. Computers are my lifeblood. When I am not programming - or reading - I enjoy | |
|                   excising and riding my bike.</p> | |
|           </div> | |
|           <div class="col-lg-8 mx-auto text-center"> | |
|             <a href="https://jrtechs.me/Jeffery_Russell_Resume.pdf" class="btn btn-lg btn-outline"> | |
|               <i class="fa fa-download"></i> | |
|               Download Portfolio | |
|             </a> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </section> | |
| 
 | |
|     <!-- Contact Section --> | |
|     <section id="contact"> | |
|       <div class="container"> | |
|         <h2 class="text-center">Contact Me</h2> | |
|         <hr class="star-primary"> | |
|         <div class="row"> | |
|             <!--<center><p>Jeffery@jrtechs.net</p></center>--> | |
|             <div class="contact-section w-100"> | |
|               <div class="container"> | |
|                 <form action="contactform.php" method="post"> | |
|                   <div class="row"> | |
|                     <div class="col-md-6 form-line"> | |
|                       <div class="form-group"> | |
|                         <label>Your name</label> | |
|                         <input type="text" class="form-control" id="" placeholder=" Enter Name" name="name"> | |
|                       </div> | |
|                       <div class="form-group"> | |
|                         <label for="exampleInputEmail">Email Address</label> | |
|                         <input type="email" class="form-control" id="exampleInputEmail" placeholder=" Enter Email id" name="email"> | |
|                       </div> | |
|                     </div> | |
|                     <div class="col-md-6"> | |
|                       <div class="form-group"> | |
|                         <label for ="description"> Message</label> | |
|                         <textarea  class="form-control" id="description" placeholder="Enter Your Message" name="message"></textarea> | |
|                       </div> | |
|                       <div> | |
|                         <div class="g-recaptcha" data-sitekey="6LceWF8UAAAAAIsd7F6iY_Pywt4fJsJlFNPtEgi9"></div> | |
|                         <!--<button type="submit" name="submit" class="btn btn-default submit"><i class="fa fa-paper-plane" aria-hidden="true"></i>Send Message</button>--> | |
|                         <input type="submit" id="submit" name="submit" value="Submit"> | |
|                       </div> | |
|                     </div> | |
|                   </div> | |
|                 </form> | |
|               </div> | |
|             </div> | |
|         </div> | |
|       </div> | |
|     </section> | |
| 
 | |
|     <!-- Footer --> | |
|     <footer class="text-center"> | |
|       <div class="footer-above"> | |
|         <div class="container"> | |
|           <div class="row"> | |
|             <div class="footer-col col-md-4"> | |
|               <h3>Location</h3> | |
|               <p>Rochester Institute of Technology | |
|                 <br>1 Lomb Memorial Dr, Rochester, NY 14623</p> | |
|             </div> | |
|             <div class="footer-col col-md-4"> | |
|               <h3>Around the Web</h3> | |
|               <ul class="list-inline"> | |
|                 <li class="list-inline-item"> | |
|                   <a class="btn-social btn-outline" href="https://www.youtube.com/c/JrtechsNet"> | |
|                     <i class="fa fa-fw fa-youtube"></i> | |
|                   </a> | |
|                 </li> | |
|                 <li class="list-inline-item"> | |
|                   <a class="btn-social btn-outline" href="https://github.com/jrtechs"> | |
|                     <i class="fa fa-fw fa-github"></i> | |
|                   </a> | |
|                 </li> | |
|                 <li class="list-inline-item"> | |
|                   <a class="btn-social btn-outline" href="http://jrtechs.net"> | |
|                     <i class="fa fa-fw fa-wordpress"></i> | |
|                   </a> | |
|                 </li> | |
|               </ul> | |
|             </div> | |
|             <div class="footer-col col-md-4"> | |
|               <h3>About This Website</h3> | |
|                 <p>Check out the source code for this website on my | |
|                   <a href="https://github.com/jrtechs">github</a>.</p> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|       <div class="footer-below"> | |
|         <div class="container"> | |
|           <div class="row"> | |
|             <div class="col-lg-12"> | |
|               Copyright © Jrtechs.me 2018 | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </footer> | |
| 
 | |
|     <!-- Scroll to Top Button (Only visible on small and extra-small screen sizes) --> | |
|     <div class="scroll-top d-lg-none"> | |
|       <a class="btn btn-primary js-scroll-trigger" href="#page-top"> | |
|         <i class="fa fa-chevron-up"></i> | |
|       </a> | |
|     </div> | |
| 
 | |
|     <!-- Portfolio Modals --> | |
| 
 | |
|     <!-- Steam graph--> | |
|     <div class="portfolio-modal modal fade" id="portfolioSteamGraph" tabindex="-1" role="dialog" aria-hidden="true"> | |
|       <div class="modal-dialog" role="document"> | |
|         <div class="modal-content"> | |
|           <div class="close-modal" data-dismiss="modal"> | |
|             <div class="lr"> | |
|               <div class="rl"></div> | |
|             </div> | |
|           </div> | |
|           <div class="container"> | |
|             <div class="row"> | |
|               <div class="col-lg-8 mx-auto"> | |
|                 <div class="modal-body"> | |
|                   <h2>Steam Friends Graph</h2> | |
|                   <hr class="star-primary"> | |
|                   <img class="img-fluid img-centered" src="img/portfolio/steamGraph.png" alt="Steam graph image"> | |
|                   <p>Using the steam api, hbase graph database, java, web sockets, and javascript, I made a website | |
|                     which renders people's steam friend graphs in their web browser. I really enjoyed making this | |
|                     project and would encourage people to check out the code on my | |
|                     <a href="https://github.com/jrtechs/SteamFriendsGraph">github</a>. | |
|                   </p> | |
|                   <ul class="list-inline item-details"> | |
|                     <li>Date: | |
|                       <strong> | |
|                         June 2018 | |
|                       </strong> | |
|                     </li> | |
|                     <li>Skills: | |
|                       <strong> | |
|                         <a href="#">Java</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="#">Gremlin Query Language</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="#">Javascript</a> | |
|                       </strong> | |
|                     </li> | |
|                   </ul> | |
|                   <button class="btn btn-success" type="button" data-dismiss="modal"> | |
|                     <i class="fa fa-times"></i> | |
|                     Close</button> | |
|                 </div> | |
|               </div> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </div> | |
| 
 | |
|     <!-- Pioneer Website --> | |
|     <div class="portfolio-modal modal fade" id="portfolioPioneer" tabindex="-1" role="dialog" aria-hidden="true"> | |
|       <div class="modal-dialog" role="document"> | |
|         <div class="modal-content"> | |
|           <div class="close-modal" data-dismiss="modal"> | |
|             <div class="lr"> | |
|               <div class="rl"></div> | |
|             </div> | |
|           </div> | |
|           <div class="container"> | |
|             <div class="row"> | |
|               <div class="col-lg-8 mx-auto"> | |
|                 <div class="modal-body"> | |
|                   <h2>Pioneer Malting</h2> | |
|                   <hr class="star-primary"> | |
|                   <img class="img-fluid img-centered" src="img/portfolio/pioneer.png" alt=""> | |
|                   <p>Over several months I built a web application for Pioneer Malting which keeps track of | |
|                     inventory, clients, payroll, | |
|                     orders, batches, and shipments. | |
|                     I built this website using PHP, SQL and HTM.L | |
|                     With the source code being over ten thousand lines long, it has pushed me towards improving | |
|                     my coding style and version control. I host and maintain this website on my personal linux server. | |
|                    </p> | |
|                   <ul class="list-inline item-details"> | |
|                     <li>Client: | |
|                       <strong> | |
|                         <a href="http://pioneermalting.com/">Pioneer Malting</a> | |
|                       </strong> | |
|                     </li> | |
|                     <li>Date: | |
|                       <strong> | |
|                         June 2017 | |
|                       </strong> | |
|                     </li> | |
|                     <li>Skills: | |
|                       <strong> | |
|                         <a href="http://php.net">PHP</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/html/">HTML</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/sql/">SQL</a> | |
|                       </strong> | |
|                     </li> | |
|                   </ul> | |
|                   <button class="btn btn-success" type="button" data-dismiss="modal"> | |
|                     <i class="fa fa-times"></i> | |
|                     Close</button> | |
|                 </div> | |
|               </div> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </div> | |
|     <!-- Hoffends Website --> | |
|     <div class="portfolio-modal modal fade" id="portfolioHoffends" tabindex="-1" role="dialog" aria-hidden="true"> | |
|       <div class="modal-dialog" role="document"> | |
|         <div class="modal-content"> | |
|           <div class="close-modal" data-dismiss="modal"> | |
|             <div class="lr"> | |
|               <div class="rl"></div> | |
|             </div> | |
|           </div> | |
|           <div class="container"> | |
|             <div class="row"> | |
|               <div class="col-lg-8 mx-auto"> | |
|                 <div class="modal-body"> | |
|                   <h2>Hoffends Employee Website</h2> | |
|                   <hr class="star-primary"> | |
|                   <img class="img-fluid img-centered" src="img/portfolio/hoffends.png" alt=""> | |
|                   <p> This is a PHP website that keeps track of employee hours for payroll. | |
|                   </p> | |
|                   <ul class="list-inline item-details"> | |
|                     <li>Client: | |
|                       <strong> | |
|                         <a href="http://www.hoffends.net/">Hoffends</a> | |
|                       </strong> | |
|                     </li> | |
|                     <li>Date: | |
|                       <strong> | |
|                         November 2016 | |
|                       </strong> | |
|                     </li> | |
|                     <li>Skills: | |
|                       <strong> | |
|                         <a href="http://php.net">PHP</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/html/">HTML</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.android.com">Android App Development</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/html/">Java</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/sql/">SQL</a> | |
|                       </strong> | |
|                     </li> | |
|                   </ul> | |
|                   <button class="btn btn-success" type="button" data-dismiss="modal"> | |
|                     <i class="fa fa-times"></i> | |
|                     Close</button> | |
|                 </div> | |
|               </div> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </div> | |
|     <!-- Jrtechs Website --> | |
|     <div class="portfolio-modal modal fade" id="portfolioJrtechs" tabindex="-1" role="dialog" aria-hidden="true"> | |
|       <div class="modal-dialog" role="document"> | |
|         <div class="modal-content"> | |
|           <div class="close-modal" data-dismiss="modal"> | |
|             <div class="lr"> | |
|               <div class="rl"></div> | |
|             </div> | |
|           </div> | |
|           <div class="container"> | |
|             <div class="row"> | |
|               <div class="col-lg-8 mx-auto"> | |
|                 <div class="modal-body"> | |
|                   <h2>Personal Blog</h2> | |
|                   <hr class="star-primary"> | |
|                   <img class="img-fluid img-centered" src="img/portfolio/jrtechs.net.png" alt=""> | |
|                   <p>I initially created <a href="http://jrtechs.net">jrtechs</a> when I was in middle school. | |
|                     Jrtechs is a personal blog where I post random stuff I think others would find useful.</p> | |
|                   <ul class="list-inline item-details"> | |
|                     <li>Date: | |
|                       <strong> | |
|                         June 2014 | |
|                       </strong> | |
|                     </li> | |
|                     <li>Skills: | |
|                       <strong> | |
|                         <a href="https://wordpress.org/">Wordpress</a> | |
|                       </strong> | |
|                     </li> | |
|                   </ul> | |
|                   <button class="btn btn-success" type="button" data-dismiss="modal"> | |
|                     <i class="fa fa-times"></i> | |
|                     Close</button> | |
|                 </div> | |
|               </div> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </div> | |
|     <!-- Java Tanks Game--> | |
|     <div class="portfolio-modal modal fade" id="portfolioTanks" tabindex="-1" role="dialog" aria-hidden="true"> | |
|       <div class="modal-dialog" role="document"> | |
|         <div class="modal-content"> | |
|           <div class="close-modal" data-dismiss="modal"> | |
|             <div class="lr"> | |
|               <div class="rl"></div> | |
|             </div> | |
|           </div> | |
|           <div class="container"> | |
|             <div class="row"> | |
|               <div class="col-lg-8 mx-auto"> | |
|                 <div class="modal-body"> | |
|                   <h2>Java Tanks Game</h2> | |
|                   <hr class="star-primary"> | |
|                   <img class="img-fluid img-centered" src="img/portfolio/tanks.png" alt=""> | |
|                   <p>After the AP finals in May, high school students who took AP classes have little to do. | |
|                   During my junior year of High School I took this time to teach my AP Computer Science class how | |
|                   to make Java GUIs. After teaching several lessons, we started making a 2D tanks game. Feel free to | |
|                     check out the <a href="https://github.com/jrtechs/Tanks">Github</a>.</p> | |
|                   <ul class="list-inline item-details"> | |
|                     <li>Date: | |
|                       <strong> | |
|                         May 2016 | |
|                       </strong> | |
|                     </li> | |
|                     <li>Skills: | |
|                       <strong> | |
|                         <a href="https://www.oracle.com/index.html">Java</a> | |
|                       </strong> | |
|                     </li> | |
|                   </ul> | |
|                   <button class="btn btn-success" type="button" data-dismiss="modal"> | |
|                     <i class="fa fa-times"></i> | |
|                     Close</button> | |
|                 </div> | |
|               </div> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </div> | |
|     <!-- Floppy Drive music --> | |
|     <div class="portfolio-modal modal fade" id="portfolioFloppy" tabindex="-1" role="dialog" aria-hidden="true"> | |
|       <div class="modal-dialog" role="document"> | |
|         <div class="modal-content"> | |
|           <div class="close-modal" data-dismiss="modal"> | |
|             <div class="lr"> | |
|               <div class="rl"></div> | |
|             </div> | |
|           </div> | |
|           <div class="container"> | |
|             <div class="row"> | |
|               <div class="col-lg-8 mx-auto"> | |
|                 <div class="modal-body"> | |
|                   <h2>Musical Floppy Drives</h2> | |
|                   <hr class="star-primary"> | |
|                   <img class="img-fluid img-centered" src="img/portfolio/floppy.jpg" alt=""> | |
|                   <p>Being the type of person who has dozens of floppy drives, I wired them up to a Arduino to play | |
|                     music.</p> | |
|                   <iframe width="560" height="315" src="https://www.youtube.com/embed/DBrR6sE-vaY" frameborder="0" | |
|                           allow="autoplay; encrypted-media" allowfullscreen></iframe> | |
| 
 | |
|                   <iframe width="560" height="315" src="https://www.youtube.com/embed/Y5msiFa54Ug" frameborder="0" | |
|                           allow="autoplay; encrypted-media" allowfullscreen></iframe> | |
|                   <ul class="list-inline item-details"> | |
|                     <li>Date: | |
|                       <strong> | |
|                         June 2017 | |
|                       </strong> | |
|                     </li> | |
|                     <li>Skills: | |
|                       <strong> | |
|                         <a href="#">c++</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="#">Arduino</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="#">Electrical Wiring</a> | |
|                       </strong> | |
|                     </li> | |
|                   </ul> | |
|                   <button class="btn btn-success" type="button" data-dismiss="modal"> | |
|                     <i class="fa fa-times"></i> | |
|                     Close</button> | |
|                 </div> | |
|               </div> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </div> | |
|     <!-- Panda Quotes --> | |
|     <div class="portfolio-modal modal fade" id="portfolioQuotes" tabindex="-1" role="dialog" aria-hidden="true"> | |
|       <div class="modal-dialog" role="document"> | |
|         <div class="modal-content"> | |
|           <div class="close-modal" data-dismiss="modal"> | |
|             <div class="lr"> | |
|               <div class="rl"></div> | |
|             </div> | |
|           </div> | |
|           <div class="container"> | |
|             <div class="row"> | |
|               <div class="col-lg-8 mx-auto"> | |
|                 <div class="modal-body"> | |
|                   <h2>Quotes Website for a Friend</h2> | |
|                   <hr class="star-primary"> | |
|                   <img class="img-fluid img-centered" src="img/portfolio/quotes.png" alt=""> | |
|                   <p>In high school my friend had a static web page where he posted quotes that people said. During | |
|                     winter break I decided amp up his project and | |
|                   create a dynamic website in PHP that would display the quotes on pictures of pandas. Along with | |
|                     displaying quotes, this website also has a web forum where | |
|                   registered users can submit new quotes.</p> | |
|                   <ul class="list-inline item-details"> | |
|                     <li>Date: | |
|                       <strong> | |
|                         December 2016 | |
|                       </strong> | |
|                     </li> | |
|                     <li>Skills: | |
|                       <strong> | |
|                         <a href="http://php.net">PHP</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/html/">HTML</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/sql/">SQL</a> | |
|                       </strong> | |
|                     </li> | |
|                   </ul> | |
|                   <button class="btn btn-success" type="button" data-dismiss="modal"> | |
|                     <i class="fa fa-times"></i> | |
|                     Close</button> | |
|                 </div> | |
|               </div> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </div> | |
| 
 | |
|     <!-- Brick Hack 4 --> | |
|     <div class="portfolio-modal modal fade" id="brickHack4" tabindex="-1" role="dialog" aria-hidden="true"> | |
|       <div class="modal-dialog" role="document"> | |
|         <div class="modal-content"> | |
|           <div class="close-modal" data-dismiss="modal"> | |
|             <div class="lr"> | |
|               <div class="rl"></div> | |
|             </div> | |
|           </div> | |
|           <div class="container"> | |
|             <div class="row"> | |
|               <div class="col-lg-8 mx-auto"> | |
|                 <div class="modal-body"> | |
|                   <h2>What the Trend?</h2> | |
|                   <hr class="star-primary"> | |
|                   <img class="img-fluid img-centered" src="img/portfolio/trend.jpg" alt=""> | |
|                   <p>This app was built at <a href="https://brickhack.io/">BrickHack4</a> -- my first hackathon. | |
|                     What the Trend is a web game where players compete against each other to submit the most trending | |
|                     word- according to the Google Trends API. Players each log into a game on their own device, and are | |
|                     given a word. They each must append a word to the phrase to make it more trending on google.</p> | |
|                   <ul class="list-inline item-details"> | |
|                     <li>Date: | |
|                       <strong> | |
|                         January 2018 | |
|                       </strong> | |
|                     </li> | |
|                     <li>Skills: | |
|                       <strong> | |
|                         <a href="https://www.javascript.com/">JavaScript</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="#">NodeJs</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/html/">HTML</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/sql/">SQL</a> | |
|                       </strong> | |
|                     </li> | |
|                   </ul> | |
|                   <button class="btn btn-success" type="button" data-dismiss="modal"> | |
|                     <i class="fa fa-times"></i> | |
|                     Close</button> | |
|                 </div> | |
|               </div> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </div> | |
| 
 | |
|     <!-- Tiger-OS website --> | |
|     <div class="portfolio-modal modal fade" id="tigerOSWebsite" tabindex="-1" role="dialog" aria-hidden="true"> | |
|       <div class="modal-dialog" role="document"> | |
|         <div class="modal-content"> | |
|           <div class="close-modal" data-dismiss="modal"> | |
|             <div class="lr"> | |
|               <div class="rl"></div> | |
|             </div> | |
|           </div> | |
|           <div class="container"> | |
|             <div class="row"> | |
|               <div class="col-lg-8 mx-auto"> | |
|                 <div class="modal-body"> | |
|                   <h2>Tiger-OS Website</h2> | |
|                   <hr class="star-primary"> | |
|                   <img class="img-fluid img-centered" src="img/portfolio/tiger-os.png" alt=""> | |
|                   <p>This is a simple bootstrap website I made for RITLUG(RIT's Linux User Group). Check the website | |
|                   out live <a href="http://tigeros.ritlug.com/">here</a>.</p> | |
|                   <ul class="list-inline item-details"> | |
|                     <li>Date: | |
|                       <strong> | |
|                         November 2017 | |
|                       </strong> | |
|                     </li> | |
|                     <li>Skills: | |
|                       <strong> | |
|                         <a href="http://php.net">Bootstrap</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/html/">HTML</a> | |
|                       </strong> | |
|                     </li> | |
|                   </ul> | |
|                   <button class="btn btn-success" type="button" data-dismiss="modal"> | |
|                     <i class="fa fa-times"></i> | |
|                     Close</button> | |
|                 </div> | |
|               </div> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </div> | |
| 
 | |
|     <!-- Panda Games --> | |
|     <div class="portfolio-modal modal fade" id="pandaGames" tabindex="-1" role="dialog" aria-hidden="true"> | |
|       <div class="modal-dialog" role="document"> | |
|         <div class="modal-content"> | |
|           <div class="close-modal" data-dismiss="modal"> | |
|             <div class="lr"> | |
|               <div class="rl"></div> | |
|             </div> | |
|           </div> | |
|           <div class="container"> | |
|             <div class="row"> | |
|               <div class="col-lg-8 mx-auto"> | |
|                 <div class="modal-body"> | |
|                   <h2>Panda Games</h2> | |
|                   <hr class="star-primary"> | |
|                   <img class="img-fluid img-centered" src="img/portfolio/clubpanda.png" alt=""> | |
|                   <p>In the journey of learning JavaScript I decided to compile a few of the games I made into a website | |
|                   that kept track of scores like an old arcade.</p> | |
|                   <iframe width="560" height="315" src="https://www.youtube.com/embed/QhJYKBj3K08" frameborder="0" | |
|                           allow="autoplay; encrypted-media" allowfullscreen></iframe> | |
|                   <p>Check out this project on <a href="https://github.com/jrtechs/Club-Panda">Github</a>.</p> | |
|                   <ul class="list-inline item-details"> | |
|                     <li>Date: | |
|                       <strong> | |
|                         May 2017 | |
|                       </strong> | |
|                     </li> | |
|                     <li>Skills: | |
|                       <strong> | |
|                         <a href="https://www.javascript.com/">JavaScript</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="http://php.net">PHP</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/html/">HTML</a> | |
|                       </strong> | |
|                       <strong> | |
|                         <a href="https://www.w3schools.com/sql/">SQL</a> | |
|                       </strong> | |
|                     </li> | |
|                   </ul> | |
|                   <button class="btn btn-success" type="button" data-dismiss="modal"> | |
|                     <i class="fa fa-times"></i> | |
|                     Close</button> | |
|                 </div> | |
|               </div> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </div> | |
| 
 | |
|     <!-- Bash Manager --> | |
|     <div class="portfolio-modal modal fade" id="bashManager" tabindex="-1" role="dialog" aria-hidden="true"> | |
|       <div class="modal-dialog" role="document"> | |
|         <div class="modal-content"> | |
|           <div class="close-modal" data-dismiss="modal"> | |
|             <div class="lr"> | |
|               <div class="rl"></div> | |
|             </div> | |
|           </div> | |
|           <div class="container"> | |
|             <div class="row"> | |
|               <div class="col-lg-8 mx-auto"> | |
|                 <div class="modal-body"> | |
|                   <h2>Bash Manager</h2> | |
|                   <hr class="star-primary"> | |
|                   <img class="img-fluid img-centered" src="img/portfolio/bash_manager.png" alt=""> | |
|                   <p>This is a project that I used to push myself to learn more Python. Since I have nearly a dozen ssh | |
|                   keys installed on numerous servers, I decided to make a application to make managing all the | |
|                   connections easier. This application is now used by myself and a couple of friends on a daily basis. | |
|                     Check it out on <a href="https://github.com/jrtechs/bash_manager">github</a>, I have been | |
|                     consistently pushing updates.</p> | |
|                   <ul class="list-inline item-details"> | |
|                     <li>Date: | |
|                       <strong> | |
|                         October 2017 | |
|                       </strong> | |
|                     </li> | |
|                     <li>Skills: | |
|                       <strong> | |
|                         <a href="https://www.python.org/">Python</a> | |
|                       </strong> | |
|                     </li> | |
|                   </ul> | |
|                   <button class="btn btn-success" type="button" data-dismiss="modal"> | |
|                     <i class="fa fa-times"></i> | |
|                     Close</button> | |
|                 </div> | |
|               </div> | |
|             </div> | |
|           </div> | |
|         </div> | |
|       </div> | |
|     </div> | |
| 
 | |
|     <!-- Bootstrap core JavaScript --> | |
|     <script src="js/jquery.min.js"></script> | |
|     <script src="js/popper.min.js"></script> | |
|     <script src="js/bootstrap.min.js"></script> | |
| 
 | |
|     <!-- Plugin JavaScript --> | |
|     <script src="js/jquery.easing.min.js"></script> | |
| 
 | |
|     <!-- For contact form --> | |
|     <script src='https://www.google.com/recaptcha/api.js'></script> | |
| 
 | |
| 
 | |
|   <!-- | |
|                         __,,,,_ | |
|        _ __..-;''`--/'/ /.',-`-. | |
|    (`/' ` |  \ \ \\ / / / / .-'/`,_ | |
|   /'`\ \   |  \ | \| // // / -.,/_,'-, | |
|  /<7' ;  \ \  | ; ||/ /| | \/    |`-/,/-.,_,/') | |
| /  _.-, `,-\,__|  _-| / \ \/|_/  |    '-/.;.\' | |
| `-`  f/ ;      / __/ \__ `/ |__/ | | |
|      `-'      |  -| =|\_  \  |-' | | |
|            __/   /_..-' `  ),'  // | |
|        fL ((__.-'((___..-'' \__.' | |
|   Wacha doing here? | |
|   Check out more of my code at https://github.com/jrtechs | |
|  | |
|   --> | |
| 
 | |
|   </body> | |
| 
 | |
| </html>
 |