shahealamit.github.io/aws-devops-engineer.html at main · shahealamit/shahealamit.github.io · GitHub

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
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />

  <title>AWS DevOps Engineer | AWS Cloud Infrastructure & Automation – Shahe Alam</title>

  <meta name="description"
    content="AWS DevOps Engineer providing secure and scalable AWS cloud infrastructure, EC2 deployments, VPC networking, CI/CD automation, and monitoring for startups and businesses across India." />

  <meta name="viewport" content="width=device-width, initial-scale=1.0" />

  <link rel="canonical" href="https://shahealamit.github.io/aws-devops-engineer.html" />
  <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">

  <!-- Tailwind -->
  <script src="https://cdn.tailwindcss.com"></script>
  <link rel="stylesheet" href="style.css">
</head>

<body class="bg-slate-950 text-slate-300">

<!-- ================= HERO ================= -->
<section class="relative min-h-[90vh] flex items-center justify-center px-6 overflow-hidden bg-slate-950">

  <div class="absolute inset-0 pointer-events-none">
    <div class="absolute inset-0 bg-[linear-gradient(to_right,#1e293b_1px,transparent_1px),linear-gradient(to_bottom,#1e293b_1px,transparent_1px)] bg-[size:40px_40px] [mask-image:radial-gradient(ellipse_60%_50%_at_50%_0%,#000_70%,transparent_100%)]"></div>

    <div class="absolute left-1/2 top-1/4 -translate-x-1/2 w-[500px] h-[500px] bg-blue-600/20 rounded-full blur-[120px]"></div>
  </div>

  <div class="max-w-5xl mx-auto text-center relative z-10">
    <div class="inline-flex items-center gap-2 mb-8 px-4 py-1.5 rounded-full bg-blue-500/10 border border-blue-500/20">
      <span class="w-1.5 h-1.5 rounded-full bg-blue-400 animate-pulse"></span>
      <span class="text-[11px] font-bold tracking-[0.2em] text-blue-400 uppercase">
        AWS Cloud & DevOps Expert
      </span>
    </div>

    <h1 class="text-4xl md:text-5xl lg:text-6xl font-black text-white mb-6 leading-[1.15] tracking-tight">
      AWS DevOps Engineer
      <span class="block mt-2 bg-gradient-to-r from-blue-400 via-teal-400 to-blue-500 bg-clip-text text-transparent">
        Infrastructure & Automation
      </span>
    </h1>

    <p class="text-base md:text-lg text-slate-400 max-w-2xl mx-auto mb-12 leading-relaxed">
      I design and manage <span class="text-slate-200">secure, scalable AWS cloud infrastructure</span>
      using automation-first practices to accelerate your business growth.
    </p>

    <div class="flex flex-col sm:flex-row items-center justify-center gap-5">
      <a href="/#contact"
        class="group w-full sm:w-auto px-8 py-4 bg-blue-600 text-white rounded-2xl font-bold transition-all hover:bg-blue-500 hover:shadow-[0_0_30px_-5px_rgba(37,99,235,0.5)] active:scale-95">
        Hire AWS Expert
        <span class="inline-block ml-1 group-hover:translate-x-1 transition-transform">→</span>
      </a>

      <a href="/devops-services.html"
        class="w-full sm:w-auto px-8 py-4 bg-slate-900/50 border border-slate-800 text-slate-300 rounded-2xl font-bold hover:bg-slate-800 hover:text-white transition-all active:scale-95">
        Explore Services
      </a>
    </div>
  </div>
</section>

<!-- ================= AWS SERVICES ================= -->
<section class="py-20 bg-slate-950 relative overflow-hidden">

  <div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-full h-full pointer-events-none">
    <div class="absolute w-[500px] h-[400px] bg-blue-500/5 blur-[120px] rounded-full"></div>
  </div>

  <div class="max-w-6xl mx-auto px-6 relative z-10">
    <div class="text-center mb-16">
      <h2 class="text-3xl md:text-4xl font-extrabold text-white mb-4 tracking-tight">
        AWS <span class="text-blue-500">DevOps Services</span>
      </h2>
      <p class="text-slate-400 text-base md:text-lg max-w-2xl mx-auto leading-relaxed">
        End-to-end AWS cloud solutions focused on reliability, security,
        automation, and cost optimization.
      </p>
    </div>

    <div class="grid md:grid-cols-3 gap-8">

      <div class="group bg-slate-900/40 backdrop-blur-sm border border-slate-800/60 rounded-3xl p-8 hover:border-blue-500/50 hover:-translate-y-2 transition-all duration-300">
        <div class="w-12 h-12 bg-blue-500/10 rounded-2xl flex items-center justify-center mb-6 group-hover:scale-110 transition-transform">
          <svg class="w-6 h-6 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"/></svg>
        </div>
        <h3 class="text-xl font-bold text-white mb-4">EC2 & Compute</h3>
        <p class="text-slate-400 text-sm leading-relaxed mb-6">
          High-availability compute infrastructure designed for performance and scalability.
        </p>
        <ul class="text-xs text-slate-300 space-y-3">
          <li class="flex items-center gap-2"><span class="w-1 h-1 rounded-full bg-blue-500"></span> EC2 Instance Architecture</li>
          <li class="flex items-center gap-2"><span class="w-1 h-1 rounded-full bg-blue-500"></span> Auto Scaling Groups</li>
          <li class="flex items-center gap-2"><span class="w-1 h-1 rounded-full bg-blue-500"></span> Load Balancer Setup</li>
        </ul>
      </div>

      <div class="group bg-slate-900/40 backdrop-blur-sm border border-slate-800/60 rounded-3xl p-8 hover:border-teal-500/50 hover:-translate-y-2 transition-all duration-300">
        <div class="w-12 h-12 bg-teal-500/10 rounded-2xl flex items-center justify-center mb-6 group-hover:scale-110 transition-transform">
          <svg class="w-6 h-6 text-teal-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"/></svg>
        </div>
        <h3 class="text-xl font-bold text-white mb-4">VPC & Security</h3>
        <p class="text-slate-400 text-sm leading-relaxed mb-6">
          Secure AWS networking and access control for production environments.
        </p>
        <ul class="text-xs text-slate-300 space-y-3">
          <li class="flex items-center gap-2"><span class="w-1 h-1 rounded-full bg-teal-500"></span> VPC & Subnet Design</li>
          <li class="flex items-center gap-2"><span class="w-1 h-1 rounded-full bg-teal-500"></span> Security Groups & NACLs</li>
          <li class="flex items-center gap-2"><span class="w-1 h-1 rounded-full bg-teal-500"></span> IAM Roles & Policies</li>
        </ul>
      </div>

      <div class="group bg-slate-900/40 backdrop-blur-sm border border-slate-800/60 rounded-3xl p-8 hover:border-purple-500/50 hover:-translate-y-2 transition-all duration-300">
        <div class="w-12 h-12 bg-purple-500/10 rounded-2xl flex items-center justify-center mb-6 group-hover:scale-110 transition-transform">
          <svg class="w-6 h-6 text-purple-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"/></svg>
        </div>
        <h3 class="text-xl font-bold text-white mb-4">Cloud Monitoring</h3>
        <p class="text-slate-400 text-sm leading-relaxed mb-6">
          Proactive monitoring and alerting to ensure uptime and cloud stability.
        </p>
        <ul class="text-xs text-slate-300 space-y-3">
          <li class="flex items-center gap-2"><span class="w-1 h-1 rounded-full bg-purple-500"></span> CloudWatch Metrics</li>
          <li class="flex items-center gap-2"><span class="w-1 h-1 rounded-full bg-purple-500"></span> Real-time Log Monitoring</li>
          <li class="flex items-center gap-2"><span class="w-1 h-1 rounded-full bg-purple-500"></span> Performance Tuning</li>
        </ul>
      </div>

    </div>
  </div>
</section>

<!-- ================= WHY AWS DEVOPS ================= -->
<section class="py-20 bg-slate-950 relative overflow-hidden">

  <div class="absolute top-0 right-0 w-1/3 h-1/2 bg-blue-500/5 blur-[120px] rounded-full pointer-events-none"></div>

  <div class="max-w-6xl mx-auto px-6 relative z-10">
    <div class="text-center mb-16">
      <h2 class="text-3xl md:text-4xl font-bold text-white mb-4">
        Why Choose My <span class="text-blue-500">AWS DevOps</span> Services?
      </h2>
      <div class="w-16 h-1 bg-blue-600 mx-auto rounded-full"></div>
    </div>

    <div class="grid md:grid-cols-2 gap-6">

      <div class="group bg-slate-900/40 border border-slate-800/60 p-8 rounded-3xl hover:border-blue-500/40 transition-all duration-300">
        <div class="flex items-start gap-5">
          <div class="shrink-0 w-12 h-12 bg-blue-500/10 rounded-2xl flex items-center justify-center group-hover:bg-blue-500/20 transition-colors">
            <svg class="w-6 h-6 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
          </div>
          <div>
            <h3 class="text-lg font-bold text-white mb-2">Production Experience</h3>
            <p class="text-slate-400 text-sm leading-relaxed">
              Managing live AWS environments with real-world traffic, ensuring high availability and zero downtime.
            </p>
          </div>
        </div>
      </div>

      <div class="group bg-slate-900/40 border border-slate-800/60 p-8 rounded-3xl hover:border-blue-500/40 transition-all duration-300">
        <div class="flex items-start gap-5">
          <div class="shrink-0 w-12 h-12 bg-blue-500/10 rounded-2xl flex items-center justify-center group-hover:bg-blue-500/20 transition-colors">
            <svg class="w-6 h-6 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"/></svg>
          </div>
          <div>
            <h3 class="text-lg font-bold text-white mb-2">Automation-First Approach</h3>
            <p class="text-slate-400 text-sm leading-relaxed">
              Reducing manual errors by implementing Infrastructure as Code (IaC) and seamless CI/CD pipelines.
            </p>
          </div>
        </div>
      </div>

      <div class="group bg-slate-900/40 border border-slate-800/60 p-8 rounded-3xl hover:border-blue-500/40 transition-all duration-300">
        <div class="flex items-start gap-5">
          <div class="shrink-0 w-12 h-12 bg-blue-500/10 rounded-2xl flex items-center justify-center group-hover:bg-blue-500/20 transition-colors">
            <svg class="w-6 h-6 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
          </div>
          <div>
            <h3 class="text-lg font-bold text-white mb-2">Cost Optimization</h3>
            <p class="text-slate-400 text-sm leading-relaxed">
              Strategic resource management to cut down cloud bills without compromising on speed or performance.
            </p>
          </div>
        </div>
      </div>

      <div class="group bg-slate-900/40 border border-slate-800/60 p-8 rounded-3xl hover:border-blue-500/40 transition-all duration-300">
        <div class="flex items-start gap-5">
          <div class="shrink-0 w-12 h-12 bg-blue-500/10 rounded-2xl flex items-center justify-center group-hover:bg-blue-500/20 transition-colors">
            <svg class="w-6 h-6 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9"/></svg>
          </div>
          <div>
            <h3 class="text-lg font-bold text-white mb-2">Reliable Remote Support</h3>
            <p class="text-slate-400 text-sm leading-relaxed">
              Flexible and dedicated remote collaboration tailored for clients across India and globally.
            </p>
          </div>
        </div>
      </div>

    </div>
  </div>
</section>

<!-- ================= CTA ================= -->
<section class="py-20 px-6 bg-slate-950 relative overflow-hidden">

  <div class="absolute inset-0 opacity-10 pointer-events-none">
    <svg class="absolute top-10 left-10 w-24 h-24 text-blue-500" fill="currentColor" viewBox="0 0 24 24"><path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"/></svg>
  </div>

  <div class="max-w-4xl mx-auto relative z-10">
    <div class="bg-slate-900/40 backdrop-blur-xl border border-slate-800/60 rounded-[2rem] p-10 md:p-16 text-center group">

      <div class="w-16 h-16 bg-blue-500/10 border border-blue-500/20 rounded-2xl flex items-center justify-center mx-auto mb-8 group-hover:rotate-12 transition-transform duration-500">
        <svg class="w-8 h-8 text-blue-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M3 15a4 4 0 004 4h9a5 5 0 10-.1-9.999 5.002 5.002 0 10-9.78 2.096A4.001 4.001 0 003 15z" />
        </svg>
      </div>

      <h2 class="text-3xl md:text-4xl font-bold text-white mb-6 tracking-tight leading-tight">
        Ready to Scale on
        <span class="bg-gradient-to-r from-blue-400 to-teal-400 bg-clip-text text-transparent">
          AWS Cloud?
        </span>
      </h2>

      <p class="text-slate-400 text-base md:text-lg mb-10 max-w-xl mx-auto leading-relaxed">
        Let’s design and automate an AWS infrastructure that is
        <span class="text-slate-200">secure, cost-optimized,</span> and ready for global traffic.
      </p>

      <div class="flex flex-col sm:flex-row items-center justify-center gap-4">
        <a href="/#contact"
          class="w-full sm:w-auto px-8 py-3.5 bg-blue-600 text-white rounded-xl font-bold hover:bg-blue-500 transition-all active:scale-95 shadow-lg shadow-blue-500/20 flex items-center justify-center gap-2">
          Start AWS Project
          <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14 5l7 7m0 0l-7 7m7-7H3"/></svg>
        </a>

        <a href="mailto:shahealam.it@gmail.com"
          class="w-full sm:w-auto px-8 py-3.5 border border-slate-700 rounded-xl text-slate-300 font-semibold hover:bg-slate-800 hover:text-white transition-all active:scale-95">
          Talk to Expert
        </a>
      </div>

    </div>
  </div>
</section>

</body>
</html>