Skip to content

Commit 7362ce6

Browse files
YacoubAl-hardariYacoubAl-hardari
committed
init
0 parents  commit 7362ce6

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

79 files changed

+11270
-0
lines changed

‎.gitignore

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.*
7+
.yarn/*
8+
!.yarn/patches
9+
!.yarn/plugins
10+
!.yarn/releases
11+
!.yarn/versions
12+
13+
# testing
14+
/coverage
15+
16+
# next.js
17+
/.next/
18+
/out/
19+
20+
# production
21+
/build
22+
23+
# misc
24+
.DS_Store
25+
*.pem
26+
27+
# debug
28+
npm-debug.log*
29+
yarn-debug.log*
30+
yarn-error.log*
31+
.pnpm-debug.log*
32+
33+
# env files (can opt-in for committing if needed)
34+
.env*
35+
36+
# vercel
37+
.vercel
38+
39+
# typescript
40+
*.tsbuildinfo
41+
next-env.d.ts

‎README.md

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
2+
3+
## Getting Started
4+
5+
First, run the development server:
6+
7+
```bash
8+
npm run dev
9+
# or
10+
yarn dev
11+
# or
12+
pnpm dev
13+
# or
14+
bun dev
15+
```
16+
17+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
18+
19+
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
20+
21+
This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
22+
23+
## Learn More
24+
25+
To learn more about Next.js, take a look at the following resources:
26+
27+
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
28+
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
29+
30+
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
31+
32+
## Deploy on Vercel
33+
34+
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
35+
36+
Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.

‎app/about/page.tsx

Lines changed: 234 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,234 @@
1+
import Image from "next/image"
2+
import Link from "next/link"
3+
import { Button } from "@/components/ui/button"
4+
import SectionHeading from "@/components/section-heading"
5+
import { Download, Mail, Phone, MapPin, Calendar, Briefcase, GraduationCap } from "lucide-react"
6+
import { Card, CardContent } from "@/components/ui/card"
7+
import AnimatedSection from "@/components/animated-section"
8+
9+
export default function AboutPage() {
10+
return (
11+
<div className="py-12">
12+
<div className="container">
13+
{/* Hero Section */}
14+
<AnimatedSection className="flex flex-col md:flex-row gap-12 items-center mb-16" animation="fadeIn">
15+
<div className="w-full md:w-1/3">
16+
<div className="relative w-full aspect-square rounded-full overflow-hidden border-8 border-primary/10 hover-scale">
17+
<Image src="/./imags/1.png" alt="صورة شخصية" fill className="object-cover" />
18+
</div>
19+
</div>
20+
<div className="w-full md:w-2/3">
21+
<h1 className="text-4xl font-bold mb-4">يعقوب الحيدري</h1>
22+
<p className="text-xl text-muted-foreground mb-6">مطور ويب متخصص في بناء تطبيقات الويب الحديثة</p>
23+
<p className="mb-6">
24+
اسمي يعقوب الحيدري، أنا مطور Full stack developer مع خبرة 3+ سنوات في تطوير تطبيقات الويب وواجهات المستخدم المبتكرة. أتقن تطوير الواجهة الأمامية بشكل أساسي من خلال HTML و CSS و JavaScript ومكتبات مختلفة. من الجانب الخلفي، لدي معرفة واسعة بلغات الخادم، بما في ذلك PHP و Laravel،Livewire,Vue.js، وكذلك قواعد البيانات مثل MySQL. بالإضافة إلى ذلك، لدي خبرة في تطوير واجهات البرمجة (APIs) والتطوير باستخدام معمارية الميكروسيرفس
25+
</p>
26+
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4 mb-6">
27+
<div className="flex items-center gap-2">
28+
<Mail className="h-5 w-5 text-primary" />
29+
<span>[email protected]</span>
30+
</div>
31+
<div className="flex items-center gap-2">
32+
<Phone className="h-5 w-5 text-primary" />
33+
<span dir="ltr">+967775042349</span>
34+
</div>
35+
<div className="flex items-center gap-2">
36+
<MapPin className="h-5 w-5 text-primary" />
37+
<span>اليمن - صنعاء</span>
38+
</div>
39+
<div className="flex items-center gap-2">
40+
<Calendar className="h-5 w-5 text-primary" />
41+
<span>1832/01/01</span>
42+
</div>
43+
</div>
44+
<Button asChild className="hover-lift">
45+
<Link href="/./imags/2.pdf" download>
46+
<Download className="ml-2 h-4 w-4" /> تحميل السيرة الذاتية
47+
</Link>
48+
</Button>
49+
</div>
50+
</AnimatedSection>
51+
52+
{/* About Me Section - Enhanced for better readability */}
53+
<AnimatedSection className="mb-16" animation="fadeInUp">
54+
<SectionHeading title="من أنا" subtitle="نبذة عن حياتي المهنية" />
55+
56+
<Card className="border-primary/20 overflow-hidden hover-scale">
57+
<div className="md:flex">
58+
{/* Left side - Career journey image */}
59+
<div className="md:w-1/3 relative min-h-[300px] bg-primary/5">
60+
<div className="absolute inset-0 flex items-center justify-center">
61+
<Image
62+
src="/./imags/3.png"
63+
alt="رحلتي المهنية"
64+
width={300}
65+
height={300}
66+
className="object-contain"
67+
/>
68+
</div>
69+
</div>
70+
71+
{/* Right side - Text content */}
72+
<CardContent className="md:w-2/3 p-8">
73+
<div className="space-y-6 text-lg leading-relaxed">
74+
<p className="first-letter:text-3xl first-letter:font-bold first-letter:text-primary first-letter:mr-1">
75+
بدأت رحلتي في عالم البرمجة منذ أكثر من <span className="font-bold text-primary">8 سنوات</span>، حيث
76+
كنت شغوفًا بتطوير المواقع الإلكترونية وتطبيقات الويب. بدأت بتعلم HTML و CSS و JavaScript، ثم توسعت في
77+
تعلم إطارات العمل الحديثة مثل React و Next.js.
78+
</p>
79+
80+
<div className="border-r-4 border-primary pr-4 py-2">
81+
<p>
82+
عملت في العديد من الشركات المرموقة، وشاركت في تطوير مشاريع متنوعة من مواقع الشركات البسيطة إلى
83+
المنصات التعليمية المتكاملة والمتاجر الإلكترونية. أسعى دائمًا لتطوير مهاراتي ومواكبة أحدث التقنيات
84+
في مجال تطوير الويب.
85+
</p>
86+
</div>
87+
88+
<p>
89+
أؤمن بأن <span className="bg-primary/10 px-2 py-1 rounded">التعلم المستمر هو مفتاح النجاح</span> في
90+
مجال التكنولوجيا، لذلك أحرص على حضور المؤتمرات والندوات التقنية، وأتابع الدورات التدريبية لتطوير
91+
مهاراتي باستمرار.
92+
</p>
93+
94+
<div className="grid grid-cols-1 sm:grid-cols-3 gap-4 mt-6">
95+
<AnimatedSection
96+
delay={0.1}
97+
className="bg-background shadow-sm rounded-lg p-4 text-center hover-lift"
98+
>
99+
<p className="text-3xl font-bold text-primary">+50</p>
100+
<p className="text-sm text-muted-foreground">مشروع مكتمل</p>
101+
</AnimatedSection>
102+
<AnimatedSection
103+
delay={0.2}
104+
className="bg-background shadow-sm rounded-lg p-4 text-center hover-lift"
105+
>
106+
<p className="text-3xl font-bold text-primary">+20</p>
107+
<p className="text-sm text-muted-foreground">عميل سعيد</p>
108+
</AnimatedSection>
109+
<AnimatedSection
110+
delay={0.3}
111+
className="bg-background shadow-sm rounded-lg p-4 text-center hover-lift"
112+
>
113+
<p className="text-3xl font-bold text-primary">+8</p>
114+
<p className="text-sm text-muted-foreground">سنوات خبرة</p>
115+
</AnimatedSection>
116+
</div>
117+
</div>
118+
</CardContent>
119+
</div>
120+
</Card>
121+
122+
{/* Additional career highlights */}
123+
<div className="grid grid-cols-1 md:grid-cols-3 gap-6 mt-8">
124+
<AnimatedSection delay={0.1} className="hover-scale">
125+
<Card className="p-6 bg-gradient-to-br from-background to-muted/30 border-primary/10 hover:shadow-md transition-shadow">
126+
<h3 className="text-xl font-bold mb-3 flex items-center">
127+
<span className="bg-primary/10 p-2 rounded-full ml-2">
128+
<Briefcase className="h-5 w-5 text-primary" />
129+
</span>
130+
الشغف
131+
</h3>
132+
<p>
133+
أحب تحويل الأفكار إلى حلول رقمية فعالة. أستمتع بالتحديات التقنية وإيجاد حلول مبتكرة للمشكلات المعقدة.
134+
</p>
135+
</Card>
136+
</AnimatedSection>
137+
138+
<AnimatedSection delay={0.2} className="hover-scale">
139+
<Card className="p-6 bg-gradient-to-br from-background to-muted/30 border-primary/10 hover:shadow-md transition-shadow">
140+
<h3 className="text-xl font-bold mb-3 flex items-center">
141+
<span className="bg-primary/10 p-2 rounded-full ml-2">
142+
<GraduationCap className="h-5 w-5 text-primary" />
143+
</span>
144+
التعلم المستمر
145+
</h3>
146+
<p>
147+
أخصص وقتًا أسبوعيًا لتعلم تقنيات جديدة. أؤمن بأن صناعة التكنولوجيا تتطور بسرعة، وأسعى دائمًا لمواكبة هذا
148+
التطور.
149+
</p>
150+
</Card>
151+
</AnimatedSection>
152+
153+
<AnimatedSection delay={0.3} className="hover-scale">
154+
<Card className="p-6 bg-gradient-to-br from-background to-muted/30 border-primary/10 hover:shadow-md transition-shadow">
155+
<h3 className="text-xl font-bold mb-3 flex items-center">
156+
<span className="bg-primary/10 p-2 rounded-full ml-2">
157+
<Mail className="h-5 w-5 text-primary" />
158+
</span>
159+
التواصل
160+
</h3>
161+
<p>أؤمن بأهمية التواصل الفعال مع العملاء وفهم احتياجاتهم لتقديم أفضل الحلول التي تلبي تطلعاتهم.</p>
162+
</Card>
163+
</AnimatedSection>
164+
</div>
165+
</AnimatedSection>
166+
167+
{/* Timeline Section */}
168+
<AnimatedSection className="mb-16" animation="fadeInUp">
169+
<SectionHeading title="مسيرتي المهنية" subtitle="رحلتي في عالم البرمجة" />
170+
<div className="relative border-r-2 border-primary/20 pr-10">
171+
{[
172+
{
173+
title: "مطور ويب أول",
174+
subtitle: "شركة تقنية العالمية، 2020 - الحالي",
175+
description:
176+
"أعمل كمطور ويب أول في فريق تطوير المنتجات، حيث أقود فريقًا من المطورين لبناء تطبيقات ويب متقدمة باستخدام React و Node.js.",
177+
icon: Briefcase,
178+
delay: 0.1,
179+
},
180+
{
181+
title: "مطور واجهة أمامية",
182+
subtitle: "شركة البرمجيات المتقدمة، 2018 - 2020",
183+
description: "عملت على تطوير واجهات مستخدم تفاعلية لعدة مشاريع باستخدام React و Redux.",
184+
icon: Briefcase,
185+
delay: 0.2,
186+
},
187+
{
188+
title: "مطور ويب",
189+
subtitle: "استوديو التصميم الإبداعي، 2016 - 2018",
190+
description:
191+
"بدأت مسيرتي المهنية كمطور ويب، حيث عملت على تطوير مواقع ويب تفاعلية باستخدام HTML و CSS و JavaScript.",
192+
icon: Briefcase,
193+
delay: 0.3,
194+
},
195+
{
196+
title: "ماجستير علوم الحاسب",
197+
subtitle: "الجامعة الأمريكية، 2016 - 2018",
198+
description: "تخصص في الذكاء الاصطناعي وتعلم الآلة.",
199+
icon: GraduationCap,
200+
delay: 0.4,
201+
},
202+
{
203+
title: "بكالوريوس علوم الحاسب",
204+
subtitle: "جامعة القاهرة، 2012 - 2016",
205+
description: "تخصص في هندسة البرمجيات وتطوير الويب.",
206+
icon: GraduationCap,
207+
delay: 0.5,
208+
},
209+
].map((item, index, array) => {
210+
const Icon = item.icon
211+
return (
212+
<AnimatedSection
213+
key={index}
214+
delay={item.delay}
215+
className={`mb-12 relative ${index === array.length - 1 ? "mb-0" : ""} hover-lift`}
216+
>
217+
<div className="absolute right-[-41px] top-0 w-8 h-8 bg-primary rounded-full flex items-center justify-center">
218+
<Icon className="h-4 w-4 text-primary-foreground" />
219+
</div>
220+
<div>
221+
<h3 className="text-xl font-bold">{item.title}</h3>
222+
<p className="text-muted-foreground">{item.subtitle}</p>
223+
<p className="mt-2">{item.description}</p>
224+
</div>
225+
</AnimatedSection>
226+
)
227+
})}
228+
</div>
229+
</AnimatedSection>
230+
</div>
231+
</div>
232+
)
233+
}
234+

‎app/blog/loading.tsx

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
export default function Loading() {
2+
return null
3+
}
4+

0 commit comments

Comments
 (0)