document.write('
Data hosted with ♥ by Pastebin.com - Download Raw - See Original
  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>iamfajarsatria@gmail.com</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>iamfajarsatria@gmail.com</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>
');