-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathindex.html
158 lines (145 loc) · 6.91 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>DevOps Engineer Portfolio</title>
<script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="bg-gray-100 font-sans leading-normal tracking-normal">
<header class="h-96 bg-gradient-to-r from-[#0693e3] via-[#00d084] to-[#ff6900] text-white">
<div class="container mx-auto px-6 py-24 text-center">
<h1 class="text-5xl font-bold">Nure Alam Siddiq | Wala</h1>
<p class="text-2xl mt-4">DevOps Engineer | Cloud Architect | Automation Enthusiast</p>
<div class="flex items-center justify-center gap-2">
<p class="text-xl mt-4 hover:text-[#ff6900]">
<a href="https://github.com/Nure" target="_blank">GitHub Profile</a>
</p>
<p class="text-xl mt-4 hover:text-[#ff6900]">
<a href="https://www.linkedin.com/in/nure/" target="_blank">LinkedIn</a>
</p>
</div>
</div>
</header>
<!-- About Section -->
<section class="py-12">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center mb-6 text-gray-800">About Me</h2>
<p class="text-center text-gray-700 max-w-3xl mx-auto">
I’m a DevOps Engineer with over 5 years of experience in building, automating, and optimizing infrastructure and workflows. I specialize in cloud architecture, CI/CD pipelines, and container orchestration to deliver scalable and reliable systems.
</p>
</div>
</section>
<!-- Skills Section -->
<section class="py-12 bg-gray-50">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center mb-6 text-gray-800">Skills</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6">
<div class="bg-white p-6 shadow-md rounded text-center">
<h3 class="text-xl font-semibold text-[#0693e3] mb-2">Cloud Platforms</h3>
<p>AWS, Azure, Google Cloud</p>
</div>
<div class="bg-white p-6 shadow-md rounded text-center">
<h3 class="text-xl font-semibold text-[#00d084] mb-2">CI/CD</h3>
<p>Jenkins, GitLab CI, GitHub Actions</p>
</div>
<div class="bg-white p-6 shadow-md rounded text-center">
<h3 class="text-xl font-semibold text-[#ff6900] mb-2">Containers & Orchestration</h3>
<p>Docker, Kubernetes, Helm</p>
</div>
<div class="bg-white p-6 shadow-md rounded text-center">
<h3 class="text-xl font-semibold text-[#0693e3] mb-2">Infrastructure as Code</h3>
<p>Terraform, CloudFormation, Ansible</p>
</div>
<div class="bg-white p-6 shadow-md rounded text-center">
<h3 class="text-xl font-semibold text-[#00d084] mb-2">Monitoring & Logging</h3>
<p>Prometheus, Grafana, ELK Stack</p>
</div>
<div class="bg-white p-6 shadow-md rounded text-center">
<h3 class="text-xl font-semibold text-[#ff6900] mb-2">Scripting & Automation</h3>
<p>Bash, Python, PowerShell</p>
</div>
</div>
</div>
</section>
<!-- Experience Section -->
<section class="py-12">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center mb-6 text-gray-800">Experience</h2>
<div class="space-y-6">
<div class="bg-white p-6 shadow-md rounded">
<h3 class="text-xl font-semibold text-[#0693e3]">Senior DevOps Engineer</h3>
<p class="text-gray-600">bongoDev | Jan 2021 - Present</p>
<ul class="mt-4 list-disc list-inside">
<li>Designed and implemented a scalable CI/CD pipeline, reducing deployment time by 50%.</li>
<li>Automated infrastructure management using Terraform and Ansible.</li>
<li>Worked closely with developers to containerize applications and manage Kubernetes clusters.</li>
</ul>
</div>
<div class="bg-white p-6 shadow-md rounded">
<h3 class="text-xl font-semibold text-[#00d084]">DevOps Engineer</h3>
<p class="text-gray-600">My Company | Aug 2018 - Dec 2020</p>
<ul class="mt-4 list-disc list-inside">
<li>Led the cloud migration project from on-premise to AWS, reducing costs by 30%.</li>
<li>Implemented a centralized logging solution using the ELK stack.</li>
<li>Developed custom monitoring dashboards using Prometheus and Grafana.</li>
</ul>
</div>
</div>
</div>
</section>
<!-- Projects Section -->
<section class="py-12 bg-gray-50">
<div class="container mx-auto px-6">
<h2 class="text-3xl font-bold text-center mb-6 text-gray-800">Projects</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6">
<!-- Project 1 -->
<div class="bg-white p-6 shadow-md rounded">
<img src="/bongoDev.png" alt="Project 1" class="mb-4 rounded-md">
<h3 class="text-xl font-semibold text-center text-[#0693e3]">Project 1</h3>
</div>
<!-- Project 2 -->
<div class="bg-white p-6 shadow-md rounded">
<img src="/bongoDev3.png" alt="Project 2" class="mb-4 rounded-md">
<h3 class="text-xl font-semibold text-center text-[#00d084]">Project 2</h3>
</div>
<!-- Project 3 -->
<div class="bg-white p-6 shadow-md rounded">
<img src="/bongoDev2.png" alt="Project 3" class="mb-4 rounded-md">
<h3 class="text-xl font-semibold text-center text-[#ff6900]">Project 3</h3>
</div>
<!-- Project 4 -->
<div class="bg-white p-6 shadow-md rounded">
<img src="/bongoDev2.png" alt="Project 4" class="mb-4 rounded-md">
<h3 class="text-xl font-semibold text-center text-[#0693e3]">Project 4</h3>
</div>
<!-- Project 5 -->
<div class="bg-white p-6 shadow-md rounded">
<img src="/bongoDev.png" alt="Project 5" class="mb-4 rounded-md">
<h3 class="text-xl font-semibold text-center text-[#00d084]">Project 5</h3>
</div>
<!-- Project 6 -->
<div class="bg-white p-6 shadow-md rounded">
<img src="/bongoDev3.png" alt="Project 6" class="mb-4 rounded-md">
<h3 class="text-xl font-semibold text-center text-[#ff6900]">Project 6</h3>
</div>
</div>
</div>
</section>
<!-- Contact Section -->
<section class="py-12">
<div class="container mx-auto px-6 text-center">
<h2 class="text-3xl font-bold text-center mb-6 text-gray-800">Contact</h2>
<p class="text-gray-700 mb-4">Let's starts with just one step to make thousand miles:</p>
<a href="mailto:xyg@gmail.com"
class="inline-block px-8 py-4 text-white font-semibold bg-[#0693e3] rounded shadow-md hover:bg-[#00d084] transition duration-300">
Email Me
</a>
</div>
</section>
<footer class="bg-gray-900 text-gray-200 py-4 text-center">
<p>© 2024 Nure Siddiq - All Rights Reserved</p>
</footer>
</body>
</html>