Skip to content

Commit 974be1d

Browse files
committed
fixes + refactor
1 parent 0107686 commit 974be1d

17 files changed

Lines changed: 147 additions & 112 deletions

blog/.vscode/settings.json

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
11
{
22
"editor.gotoLocation.multipleDefinitions": "goto",
3-
"editor.wordWrap": "on"
3+
"editor.wordWrap": "on",
4+
"editor.defaultFormatter": "biomejs.biome",
5+
"editor.formatOnSave": false,
6+
"[astro]": {
7+
"editor.defaultFormatter": "biomejs.biome"
8+
}
49
}

blog/src/components/Chip.astro

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
---
2+
interface Props {
3+
text: string;
4+
}
5+
const { text } = Astro.props;
6+
---
7+
8+
<span class="chip">{text}</span>
9+
10+
<style>
11+
.chip {
12+
display: inline-block;
13+
padding: 0.2rem 0.5rem;
14+
border-radius: 0.8rem;
15+
margin: 0.2rem;
16+
color: var(--secondary);
17+
font-size: 0.9rem;
18+
box-shadow: inset 0px 0px 15px 1px var(--primary-dark);
19+
white-space: nowrap;
20+
text-decoration: none;
21+
border: 1px solid var(--primary-dark);
22+
}
23+
</style>

blog/src/components/PostCard.astro

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
---
2+
import Chip from './chip.astro';
3+
4+
interface Props {
5+
link: string;
6+
title: string;
7+
description: string;
8+
createdAt?: string;
9+
tags?: string[]
10+
}
11+
const { link, title, description, createdAt, tags } = Astro.props;
12+
---
13+
14+
<a href={link} class="post-container">
15+
<div class="post-header">
16+
<h3>{title}</h3>
17+
{createdAt && <span class="post-date">{createdAt}</span>}
18+
</div>
19+
<div>{tags && tags.map(tag => <Chip text={tag}/>)} </div>
20+
21+
<div>{description}</div>
22+
</a>
23+
24+
<style>
25+
.post-container {
26+
display: flex;
27+
flex-direction: column;
28+
gap: 1rem;
29+
padding: 1rem;
30+
border: 1px solid #353535;
31+
color: #ffffff;
32+
text-decoration: none;
33+
transition:
34+
background-color 0.15s ease,
35+
border 0.15s ease;
36+
}
37+
38+
.post-container:hover,
39+
.post-container:focus-visible {
40+
background-color: rgba(var(--primary-rgb), 0.125);
41+
border: 1px solid var(--primary);
42+
color: white;
43+
text-decoration: none;
44+
}
45+
46+
.post-container:focus-visible {
47+
outline: none;
48+
}
49+
50+
.post-header {
51+
display: flex;
52+
flex-direction: row;
53+
justify-content: space-between;
54+
}
55+
56+
@media screen and (max-width: 640px) {
57+
.post-header {
58+
flex-direction: column;
59+
gap: 0.5rem;
60+
}
61+
}
62+
63+
.post-header h3 {
64+
margin: 0;
65+
}
66+
67+
.post-date {
68+
color: var(--secondary);
69+
}
70+
</style>

blog/src/content.config.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,10 @@ const projects = defineCollection({
7777
description: z.string(),
7878
date: z.coerce.date(),
7979
image: image(),
80-
link: z.string().url().optional(),
80+
link: z.string().url(),
81+
tags: z.array(
82+
reference("tags")
83+
),
8184
info: z.array(
8285
z.object({
8386
text: z.string(),

blog/src/content/other/about.mdx

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,5 @@
11
I’m a software developer with over 4 years of experience working across the stack, from building robust backend services to performant frontend apps. I’ve worked extensively in the JavaScript ecosystem. Besides that, I have hands-on experience with Python, Go, Ruby on Rails, and serverless tech as well.
22

3-
I'm driven by the pursuit of excellence, a passion for learning new technologies and building systems that scale.
4-
5-
When I'm not coding, you’ll probably find me reading non-fiction, playing chess or dreaming about travel.
6-
7-
Lately, I’ve been trying to find my footing in the post-LLM world. Rethinking how we build, learn, and collaborate in a landscape that’s changing fast. This blog is my space to explore those ideas. I write to sharpen my own craft, share what I’ve learned, and hopefully contribute something useful to other folks navigating similar paths.
3+
I'm driven by the pursuit of excellence, a passion for learning new technologies and building systems that scale. Trying to find my footing in the post-LLM world. Rethinking how we build, learn, and collaborate in a landscape that’s changing fast. This blog is my space to explore those ideas. I write to sharpen my own craft, share what I’ve learned, and hopefully contribute something useful to other folks navigating similar paths.
84

95

blog/src/content/posts/react-state-shallow.mdx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,13 @@ createdAt: 05-14-2022
66
draft: false
77
tags:
88
- react
9+
- javascript
10+
- immutability
911
---
1012

11-
### Find the bug
12-
1313
https://codepen.io/filtered/pen/ZErBveR
1414

15+
#### Find the bug
1516

1617
Selecting an item in any one of the two lists causes the same item to get selected in the other list as well.
1718
`samList` and `janeList` are supposed to be isolated but their state seems to accidentally shared. See if you can find what part of the code causes this issue.

blog/src/content/projects/buffered-event-emitter.mdx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ date: 12-02-2024
44
description: A tiny (2.4kb) library with Typescript support to handle events. Buffer and flush events with configurable buffer capacity. Pause, queue and resume events. Log event emission, adding and removing listeners. Works for both node and browser.
55
image: ../assets/placeholder.png
66
link: https://github.com/33j33/buffered-event-emitter
7+
tags:
8+
- event-emitter
9+
- node
10+
- javascript
711
info:
812
- text: GitHub
913
type: github

blog/src/content/projects/slack-privacy-extension.mdx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@ date: 12-02-2025
44
description: Browser extension for Slack which blurs messages, media, and other content until you need to view them. Perfect for those who work in public spaces or frequently share their screen during meetings.
55
image: ../assets/slack-privacy-ext.png
66
link: https://github.com/33j33/Slack-Privacy-Extension
7+
tags:
8+
- javascript
9+
- browser-extension
10+
- slack
711
info:
812
- text: GitHub
913
type: github

blog/src/content/tags.json

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
11
[
22
{
33
"id": "react"
4+
},
5+
{
6+
"id": "javascript"
7+
},
8+
{
9+
"id": "immutability"
10+
},
11+
{
12+
"id": "typescript"
413
}
514
]

blog/src/content/work.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
{
33
"id": 1,
44
"duration": "2021 - present",
5-
"company": "",
6-
"title": "",
7-
"description": ""
5+
"company": "wrwerwernwen werwe",
6+
"title": " werw werw er",
7+
"description": " werwe werw"
88
}
99
]

0 commit comments

Comments
 (0)