-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
172 lines (161 loc) · 8.04 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Aloy's Website</title>
<link rel="stylesheet" href="./assets/css/style.css">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.0/css/all.min.css"
integrity="sha512-xh6O/CkQoPOWDdYTDqeRdPCVd1SpvCA9XXcUnZS2FmJNp1coAFzvtCN9BmamE+4aHK8yyUHUSCcJHgXloTyT2A=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<body>
<div id="header">
<div class="container">
<!--Home Page-->
<nav>
<h1><span>aloysiusrh</span></h1>
<ul>
<li><a href="#header">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#portofolio">Portofolio</a></li>
<li><a href="#blog">Blog</a></li>
</ul>
</nav>
<div class="header-text">
<p>Hello!</p>
<h2>I'm <span>Aloysius Riandika</span></h2>
<p>A student of informatics engineering at Gunadarma University who has an interest in web
developers.</p>
<div class="social">
<a href="https://github.com/aloysiusriandika"><i class="fab fa-github"></i></a>
<a href="https://linkedin.com/in/aloysiusriandika"><i class="fab fa-linkedin"></i></a>
<a href="https://www.instagram.com/aloysiusriandika/"><i class="fab fa-instagram"></i></a>
<a href="https://www.x.com/aloysiusrh/"><i class="fab fa-twitter"></i></a>
</div>
<a href="#about"><button type="button">More About Me</button></a>
</div>
</div>
</div>
<!-- Home Page-->
<!-- about page -->
<section class="about-page" id="about">
<div class="img-about">
<img src="./assets/img/profil.jpg">
</div>
<div class="text-about">
<span>
About Me
</span>
<p>
I am 7th semester's informatics student of Gunadarma University,<span> I am able to work for
individual or
in a team.</span>
I have experience in web programming, especially in front-end development using <span>HTML,
CSS and JavaScript.</span>
I am very interested to learn new things, and still learn how to work fast, through and concepted is
the things I prioritize.
</p>
</div>
</section>
<!-- Portofolio Page -->
<section class="portofolio-page" id="portofolio">
<div class="judul-portofolio">
<span>Projects</span>
<p>These are some projects that i have made</p>
</div>
<div class="project">
<div class="card">
<div class="face face1">
<div class="content">
<img src="./assets/img/bmi-image.JPG" alt="">
<h3>BMI Calculator</h3>
</div>
</div>
<div class="face face2">
<div class="content">
<p>Body mass index (BMI) is a measure of body fat based on height and weight that applies to
adult men and women.</p>
<a href="https://bmi-calc-aloysiusriandika.netlify.app/">Visit Web</a>
</div>
</div>
</div>
<div class="card">
<div class="face face1">
<div class="content">
<img src="./assets/img/progate-img.JPG">
<h3>Static Website</h3>
</div>
</div>
<div class="face face2">
<div class="content">
<p>A static site website is a pages of static content, or plain HTML, Javascript, or CSS
code.</p>
<a href="https://static-progate-project.netlify.app/">Visit Web</a>
</div>
</div>
</div>
</div>
</section>
<!-- Blog Page -->
<section id="blog">
<h2>Blog</h2>
<div class="container-blog">
<div class="cardblog">
<div class="gambar">
<img src="./assets/img/ios-vs-android.png" alt="" width="400px">
</div>
<div class="isi">
<h3>Android vs IOS</h3>
<p>Semenjak munculnya smartphone untuk pertama kali, banyak terjadi perdebatan manakah yang
lebih baik antara Android atau Iphone yang menggunakan OS
iOS. Tentu saja masing masing OS memiliki kelebihan dan kekurangan masing-masing....</p>
<a href="https://aloysiusrh.blogspot.com/2021/12/android-vs-ios.html">Read More</a>
</div>
</div>
<div class="cardblog">
<div class="gambar">
<img src="./assets/img/history-web.jpg" alt="" width="400px">
</div>
<div class="isi">
<h3>Sejarah dan Perkembangan Web 2.0</h3>
<p>Pada tahun 2003 Web 2.0 dipelopori oleh O'Reilly Media, kemudian sekitar tahun 2004, web 2.0
mulai dikembangkan dengan menyatukan teknologi-teknologi gabungan dari HTML, XML, CSS,
JavaScript, dan AJAX. HTML dan CSS digunakan untuk mempercantik tampilan web...</p>
<a href="https://aloysiusrh.blogspot.com/2022/03/sejarah-dan-perkembangan-web-20.html">Read
More</a>
</div>
</div>
<div class="cardblog">
<div class="gambar">
<img src="./assets/img/digital-music.jpg" alt="" width="400px">
</div>
<div class="isi">
<h3>Kemajuan Musik Digital dan Pengaruhnya pada Generasi Muda</h3>
<p>Teknologi musik adalah istilah yang merujuk pada segala bentuk teknologi yang terlibat dengan
seni music, khususnya penggunaan perangkat elektronik dan perangkat lunak komputer untuk
memfasilitasi...</p>
<a href="https://aloysiusrh.blogspot.com/2021/11/kemajuan-musik-digital-dan-pengaruhnya.html">Read
More</a>
</div>
</div>
</div>
</section>
<!--Footer Page-->
<footer class="footer-page">
<div class="footer-item">
<div class="row">
<a href="https://github.com/aloysiusriandika"><i class="fab fa-github"></i></a>
<a href="https://linkedin.com/in/aloysiusriandika"><i class="fab fa-linkedin"></i></a>
<a href="https://www.instagram.com/aloysiusriandika/"><i class="fab fa-instagram"></i></a>
<a href="https://www.x.com/aloysiusrh/"><i class="fab fa-twitter"></i></a>
</div>
<div class="row">
aloysiusrh Copyright © 2022 All rights reserved || Designed By: Aloysius Riandika Hermawan
</div>
</div>
</footer>
</body>
</html>