API tools faq
paste
Advertisement
kuchuz

Tugas 1 PWEB-D index.php

kuchuz
Oct 26th, 2021
1,753
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
PHP 13.77 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4. <head>
  5.   <meta charset="utf-8">
  6.   <meta content="width=device-width, initial-scale=1.0" name="viewport">
  7.  
  8.   <title>Fajar Satria</title>
  9.   <meta content="" name="description">
  10.   <meta content="" name="keywords">
  11.  
  12.   <!-- Favicons -->
  13.   <link href="assets/img/favicon.png" rel="icon">
  14.   <link href="assets/img/apple-touch-icon.png" rel="apple-touch-icon">
  15.  
  16.   <!-- Google Fonts -->
  17.   <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i" rel="stylesheet">
  18.  
  19.   <!-- Vendor CSS Files -->
  20.   <link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
  21.   <link href="assets/vendor/bootstrap-icons/bootstrap-icons.css" rel="stylesheet">
  22.   <link href="assets/vendor/boxicons/css/boxicons.min.css" rel="stylesheet">
  23.   <link href="assets/vendor/glightbox/css/glightbox.min.css" rel="stylesheet">
  24.   <link href="assets/vendor/remixicon/remixicon.css" rel="stylesheet">
  25.   <link href="assets/vendor/swiper/swiper-bundle.min.css" rel="stylesheet">
  26.  
  27.   <!-- Template Main CSS File -->
  28.   <link href="assets/css/style.css" rel="stylesheet">
  29.  
  30. </head>
  31.  
  32. <body>
  33.  
  34.   <!-- ======= Header ======= -->
  35.   <header id="header">
  36.     <div class="container">
  37.  
  38.       <h1><a href="/">Fajar Satria</a></h1>
  39.       <!-- Uncomment below if you prefer to use an image logo -->
  40.       <!-- <a href="/" class="mr-auto"><img src="assets/img/logo.png" alt="" class="img-fluid"></a> -->
  41.       <h2>I'm a passionate <span>web developer</span> from Ngawi</h2>
  42.  
  43.       <nav id="navbar" class="navbar">
  44.         <ul>
  45.           <li><a class="nav-link active" href="#header">Home</a></li>
  46.           <li><a class="nav-link" href="#about">About</a></li>
  47.           <li><a class="nav-link" href="#resume">Resume</a></li>
  48.           <!--<li><a class="nav-link" href="#services">Services</a></li>
  49.           <li><a class="nav-link" href="#portfolio">Portfolio</a></li>-->
  50.           <li><a class="nav-link" href="#contact">Contact</a></li>
  51.         </ul>
  52.         <i class="bi bi-list mobile-nav-toggle"></i>
  53.       </nav><!-- .navbar -->
  54.  
  55.       <div class="social-links">
  56.         <a href="#" class="twitter"><i class="bi bi-twitter"></i></a>
  57.         <a href="https://fb.com/12259" class="facebook"><i class="bi bi-facebook"></i></a>
  58.         <a href="https://instagram.com/kuchuz" class="instagram"><i class="bi bi-instagram"></i></a>
  59.         <a href="https://www.linkedin.com/in/kuchuz" class="linkedin"><i class="bi bi-linkedin"></i></a>
  60.       </div>
  61.  
  62.     </div>
  63.   </header><!-- End Header -->
  64.  
  65.   <!-- ======= About Section ======= -->
  66.   <section id="about" class="about">
  67.  
  68.     <!-- ======= About Me ======= -->
  69.     <div class="about-me container">
  70.  
  71.       <div class="section-title">
  72.         <h2>About</h2>
  73.         <p>Learn more about me</p>
  74.       </div>
  75.  
  76.       <div class="row">
  77.         <div class="col-lg-4" data-aos="fade-right">
  78.           <img src="assets/img/me.jpg" class="img-fluid" alt="">
  79.         </div>
  80.         <div class="col-lg-8 pt-4 pt-lg-0 content" data-aos="fade-left">
  81.           <h3>Back-end &amp; Website Developer</h3>
  82.           <p class="fst-italic">
  83.             My name is Fajar Satria also known as Kuchuz. I am <?=date_diff(date_create("2001-06-10"), date_create(date("Y-m-d")))->format('%y');?> years old. I have a background in IT and still study at Institut Teknologi Sepuluh Nopember. I also participated in various competition and organization. Here is my personal data.
  84.           </p>
  85.           <div class="row">
  86.             <div class="col-lg-6">
  87.               <ul>
  88.                 <li><i class="bi bi-chevron-right"></i> <strong>Birthday:</strong> <span>10 June 2001</span></li>
  89.                 <li><i class="bi bi-chevron-right"></i> <strong>Website:</strong> <span>www.kuchuz.my.id</span></li>
  90.                 <li><i class="bi bi-chevron-right"></i> <strong>Phone:</strong> <span>+62 816 417 886</span></li>
  91.                 <li><i class="bi bi-chevron-right"></i> <strong>City:</strong> <span>Ngawi, Indonesia</span></li>
  92.               </ul>
  93.             </div>
  94.             <div class="col-lg-6">
  95.               <ul>
  96.                 <li><i class="bi bi-chevron-right"></i> <strong>Age:</strong> <span><?=date_diff(date_create("2001-06-10"), date_create(date("Y-m-d")))->format('%y');?></span></li>
  97.                 <li><i class="bi bi-chevron-right"></i> <strong>Degree:</strong> <span>Bachelor</span></li>
  98.                 <li><i class="bi bi-chevron-right"></i> <strong>Email:</strong> <span>[email protected]</span></li>
  99.                 <li><i class="bi bi-chevron-right"></i> <strong>Freelance:</strong> <span>Available</span></li>
  100.               </ul>
  101.             </div>
  102.           </div>
  103.           <p>
  104.             With my educational background, I am confident that my qualification and skills could make significant contributions to the future. I am a person who can work well as part of a team and on my own. I am also hardworking, and eager to learn.
  105.           </p>
  106.         </div>
  107.       </div>
  108.  
  109.     </div><!-- End About Me -->
  110.     <!-- ======= Skills  ======= -->
  111.     <div class="skills container">
  112.  
  113.       <div class="section-title">
  114.         <h2>Skills</h2>
  115.       </div>
  116.  
  117.       <div class="row skills-content">
  118.  
  119.         <div class="col-lg-6">
  120.  
  121.           <div class="progress">
  122.             <span class="skill">HTML <i class="val">100%</i></span>
  123.             <div class="progress-bar-wrap">
  124.               <div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
  125.             </div>
  126.           </div>
  127.  
  128.           <div class="progress">
  129.             <span class="skill">CSS <i class="val">90%</i></span>
  130.             <div class="progress-bar-wrap">
  131.               <div class="progress-bar" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"></div>
  132.             </div>
  133.           </div>
  134.  
  135.           <div class="progress">
  136.             <span class="skill">JavaScript <i class="val">75%</i></span>
  137.             <div class="progress-bar-wrap">
  138.               <div class="progress-bar" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
  139.             </div>
  140.           </div>
  141.  
  142.         </div>
  143.  
  144.         <div class="col-lg-6">
  145.  
  146.           <div class="progress">
  147.             <span class="skill">PHP <i class="val">95%</i></span>
  148.             <div class="progress-bar-wrap">
  149.               <div class="progress-bar" role="progressbar" aria-valuenow="95" aria-valuemin="0" aria-valuemax="100"></div>
  150.             </div>
  151.           </div>
  152.  
  153.           <div class="progress">
  154.             <span class="skill">WordPress/CMS <i class="val">90%</i></span>
  155.             <div class="progress-bar-wrap">
  156.               <div class="progress-bar" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"></div>
  157.             </div>
  158.           </div>
  159.  
  160.           <div class="progress">
  161.             <span class="skill">Photoshop <i class="val">90%</i></span>
  162.             <div class="progress-bar-wrap">
  163.               <div class="progress-bar" role="progressbar" aria-valuenow="90" aria-valuemin="0" aria-valuemax="100"></div>
  164.             </div>
  165.           </div>
  166.  
  167.         </div>
  168.  
  169.       </div>
  170.  
  171.     </div><!-- End Skills -->
  172.   </section><!-- End About Section -->
  173.  
  174.   <!-- ======= Resume Section ======= -->
  175.   <section id="resume" class="resume">
  176.     <div class="container">
  177.  
  178.       <div class="section-title">
  179.         <h2>Resume</h2>
  180.         <p>Check My Resume</p>
  181.       </div>
  182.  
  183.       <div class="row">
  184.         <div class="col-lg-6">
  185.           <h3 class="resume-title">Education</h3>
  186.           <div class="resume-item">
  187.             <h4>Bachelor of Informatics Engineering</h4>
  188.             <h5>2019 - <font color="#18d26e">present</font></h5>
  189.             <p><em>Institut Teknologi Sepuluh Nopember, Surabaya, ID</em></p>
  190.             <p>
  191.               <ul>
  192.                 <li>Rank 38 out of 600 teams in the 2021 International CTF Competition by <a href="https://www.instagram.com/0xdarkarmy/">DarkArmy</a></li>
  193.                 <li>Staff of MedHum Division at <a href="https://forsmawi.or.id">Forsmawi</a></li>
  194.               </ul>
  195.             </p>
  196.           </div>
  197.           <div class="resume-item">
  198.             <h4>High School Diploma</h4>
  199.             <h5>2016 - 2019</h5>
  200.             <p><em>Senior High School 2, Ngawi, ID</em></p>
  201.             <p>
  202.               <ul>
  203.                 <li>1st place in the 2017 District Science Olympiad in Informatics</li>
  204.                 <li>1st place in the 2018 District Science Olympiad in Informatics</li>
  205.                 <li>Semifinalist in the Electra 8 National Olympiad by <a href="https://ee.its.ac.id">Electrical Engineering Department</a>, Institut Teknologi Sepuluh Nopember</li>
  206.                 <li>Secretary of LITEV Division at <a href="https://rakasmada.org">Rakasmada</a></li>
  207.               </ul>
  208.             </p>
  209.           </div>
  210.         </div>
  211.         <div class="col-lg-6">
  212.           <h3 class="resume-title">Professional Experience</h3>
  213.           <div class="resume-item">
  214.             <h4>Admin Sales</h4>
  215.             <h5>2021 - <font color="#18d26e">present</font></h5>
  216.             <p><em>Karier.mu By Sekolah.mu, South Jakarta, ID </em></p>
  217.             <p>
  218.             <ul>
  219.               <li>Meet the Targets given by the Company.</li>
  220.               <li>Respect among coworkers, Supervisors, Managers or Users.</li>
  221.               <li>Establish a good cooperative relationship with each other colleagues, Supervisors, and Managers.</li>
  222.               <li>Doing Daily Report carefully in accordance with company provisions, with a predetermined time limit determined by the company.</li>
  223.             </ul>
  224.             </p>
  225.           </div>
  226.           <div class="resume-item">
  227.             <h4>IT Support</h4>
  228.             <h5>2019 - 2021</h5>
  229.             <p><em>Wonokerto 5 Elementary School, Ngawi, ID</em></p>
  230.             <p>
  231.             <ul>
  232.               <li>Perform all installation, update, and evaluation processes for computers, software, and network systems</li>
  233.               <li>Create and maintain applications to meet teaching and learning needs</li>
  234.               <li>provide recommendations for all things IT related</li>
  235.             </ul>
  236.             </p>
  237.           </div>
  238.         </div>
  239.       </div>
  240.  
  241.     </div>
  242.   </section><!-- End Resume Section -->
  243.   <section id="contact" class="contact">
  244.     <div class="container">
  245.  
  246.       <div class="section-title">
  247.         <h2>Contact</h2>
  248.         <p>Contact Me</p>
  249.       </div>
  250.  
  251.       <div class="row mt-2">
  252.  
  253.         <div class="col-md-6 d-flex align-items-stretch">
  254.           <div class="info-box">
  255.             <i class="bx bx-map"></i>
  256.             <h3>My Address</h3>
  257.             <p>Dsn.Sendang Embes, RT.002/RW.006, Ds.Wonokerto, Kec.Kedunggalar, Ngawi, ID 63254</p>
  258.           </div>
  259.         </div>
  260.  
  261.         <div class="col-md-6 mt-4 mt-md-0 d-flex align-items-stretch">
  262.           <div class="info-box">
  263.             <i class="bx bx-share-alt"></i>
  264.             <h3>Social Profiles</h3>
  265.             <div class="social-links">
  266.               <a href="#" class="twitter"><i class="bi bi-twitter"></i></a>
  267.               <a href="https://fb.com/12259" class="facebook"><i class="bi bi-facebook"></i></a>
  268.               <a href="https://instagram.com/kuchuz" class="instagram"><i class="bi bi-instagram"></i></a>
  269.               <a href="#" class="google-plus"><i class="bi bi-skype"></i></a>
  270.               <a href="#" class="linkedin"><i class="bi bi-linkedin"></i></a>
  271.             </div>
  272.           </div>
  273.         </div>
  274.  
  275.         <div class="col-md-6 mt-4 d-flex align-items-stretch">
  276.           <div class="info-box">
  277.             <i class="bx bx-envelope"></i>
  278.             <h3>Email Me</h3>
  279.             <p>[email protected]</p>
  280.           </div>
  281.         </div>
  282.         <div class="col-md-6 mt-4 d-flex align-items-stretch">
  283.           <div class="info-box">
  284.             <i class="bx bx-phone-call"></i>
  285.             <h3>Call Me</h3>
  286.             <p>+62 816 417 886</p>
  287.           </div>
  288.         </div>
  289.       </div>
  290.       <!--
  291.       <form action="forms/contact.php" method="post" role="form" class="php-email-form mt-4">
  292.         <div class="row">
  293.           <div class="col-md-6 form-group">
  294.             <input type="text" name="name" class="form-control" id="name" placeholder="Your Name" required>
  295.           </div>
  296.           <div class="col-md-6 form-group mt-3 mt-md-0">
  297.             <input type="email" class="form-control" name="email" id="email" placeholder="Your Email" required>
  298.           </div>
  299.         </div>
  300.         <div class="form-group mt-3">
  301.           <input type="text" class="form-control" name="subject" id="subject" placeholder="Subject" required>
  302.         </div>
  303.         <div class="form-group mt-3">
  304.           <textarea class="form-control" name="message" rows="5" placeholder="Message" required></textarea>
  305.         </div>
  306.         <div class="my-3">
  307.           <div class="loading">Loading</div>
  308.           <div class="error-message"></div>
  309.           <div class="sent-message">Your message has been sent. Thank you!</div>
  310.         </div>
  311.         <div class="text-center"><button type="submit">Send Message</button></div>
  312.       </form>
  313.       -->
  314.     </div>
  315.   </section><!-- End Contact Section -->
  316.  
  317.   <div class="credits">
  318.     Made with &hearts;
  319.   </div>
  320.  
  321.   <!-- Vendor JS Files -->
  322.   <script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
  323.   <script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
  324.   <script src="assets/vendor/isotope-layout/isotope.pkgd.min.js"></script>
  325.   <script src="assets/vendor/php-email-form/validate.js"></script>
  326.   <script src="assets/vendor/purecounter/purecounter.js"></script>
  327.   <script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
  328.   <script src="assets/vendor/waypoints/noframework.waypoints.js"></script>
  329.  
  330.   <!-- Template Main JS File -->
  331.   <script src="assets/js/main.js"></script>
  332.  
  333. </body>
  334.  
  335. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!