Skip to content

Commit 61b19b3

Browse files
civilcoder55civilcoder55
committed
First Try
0 parents  commit 61b19b3

27 files changed

+1034
-0
lines changed

‎.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
public

‎.hugo_build.lock

Whitespace-only changes.

‎README.MD

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
# My Personal Blog Using Hugo
2+
3+
<a href="https://gohugo.io/"><img src="https://raw.githubusercontent.com/gohugoio/gohugoioTheme/master/static/images/hugo-logo-wide.svg?sanitize=true" alt="Hugo" width="565"></a>
4+
5+
6+
7+
- A try to create a personal blog using Hugo. https://github.com/gohugoio/hugo
8+
9+
### Credits and Thanks
10+
[Lama Dev](https://www.youtube.com/watch?v=6BRZ-yHjYwo)

‎archetypes/default.md

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
+++
2+
title = '{{ replace .File.ContentBaseName "-" " " | title }}'
3+
date = {{ .Date }}
4+
draft = false
5+
description = ""
6+
image = ""
7+
imageBig = ""
8+
categories = ["general"]
9+
avatar = "/images/avatar.webp"
10+
+++

‎config.toml

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
baseURL = 'http://example.org/'
2+
languageCode = 'en-us'
3+
title = 'OMAR.A'
4+
5+
6+
paginate = 4
7+
8+
[params]
9+
description = "My Tech Blog"
10+
dateFormat = "Jan 2, 2006 03:04:05 PM"
11+
12+
[params.social]
13+
linkedin = 'https://www.linkedin.com/in/omar-a-5956ba215/'
14+
github = 'https://github.com/civilcoder55'
15+
16+
[taxonomies]
17+
category = "categories"

‎content/journey/mission-1.md

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
---
2+
title: "Sw Journey: Mission 1"
3+
date: 2024-08-06T19:11:50+03:00
4+
draft: true
5+
description: "Software Journey Mission 1"
6+
image: "/images/journey/1.jpg"
7+
imageBig: "/images/journey/1.jpg"
8+
categories: ["journey", "k8s", "kubernetes"]
9+
avatar: "/images/avatar.webp"
10+
---
11+
12+
I'm starting a journey to build random stuff, and apply and practice Backend Engineering, I will go from a Monolithic application to a Microservices exploring and building cool stuff and Proof of Concepts. 🚀💻
13+
14+
## Mission 1
15+
16+
during this week I will discover and learn Kubernetes, and how to deploy a simple application to k8s.
17+
18+
I will build a simple API application with Express and then deploy it to Kubernetes, including a database and Redis cache.
19+
20+
the API will be a **Incantogamus app** a simple CRUD application for video games.
21+
22+
**Incantogamus**: is a whimsical and imaginary word created with a mix of Latin and whimsy, inspired by the magical world of Harry Potter. However, in terms of actual meaning, it doesn't have a specific definition or translation as it's a made-up term. It's intended to evoke a sense of enchantment and mystery, fitting for a magical word related to games in the Harry Potter universe.
23+
24+
### To Do
25+
26+
#### project: https://github.com/civilcoder55/incantogamus
27+
28+
- [x] Create a simple API application with express
29+
![incantogamus](/images/journey/incantogamus-api-example.png " {width='1360', height='720'}")
30+
31+
- [x] Dockerize the application
32+
- [x] Deploy the application to Kubernetes
33+
34+
- I deployed the application to a Kubernetes cluster on my local machine using minikube. the cluster looks like this:
35+
36+
![cluster-overview](/images/journey/cluster-overview.png)
37+
38+
- created an ingress to expose the application to the outside world, and made a domain point to the minikube node IP address.
39+
![hosts](/images/journey/hosts.png)
40+
41+
- the application is accessible at `incantogamus.com`
42+
![incantogamus](/images/journey/incantogamus-api.png)
43+
44+
- [ ] Discover and play with Kubernetes features
45+
- [x] Learning Helm Charts
46+
- During this sub-mission, I learned what Helm is and how to use and create Helm Charts.
47+
- I created a Helm Chart for the Incantogamus application. And I have published it to a Helm Repo hosted on GitHub using GitHub pages and helm releaser.
48+
- The Helm Chart is accessible at: https://civilcoder55.github.io/learning-helm-charts/
49+
- updated the application readme to include the Helm Chart usage. https://github.com/civilcoder55/incantogamus
50+
51+
## Mission 2
52+
53+
- [x] Discover Prometheus and Grafana
54+
55+
- I discovered Prometheus, understanding its functionality and how to use it for monitoring applications. Additionally, I learned about Grafana and how to visualize the metrics collected by Prometheus.
56+
- I also gained knowledge on creating and using an Exporter to gather metrics from an application and expose them to Prometheus.
57+
58+
- [x] Collect and Visualize Asterisk Metrics
59+
60+
- I collected metrics from an Asterisk server using the Asterisk `res_prometheus` module and exposed them to Prometheus.
61+
- I visualized these metrics using a simple Grafana dashboard.
62+
- Additionally, I used `node_exporter` to collect metrics from the Asterisk server node.
63+
64+
![incantogamus](/images/journey/prom-1.png)
65+
66+
![incantogamus](/images/journey/prom-2.png)
67+
68+
![incantogamus](/images/journey/prom-3.png)
69+
70+
- [ ] Collect K8s Cluster Metrics Using Prometheus
71+
- [ ] Visualize the Metrics Using Grafana
72+
- [ ] Create Alerts using Prometheus Alertmanager

‎layouts/404.html

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Not Found</title>
8+
</head>
9+
10+
<body>
11+
Not Found
12+
<a href="/">Go to homepage</a>
13+
</body>
14+
15+
</html>

‎layouts/_default/_markup/render-image.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
<a href="{{ .Destination | safeURL }}" class="lightbox-image current gallery">
2+
<img class='md-img' src="{{ .Destination | safeURL }}" {{- with .Text }} alt="{{ . }}" {{ end -}} {{- with .Title }}
3+
title="{{ . }}" {{ end -}}>
4+
</a>

‎layouts/_default/baseof.html

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8+
<meta name="description" content={{or .Params.description .Site.Params.description}}>
9+
<link rel="preconnect" href="https://fonts.googleapis.com">
10+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
11+
<link href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200..1000;1,200..1000&display=swap"
12+
rel="stylesheet">
13+
<link rel="stylesheet" href="/styles/style.css">
14+
<link rel="icon" href="/images/favicon.png" />
15+
<title>{{ .Title }}</title>
16+
</head>
17+
18+
<body>
19+
<div class="container">
20+
{{ partial "navbar" . }}
21+
{{ block "main" . }} {{ end }}
22+
{{ partial "footer" . }}
23+
</div>
24+
<script src="/js/app.js"></script>
25+
<script type="text/javascript" src="/js/lightbox.js"></script>
26+
<link rel="stylesheet" href="/styles/lightbox.css">
27+
</body>
28+
29+
</html>

‎layouts/_default/list.html

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
{{ define "main" }}
2+
<div class="list">
3+
{{ range .Paginator.Pages }}
4+
5+
<div class="list-item">
6+
<img src={{ .Params.image }} alt="{{.Title}}" class="list-item__image" loading="lazy" />
7+
8+
<div class="list-item__texts">
9+
<h1 class="list-item__title">
10+
<a href="{{.Permalink}}">{{.Title}}</a>
11+
</h1>
12+
13+
14+
<p class="list-item__desc">{{.Params.description}}</p>
15+
16+
<div class="list-item__detail">
17+
<img src="{{.Params.avatar}}" loading="lazy" alt="" class="list-item__avatar" />
18+
<span>{{ range (.GetTerms "authors")}}
19+
<a href={{.Permalink}}>{{ .Name }}</a>
20+
{{end}}</span>
21+
<time>{{ dateFormat .Site.Params.dateFormat .Date}}</time>
22+
</div>
23+
24+
25+
<div class="list-item__categories">
26+
{{ range (.GetTerms "categories") }}
27+
<a class="list-item__category" href={{ .Permalink }}>{{ .Name }}</a>
28+
{{ end }}
29+
</div>
30+
</div>
31+
</div>
32+
33+
34+
<div class="divider"></div>
35+
36+
{{ end }} {{ template "_internal/pagination.html" . }}
37+
38+
</div>
39+
{{ end }}

‎layouts/_default/single.html

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
{{ define "main" }}
2+
<div class="single">
3+
<div class="single-head">
4+
<div class="single-head__texts">
5+
<h1 class="single-head__title">{{.Title}}</h1>
6+
7+
<p class="single-head__desc">{{.Params.description}}</p>
8+
9+
<div class="single-head__detail">
10+
<img src={{.Params.avatar}} loading="lazy" alt="" class="single-avatar">
11+
<span>{{ range (.GetTerms "authors")}}
12+
<a href={{.Permalink}}>{{ .Name }}</a>
13+
{{end}}
14+
</span>
15+
{{ range (.GetTerms "categories")}}
16+
<a href={{.Permalink}} class="single-category">{{ .Name }}</a>
17+
{{end}}
18+
</div>
19+
20+
<time>{{ dateFormat .Site.Params.dateFormat .Date }}</time>
21+
</div>
22+
23+
<img src={{ .Params.imageBig }} alt={{.Title}} class="single-head__img">
24+
</div>
25+
26+
<div class="single-bottom">
27+
<div class="single-content">{{ .Content }}</div>
28+
</div>
29+
</div>
30+
{{ end }}

‎layouts/categories/list.html

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{{ define "main" }}
2+
{{ if eq .RelPermalink "/categories/"}}
3+
{{ range $.Site.Taxonomies.categories.ByCount }}
4+
<a href="/categories/{{ .Name }}">
5+
# {{ .Name }} <small>({{.Count}})</small>
6+
</a>
7+
{{end}}
8+
{{ else }}
9+
10+
<div class="list">
11+
{{ range .Paginator.Pages }}
12+
<div class="list-item">
13+
<img src={{ .Params.image }} alt="{{.Title}}" class="list-item__image" loading="lazy" />
14+
<div class="list-item__texts">
15+
<h1 class="list-item__title">
16+
<a href="{{.Permalink}}">{{.Title}}</a>
17+
</h1>
18+
<p class="list-item__desc">{{.Params.description}}</p>
19+
<div class="list-item__detail">
20+
<img src="{{.Params.avatar}}" loading="lazy" alt="" class="list-item__avatar" />
21+
<span>{{ range (.GetTerms "authors")}}
22+
<a href="{{.Permalink}}">{{ .Name }}</a>
23+
{{end}}</span>
24+
<time>{{ dateFormat .Site.Params.dateFormat .Date}}</time>
25+
</div>
26+
<div class="list-item__categories">
27+
{{ range (.GetTerms "categories") }}
28+
<a class="list-item__category" href={{ .Permalink }}>{{ .Name }}</a>
29+
{{ end }}
30+
</div>
31+
</div>
32+
</div>
33+
{{ end }} {{ template "_internal/pagination.html" . }}
34+
</div>
35+
{{end}} {{ end }}

‎layouts/partials/footer.html

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
<div class="footer">
2+
<div class="footerLinks">
3+
<a href="/">Home</a> |
4+
<a href="/categories">Categories</a> |
5+
<a href="/sitemap.xml">Sitemap</a>
6+
</div>
7+
8+
<div class="social">
9+
<a href="{{ .Site.Params.social.linkedin }}" title="LinkedIn">
10+
<svg height="20" width="20" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"
11+
version="1.1" viewBox="0 0 512 512" width="100%" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
12+
xmlns:serif="http://www.serif.com/" xmlns:xlink="http://www.w3.org/1999/xlink">
13+
<g id="g5891">
14+
<path
15+
d="M512,64c0,-35.323 -28.677,-64 -64,-64l-384,0c-35.323,0 -64,28.677 -64,64l0,384c0,35.323 28.677,64 64,64l384,0c35.323,0 64,-28.677 64,-64l0,-384Z"
16+
id="background" style="fill:#2867b2;" />
17+
<g id="shapes">
18+
<rect height="257.962" id="rect11" style="fill:#fff;" width="85.76" x="61.053" y="178.667" />
19+
<path
20+
d="M104.512,54.28c-29.341,0 -48.512,19.29 -48.512,44.573c0,24.752 18.588,44.574 47.377,44.574l0.554,0c29.903,0 48.516,-19.822 48.516,-44.574c-0.555,-25.283 -18.611,-44.573 -47.935,-44.573Z"
21+
id="path13-0" style="fill:#fff;fill-rule:nonzero;" />
22+
<path
23+
d="M357.278,172.601c-45.49,0 -65.866,25.017 -77.276,42.589l0,-36.523l-85.738,0c1.137,24.197 0,257.961 0,257.961l85.737,0l0,-144.064c0,-7.711 0.554,-15.42 2.827,-20.931c6.188,-15.4 20.305,-31.352 43.993,-31.352c31.012,0 43.436,23.664 43.436,58.327l0,138.02l85.741,0l0,-147.93c0,-79.237 -42.305,-116.097 -98.72,-116.097Z"
24+
id="path15" style="fill:#fff;fill-rule:nonzero;" />
25+
</g>
26+
</g>
27+
</svg>
28+
</a>
29+
30+
<a href="{{ .Site.Params.social.github }}" title="GitHub">
31+
<svg enable-background="new -1163 1657.697 56.693 56.693" height="20" width="20" id="Layer_1" version="1.1"
32+
viewBox="-1163 1657.697 56.693 56.693" width="56.693px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
33+
xmlns:xlink="http://www.w3.org/1999/xlink">
34+
<g>
35+
<path clip-rule="evenodd"
36+
d="M-1134.6598,1662.9163c-13.601,0-24.63,11.0267-24.63,24.6299 c0,10.8821,7.0573,20.1144,16.8435,23.3713c1.2308,0.2279,1.6829-0.5345,1.6829-1.1849c0-0.587-0.0227-2.5276-0.0334-4.5857 c-6.8521,1.4901-8.2979-2.906-8.2979-2.906c-1.1205-2.8467-2.7347-3.6039-2.7347-3.6039 c-2.2349-1.5287,0.1685-1.4972,0.1685-1.4972c2.473,0.1737,3.7755,2.5385,3.7755,2.5385c2.1967,3.7651,5.7618,2.6765,7.1675,2.0472 c0.2211-1.5917,0.8591-2.6786,1.5637-3.2936c-5.4707-0.6226-11.2218-2.7347-11.2218-12.1722c0-2.6888,0.9623-4.8861,2.538-6.611 c-0.2557-0.6206-1.0989-3.1255,0.2386-6.5183c0,0,2.0684-0.6616,6.7747,2.525c1.9648-0.5458,4.0719-0.8195,6.165-0.829 c2.093,0.0095,4.2017,0.2832,6.17,0.829c4.7012-3.1866,6.7665-2.525,6.7665-2.525c1.3406,3.3928,0.4974,5.8977,0.2417,6.5183 c1.5793,1.7249,2.5348,3.9221,2.5348,6.611c0,9.4602-5.7618,11.5428-11.2465,12.1527c0.8834,0.7644,1.6704,2.2632,1.6704,4.561 c0,3.2955-0.0282,5.9479-0.0282,6.7592c0,0.6556,0.4432,1.4236,1.6915,1.1818c9.7812-3.2605,16.8296-12.4896,16.8296-23.3682 C-1110.0299,1673.943-1121.0574,1662.9163-1134.6598,1662.9163z"
37+
fill-rule="evenodd" />
38+
<path
39+
d="M-1149.9611,1698.2793c-0.0542,0.1227-0.2469,0.1593-0.4222,0.0753c-0.1788-0.0804-0.2788-0.2473-0.2211-0.37 c0.053-0.126,0.2457-0.161,0.4242-0.0769C-1150.0013,1697.9882-1149.8993,1698.1566-1149.9611,1698.2793L-1149.9611,1698.2793z M-1150.2642,1698.0547" />
40+
<path
41+
d="M-1148.9634,1699.3922c-0.1174,0.1086-0.3473,0.0581-0.5031-0.1139c-0.1613-0.1718-0.1912-0.4016-0.072-0.5118 c0.1211-0.1088,0.3438-0.0579,0.505,0.1139C-1148.8721,1699.0541-1148.8407,1699.2819-1148.9634,1699.3922L-1148.9634,1699.3922z M-1149.1984,1699.14" />
42+
<path
43+
d="M-1147.9922,1700.8105c-0.151,0.1051-0.3979,0.0067-0.5505-0.2123c-0.151-0.2191-0.151-0.4819,0.0035-0.5872 c0.1526-0.1051,0.396-0.0104,0.5505,0.2068C-1147.8381,1700.4406-1147.8381,1700.7034-1147.9922,1700.8105L-1147.9922,1700.8105z M-1147.9922,1700.8105" />
44+
<path
45+
d="M-1146.6619,1702.1812c-0.1351,0.1489-0.4227,0.1086-0.6329-0.0945c-0.2155-0.1984-0.2753-0.4803-0.1403-0.6293 c0.1371-0.149,0.4263-0.1072,0.6381,0.0944C-1146.5831,1701.7501-1146.5182,1702.0337-1146.6619,1702.1812L-1146.6619,1702.1812z M-1146.6619,1702.1812" />
46+
<path
47+
d="M-1144.8265,1702.9769c-0.0597,0.1927-0.3365,0.2804-0.6154,0.1984c-0.2788-0.0845-0.4608-0.3103-0.4047-0.5051 c0.0577-0.1943,0.3361-0.2855,0.6169-0.1979C-1144.9512,1702.5563-1144.7688,1702.7805-1144.8265,1702.9769L-1144.8265,1702.9769z M-1144.8265,1702.9769" />
48+
<path
49+
d="M-1142.8107,1703.1243c0.0067,0.2031-0.2299,0.3716-0.5226,0.3752c-0.2944,0.0067-0.533-0.1577-0.5361-0.3577 c0-0.2052,0.2313-0.3717,0.5258-0.3768C-1143.0509,1702.7594-1142.8107,1702.9227-1142.8107,1703.1243L-1142.8107,1703.1243z M-1142.8107,1703.1243" />
50+
<path
51+
d="M-1140.9351,1702.8052c0.035,0.198-0.1686,0.4015-0.4594,0.4557c-0.2859,0.0526-0.5504-0.0701-0.587-0.2665 c-0.0354-0.2031,0.1716-0.4066,0.4573-0.4592C-1141.233,1702.4846-1140.9722,1702.6036-1140.9351,1702.8052L-1140.9351,1702.8052z M-1140.9351,1702.8052" />
52+
</g>
53+
</svg>
54+
55+
</a>
56+
</div>
57+
</div>

‎layouts/partials/navbar.html

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<nav class="navbar">
2+
<div class="logo">
3+
<a href="/">{{ .Site.Title }}</a>
4+
</div>
5+
<div class="links">
6+
<div class="toggle">
7+
<svg width="20px" height="20px" viewBox="-0.14 0 20.03 20.03" fill="#000000">
8+
<g id="moon-alt" transform="translate(-2.25 -2)">
9+
<path id="secondary" fill="#ffe01b"
10+
d="M21,12A9,9,0,0,1,3.25,14.13,6.9,6.9,0,0,0,8,16,7,7,0,0,0,11.61,3H12a9,9,0,0,1,9,9Z"></path>
11+
</g>
12+
</svg>
13+
<div class="ball"></div>
14+
<svg width="20px" height="20px" viewBox="0 0 20 20" fill="#000000">
15+
<g id="sun" transform="translate(-2 -2)">
16+
<circle id="secondary" fill="#ffe01b" cx="4" cy="4" r="4" transform="translate(8 8)"></circle>
17+
<path id="primary"
18+
d="M12,3V4M5.64,5.64l.7.7M3,12H4m1.64,6.36.7-.7M12,21V20m6.36-1.64-.7-.7M21,12H20M18.36,5.64l-.7.7M12,8a4,4,0,1,0,4,4A4,4,0,0,0,12,8Z"
19+
fill="none" stroke="#ffe01b" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"></path>
20+
</g>
21+
</svg>
22+
</div>
23+
<a href="/">Homepage</a>
24+
<a href="/categories">Categories</a>
25+
</div>
26+
</nav>

‎static/images/avatar.webp

10.7 KB
Binary file not shown.

‎static/images/journey/1.jpg

55.1 KB
Loading

‎static/images/journey/cluster-overview.png

153 KB
Loading

‎static/images/journey/hosts.png

50.3 KB
Loading

‎static/images/journey/incantogamus-api-example.png

121 KB
Loading

‎static/images/journey/incantogamus-api.png

80.5 KB
Loading

‎static/images/journey/prom-1.png

83.7 KB
Loading

‎static/images/journey/prom-2.png

123 KB
Loading

‎static/images/journey/prom-3.png

127 KB
Loading

‎static/js/app.js

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
const mode = localStorage.getItem("mode") || "";
2+
const toggle = document.querySelector(".toggle");
3+
const body = document.querySelector("body");
4+
5+
document.body.className = mode;
6+
7+
toggle.addEventListener("click", () => {
8+
localStorage.setItem("mode", mode === "light" ? "" : "light");
9+
body.classList.toggle("light");
10+
});

0 commit comments

Comments
 (0)