Updated the website.
This commit is contained in:
parent
62d84dad87
commit
65e4ed8477
9 changed files with 2299 additions and 7 deletions
|
|
@ -1,7 +1,9 @@
|
|||
body {
|
||||
font-family: 'Roboto', sans-serif;
|
||||
color: rgb(200, 195, 188);
|
||||
margin: -20px 0
|
||||
margin: -20px 0;
|
||||
background-color:#27313f
|
||||
|
||||
}
|
||||
|
||||
p {
|
||||
|
|
@ -317,7 +319,7 @@ ul {
|
|||
background-color: rgba(45, 58, 75, 0.5);
|
||||
padding: 0px 60px;
|
||||
position: relative;
|
||||
margin: 10vh auto 0 auto;
|
||||
margin: 5vh auto 0 auto;
|
||||
}
|
||||
|
||||
.home-content h1 {
|
||||
|
|
@ -336,7 +338,7 @@ ul {
|
|||
}
|
||||
|
||||
.home-content .home-box-content {
|
||||
margin-top: 45px;
|
||||
margin-top: 25px;
|
||||
background-color: #455871;
|
||||
position: relative;
|
||||
right: -100px;
|
||||
|
|
@ -415,6 +417,7 @@ ul {
|
|||
|
||||
#links .about-content .about-box-text {
|
||||
text-align: center;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.about-content .about-box-text h4 {
|
||||
|
|
@ -719,6 +722,10 @@ ul {
|
|||
margin-right: 15px;
|
||||
}
|
||||
|
||||
#links .about-content .about-box-text {
|
||||
margin-top: -250px;
|
||||
}
|
||||
|
||||
.projects-content {
|
||||
width: 100vh;
|
||||
height: 100vh;
|
||||
|
|
@ -1409,3 +1416,48 @@ body.lb-disable-scrolling {
|
|||
li {
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.dropbtn {
|
||||
background-color: #455871;
|
||||
color: white;
|
||||
padding: 16px;
|
||||
font-size: 16px;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
float: right;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.dropdown-content {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: #455871;
|
||||
min-width: 160px;
|
||||
box-shadow: 0px 8px 16px
|
||||
0px rgba(0, 0, 0, 0.2);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.dropdown-content a {
|
||||
color: white;
|
||||
padding: 12px 16px;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.dropdown-content a:hover {
|
||||
background-color: #4d627e
|
||||
}
|
||||
|
||||
.dropdown:hover .dropdown-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.dropdown:hover .dropbtn {
|
||||
background-color: #4d627e;
|
||||
}
|
||||
738
es/index.html
Normal file
738
es/index.html
Normal file
|
|
@ -0,0 +1,738 @@
|
|||
<!doctype html>
|
||||
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
|
||||
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
|
||||
<!--[if IE 8]> <html class="no-js lt-ie9" lang=""> <![endif]-->
|
||||
<!--[if gt IE 8]><!-->
|
||||
<html class="no-js" lang=""> <!--<![endif]-->
|
||||
|
||||
<head>gi
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<title>Batuhan Başoğlu</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="apple-touch-icon" href="../apple-touch-icon.png">
|
||||
|
||||
<link rel="stylesheet" href="../css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../css/bootstrap-theme.min.css">
|
||||
<link rel="stylesheet" href="../css/styles.css">
|
||||
|
||||
<script src="../js/vendor/modernizr-3.6.0-respond-1.4.2.min.js"></script>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css"
|
||||
integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="angionymous">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!--[if lt IE 8]>
|
||||
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
|
||||
<![endif]-->
|
||||
|
||||
<nav class="nav">
|
||||
<div class="burger">
|
||||
<div class="burger__patty"></div>
|
||||
</div>
|
||||
|
||||
<ul class="nav__list">
|
||||
<li class="nav__item">
|
||||
<a href="#home" class="nav__link c-blue"><img src="../img/home-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#links" class="nav__link c-yellow scrolly"><img src="../img/link-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#skills" class="nav__link c-red"><img src="../img/skills-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#experience" class="nav__link c-green"><img src="../img/work-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#projects" class="nav__link c-red"><img src="../img/projects-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#education" class="nav__link c-red"><img src="../img/education-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#contact" class="nav__link c-green"><img src="../img/contact-icon.png" alt=""></a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="dropdown">
|
||||
<button class="dropbtn">
|
||||
<img src="../img/es.png" width="20" height="15"> Español
|
||||
</button>
|
||||
|
||||
<div class="dropdown-content">
|
||||
<a href="../index.html">
|
||||
<img src="../img/en.png"
|
||||
width="20" height="15"> English</a>
|
||||
<a href="../fr/index.html">
|
||||
<img src="../img/fr.png"
|
||||
width="20" height="15"> Français</a>
|
||||
<a href="../tr/index.html">
|
||||
<img src="../img/tr.png"
|
||||
width="20" height="15"> Türkçe</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="panel b-blue" id="home">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="home-content">
|
||||
<div class="home-heading">
|
||||
<h1><em>Batuhan Berk Başoğlu</em> <br>Software Developer</h1>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="home-box-content">
|
||||
<div class="left-text">
|
||||
<h4>About me</h4>
|
||||
<p>Motivated Software Developer with an extensive knowledge of web development, design, and coding,
|
||||
as well as experience in a wide range of programming languages, frameworks, and tools. Proven success
|
||||
in developing and deploying applications, websites, and web services. Highly organized and detail-oriented,
|
||||
with a knack for finding creative solutions to challenging problems.
|
||||
</p>
|
||||
<div class="primary-button">
|
||||
<a href="../resume/CV_Batuhan.pdf">Download Resume</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-image">
|
||||
<img src="../img/batuhan-basoglu.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-yellow" id="links">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="about-content">
|
||||
<div style="padding-top: 10%;" class="heading">
|
||||
<h4>Links</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="about-box-content">
|
||||
<img src="../img/social.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-7 col-md-offset-5">
|
||||
<div class="about-box-text">
|
||||
<h4>Professional</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-linkedin"></i> <a href="https://www.linkedin.com/in/batuhan-basoglu/">LinkedIn</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-github"></i> <a href="https://github.com/batuhan-basoglu">GitHub</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-wordpress"></i> <a href="https://arcticpress.basoglu.co/">Blog</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h4>Personal</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-mastodon"></i> <a rel="me" href="https://mastodon.social/@batuhan_basoglu">Mastodon</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-pixelfed"></i> <a href="https://pixelfed.social/@batuhan_basoglu">Pixelfed</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h4>Contact</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-phone"></i> <a href="tel:+14385963135">Phone</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-envelope"></i> <a href="mailto:batuhanbasoglu@mailbox.org">E-Mail</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-matrix-org"></i> <a href="https://matrix.to/#/@arctichawk1:mozilla.org">Matrix</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h4>Tipping</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-coffee"></i> <a rel="me" href="https://ko-fi.com/batuhanbasoglu">Ko-Fi</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-liberapay "></i> <a href="https://liberapay.com/batuhan-basoglu/">Liberapay</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="primary-button">
|
||||
<a href="#contact">Contact Me</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-yellow" id="skills">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="about-content">
|
||||
<div style="padding-top: 20%;" class="heading">
|
||||
<h4>Skills</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
<div class="about-box-text" style="margin-top: 0;">
|
||||
<h4>Languages and Skills</h4>
|
||||
<ul>
|
||||
<li>Git</li>
|
||||
<li>Python</li>
|
||||
<li>Java</li>
|
||||
<li>Android Studio</li>
|
||||
<li>JavaScript</li>
|
||||
<li>Visual Studio</li>
|
||||
<li>Node.js</li>
|
||||
<li>React.js</li>
|
||||
<li>Angular</li>
|
||||
<li>JQuery</li>
|
||||
<li>Bootstrap</li>
|
||||
<li>EJS</li>
|
||||
<li>Spring Framework</li>
|
||||
<li>REST APIs</li>
|
||||
<li>C</li>
|
||||
<li>C++</li>
|
||||
<li>C#</li>
|
||||
<li>.NET</li>
|
||||
<li>ASP.NET</li>
|
||||
<li>HTML</li>
|
||||
<li>CSS</li>
|
||||
<li>MySQL</li>
|
||||
<li>IIS</li>
|
||||
<li>Microsoft Azure</li>
|
||||
<li>Oracle Cloud</li>
|
||||
<li>Docker</li>
|
||||
<li>MATLAB</li>
|
||||
<li>ModelSim</li>
|
||||
<li>AutoCAD</li>
|
||||
<li>TypeScript</li>
|
||||
<li>PHP</li>
|
||||
<li>Vue</li>
|
||||
<li>Kotlin</li>
|
||||
<li>CMake</li>
|
||||
<li>Shell Scripting</li>
|
||||
<li>Quartus</li>
|
||||
<li>Microsoft Azure</li>
|
||||
<li>Roff</li>
|
||||
<li>Windows</li>
|
||||
<li>Linux</li>
|
||||
<li>Ubuntu</li>
|
||||
<li>Fedora</li>
|
||||
<li>Arch Linux</li>
|
||||
<li>Android</li>
|
||||
<li>iOS</li>
|
||||
<li>Embedded Systems</li>
|
||||
<li>FPGA</li>
|
||||
<li>HCS12</li>
|
||||
<li>Altera DE2</li>
|
||||
<li>K-CSP</li>
|
||||
<li>K-ECS</li>sn
|
||||
<li>Adobe After Effects</li>
|
||||
<li>Adobe Photoshop</li>
|
||||
<li>Adobe Premiere Pro</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-red" id="experience">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="projects-content">
|
||||
<div class="heading">
|
||||
<h4>Work Experience</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="owl-carousel owl-theme projects-container">
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/inovestor.jpg" data-lightbox="image-1"><img src="../img/inovestor.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Inovestor</h4>
|
||||
<p>(2021-2024)</p>
|
||||
<p> Worked as a web developer, doing a contract work through RPM Eco to develop it's website.
|
||||
Did a contract work through IBM to develop VIA Rail Canada's website.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://www.inovestor.com/">Visit Website</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/kargi.jpg" data-lightbox="image-1"><img src="../img/kargi.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Kargı Building Complex</h4>
|
||||
<p>(2021-2021)</p>
|
||||
<p>Worked part-time as web developer. Made a website for the Kargı building complex. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://kargisitesi.com/">Visit Website</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/atelye70.jpg" data-lightbox="image-1"><img src="../img/atelye70.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Atelye70</h4>
|
||||
<p>(2016-2016)</p>
|
||||
<p>Learned how to design houses with Atelye70 through an internship.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://atelye70.com/">Visit Website</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-red" id="projects">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="projects-content">
|
||||
<div class="heading">
|
||||
<h4>Projects</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="owl-carousel owl-theme projects-container">
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-17.jpg" data-lightbox="image-2"><img src="../img/project-17.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>RPM Eco's Website</h4>
|
||||
<p>Worked on RPM Eco’s Website through a contract with RPM Eco. It is made using HTML, CSS,
|
||||
.NET, C#, React and MySQL. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://rpm.eco">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-13.jpg" data-lightbox="image-2"><img src="../img/project-13.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>VIA Rail Canada's Website</h4>
|
||||
<p>Worked on VIA Rail Canada’s Website through a contract with IBM. It is made using HTML,
|
||||
CSS, .NET, C#, AngularJS and MySQL. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://reservia.viarail.ca">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-19.jpg" data-lightbox="image-2"><img src="../img/project-19.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Git Hosting Service</h4>
|
||||
<p>A self-hosted Git hosting Website hosted in a Ubuntu Linux server via Oracle. It is configured
|
||||
with Forgejo which is a fork of Gitea. It is made using Go, Javascript, Roff and CSS. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://git.batuhan.basoglu.co/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-18.jpg" data-lightbox="image-2"><img src="../img/project-18.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Photo Management Website</h4>
|
||||
<p>A self-hosted Photo Management Website hosted in a Ubuntu Linux server via Oracle. It is configured
|
||||
with PhotoPrism which uses AI to index its photos. It is made using Go, Vue and CSS. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://arcticcloud.basoglu.co:2342/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-16.jpg" data-lightbox="image-2"><img src="../img/project-16.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My WordPress Blog</h4>
|
||||
<p>A self-hosted WordPress blog hosted in a Ubuntu Linux server via Oracle. It is configured
|
||||
with Activity Pub to connect with other federated social networks.
|
||||
WordPress is made using PHP, JavaScript, CSS and HTML.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://arcticpress.basoglu.co/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-15.jpg" data-lightbox="image-2"><img src="../img/project-15.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Nextcloud Storage</h4>
|
||||
<p>A self-hosted Nextcloud storage hosted in a Ubuntu Linux server via Oracle. Nextcloud is
|
||||
made using JavaScript, PHP, TypeScript and Vue.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://arcticcloud.basoglu.co">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-12.jpg" data-lightbox="image-2"><img src="../img/project-12.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Kargı Building Complex's Website</h4>
|
||||
<p>Built Kargi Building Complex’s Website using HTML, CSS, Javascript, Angular and
|
||||
Typescript. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://kargisitesi.com/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-11.jpg" data-lightbox="image-2"><img src="../img/project-11.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Vehicle Anti-Theft Face Recognition System</h4>
|
||||
<p>Made a Vehicle Anti-Theft Face Recognition System using Python, HTML, CMake, Node.js,
|
||||
Roff, CSS and Java in Computer Engineering Design Project. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://sherm048.github.io/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-10.png" data-lightbox="image-2"><img src="../img/project-10.png" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Olympus Home Service Application</h4>
|
||||
<p>Made Android appliance app using Java in Introduction to Software Engineering class. It
|
||||
is an appliance application where user can set up his/her details and order appliance
|
||||
services from user’s home. App is made on the Android Studio.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/SEG2105-Olympus-Android-Application">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-9.jpg" data-lightbox="image-2"><img src="../img/project-9.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Hospital-Patient Management System</h4>
|
||||
<p>Made a Hospital Management System using React.js in Software Design and Architecture
|
||||
class. In the Hospital Management System, user can manage the patients and assign them to
|
||||
the hospital employees where each employee makes different actions.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/Hospital-Management-System">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-8.jpg" data-lightbox="image-2"><img src="../img/project-8.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Kene's Cribs Website</h4>
|
||||
<p>Made a real estate website using HTML, CSS and React.js in Analysis and Design of User
|
||||
Interfaces class. It is a website where user can browse the houses, search them in google
|
||||
maps or contact the agents from the contact form.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/Kene-s-Cribs-Website">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-7.jpg" data-lightbox="image-2"><img src="../img/project-7.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Batuhan's Bikes Website Alternative with Chatbot Service</h4>
|
||||
<p>Made an alternative service company with chatbot service website using HTML, CSS and
|
||||
Node.js in Analysis and Design of User Interfaces class. </p>
|
||||
<div class="primary-button">
|
||||
<a
|
||||
href="https://batuhan-basoglu.github.io/Batuhan-s-Bikes-Website-Alternative-with-Chatbot-Service/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-6.jpg" data-lightbox="image-2"><img src="../img/project-6.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Batuhan's Bikes Website Alternative with Validating Form</h4>
|
||||
<p>Made an alternative service company with validating form website using HTML, CSS and
|
||||
Node.js in Analysis and Design of User Interfaces class.</p>
|
||||
<div class="primary-button">
|
||||
<a
|
||||
href="https://batuhan-basoglu.github.io/Batuhan-s-Bikes-Website-Alternative-with-Validating-Form/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-5.jpg" data-lightbox="image-2"><img src="../img/project-5.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Batuhan's Bikes Website</h4>
|
||||
<p>Made a service company website using HTML and CSS in Analysis and Design of User
|
||||
Interfaces class. It is a bike service company website which talks about bike repairs.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Batuhan-s-Bikes-Website/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-4.jpg" data-lightbox="image-2"><img src="../img/project-4.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Sam's Mart Website Alternative</h4>
|
||||
<p>Made an alternative grocery store website using HTML, CSS and Node.js in Analysis and
|
||||
Design of User Interfaces class.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Sam-s-Mart-Website-Alternative/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-3.jpg" data-lightbox="image-2"><img src="../img/project-3.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Sam's Mart Website</h4>
|
||||
<p>Made a grocery store website using HTML, CSS and Node.js in Analysis and Design of User
|
||||
Interfaces class. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Sam-s-Mart-Website/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-2.jpg" data-lightbox="image-2"><img src="../img/project-2.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Questionnaire of the Facebook UI/UX Website Alternative with Analysis Function</h4>
|
||||
<p>Made an alternative Facebook survey with analysis function website using HTML and CSS,
|
||||
Node.js and EJS in Analysis and Design of User Interfaces class.</p>
|
||||
<div class="primary-button">
|
||||
<a
|
||||
href="https://github.com/batuhan-basoglu/Questionnaire-of-the-Facebook-UI-UX-Website-Alternative-with-Analysis-Function">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-1.jpg" data-lightbox="image-2"><img src="../img/project-1.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Questionnaire of the Facebook UI/UX Website</h4>
|
||||
<p>Made a Facebook survey Website using HTML and CSS in Analysis and Design of User
|
||||
Interfaces class. This is a website that asks questions about the Facebook user interface
|
||||
with submit button to send the answers.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Questionnaire-of-the-Facebook-UI-UX-Website/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-14.jpg" data-lightbox="image-2"><img src="../img/project-14.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Website</h4>
|
||||
<p>This very website that I made with HTML, CSS and Javascript.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/Batuhan-Basoglu-Website">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-red" id="education">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="projects-content">
|
||||
<div style="padding-top: 20%" class="heading">
|
||||
<h4>Education</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="slider">
|
||||
|
||||
<!-- slide 1 -->
|
||||
<div class="slide">
|
||||
<a href="../img/UOttawa_Diploma.jpg" data-lightbox="image-3"><img src="../img/UOttawa_Diploma.jpg"
|
||||
alt="" /></a>
|
||||
<div class="text-content">
|
||||
<h4>University of Ottawa Computer Engineering Degree</h4>
|
||||
<p>Bachelor of Applied Science in Computer Engineering. 4 years of Computer Engineering
|
||||
program, graduated in 7 June 2021.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- slide 2 -->
|
||||
<div class="slide">
|
||||
<a href="../img/ironring-certificate.jpg" data-lightbox="image-3"><img
|
||||
src="../img/ironring-certificate-sm.jpg" alt="" /></a>
|
||||
<div class="text-content">
|
||||
<h4>The Ritual of the Calling of an Engineer</h4>
|
||||
<p>Official Engineer declaration by Seven Wardens Inc. A Binding document which declares the
|
||||
integrity of the Engineer. Received at 13 June 2021.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- slide 3 -->
|
||||
<div class="slide">
|
||||
<a href="../img/horizons-certificate.jpg" data-lightbox="image-3"><img
|
||||
src="../img/horizons-certificate.jpg" alt="" /></a>
|
||||
<div class="text-content">
|
||||
<h4>The Horizons Professional Development Program</h4>
|
||||
<p>Career development program to improve professional connections through the use of
|
||||
professional resources. Received at 26 April 2021.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Control buttons -->
|
||||
<button class="btn btn-next"><img src="../img/next.png" /></button>
|
||||
<button class="btn btn-prev"><img src="../img/prev.png" /></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-green" id="contact">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="contact-content">
|
||||
<div class="heading">
|
||||
<h4>Contact me</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<div class="contact-form">
|
||||
<form id="contact" action="https://formspree.io/f/mrgvywen" method="POST">
|
||||
<fieldset>
|
||||
<input name="name" type="text" class="form-control" id="name" placeholder="Your Name"
|
||||
required>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<input name="email" type="email" class="form-control" id="email" placeholder="Email" required>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<textarea name="message" rows="6" class="form-control" id="message" placeholder="Message"
|
||||
required></textarea>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<button type="submit" id="form-submit" class="btn">Send Message</button>
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="more-info">
|
||||
<p>Feel free to get in touch with me, and I will respond as promptly as possible.<br><br>
|
||||
<em>Montreal, QC</em>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12">
|
||||
<div class="footer">
|
||||
<p>Copyright © 2024 Batuhan Başoğlu</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
|
||||
<script src="..//ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
|
||||
<script>window.jQuery || document.write('<script src="../js/vendor/jquery-3.6.4.min.js"><\/script>')</script>
|
||||
|
||||
<script src="../js/vendor/jquery-migrate.min.js"></script>
|
||||
<script src="js/vendor/bootstrap.min.js"></script>
|
||||
|
||||
<script src="../js/plugins.js"></script>
|
||||
<script src="../js/main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
738
fr/index.html
Normal file
738
fr/index.html
Normal file
|
|
@ -0,0 +1,738 @@
|
|||
<!doctype html>
|
||||
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
|
||||
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
|
||||
<!--[if IE 8]> <html class="no-js lt-ie9" lang=""> <![endif]-->
|
||||
<!--[if gt IE 8]><!-->
|
||||
<html class="no-js" lang=""> <!--<![endif]-->
|
||||
|
||||
<head>gi
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<title>Batuhan Başoğlu</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="apple-touch-icon" href="../apple-touch-icon.png">
|
||||
|
||||
<link rel="stylesheet" href="../css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../css/bootstrap-theme.min.css">
|
||||
<link rel="stylesheet" href="../css/styles.css">
|
||||
|
||||
<script src="../js/vendor/modernizr-3.6.0-respond-1.4.2.min.js"></script>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css"
|
||||
integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="angionymous">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!--[if lt IE 8]>
|
||||
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
|
||||
<![endif]-->
|
||||
|
||||
<nav class="nav">
|
||||
<div class="burger">
|
||||
<div class="burger__patty"></div>
|
||||
</div>
|
||||
|
||||
<ul class="nav__list">
|
||||
<li class="nav__item">
|
||||
<a href="#home" class="nav__link c-blue"><img src="../img/home-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#links" class="nav__link c-yellow scrolly"><img src="../img/link-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#skills" class="nav__link c-red"><img src="../img/skills-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#experience" class="nav__link c-green"><img src="../img/work-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#projects" class="nav__link c-red"><img src="../img/projects-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#education" class="nav__link c-red"><img src="../img/education-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#contact" class="nav__link c-green"><img src="../img/contact-icon.png" alt=""></a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="dropdown">
|
||||
<button class="dropbtn">
|
||||
<img src="../img/fr.png" width="20" height="15"> Français
|
||||
</button>
|
||||
|
||||
<div class="dropdown-content">
|
||||
<a href="../index.html">
|
||||
<img src="../img/en.png"
|
||||
width="20" height="15"> English</a>
|
||||
<a href="../es/index.html">
|
||||
<img src="../img/es.png"
|
||||
width="20" height="15"> Español</a>
|
||||
<a href="../tr/index.html">
|
||||
<img src="../img/tr.png"
|
||||
width="20" height="15"> Türkçe</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="panel b-blue" id="home">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="home-content">
|
||||
<div class="home-heading">
|
||||
<h1><em>Batuhan Berk Başoğlu</em> <br>Software Developer</h1>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="home-box-content">
|
||||
<div class="left-text">
|
||||
<h4>About me</h4>
|
||||
<p>Motivated Software Developer with an extensive knowledge of web development, design, and coding,
|
||||
as well as experience in a wide range of programming languages, frameworks, and tools. Proven success
|
||||
in developing and deploying applications, websites, and web services. Highly organized and detail-oriented,
|
||||
with a knack for finding creative solutions to challenging problems.
|
||||
</p>
|
||||
<div class="primary-button">
|
||||
<a href="../resume/CV_Batuhan.pdf">Download Resume</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-image">
|
||||
<img src="../img/batuhan-basoglu.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-yellow" id="links">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="about-content">
|
||||
<div style="padding-top: 10%;" class="heading">
|
||||
<h4>Links</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="about-box-content">
|
||||
<img src="../img/social.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-7 col-md-offset-5">
|
||||
<div class="about-box-text">
|
||||
<h4>Professional</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-linkedin"></i> <a href="https://www.linkedin.com/in/batuhan-basoglu/">LinkedIn</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-github"></i> <a href="https://github.com/batuhan-basoglu">GitHub</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-wordpress"></i> <a href="https://arcticpress.basoglu.co/">Blog</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h4>Personal</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-mastodon"></i> <a rel="me" href="https://mastodon.social/@batuhan_basoglu">Mastodon</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-pixelfed"></i> <a href="https://pixelfed.social/@batuhan_basoglu">Pixelfed</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h4>Contact</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-phone"></i> <a href="tel:+14385963135">Phone</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-envelope"></i> <a href="mailto:batuhanbasoglu@mailbox.org">E-Mail</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-matrix-org"></i> <a href="https://matrix.to/#/@arctichawk1:mozilla.org">Matrix</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h4>Tipping</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-coffee"></i> <a rel="me" href="https://ko-fi.com/batuhanbasoglu">Ko-Fi</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-liberapay "></i> <a href="https://liberapay.com/batuhan-basoglu/">Liberapay</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="primary-button">
|
||||
<a href="#contact">Contact Me</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-yellow" id="skills">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="about-content">
|
||||
<div style="padding-top: 20%;" class="heading">
|
||||
<h4>Skills</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
<div class="about-box-text" style="margin-top: 0;">
|
||||
<h4>Languages and Skills</h4>
|
||||
<ul>
|
||||
<li>Git</li>
|
||||
<li>Python</li>
|
||||
<li>Java</li>
|
||||
<li>Android Studio</li>
|
||||
<li>JavaScript</li>
|
||||
<li>Visual Studio</li>
|
||||
<li>Node.js</li>
|
||||
<li>React.js</li>
|
||||
<li>Angular</li>
|
||||
<li>JQuery</li>
|
||||
<li>Bootstrap</li>
|
||||
<li>EJS</li>
|
||||
<li>Spring Framework</li>
|
||||
<li>REST APIs</li>
|
||||
<li>C</li>
|
||||
<li>C++</li>
|
||||
<li>C#</li>
|
||||
<li>.NET</li>
|
||||
<li>ASP.NET</li>
|
||||
<li>HTML</li>
|
||||
<li>CSS</li>
|
||||
<li>MySQL</li>
|
||||
<li>IIS</li>
|
||||
<li>Microsoft Azure</li>
|
||||
<li>Oracle Cloud</li>
|
||||
<li>Docker</li>
|
||||
<li>MATLAB</li>
|
||||
<li>ModelSim</li>
|
||||
<li>AutoCAD</li>
|
||||
<li>TypeScript</li>
|
||||
<li>PHP</li>
|
||||
<li>Vue</li>
|
||||
<li>Kotlin</li>
|
||||
<li>CMake</li>
|
||||
<li>Shell Scripting</li>
|
||||
<li>Quartus</li>
|
||||
<li>Microsoft Azure</li>
|
||||
<li>Roff</li>
|
||||
<li>Windows</li>
|
||||
<li>Linux</li>
|
||||
<li>Ubuntu</li>
|
||||
<li>Fedora</li>
|
||||
<li>Arch Linux</li>
|
||||
<li>Android</li>
|
||||
<li>iOS</li>
|
||||
<li>Embedded Systems</li>
|
||||
<li>FPGA</li>
|
||||
<li>HCS12</li>
|
||||
<li>Altera DE2</li>
|
||||
<li>K-CSP</li>
|
||||
<li>K-ECS</li>sn
|
||||
<li>Adobe After Effects</li>
|
||||
<li>Adobe Photoshop</li>
|
||||
<li>Adobe Premiere Pro</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-red" id="experience">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="projects-content">
|
||||
<div class="heading">
|
||||
<h4>Work Experience</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="owl-carousel owl-theme projects-container">
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/inovestor.jpg" data-lightbox="image-1"><img src="../img/inovestor.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Inovestor</h4>
|
||||
<p>(2021-2024)</p>
|
||||
<p> Worked as a web developer, doing a contract work through RPM Eco to develop it's website.
|
||||
Did a contract work through IBM to develop VIA Rail Canada's website.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://www.inovestor.com/">Visit Website</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/kargi.jpg" data-lightbox="image-1"><img src="../img/kargi.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Kargı Building Complex</h4>
|
||||
<p>(2021-2021)</p>
|
||||
<p>Worked part-time as web developer. Made a website for the Kargı building complex. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://kargisitesi.com/">Visit Website</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/atelye70.jpg" data-lightbox="image-1"><img src="../img/atelye70.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Atelye70</h4>
|
||||
<p>(2016-2016)</p>
|
||||
<p>Learned how to design houses with Atelye70 through an internship.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://atelye70.com/">Visit Website</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-red" id="projects">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="projects-content">
|
||||
<div class="heading">
|
||||
<h4>Projects</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="owl-carousel owl-theme projects-container">
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-17.jpg" data-lightbox="image-2"><img src="../img/project-17.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>RPM Eco's Website</h4>
|
||||
<p>Worked on RPM Eco’s Website through a contract with RPM Eco. It is made using HTML, CSS,
|
||||
.NET, C#, React and MySQL. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://rpm.eco">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-13.jpg" data-lightbox="image-2"><img src="../img/project-13.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>VIA Rail Canada's Website</h4>
|
||||
<p>Worked on VIA Rail Canada’s Website through a contract with IBM. It is made using HTML,
|
||||
CSS, .NET, C#, AngularJS and MySQL. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://reservia.viarail.ca">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-19.jpg" data-lightbox="image-2"><img src="../img/project-19.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Git Hosting Service</h4>
|
||||
<p>A self-hosted Git hosting Website hosted in a Ubuntu Linux server via Oracle. It is configured
|
||||
with Forgejo which is a fork of Gitea. It is made using Go, Javascript, Roff and CSS. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://git.batuhan.basoglu.co/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-18.jpg" data-lightbox="image-2"><img src="../img/project-18.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Photo Management Website</h4>
|
||||
<p>A self-hosted Photo Management Website hosted in a Ubuntu Linux server via Oracle. It is configured
|
||||
with PhotoPrism which uses AI to index its photos. It is made using Go, Vue and CSS. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://arcticcloud.basoglu.co:2342/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-16.jpg" data-lightbox="image-2"><img src="../img/project-16.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My WordPress Blog</h4>
|
||||
<p>A self-hosted WordPress blog hosted in a Ubuntu Linux server via Oracle. It is configured
|
||||
with Activity Pub to connect with other federated social networks.
|
||||
WordPress is made using PHP, JavaScript, CSS and HTML.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://arcticpress.basoglu.co/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-15.jpg" data-lightbox="image-2"><img src="../img/project-15.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Nextcloud Storage</h4>
|
||||
<p>A self-hosted Nextcloud storage hosted in a Ubuntu Linux server via Oracle. Nextcloud is
|
||||
made using JavaScript, PHP, TypeScript and Vue.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://arcticcloud.basoglu.co">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-12.jpg" data-lightbox="image-2"><img src="../img/project-12.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Kargı Building Complex's Website</h4>
|
||||
<p>Built Kargi Building Complex’s Website using HTML, CSS, Javascript, Angular and
|
||||
Typescript. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://kargisitesi.com/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-11.jpg" data-lightbox="image-2"><img src="../img/project-11.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Vehicle Anti-Theft Face Recognition System</h4>
|
||||
<p>Made a Vehicle Anti-Theft Face Recognition System using Python, HTML, CMake, Node.js,
|
||||
Roff, CSS and Java in Computer Engineering Design Project. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://sherm048.github.io/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-10.png" data-lightbox="image-2"><img src="../img/project-10.png" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Olympus Home Service Application</h4>
|
||||
<p>Made Android appliance app using Java in Introduction to Software Engineering class. It
|
||||
is an appliance application where user can set up his/her details and order appliance
|
||||
services from user’s home. App is made on the Android Studio.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/SEG2105-Olympus-Android-Application">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-9.jpg" data-lightbox="image-2"><img src="../img/project-9.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Hospital-Patient Management System</h4>
|
||||
<p>Made a Hospital Management System using React.js in Software Design and Architecture
|
||||
class. In the Hospital Management System, user can manage the patients and assign them to
|
||||
the hospital employees where each employee makes different actions.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/Hospital-Management-System">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-8.jpg" data-lightbox="image-2"><img src="../img/project-8.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Kene's Cribs Website</h4>
|
||||
<p>Made a real estate website using HTML, CSS and React.js in Analysis and Design of User
|
||||
Interfaces class. It is a website where user can browse the houses, search them in google
|
||||
maps or contact the agents from the contact form.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/Kene-s-Cribs-Website">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-7.jpg" data-lightbox="image-2"><img src="../img/project-7.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Batuhan's Bikes Website Alternative with Chatbot Service</h4>
|
||||
<p>Made an alternative service company with chatbot service website using HTML, CSS and
|
||||
Node.js in Analysis and Design of User Interfaces class. </p>
|
||||
<div class="primary-button">
|
||||
<a
|
||||
href="https://batuhan-basoglu.github.io/Batuhan-s-Bikes-Website-Alternative-with-Chatbot-Service/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-6.jpg" data-lightbox="image-2"><img src="../img/project-6.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Batuhan's Bikes Website Alternative with Validating Form</h4>
|
||||
<p>Made an alternative service company with validating form website using HTML, CSS and
|
||||
Node.js in Analysis and Design of User Interfaces class.</p>
|
||||
<div class="primary-button">
|
||||
<a
|
||||
href="https://batuhan-basoglu.github.io/Batuhan-s-Bikes-Website-Alternative-with-Validating-Form/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-5.jpg" data-lightbox="image-2"><img src="../img/project-5.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Batuhan's Bikes Website</h4>
|
||||
<p>Made a service company website using HTML and CSS in Analysis and Design of User
|
||||
Interfaces class. It is a bike service company website which talks about bike repairs.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Batuhan-s-Bikes-Website/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-4.jpg" data-lightbox="image-2"><img src="../img/project-4.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Sam's Mart Website Alternative</h4>
|
||||
<p>Made an alternative grocery store website using HTML, CSS and Node.js in Analysis and
|
||||
Design of User Interfaces class.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Sam-s-Mart-Website-Alternative/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-3.jpg" data-lightbox="image-2"><img src="../img/project-3.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Sam's Mart Website</h4>
|
||||
<p>Made a grocery store website using HTML, CSS and Node.js in Analysis and Design of User
|
||||
Interfaces class. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Sam-s-Mart-Website/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-2.jpg" data-lightbox="image-2"><img src="../img/project-2.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Questionnaire of the Facebook UI/UX Website Alternative with Analysis Function</h4>
|
||||
<p>Made an alternative Facebook survey with analysis function website using HTML and CSS,
|
||||
Node.js and EJS in Analysis and Design of User Interfaces class.</p>
|
||||
<div class="primary-button">
|
||||
<a
|
||||
href="https://github.com/batuhan-basoglu/Questionnaire-of-the-Facebook-UI-UX-Website-Alternative-with-Analysis-Function">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-1.jpg" data-lightbox="image-2"><img src="../img/project-1.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Questionnaire of the Facebook UI/UX Website</h4>
|
||||
<p>Made a Facebook survey Website using HTML and CSS in Analysis and Design of User
|
||||
Interfaces class. This is a website that asks questions about the Facebook user interface
|
||||
with submit button to send the answers.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Questionnaire-of-the-Facebook-UI-UX-Website/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-14.jpg" data-lightbox="image-2"><img src="../img/project-14.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Website</h4>
|
||||
<p>This very website that I made with HTML, CSS and Javascript.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/Batuhan-Basoglu-Website">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-red" id="education">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="projects-content">
|
||||
<div style="padding-top: 20%" class="heading">
|
||||
<h4>Education</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="slider">
|
||||
|
||||
<!-- slide 1 -->
|
||||
<div class="slide">
|
||||
<a href="../img/UOttawa_Diploma.jpg" data-lightbox="image-3"><img src="../img/UOttawa_Diploma.jpg"
|
||||
alt="" /></a>
|
||||
<div class="text-content">
|
||||
<h4>University of Ottawa Computer Engineering Degree</h4>
|
||||
<p>Bachelor of Applied Science in Computer Engineering. 4 years of Computer Engineering
|
||||
program, graduated in 7 June 2021.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- slide 2 -->
|
||||
<div class="slide">
|
||||
<a href="../img/ironring-certificate.jpg" data-lightbox="image-3"><img
|
||||
src="../img/ironring-certificate-sm.jpg" alt="" /></a>
|
||||
<div class="text-content">
|
||||
<h4>The Ritual of the Calling of an Engineer</h4>
|
||||
<p>Official Engineer declaration by Seven Wardens Inc. A Binding document which declares the
|
||||
integrity of the Engineer. Received at 13 June 2021.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- slide 3 -->
|
||||
<div class="slide">
|
||||
<a href="../img/horizons-certificate.jpg" data-lightbox="image-3"><img
|
||||
src="../img/horizons-certificate.jpg" alt="" /></a>
|
||||
<div class="text-content">
|
||||
<h4>The Horizons Professional Development Program</h4>
|
||||
<p>Career development program to improve professional connections through the use of
|
||||
professional resources. Received at 26 April 2021.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Control buttons -->
|
||||
<button class="btn btn-next"><img src="../img/next.png" /></button>
|
||||
<button class="btn btn-prev"><img src="../img/prev.png" /></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-green" id="contact">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="contact-content">
|
||||
<div class="heading">
|
||||
<h4>Contact me</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<div class="contact-form">
|
||||
<form id="contact" action="https://formspree.io/f/mrgvywen" method="POST">
|
||||
<fieldset>
|
||||
<input name="name" type="text" class="form-control" id="name" placeholder="Your Name"
|
||||
required>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<input name="email" type="email" class="form-control" id="email" placeholder="Email" required>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<textarea name="message" rows="6" class="form-control" id="message" placeholder="Message"
|
||||
required></textarea>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<button type="submit" id="form-submit" class="btn">Send Message</button>
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="more-info">
|
||||
<p>Feel free to get in touch with me, and I will respond as promptly as possible.<br><br>
|
||||
<em>Montreal, QC</em>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12">
|
||||
<div class="footer">
|
||||
<p>Copyright © 2024 Batuhan Başoğlu</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
|
||||
<script src="..//ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
|
||||
<script>window.jQuery || document.write('<script src="../js/vendor/jquery-3.6.4.min.js"><\/script>')</script>
|
||||
|
||||
<script src="../js/vendor/jquery-migrate.min.js"></script>
|
||||
<script src="js/vendor/bootstrap.min.js"></script>
|
||||
|
||||
<script src="../js/plugins.js"></script>
|
||||
<script src="../js/main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
BIN
img/en.png
Normal file
BIN
img/en.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.5 KiB |
BIN
img/es.png
Normal file
BIN
img/es.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.4 KiB |
BIN
img/fr.png
Normal file
BIN
img/fr.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
img/tr.png
Normal file
BIN
img/tr.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.5 KiB |
32
index.html
32
index.html
|
|
@ -26,6 +26,7 @@
|
|||
<!--[if lt IE 8]>
|
||||
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
|
||||
<![endif]-->
|
||||
|
||||
<nav class="nav">
|
||||
<div class="burger">
|
||||
<div class="burger__patty"></div>
|
||||
|
|
@ -56,6 +57,24 @@
|
|||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="dropdown">
|
||||
<button class="dropbtn">
|
||||
<img src="img/en.png" width="20" height="15"> English
|
||||
</button>
|
||||
|
||||
<div class="dropdown-content">
|
||||
<a href="/fr/index.html">
|
||||
<img src="img/fr.png"
|
||||
width="20" height="15"> Français</a>
|
||||
<a href="/es/index.html">
|
||||
<img src="img/es.png"
|
||||
width="20" height="15"> Español</a>
|
||||
<a href="/tr/index.html">
|
||||
<img src="img/tr.png"
|
||||
width="20" height="15"> Türkçe</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="panel b-blue" id="home">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
|
|
@ -144,6 +163,15 @@
|
|||
<i class="fa fa-matrix-org"></i> <a href="https://matrix.to/#/@arctichawk1:mozilla.org">Matrix</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h4>Tipping</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-coffee"></i> <a rel="me" href="https://ko-fi.com/batuhanbasoglu">Ko-Fi</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-liberapay "></i> <a href="https://liberapay.com/batuhan-basoglu/">Liberapay</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="primary-button">
|
||||
<a href="#contact">Contact Me</a>
|
||||
</div>
|
||||
|
|
@ -678,9 +706,7 @@
|
|||
<div class="col-md-4">
|
||||
<div class="more-info">
|
||||
<p>Feel free to get in touch with me, and I will respond as promptly as possible.<br><br>
|
||||
<em>Montreal, QC,
|
||||
<br>1220 Crescent Street #304,
|
||||
<br>H3G 2A9</em>
|
||||
<em>Montreal, QC</em>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
738
tr/index.html
Normal file
738
tr/index.html
Normal file
|
|
@ -0,0 +1,738 @@
|
|||
<!doctype html>
|
||||
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang=""> <![endif]-->
|
||||
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8" lang=""> <![endif]-->
|
||||
<!--[if IE 8]> <html class="no-js lt-ie9" lang=""> <![endif]-->
|
||||
<!--[if gt IE 8]><!-->
|
||||
<html class="no-js" lang=""> <!--<![endif]-->
|
||||
|
||||
<head>gi
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<title>Batuhan Başoğlu</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="apple-touch-icon" href="../apple-touch-icon.png">
|
||||
|
||||
<link rel="stylesheet" href="../css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="../css/bootstrap-theme.min.css">
|
||||
<link rel="stylesheet" href="../css/styles.css">
|
||||
|
||||
<script src="../js/vendor/modernizr-3.6.0-respond-1.4.2.min.js"></script>
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.2.0/css/fork-awesome.min.css"
|
||||
integrity="sha256-XoaMnoYC5TH6/+ihMEnospgm0J1PM/nioxbOUdnM8HY=" crossorigin="angionymous">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!--[if lt IE 8]>
|
||||
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
|
||||
<![endif]-->
|
||||
|
||||
<nav class="nav">
|
||||
<div class="burger">
|
||||
<div class="burger__patty"></div>
|
||||
</div>
|
||||
|
||||
<ul class="nav__list">
|
||||
<li class="nav__item">
|
||||
<a href="#home" class="nav__link c-blue"><img src="../img/home-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#links" class="nav__link c-yellow scrolly"><img src="../img/link-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#skills" class="nav__link c-red"><img src="../img/skills-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#experience" class="nav__link c-green"><img src="../img/work-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#projects" class="nav__link c-red"><img src="../img/projects-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#education" class="nav__link c-red"><img src="../img/education-icon.png" alt=""></a>
|
||||
</li>
|
||||
<li class="nav__item">
|
||||
<a href="#contact" class="nav__link c-green"><img src="../img/contact-icon.png" alt=""></a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="dropdown">
|
||||
<button class="dropbtn">
|
||||
<img src="../img/tr.png" width="20" height="15"> Türkçe
|
||||
</button>
|
||||
|
||||
<div class="dropdown-content">
|
||||
<a href="../index.html">
|
||||
<img src="../img/en.png"
|
||||
width="20" height="15"> English</a>
|
||||
<a href="../fr/index.html">
|
||||
<img src="../img/fr.png"
|
||||
width="20" height="15"> Français</a>
|
||||
<a href="../es/index.html">
|
||||
<img src="../img/es.png"
|
||||
width="20" height="15"> Español</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<section class="panel b-blue" id="home">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="home-content">
|
||||
<div class="home-heading">
|
||||
<h1><em>Batuhan Berk Başoğlu</em> <br>Software Developer</h1>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="home-box-content">
|
||||
<div class="left-text">
|
||||
<h4>About me</h4>
|
||||
<p>Motivated Software Developer with an extensive knowledge of web development, design, and coding,
|
||||
as well as experience in a wide range of programming languages, frameworks, and tools. Proven success
|
||||
in developing and deploying applications, websites, and web services. Highly organized and detail-oriented,
|
||||
with a knack for finding creative solutions to challenging problems.
|
||||
</p>
|
||||
<div class="primary-button">
|
||||
<a href="../resume/CV_Batuhan.pdf">Download Resume</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right-image">
|
||||
<img src="../img/batuhan-basoglu.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-yellow" id="links">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="about-content">
|
||||
<div style="padding-top: 10%;" class="heading">
|
||||
<h4>Links</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="about-box-content">
|
||||
<img src="../img/social.jpg" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-7 col-md-offset-5">
|
||||
<div class="about-box-text">
|
||||
<h4>Professional</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-linkedin"></i> <a href="https://www.linkedin.com/in/batuhan-basoglu/">LinkedIn</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-github"></i> <a href="https://github.com/batuhan-basoglu">GitHub</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-wordpress"></i> <a href="https://arcticpress.basoglu.co/">Blog</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h4>Personal</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-mastodon"></i> <a rel="me" href="https://mastodon.social/@batuhan_basoglu">Mastodon</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-pixelfed"></i> <a href="https://pixelfed.social/@batuhan_basoglu">Pixelfed</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h4>Contact</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-phone"></i> <a href="tel:+14385963135">Phone</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-envelope"></i> <a href="mailto:batuhanbasoglu@mailbox.org">E-Mail</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-matrix-org"></i> <a href="https://matrix.to/#/@arctichawk1:mozilla.org">Matrix</a>
|
||||
</li>
|
||||
</ul>
|
||||
<h4>Tipping</h4>
|
||||
<ul class="fa-ul">
|
||||
<li>
|
||||
<i class="fa fa-coffee"></i> <a rel="me" href="https://ko-fi.com/batuhanbasoglu">Ko-Fi</a>
|
||||
</li>
|
||||
<li>
|
||||
<i class="fa fa-liberapay "></i> <a href="https://liberapay.com/batuhan-basoglu/">Liberapay</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="primary-button">
|
||||
<a href="#contact">Contact Me</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-yellow" id="skills">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="about-content">
|
||||
<div style="padding-top: 20%;" class="heading">
|
||||
<h4>Skills</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column">
|
||||
<div class="about-box-text" style="margin-top: 0;">
|
||||
<h4>Languages and Skills</h4>
|
||||
<ul>
|
||||
<li>Git</li>
|
||||
<li>Python</li>
|
||||
<li>Java</li>
|
||||
<li>Android Studio</li>
|
||||
<li>JavaScript</li>
|
||||
<li>Visual Studio</li>
|
||||
<li>Node.js</li>
|
||||
<li>React.js</li>
|
||||
<li>Angular</li>
|
||||
<li>JQuery</li>
|
||||
<li>Bootstrap</li>
|
||||
<li>EJS</li>
|
||||
<li>Spring Framework</li>
|
||||
<li>REST APIs</li>
|
||||
<li>C</li>
|
||||
<li>C++</li>
|
||||
<li>C#</li>
|
||||
<li>.NET</li>
|
||||
<li>ASP.NET</li>
|
||||
<li>HTML</li>
|
||||
<li>CSS</li>
|
||||
<li>MySQL</li>
|
||||
<li>IIS</li>
|
||||
<li>Microsoft Azure</li>
|
||||
<li>Oracle Cloud</li>
|
||||
<li>Docker</li>
|
||||
<li>MATLAB</li>
|
||||
<li>ModelSim</li>
|
||||
<li>AutoCAD</li>
|
||||
<li>TypeScript</li>
|
||||
<li>PHP</li>
|
||||
<li>Vue</li>
|
||||
<li>Kotlin</li>
|
||||
<li>CMake</li>
|
||||
<li>Shell Scripting</li>
|
||||
<li>Quartus</li>
|
||||
<li>Microsoft Azure</li>
|
||||
<li>Roff</li>
|
||||
<li>Windows</li>
|
||||
<li>Linux</li>
|
||||
<li>Ubuntu</li>
|
||||
<li>Fedora</li>
|
||||
<li>Arch Linux</li>
|
||||
<li>Android</li>
|
||||
<li>iOS</li>
|
||||
<li>Embedded Systems</li>
|
||||
<li>FPGA</li>
|
||||
<li>HCS12</li>
|
||||
<li>Altera DE2</li>
|
||||
<li>K-CSP</li>
|
||||
<li>K-ECS</li>sn
|
||||
<li>Adobe After Effects</li>
|
||||
<li>Adobe Photoshop</li>
|
||||
<li>Adobe Premiere Pro</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-red" id="experience">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="projects-content">
|
||||
<div class="heading">
|
||||
<h4>Work Experience</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="owl-carousel owl-theme projects-container">
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/inovestor.jpg" data-lightbox="image-1"><img src="../img/inovestor.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Inovestor</h4>
|
||||
<p>(2021-2024)</p>
|
||||
<p> Worked as a web developer, doing a contract work through RPM Eco to develop it's website.
|
||||
Did a contract work through IBM to develop VIA Rail Canada's website.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://www.inovestor.com/">Visit Website</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/kargi.jpg" data-lightbox="image-1"><img src="../img/kargi.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Kargı Building Complex</h4>
|
||||
<p>(2021-2021)</p>
|
||||
<p>Worked part-time as web developer. Made a website for the Kargı building complex. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://kargisitesi.com/">Visit Website</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/atelye70.jpg" data-lightbox="image-1"><img src="../img/atelye70.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Atelye70</h4>
|
||||
<p>(2016-2016)</p>
|
||||
<p>Learned how to design houses with Atelye70 through an internship.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://atelye70.com/">Visit Website</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-red" id="projects">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="projects-content">
|
||||
<div class="heading">
|
||||
<h4>Projects</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="owl-carousel owl-theme projects-container">
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-17.jpg" data-lightbox="image-2"><img src="../img/project-17.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>RPM Eco's Website</h4>
|
||||
<p>Worked on RPM Eco’s Website through a contract with RPM Eco. It is made using HTML, CSS,
|
||||
.NET, C#, React and MySQL. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://rpm.eco">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-13.jpg" data-lightbox="image-2"><img src="../img/project-13.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>VIA Rail Canada's Website</h4>
|
||||
<p>Worked on VIA Rail Canada’s Website through a contract with IBM. It is made using HTML,
|
||||
CSS, .NET, C#, AngularJS and MySQL. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://reservia.viarail.ca">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-19.jpg" data-lightbox="image-2"><img src="../img/project-19.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Git Hosting Service</h4>
|
||||
<p>A self-hosted Git hosting Website hosted in a Ubuntu Linux server via Oracle. It is configured
|
||||
with Forgejo which is a fork of Gitea. It is made using Go, Javascript, Roff and CSS. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://git.batuhan.basoglu.co/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-18.jpg" data-lightbox="image-2"><img src="../img/project-18.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Photo Management Website</h4>
|
||||
<p>A self-hosted Photo Management Website hosted in a Ubuntu Linux server via Oracle. It is configured
|
||||
with PhotoPrism which uses AI to index its photos. It is made using Go, Vue and CSS. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://arcticcloud.basoglu.co:2342/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-16.jpg" data-lightbox="image-2"><img src="../img/project-16.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My WordPress Blog</h4>
|
||||
<p>A self-hosted WordPress blog hosted in a Ubuntu Linux server via Oracle. It is configured
|
||||
with Activity Pub to connect with other federated social networks.
|
||||
WordPress is made using PHP, JavaScript, CSS and HTML.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://arcticpress.basoglu.co/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-15.jpg" data-lightbox="image-2"><img src="../img/project-15.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Nextcloud Storage</h4>
|
||||
<p>A self-hosted Nextcloud storage hosted in a Ubuntu Linux server via Oracle. Nextcloud is
|
||||
made using JavaScript, PHP, TypeScript and Vue.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://arcticcloud.basoglu.co">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-12.jpg" data-lightbox="image-2"><img src="../img/project-12.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Kargı Building Complex's Website</h4>
|
||||
<p>Built Kargi Building Complex’s Website using HTML, CSS, Javascript, Angular and
|
||||
Typescript. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://kargisitesi.com/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-11.jpg" data-lightbox="image-2"><img src="../img/project-11.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Vehicle Anti-Theft Face Recognition System</h4>
|
||||
<p>Made a Vehicle Anti-Theft Face Recognition System using Python, HTML, CMake, Node.js,
|
||||
Roff, CSS and Java in Computer Engineering Design Project. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://sherm048.github.io/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-10.png" data-lightbox="image-2"><img src="../img/project-10.png" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Olympus Home Service Application</h4>
|
||||
<p>Made Android appliance app using Java in Introduction to Software Engineering class. It
|
||||
is an appliance application where user can set up his/her details and order appliance
|
||||
services from user’s home. App is made on the Android Studio.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/SEG2105-Olympus-Android-Application">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-9.jpg" data-lightbox="image-2"><img src="../img/project-9.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Hospital-Patient Management System</h4>
|
||||
<p>Made a Hospital Management System using React.js in Software Design and Architecture
|
||||
class. In the Hospital Management System, user can manage the patients and assign them to
|
||||
the hospital employees where each employee makes different actions.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/Hospital-Management-System">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-8.jpg" data-lightbox="image-2"><img src="../img/project-8.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Kene's Cribs Website</h4>
|
||||
<p>Made a real estate website using HTML, CSS and React.js in Analysis and Design of User
|
||||
Interfaces class. It is a website where user can browse the houses, search them in google
|
||||
maps or contact the agents from the contact form.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/Kene-s-Cribs-Website">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-7.jpg" data-lightbox="image-2"><img src="../img/project-7.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Batuhan's Bikes Website Alternative with Chatbot Service</h4>
|
||||
<p>Made an alternative service company with chatbot service website using HTML, CSS and
|
||||
Node.js in Analysis and Design of User Interfaces class. </p>
|
||||
<div class="primary-button">
|
||||
<a
|
||||
href="https://batuhan-basoglu.github.io/Batuhan-s-Bikes-Website-Alternative-with-Chatbot-Service/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-6.jpg" data-lightbox="image-2"><img src="../img/project-6.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Batuhan's Bikes Website Alternative with Validating Form</h4>
|
||||
<p>Made an alternative service company with validating form website using HTML, CSS and
|
||||
Node.js in Analysis and Design of User Interfaces class.</p>
|
||||
<div class="primary-button">
|
||||
<a
|
||||
href="https://batuhan-basoglu.github.io/Batuhan-s-Bikes-Website-Alternative-with-Validating-Form/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-5.jpg" data-lightbox="image-2"><img src="../img/project-5.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Batuhan's Bikes Website</h4>
|
||||
<p>Made a service company website using HTML and CSS in Analysis and Design of User
|
||||
Interfaces class. It is a bike service company website which talks about bike repairs.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Batuhan-s-Bikes-Website/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-4.jpg" data-lightbox="image-2"><img src="../img/project-4.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Sam's Mart Website Alternative</h4>
|
||||
<p>Made an alternative grocery store website using HTML, CSS and Node.js in Analysis and
|
||||
Design of User Interfaces class.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Sam-s-Mart-Website-Alternative/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-3.jpg" data-lightbox="image-2"><img src="../img/project-3.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Sam's Mart Website</h4>
|
||||
<p>Made a grocery store website using HTML, CSS and Node.js in Analysis and Design of User
|
||||
Interfaces class. </p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Sam-s-Mart-Website/">Discover More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-2.jpg" data-lightbox="image-2"><img src="../img/project-2.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Questionnaire of the Facebook UI/UX Website Alternative with Analysis Function</h4>
|
||||
<p>Made an alternative Facebook survey with analysis function website using HTML and CSS,
|
||||
Node.js and EJS in Analysis and Design of User Interfaces class.</p>
|
||||
<div class="primary-button">
|
||||
<a
|
||||
href="https://github.com/batuhan-basoglu/Questionnaire-of-the-Facebook-UI-UX-Website-Alternative-with-Analysis-Function">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-1.jpg" data-lightbox="image-2"><img src="../img/project-1.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>Questionnaire of the Facebook UI/UX Website</h4>
|
||||
<p>Made a Facebook survey Website using HTML and CSS in Analysis and Design of User
|
||||
Interfaces class. This is a website that asks questions about the Facebook user interface
|
||||
with submit button to send the answers.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://batuhan-basoglu.github.io/Questionnaire-of-the-Facebook-UI-UX-Website/">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="project-item">
|
||||
<a href="../img/project-14.jpg" data-lightbox="image-2"><img src="../img/project-14.jpg" alt=""></a>
|
||||
<div class="text-content">
|
||||
<h4>My Website</h4>
|
||||
<p>This very website that I made with HTML, CSS and Javascript.</p>
|
||||
<div class="primary-button">
|
||||
<a href="https://github.com/batuhan-basoglu/Batuhan-Basoglu-Website">Discover
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-red" id="education">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="projects-content">
|
||||
<div style="padding-top: 20%" class="heading">
|
||||
<h4>Education</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="slider">
|
||||
|
||||
<!-- slide 1 -->
|
||||
<div class="slide">
|
||||
<a href="../img/UOttawa_Diploma.jpg" data-lightbox="image-3"><img src="../img/UOttawa_Diploma.jpg"
|
||||
alt="" /></a>
|
||||
<div class="text-content">
|
||||
<h4>University of Ottawa Computer Engineering Degree</h4>
|
||||
<p>Bachelor of Applied Science in Computer Engineering. 4 years of Computer Engineering
|
||||
program, graduated in 7 June 2021.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- slide 2 -->
|
||||
<div class="slide">
|
||||
<a href="../img/ironring-certificate.jpg" data-lightbox="image-3"><img
|
||||
src="../img/ironring-certificate-sm.jpg" alt="" /></a>
|
||||
<div class="text-content">
|
||||
<h4>The Ritual of the Calling of an Engineer</h4>
|
||||
<p>Official Engineer declaration by Seven Wardens Inc. A Binding document which declares the
|
||||
integrity of the Engineer. Received at 13 June 2021.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- slide 3 -->
|
||||
<div class="slide">
|
||||
<a href="../img/horizons-certificate.jpg" data-lightbox="image-3"><img
|
||||
src="../img/horizons-certificate.jpg" alt="" /></a>
|
||||
<div class="text-content">
|
||||
<h4>The Horizons Professional Development Program</h4>
|
||||
<p>Career development program to improve professional connections through the use of
|
||||
professional resources. Received at 26 April 2021.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Control buttons -->
|
||||
<button class="btn btn-next"><img src="../img/next.png" /></button>
|
||||
<button class="btn btn-prev"><img src="../img/prev.png" /></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
<section class="panel b-green" id="contact">
|
||||
<article class="panel__wrapper">
|
||||
<div class="panel__content">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<div class="contact-content">
|
||||
<div class="heading">
|
||||
<h4>Contact me</h4>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-8">
|
||||
<div class="contact-form">
|
||||
<form id="contact" action="https://formspree.io/f/mrgvywen" method="POST">
|
||||
<fieldset>
|
||||
<input name="name" type="text" class="form-control" id="name" placeholder="Your Name"
|
||||
required>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<input name="email" type="email" class="form-control" id="email" placeholder="Email" required>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<textarea name="message" rows="6" class="form-control" id="message" placeholder="Message"
|
||||
required></textarea>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<button type="submit" id="form-submit" class="btn">Send Message</button>
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="more-info">
|
||||
<p>Feel free to get in touch with me, and I will respond as promptly as possible.<br><br>
|
||||
<em>Montreal, QC</em>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12">
|
||||
<div class="footer">
|
||||
<p>Copyright © 2024 Batuhan Başoğlu</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
|
||||
<script src="..//ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
|
||||
<script>window.jQuery || document.write('<script src="../js/vendor/jquery-3.6.4.min.js"><\/script>')</script>
|
||||
|
||||
<script src="../js/vendor/jquery-migrate.min.js"></script>
|
||||
<script src="js/vendor/bootstrap.min.js"></script>
|
||||
|
||||
<script src="../js/plugins.js"></script>
|
||||
<script src="../js/main.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Reference in a new issue