Kamis, 12 Desember 2019

Muhammad Al Aziz/Ujian Akhir Semester Internet Aplikasi 2020

Nilai Sebuah Kegagalan


Bagi banyak orang kegagalan adalah sesuatu yang buruk. Apakah betul begitu? Untuk pikiran yang dangkal, hal itu memang betul. Namun apabila kita memikirkannya lebih dalam lagi, kegagalan tidak selamanya merupakan bencana. Bisa jadi, dengan kegagalan Tuhan mengingatkan kita bahwa kapasitas kita belum cukup untuk menerima kesuksesan. Barangkali Tuhan menunjukkan kepada kita bahwa masih banyak hal yang harus kita pelajari, yang mana kalau kita sukses padahal kemampuan kita masih dangkal, kita akan terjatuh lebih dalam lagi. seperti yang pernah dikatakan oleh seorang ahli investasi dari Amerika bahwa 'orang bodoh dengan uang banyak adalah suatu fenomena yang sangat menarik'.


Apakah yang akan terjadi bila orag bodoh tiba-tiba mendapatkan uang banyak? Jelas, dia akan menghabiskannya tanpa perhitungan hanya untuk barang-barang konsumtif dan kembali mengalami kesulitan keuangan karena kemungkinan besar barang-barang konsumtif terseut dia beli dengan cara kredit. Apakah dia pantas disebut orang kaya? Jelas tidak, orang yang betul-betul kaya tahu betul apa yang akan dia perbuat dengan uangnya dan akan mengembangkannya lebih banyak lagi.


Poin utamanya adalah kesuksesan yang kita terima akan selalu sesuai dengan kapasitas diri kita. Jika kita menerima kesuksesan di luar kapasitas diri, malah kita akan jatuh lebih dalam dan gagal lebih parah. Maka dari itu,  jangan terlalu mendramatisir kegagalan. Bisa jadi dengan kegagalan Tuhan menyelamatkan kita dari kegagalan yang lebih parah. Yang perlu kita fokuskan adalah bagaimana caranya agar kita bisa berkembang secara pribadi untuk layak menjadi orang yang betul-betul sukses sehingga kesuksesan kita bisa bertahan lama dan semakin berkembang.

Semoga Beruntung!

Selasa, 19 November 2019

Efek Hover pada Foto

Halo kembali lagi bersama dengan blog kesayangan kita semua hari ini saya ingin membagikan salah satu kreasi saya setelah belajar css & html, baik langsung saja ke coding nya.
Coding HTML
<!DOCTYPE html>
<html>
<head>
<title>Awesome Efek Hover</title>
<link rel="stylesheet" type="text/css" href="Style.css">
</head>
<body>
<div class="card middle">
<div class="front">
<img src="1-cloudscape-canvas-pixabay.jpg">
</div>
<div class="back">
<div class="back-content middle">
<h2>Blogger</h2>
<span>Youtube</span>
<div class="sm">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
<a href="#"><i class="fa fa-instagram"></i></a>
<a href="#"><i class="fa fa-linkedin"></i></a>
</div>
</div>
</div>
</div>
</body>

</html>

Coding CSS
@import "https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css";
* {
margin: 0;
padding: 0;
text-decoration: none;
font-family: sans-serif;
}
body {
background: #2f3640;
}
.middle {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.card {
cursor: pointer;
width: 340px;
height: 480px;
}
.front, .back {
width: 100%;
height: 100%;
overflow: hidden;
backface-visibility: hidden;
position: absolute;
transition: transform 0.6s linear;
}
.front img {
height: 100%;
}
.front {
transform: perspective(600px) rotateY(0deg);
}
.back {
background: #f1f1f1;
transform: perspective(600px) rotateY(180deg);
}
.back-content {
color: #2c3e50;
text-align: center;
width: 100%;
}
.sm {
margin: 20px 0;
}
.sm a {
display: inline-flex;
width: 40px;
height: 40px;
align-items: center;
justify-content: center;
color: #2c3e50;
font-size: 18px;
transition: 0.4s;
border-radius: 50px;
}
.sm a:hover {
background: #2c3e50;
color: white;
}
.card:hover > .front {
transform: perspective(600px) rotateY(-180deg);
}
.card:hover > .back {
transform: perspective(600px) rotateY(0deg);
}
Hasil
Before:

After:








SharedAnimation

Halo kembali lagi bersama dengan blog kesayangan kita semua hari ini saya ingin membagikan salah satu kreasi saya setelah belajar css & html, baik langsung saja ke coding nya
Coding HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" type="text/css" href="Style7.css">
<link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
</head>
<body>
<div class="share-button">
<span><i class="fa fa-share-alt"></i> &nbsp Share! </span>
<a href="#"><i class="fa fa-facebook-f"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
<a href="#"><i class="fa fa-instagram"></i></a>
<a href="#"><i class="fa fa-linkedin"></i></a>
</div>
<div class="back">
<a href="NavbarSpecial.html">Back</a>
<a href="Layout.html">Exit</a>
</div>
</body>

</html>

Coding CSS:
body {
margin: 0;
padding: 0;
font-family: "mont-serrat",sans-serif;
display: flex;
height: 100vh;
align-items: center;
justify-content: center;
color: red;
background: rgba(0,0,0,0.5);
}
.share-button {
width: 280px;
height: 80px;
background: #dfe6e9;
border-radius: 40px;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
cursor: pointer;
transition: 0.3s linear;
position: relative;
}
.share-button:hover {
transform: scale(1.1);
}
.share-button span {
position: absolute;
width: 100%;
height: 100%;
background: #2d3436;
color: #f1f1f1;
text-align: center;
line-height: 80px;
z-index: 999;
transition: 0.6s linear;
border-radius: 40px;
}
.share-button:hover span {
transform: translateX(-100%);
transition-delay: 0.1s;
}
.share-button a {
flex: 1;
font-size: 26px;
color: #2d3436;
text-align: center;
transform: translateX(-100%);
opacity: 0;
transition: 0.3s linear;
}
.share-button:hover a {
opacity: 1;
transform: translateX(0);
}
.share-button a:nth-of-type(1) {
transition-delay: 0.8s;
}
.share-button a:nth-of-type(2) {
transition-delay: 0.6s;
}
.share-button a:nth-of-type(3) {
transition-delay: 0.4s;
}
.share-button a:nth-of-type(4) {
transition-delay: 0.2s;
}
.back {
width: 150px;
height: 20px;
background: black;
border-radius: 25px;
border: 1px solid black;
text-align: center;
position: absolute;
top: 56.5%;
line-height: 20px;
padding: 10px 20px;
}
.back a {
text-decoration: none;
color: white;
padding: 10px;
}
.back a:hover {
color: greenyellow;
}
Hasil
Before

After

Button Animation

Halo kembali lagi bersama dengan blog kesayangan kita semua hari ini saya ingin membagikan salah satu kreasi saya setelah belajar css & html, baik langsung saja ke coding nya
Coding HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Button Animation</title>
<link rel="stylesheet" type="text/css" href="Button Animation.css">
</head>
<body>
<div class="container">
<a href="#">
<span></span>
<span></span>
<span></span>
<span></span>
Log In
</a>
</div>
</body>
</html>

Coding CSS: 
body {
padding: 0;
margin: 0;
background-color: purple;
font-family: sans-serif;
}
a {
background: #0c002b;
margin: 0;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
color: #1670f0;
padding: 50px 50px;
font-size: 20px;
letter-spacing: 2px;
text-transform: uppercase;
text-decoration: none;
box-shadow: 0 100px 80px rgba(0,0,0,.5);
overflow: hidden;
}
a:before {
  content: "";
position: absolute;
top: 2px;
left: 2px;
bottom: 2px;
width: 50%;
background: rgba(255,255,255,0.05);
}
a span:nth-child(1) {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(to right, #0c002b, #1779ff);
animation: animate1 2s linear infinite;
}
@keyframes animate1
{
0%
{
transform: translateX(-100%);
}
100%
{
transform: translateX(100%);
}
}
a span:nth-child(2) {
position: absolute;
top: 0;
right: 0;
width: 2px;
height: 100%;
background: linear-gradient(to bottom, #0c002b, #1779ff);
animation: animate2 2s linear infinite;
animation-delay: 1s;
}
@keyframes animate2
{
0%
{
transform: translateY(-100%);
}
100%
{
transform: translateY(100%);
}
}

a span:nth-child(3) {
position: absolute;
bottom: 0;
right: 0;
width: 100%;
height: 2px;
background: linear-gradient(to left, #0c002b, #1779ff);
animation: animate3 2s linear infinite;
}
@keyframes animate3
{
0%
{
transform: translateX(100%);
}
100%
{
transform: translateX(-100%);
}
}

a span:nth-child(4) {
position: absolute;
top: 0;
left: 0;
width: 2px;
height: 100%;
background: linear-gradient(to top, #0c002b, #1779ff);
animation: animate4 2s linear infinite;
animation-delay: 1s;
}
@keyframes animate4
{
0%
{
transform: translateY(100%);
}
100%
{
transform: translateY(-100%);
}

}

Hasilnya kurang lebih seperti ini


Selasa, 12 November 2019

Pengertian Linux

Pengertian Linux

Linux adalah salah satu OS yang menganut sistem UNIX yang menggunakan model pengembangan, serta distribusi software secara gratis, maupun biasa Anda kenal dengan sebutan open source. Sama halnya dengan aplikasi open source lainnya, Linux juga dapat dikembangkan dan di distribusikan secara gratis. Hal ini merupakan salah satu daya tarik dari OS ini.

Linux sendiri mungkin kurang familiar apabila dibandingkan dengan Windows maupun Macintosh. Hal tersebut sangat wajar karena pengguna Linux merupakan orang-orang dengan jumlah presentase yang sangat sedikit, yaitu betapa sedikitnya pengguna Linux yang hanya 1,5% apabila dibandingkan dengan Macintosh sebanyak 11%, serta Windows malah lebih dari 85%.

Selain itu, Linux juga OS yang handal nan tangguh, meskipun Anda tidak membutuhkan biaya untuk memakainya. Linux lebih terbukti stabil dan jarang terdapat permasalahan yang umum, misalnya proses yang melambat, terkena virus maupun malware, dan lain-lain. Jadi, Anda akan jarang mendapat masalah-masalah pada OS ini. Versi dari Linux sendiri lebih dikenal dengan istilah distributions, atau biasanya disingkat dengan distro. 

Linux ini memiliki sejumlah versi yang berbeda, serta dapat memenuhi kebutuhan dari para pengguna yang tentunya akan berbeda-beda pula. Mulai dari para pengguna baru sampai pengguna lama dapat mendapatkan versi Linux yang disesuaikan dengan kebutuhan. Saat ini, hampir semua versi Linux dapat diunduh secara gratis dan dipasang di mana saja sesuai dengan keinginan Anda.

Sejarah Terbentuknya Sistem Linux 

Sistem operasi Linux berbasis open source. Kernel dari sistem operasi Linux dibuat oleh Linus Torvald pada tahun 1991 saat itu dia masih masa perkuliahan di Universitas Helsinski, Finlandia. Sebelumnya, Richard Stallman pum sudah terlebih dulu mengembangkan project GNU. Dalam project tersebut, Stallman adalah pencipta linux untuk menciptakan sistem operasi yang benar-benar free. Free di sini artinya bebas untuk di kembangkan. 

Berbagai kode program pun telah di kembangkan. Pada tahun 1991, kode linux ini telah terkumpul hanya kurang 1 yaitu kernel. Sementara itu, di lokasi yang berbeda Linus Torvald yang masih seorang mahasiswa di Universitas Helsinski mulai mengembangkan project pribadi. Hal ini adalah mengembangkan kernel pada sistem operasi yang mirip dengan UNIX (atau disebut dengan UNIX like). 

Proses perkembangan yang dilakukan oleh Linux hanya sebatas kernel. Kernel yang telah dia kembangkan pun baru dapat membaca hardisk dan device yang telah terhubung ke komputer. Pada September 1991, kernel tersebut mulai di luncurkan dengan nama Linux. Kernel ini sendiri pun diberi versi 0.01. Kemudian, Kernel ini digabungkan dengan project GNU, sehingga terbentuklah sebuah nama GNU/Linux. 

Setelah itu, proses perkembangan Linux pun menjadi sangat cepat. Pada 5 Oktober 1991, Linus resmi mengumumkan kernel Linux 0.02, kemudian pada 19 Desember 1991, linux kembali memperkenalkan versi kernel 0.11 yang mana pada versi ini, Linux telah dapat berfungsi selayaknya sistem operasi standar. Versi 0.11 kernel Linux masih berlisensi sebagai free software. 

Namun, berikutnya linux pun mengganti lisensi kernel yang dia ciptakan menjadi GNU/GPL (General Public License) hal ini membuat siapa saja dapat melihat, mengembangkan dan berpartisipasi dalam proses development Linux. Awal kemunculan dari Linux pada dekade 1990-2000, Linux hanya dapat digunakan untuk lingkungan aplikasi berskala besar, misalnya seperti web server, network server, serta database server.  

Macam Sistem Operasi Linux yang Sering Digunakan 

Sistem operasi dari Linux berbeda dengan sistem operasi yang lain karena sifatnya yang open source atau bebas dikembangkan oleh siapa saja. Nah, oleh sebab itu banyak sekali varian dari sistem operasi ini. Sebagian besar para penggunanya telah berpendapat bahwa sistem operasi ini lebih mudah untuk digunakan, lebih simpel, terstruktur, serta tahan terhadap adanya virus dan malware. Berikut ini macam-macam Linux yang paling sering digunakan, di antataranya seperti berikut. 

1. Debian 

Debian adalah salah satu tipe dari macam-macam sistem operasi Linux yang telah lama ada sejak tahun 1999 lalu dan terus dikembangkan secara teratur di setiap tahunnya, hingga saat ini telah memasuki versi 8. Sistem operasi ini sebenarnya kurang cocok digunakan untuk tujuan personal. Hal ini karena fungsinya lebih diperuntukkan pada penggunaan di sistem komputer server maupum admin.   

2. Ubuntu 

Ubuntu yaitu tipe sistem operasi Linux yang dasarnya dikembangkan dari Debian. Bedanya, pada sistem operasi ini dapat digunakan tidak hanya pada komputer server dan admin saja, akan tetapi juga dapat digunakan untuk penggunaan pada komputer pribadi atau personal. Bahkan, pada versi terbaru ini dikondisikan untuk para penggunaan di perangkat smartphone Anda.   

3. Linux Mint

Linux Mint Apabila Ubuntu tadi merupakan perkembangan dari Debian, maka Linux Mint pun dapat dibilang cucu dari sistem operasi Debian karena dikembangkan dengan dasar Ubuntu. Sistem dari operasi yang telah dikembangkan untuk tujuan penggunaan pribadi maupun personal (PC) dan telah terbagi menjadi dua varian yaitu CINNAMON dan MATE.   

4. Red Hat 

Red Hat pun merupakan salah satu dari sistem operasi Linux yang juga populer. Dapat dikatakan Red Hat satu angkatan dengan Debian. Hal ini karena Red Hat telah lama ada dan menjadi dasar bagi perkembangan macam-macam sistem operasi Linux yang lain, misalnya seperti Fedora dan CentOS. Demikian panduan lengkap mengenai linux yang merupakan salah satu bukti kecanggihan teknologi zaman sekarang. Seperti yang Anda ketahui, Sistem operasi linux sangat tangguh dan fleksibel, tak heran jika sistem ini sangat disukai.