mirror of
https://github.com/mmahdium/portfolio.git
synced 2026-02-07 00:07:08 +01:00
Minor fixes and improvements to locales
This commit is contained in:
@@ -73,8 +73,8 @@ const items = computed(() => [
|
||||
key: 'ttc',
|
||||
iconType: 'icon' as const,
|
||||
icon: 'i-twemoji-globe-with-meridians',
|
||||
title: t('languageSection.items.huawei.title'),
|
||||
description: t('languageSection.items.huawei.desc'),
|
||||
title: t('languageSection.items.ttc.title'),
|
||||
description: t('languageSection.items.ttc.desc'),
|
||||
},
|
||||
])
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<section ref="sectionEl" class="section-spacing">
|
||||
<section ref="sectionEl" class="section-spacing" v-if="shouldRenderCarousel">
|
||||
<UContainer>
|
||||
<div class="section-header">
|
||||
<!-- <div
|
||||
|
||||
@@ -2,10 +2,17 @@
|
||||
title: "A Big Career Change: From 7 Years at Huawei to Frontend Development"
|
||||
description: "A personal story of leaving telecom and team management at Huawei to pursue frontend development, covering the challenges, lessons, and mental shifts required for a successful career transition."
|
||||
date: "2025-11-25"
|
||||
tags: ["career-change", "frontend-development", "personal-growth", "huawei", "developer-journey"]
|
||||
author: "Ali Arghyani"
|
||||
tags:
|
||||
[
|
||||
"career-change",
|
||||
"frontend-development",
|
||||
"personal-growth",
|
||||
"huawei",
|
||||
"developer-journey",
|
||||
]
|
||||
author: "Mohammad Mahdi Mohammadi"
|
||||
image: "/img/blog/big-career-change.webp"
|
||||
draft: false
|
||||
draft: true
|
||||
---
|
||||
|
||||
When I left the world of telecom and team management—and the years I had spent at Huawei—to move into software development, I didn't have a clear picture of the future.
|
||||
@@ -106,7 +113,7 @@ We all carry some kind of "toolkit" with us. Mine looked like this:
|
||||
|
||||
- **People** who stayed close and didn't let me burn out under pressure.
|
||||
- **A program called "Aknoon"** that helped me build mental and emotional structure in the middle of chaos.
|
||||
- **Books** like *The Art of Thinking Clearly* and *The Compound Effect* that gave me a deeper understanding of decision-making and consistency.
|
||||
- **Books** like _The Art of Thinking Clearly_ and _The Compound Effect_ that gave me a deeper understanding of decision-making and consistency.
|
||||
- And most importantly: **the habit of slow refuelling.**
|
||||
|
||||
I made a commitment to myself not to burn out.
|
||||
|
||||
@@ -3,7 +3,7 @@ title: "This is a Draft Post"
|
||||
description: "This post is in draft mode and should not appear in production."
|
||||
date: "2024-11-10"
|
||||
tags: ["draft", "test"]
|
||||
author: "Ali Arghyani"
|
||||
author: "Mohammad Mahdi Mohammadi"
|
||||
draft: true
|
||||
---
|
||||
|
||||
|
||||
@@ -3,7 +3,7 @@ title: "Getting Started with Nuxt Content"
|
||||
description: "Learn how to build a powerful blog with Nuxt Content v3, featuring markdown support, syntax highlighting, and Vue component integration."
|
||||
date: "2024-11-09"
|
||||
tags: ["nuxt", "vue", "typescript", "tutorial"]
|
||||
author: "Ali Arghyani"
|
||||
author: "Mohammad Mahdi Mohammadi"
|
||||
draft: false
|
||||
---
|
||||
|
||||
@@ -33,8 +33,8 @@ Then add it to your `nuxt.config.ts`:
|
||||
|
||||
```typescript
|
||||
export default defineNuxtConfig({
|
||||
modules: ['@nuxt/content']
|
||||
})
|
||||
modules: ["@nuxt/content"],
|
||||
});
|
||||
```
|
||||
|
||||
## Creating Content
|
||||
@@ -59,11 +59,9 @@ Use the `queryContent()` composable to fetch your content:
|
||||
|
||||
```vue
|
||||
<script setup>
|
||||
const { data: posts } = await useAsyncData('posts', () =>
|
||||
queryContent('blog')
|
||||
.sort({ date: -1 })
|
||||
.find()
|
||||
)
|
||||
const { data: posts } = await useAsyncData("posts", () =>
|
||||
queryContent("blog").sort({ date: -1 }).find()
|
||||
);
|
||||
</script>
|
||||
```
|
||||
|
||||
@@ -86,8 +84,8 @@ Nuxt Content uses Shiki for beautiful syntax highlighting:
|
||||
```javascript
|
||||
// This code will be highlighted automatically
|
||||
const greeting = (name) => {
|
||||
console.log(`Hello, ${name}!`)
|
||||
}
|
||||
console.log(`Hello, ${name}!`);
|
||||
};
|
||||
```
|
||||
|
||||
### MDC Components
|
||||
|
||||
@@ -3,7 +3,7 @@ title: "Building Beautiful UIs with Nuxt UI"
|
||||
description: "Explore Nuxt UI components and learn how to create stunning, accessible user interfaces with minimal effort."
|
||||
date: "2024-11-08"
|
||||
tags: ["nuxt", "ui", "design", "components"]
|
||||
author: "Ali Arghyani"
|
||||
author: "Mohammad Mahdi Mohammadi"
|
||||
draft: false
|
||||
---
|
||||
|
||||
@@ -37,8 +37,8 @@ Add it to your `nuxt.config.ts`:
|
||||
|
||||
```typescript
|
||||
export default defineNuxtConfig({
|
||||
modules: ['@nuxt/ui']
|
||||
})
|
||||
modules: ["@nuxt/ui"],
|
||||
});
|
||||
```
|
||||
|
||||
## Essential Components
|
||||
@@ -68,9 +68,9 @@ Cards are perfect for displaying content:
|
||||
<template #header>
|
||||
<h3>Card Title</h3>
|
||||
</template>
|
||||
|
||||
|
||||
<p>Card content goes here</p>
|
||||
|
||||
|
||||
<template #footer>
|
||||
<UButton>Action</UButton>
|
||||
</template>
|
||||
@@ -85,14 +85,14 @@ Build forms quickly with validation:
|
||||
```vue
|
||||
<script setup>
|
||||
const state = reactive({
|
||||
email: '',
|
||||
password: ''
|
||||
})
|
||||
email: "",
|
||||
password: "",
|
||||
});
|
||||
|
||||
const schema = z.object({
|
||||
email: z.string().email(),
|
||||
password: z.string().min(8)
|
||||
})
|
||||
password: z.string().min(8),
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -100,11 +100,11 @@ const schema = z.object({
|
||||
<UFormGroup label="Email" name="email">
|
||||
<UInput v-model="state.email" />
|
||||
</UFormGroup>
|
||||
|
||||
|
||||
<UFormGroup label="Password" name="password">
|
||||
<UInput v-model="state.password" type="password" />
|
||||
</UFormGroup>
|
||||
|
||||
|
||||
<UButton type="submit">Submit</UButton>
|
||||
</UForm>
|
||||
</template>
|
||||
@@ -117,13 +117,13 @@ Customize your app's appearance with the `app.config.ts`:
|
||||
```typescript
|
||||
export default defineAppConfig({
|
||||
ui: {
|
||||
primary: 'indigo',
|
||||
gray: 'slate',
|
||||
primary: "indigo",
|
||||
gray: "slate",
|
||||
button: {
|
||||
rounded: 'rounded-full'
|
||||
}
|
||||
}
|
||||
})
|
||||
rounded: "rounded-full",
|
||||
},
|
||||
},
|
||||
});
|
||||
```
|
||||
|
||||
::alert{type="success"}
|
||||
@@ -136,17 +136,15 @@ Dark mode is built-in and works out of the box:
|
||||
|
||||
```vue
|
||||
<template>
|
||||
<UButton @click="toggleDarkMode">
|
||||
Toggle Dark Mode
|
||||
</UButton>
|
||||
<UButton @click="toggleDarkMode"> Toggle Dark Mode </UButton>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
const colorMode = useColorMode()
|
||||
const colorMode = useColorMode();
|
||||
|
||||
const toggleDarkMode = () => {
|
||||
colorMode.preference = colorMode.value === 'dark' ? 'light' : 'dark'
|
||||
}
|
||||
colorMode.preference = colorMode.value === "dark" ? "light" : "dark";
|
||||
};
|
||||
</script>
|
||||
```
|
||||
|
||||
|
||||
@@ -3,7 +3,7 @@ title: "TypeScript Best Practices for Vue 3"
|
||||
description: "Discover essential TypeScript patterns and best practices for building type-safe Vue 3 applications with Composition API."
|
||||
date: "2024-11-08"
|
||||
tags: ["typescript", "vue", "best-practices", "composition-api"]
|
||||
author: "Ali Arghyani"
|
||||
author: "Mohammad Mahdi Mohammadi"
|
||||
draft: false
|
||||
---
|
||||
|
||||
@@ -18,12 +18,12 @@ Define props with proper TypeScript interfaces:
|
||||
```vue
|
||||
<script setup lang="ts">
|
||||
interface Props {
|
||||
title: string
|
||||
count?: number
|
||||
items: string[]
|
||||
title: string;
|
||||
count?: number;
|
||||
items: string[];
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
const props = defineProps<Props>();
|
||||
</script>
|
||||
```
|
||||
|
||||
@@ -33,21 +33,21 @@ Create reusable composables with full type safety:
|
||||
|
||||
```typescript
|
||||
export function useCounter(initialValue = 0) {
|
||||
const count = ref<number>(initialValue)
|
||||
|
||||
const count = ref<number>(initialValue);
|
||||
|
||||
const increment = (): void => {
|
||||
count.value++
|
||||
}
|
||||
|
||||
count.value++;
|
||||
};
|
||||
|
||||
const decrement = (): void => {
|
||||
count.value--
|
||||
}
|
||||
|
||||
count.value--;
|
||||
};
|
||||
|
||||
return {
|
||||
count: readonly(count),
|
||||
increment,
|
||||
decrement
|
||||
}
|
||||
decrement,
|
||||
};
|
||||
}
|
||||
```
|
||||
|
||||
@@ -58,11 +58,11 @@ Build flexible components with generics:
|
||||
```vue
|
||||
<script setup lang="ts" generic="T extends { id: string }">
|
||||
interface Props {
|
||||
items: T[]
|
||||
onSelect: (item: T) => void
|
||||
items: T[];
|
||||
onSelect: (item: T) => void;
|
||||
}
|
||||
|
||||
const props = defineProps<Props>()
|
||||
const props = defineProps<Props>();
|
||||
</script>
|
||||
```
|
||||
|
||||
@@ -73,11 +73,11 @@ Define emits with proper typing:
|
||||
```vue
|
||||
<script setup lang="ts">
|
||||
interface Emits {
|
||||
(e: 'update', value: string): void
|
||||
(e: 'delete', id: number): void
|
||||
(e: "update", value: string): void;
|
||||
(e: "delete", id: number): void;
|
||||
}
|
||||
|
||||
const emit = defineEmits<Emits>()
|
||||
const emit = defineEmits<Emits>();
|
||||
</script>
|
||||
```
|
||||
|
||||
@@ -87,16 +87,16 @@ Leverage TypeScript utility types:
|
||||
|
||||
```typescript
|
||||
// Pick specific properties
|
||||
type UserPreview = Pick<User, 'id' | 'name' | 'email'>
|
||||
type UserPreview = Pick<User, "id" | "name" | "email">;
|
||||
|
||||
// Make all properties optional
|
||||
type PartialUser = Partial<User>
|
||||
type PartialUser = Partial<User>;
|
||||
|
||||
// Make all properties required
|
||||
type RequiredUser = Required<User>
|
||||
type RequiredUser = Required<User>;
|
||||
|
||||
// Exclude properties
|
||||
type UserWithoutPassword = Omit<User, 'password'>
|
||||
type UserWithoutPassword = Omit<User, "password">;
|
||||
```
|
||||
|
||||
## Type Guards
|
||||
@@ -106,11 +106,11 @@ Implement type guards for runtime type checking:
|
||||
```typescript
|
||||
function isUser(value: unknown): value is User {
|
||||
return (
|
||||
typeof value === 'object' &&
|
||||
typeof value === "object" &&
|
||||
value !== null &&
|
||||
'id' in value &&
|
||||
'name' in value
|
||||
)
|
||||
"id" in value &&
|
||||
"name" in value
|
||||
);
|
||||
}
|
||||
```
|
||||
|
||||
@@ -119,10 +119,9 @@ function isUser(value: unknown): value is User {
|
||||
Type your async data properly:
|
||||
|
||||
```typescript
|
||||
const { data, pending, error } = await useAsyncData<User[]>(
|
||||
'users',
|
||||
() => $fetch('/api/users')
|
||||
)
|
||||
const { data, pending, error } = await useAsyncData<User[]>("users", () =>
|
||||
$fetch("/api/users")
|
||||
);
|
||||
```
|
||||
|
||||
## Conclusion
|
||||
|
||||
@@ -5,7 +5,7 @@ date: "2025-11-25"
|
||||
tags: ["تغییر-شغلی", "برنامه-نویسی-فرانت-اند", "رشد-شخصی", "هواوی", "مسیر-توسعه-دهنده"]
|
||||
author: "علی ارغیانی"
|
||||
image: "/img/blog/big-career-change.webp"
|
||||
draft: false
|
||||
draft: true
|
||||
---
|
||||
|
||||
وقتی مسیرم رو عوض کردم و از دنیای تلکام و مدیریت تیم توی هواوی اومدم بیرون و وارد دنیای برنامهنویسی شدم، تصویر واضحی از آینده نداشتم.
|
||||
|
||||
@@ -57,6 +57,7 @@
|
||||
},
|
||||
"languageSection": {
|
||||
"tagline": "Advanced English communication for global collaboration.",
|
||||
"accordionLabel": "Advanced English communication for global collaboration.",
|
||||
"items": {
|
||||
"ielts": {
|
||||
"title": "IELTS readiness",
|
||||
|
||||
@@ -136,6 +136,7 @@
|
||||
},
|
||||
"languageSection": {
|
||||
"tagline": "انگلیسی پیشرفته برای همکاری با تیمهای بینالمللی.",
|
||||
"accordionLabel": "انگلیسی پیشرفته برای همکاری با تیمهای بینالمللی.",
|
||||
"items": {
|
||||
"ielts": {
|
||||
"title": "آمادگی آزمون آیلتس",
|
||||
|
||||
Reference in New Issue
Block a user