mirror of
https://github.com/tiennm99/is-a-dev.git
synced 2026-08-08 12:23:54 +00:00
Add files via upload
This commit is contained in:
@@ -0,0 +1,351 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>Page not found</title>
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
|
||||
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
|
||||
|
||||
<link rel="shortcut icon" href="https://avatars.githubusercontent.com/u/93589643?v=4">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Nunito:wght@200..1000&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300..700&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="style.css">
|
||||
|
||||
</head>
|
||||
|
||||
<body class="bg-dark text-white" style="font-family: Nunito, sans-serif;">
|
||||
<nav class="navbar navbar-expand-lg text-white fixed-top shadow-sm navbar-blur mt-3 rounded-pill">
|
||||
<div class="container" >
|
||||
<a class="navbar-brand text-white" href="#">
|
||||
<b>Maell</b>
|
||||
</a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
|
||||
data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
|
||||
aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav m-auto mb-2 mb-lg-0 me-3" >
|
||||
<li class="nav-item ps-3">
|
||||
<a class="nav-link text-white" href="#">Home</a>
|
||||
</li>
|
||||
<li class="nav-item ps-3">
|
||||
<a class="nav-link text-white" href="#pendidikan">Riwayat Pendidikan</a>
|
||||
</li>
|
||||
<li class="nav-item ps-3">
|
||||
<a class="nav-link text-white" href="#keahlian">Keahlian</a>
|
||||
</li>
|
||||
<li class="nav-item ps-3">
|
||||
<a class="nav-link text-white" href="#kontak">Hubungi Saya</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="d-flex">
|
||||
<a class="btn btn-warning rounded-pill" data-bs-toggle="modal" data-bs-target="#modalKontak">
|
||||
<b>Hubungi Saya</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<div class="pt-4"></div>
|
||||
|
||||
<section class="mt-5 pt-5" >
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-3 mb-5 mb-md-0">
|
||||
<img src="assets/images/echa.jpeg" alt="ramadhan" class="img-fluid rounded-4 shadow-lg">
|
||||
</div>
|
||||
<div class="col-md-9 mt-md-5">
|
||||
<div class="ms-md-4 pt-md-5">
|
||||
<div class=" text-md-start text-center">
|
||||
<h1>Muhammad Aldyn</h1>
|
||||
<h5 class="text-secondary">
|
||||
<b>Software Engineer</b> at
|
||||
<a href="spesolution.com" class="text-decoration-none text-primary-emphasis" target="_blank">POLWIANGI</a>
|
||||
</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="pendidikan" class="pt-5">
|
||||
<div class="container pt-5">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<div class="row">
|
||||
<h3 class="mb-3">Riwayat Pendidikan</h3>
|
||||
|
||||
<div class="col-md-12 mb-3">
|
||||
<div class="card shadow-sm border-0 rounded-4 card-blur text-white">
|
||||
<div class="card-body ">
|
||||
<span class="badge bg-warning text-black">2019 - 2020</span>
|
||||
<h5 class="mt-2 mb-0">Politeknik Negeri Jember</h5>
|
||||
<p class="text-light mb-0">Teknik Informatika | IPK. 3.71</p>
|
||||
|
||||
<div class="mt-2">
|
||||
<p class="mb-1">Mata Kuliah yang saya ikuti : </p>
|
||||
<span class="badge bg-warning-subtle text-black">Data Science</span>
|
||||
<span class="badge bg-warning-subtle text-black">Pemrograman Mobile</span>
|
||||
<span class="badge bg-warning-subtle text-black">Bisnis Digital</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12 mb-3">
|
||||
<div class="card shadow-sm border-0 rounded-4 card-blur text-white">
|
||||
<div class="card-body">
|
||||
<span class="badge bg-warning text-black">2015 - 2018</span>
|
||||
<h5 class="mt-2 mb-0">Politeknik Negeri Banyuwangi</h5>
|
||||
<p class="text-light mb-0">Teknik Informatika | IPK. 3.6</p>
|
||||
<div class="mt-2">
|
||||
<p class="mb-1">Mata Kuliah yang saya ikuti : </p>
|
||||
<span class="badge text-bg-light">Pemrograman Web</span>
|
||||
<span class="badge text-bg-light">Basis Data</span>
|
||||
<span class="badge text-bg-light">Algoritma Struktur Data</span>
|
||||
<span class="badge text-bg-light">Bahasa Inggris</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="col-md-6 mt-5 mt-md-0">
|
||||
<div class="row">
|
||||
<h3 class="mb-3">Pengalaman</h3>
|
||||
<!-- Contoh: Pengalaman Kerja, Pengalaman Sukarelawan, Magang, Organisasi, dll. -->
|
||||
|
||||
<div class="col-md-12 mb-3">
|
||||
<div class="card shadow-sm border-0 rounded-4">
|
||||
<div class="card-body">
|
||||
<span class="badge bg-secondary">2023 - Sekarang</span>
|
||||
<h5 class="mt-2 mb-0"><b>SPE Solution</b></h5>
|
||||
<p class="text-body-tertiary mb-0">Software Engineer</p>
|
||||
<hr class="mt-2 mb-3 text-body-tertiary">
|
||||
|
||||
<div class="mt-2">
|
||||
<ul class="mb-0">
|
||||
<li>Melakukan pembuatan website</li>
|
||||
<li>Bekerjasama dengan Tim untuk membuat aplikasi</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12 mb-3">
|
||||
<div class="card shadow-sm border-0 rounded-4">
|
||||
<div class="card-body">
|
||||
<span class="badge bg-secondary">2024 - Sekarang</span>
|
||||
<h5 class="mt-2 mb-0"><b>Eduwork</b></h5>
|
||||
<p class="text-body-tertiary mb-0">Mentor</p>
|
||||
<hr class="mt-2 mb-3 text-body-tertiary">
|
||||
|
||||
<div class="mt-2">
|
||||
<p class="mb-0">Memberikan mentoring kepada siswa tentang Backend Development
|
||||
dengan Golang</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- KEAHLIAN DAN KURSUS -->
|
||||
<section class="my-5 py-5" id="keahlian">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<h3 class="mb-3">Keahlian</h3>
|
||||
<!-- Keahlian atau skill yang kamu bisa atau kuasai -->
|
||||
|
||||
<a class="btn btn-primary text-bg-light text-start mb-2 me-1">
|
||||
Web Development (HTML, CSS, PHP, Laravel)
|
||||
</a>
|
||||
<a class="btn btn-primary text-bg-light text-start mb-2 me-1">
|
||||
Design UI di Figma
|
||||
</a>
|
||||
<a class="btn btn-primary text-bg-light text-start mb-2 me-1">
|
||||
Data Science
|
||||
</a>
|
||||
<a class="btn btn-primary text-bg-light text-start mb-2 me-1">
|
||||
Microsoft Office (Word, Excel, Powerpoint)
|
||||
</a>
|
||||
</div>
|
||||
<div class="col-md-6 mt-5 mt-md-0">
|
||||
<div class="row">
|
||||
<h3 class="mb-3">Kursus | Webinar | Seminar</h3>
|
||||
<div class="col-md-12 mb-3">
|
||||
<div class="card shadow-sm border-0 rounded-4">
|
||||
<div class="card-body">
|
||||
<h6 class="mt-0 mb-0">Pembuatan Web dengan PHP Laravel</h6>
|
||||
<p class="text-body-tertiary mb-0">Udemy</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-12 mb-3">
|
||||
<div class="card shadow-sm border-0 rounded-4">
|
||||
<div class="card-body">
|
||||
<h6 class="mt-0 mb-0">Mini Bootcamp UI/UX Design</h6>
|
||||
<p class="text-body-tertiary mb-0">Peduli Digital</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-md-12 mt-5 mt-md-3">
|
||||
<h3 class="mb-3">Ketertarikan</h3>
|
||||
<!-- Ketertarikan terkait industri yang kamu tuju seperti profesi, bidang, atau yang lain -->
|
||||
|
||||
<a class="btn btn-success text-bg-light text-start mb-2 me-1">
|
||||
Software Development
|
||||
</a>
|
||||
<a class="btn btn-success text-bg-light text-start mb-2 me-1">
|
||||
Product Management
|
||||
</a>
|
||||
<a class="btn btn-success text-bg-light text-start mb-2 me-1">
|
||||
UI/UX Design
|
||||
</a>
|
||||
<a class="btn btn-success text-bg-light text-start mb-2 me-1">
|
||||
Startup Bussiness
|
||||
</a>
|
||||
<a class="btn btn-success text-bg-light text-start mb-2 me-1">
|
||||
Leadership
|
||||
</a>
|
||||
<a class="btn btn-success text-bg-light text-start mb-2 me-1">
|
||||
Teaching
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- END OF KEAHLIAN DAN KURSUS -->
|
||||
|
||||
<section id="kontak">
|
||||
<div class="container py-md-5">
|
||||
<div class="row">
|
||||
<div class="col-md-7 pt-5 text-md-start text-center">
|
||||
<h1><b>Tertarik dengan Saya?</b></h1>
|
||||
<p>Hubungi saya jika ada hal yang perlu didiskusikan lebih lanjut</p>
|
||||
|
||||
<div class="mb-3">
|
||||
<a class="btn btn-primary me-1" data-bs-toggle="modal" data-bs-target="#modalKontak">
|
||||
<b>Hubungi Saya</b>
|
||||
</a>
|
||||
<a href="https://drive.google.com/file/d/1v3e1T_O9fDtETjZEbaTzR4-BAF0Fs7Dy/view"
|
||||
class="btn btn-outline-primary" target="_blank">
|
||||
<b>Download CV</b>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-5 text-start">
|
||||
<!-- Ilustrasi lainnya, cek di https://storyset.com/ (Gratis!) -->
|
||||
<img src="assets/images/ilustrasi-kontak.svg" alt="Ilustrasi" class="img-fluid">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- FOOTER -->
|
||||
<footer class="bg-dark py-3">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-12 text-center">
|
||||
<p class="text-white mb-0">Copyright © 2024 - <b>Rahmat Ramadhan Putra</b> </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
<!-- END OF FOOTER -->
|
||||
|
||||
<!-- NOTE!
|
||||
LEBIH BAIK JIKA ADA :
|
||||
- Kamu bisa tambahkan Portofolio terkait project atau hal yang telah kamu buat -->
|
||||
|
||||
<!-- MODAL KONTAK -->
|
||||
<div class="modal fade" id="modalKontak" tabindex="-1" aria-labelledby="modalKontakLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="modalKontakLabel">Hubungi Saya</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<div class="card bg-light border-success-subtle mb-3 rounded-4">
|
||||
<div class="card-body">
|
||||
<h5 class="mb-0">No. HP / Whatsapp</h5>
|
||||
<p class="mb-0">
|
||||
<b>+62 822-4421-3171</b>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card bg-light border-primary-subtle mb-3 rounded-4">
|
||||
<div class="card-body">
|
||||
<h5 class="mb-0">Linkedin</h5>
|
||||
<p class="mb-0">
|
||||
<a href="linkedin.com/in/rahmatrdn/" target="_blank">
|
||||
linkedin.com/in/<b>rahmatrdn</b>
|
||||
</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card bg-light border-dark mb-3 rounded-4">
|
||||
<div class="card-body">
|
||||
<h5 class="mb-0">Email</h5>
|
||||
<p class="mb-0">
|
||||
<b>rahmatrdn.dev@gmail.com</b>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card bg-light border-danger-subtle mb-3 rounded-4">
|
||||
<div class="card-body">
|
||||
<h5 class="mb-0">Instagram</h5>
|
||||
<p class="mb-0">
|
||||
<b><a href="https://www.instagram.com/rahmatrdn__/">@rahmatrdn__</a></b>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
|
||||
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
|
||||
crossorigin="anonymous"></script>
|
||||
|
||||
<!-- Kode Javascript agar menu pada navbar otomatis tertutup jika di klik -->
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
var navbarNav = document.getElementById('navbarSupportedContent');
|
||||
var navLinks = navbarNav.querySelectorAll('.nav-link');
|
||||
var bsCollapse = new bootstrap.Collapse(navbarNav, {
|
||||
toggle: false
|
||||
});
|
||||
|
||||
navLinks.forEach(function (link) {
|
||||
link.addEventListener('click', function () {
|
||||
if (navbarNav.classList.contains('show')) {
|
||||
bsCollapse.hide();
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@@ -0,0 +1,24 @@
|
||||
body::before {
|
||||
content: '';
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-image: linear-gradient(0deg, rgba(255, 255, 255, 0.1) 1px, transparent 1px),
|
||||
linear-gradient(90deg, rgba(255, 255, 255, 0.1) 1px, transparent 1px);
|
||||
background-size: 20px 20px;
|
||||
z-index: -1;
|
||||
}
|
||||
.navbar-blur {
|
||||
background-color: rgba(255, 255, 255, 0.10); /* Adjust the transparency as needed */
|
||||
backdrop-filter: blur(10px); /* Adjust the blur amount as needed */
|
||||
-webkit-backdrop-filter: blur(10px); /* For Safari */
|
||||
|
||||
}
|
||||
.card-blur {
|
||||
background-color: rgba(85, 85, 85, 0.6); /* Adjust the transparency as needed */
|
||||
backdrop-filter: blur(1px); /* Adjust the blur amount as needed */
|
||||
-webkit-backdrop-filter: blur(1px); /* For Safari */
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user