bender/a508aed0-23f4-4fc9-bc9c-87af7a307637
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main #1

Merged
bender merged 4 commits from version_2 into main 2026-03-07 04:59:26 +00:00
Conversation 0 Commits 4 Files Changed 4 +79 -44
4 changed files with 79 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/app/layout.tsx
View File

@@ -1,25 +1,18 @@
import type { Metadata } from "next";
import { Halant } from "next/font/google";
import { DM_Sans } from "next/font/google";
import { Inter } from "next/font/google";
import { Lato } from "next/font/google";
import "./globals.css";
import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const halant = Halant({
variable: "--font-halant", subsets: ["latin"],
weight: ["300", "400", "500", "600", "700"],
const dmSans = DM_Sans({
variable: "--font-dm-sans", subsets: ["latin"],
});
const inter = Inter({
variable: "--font-inter", subsets: ["latin"],
});
const lato = Lato({
variable: "--font-lato", subsets: ["latin"],
weight: ["100", "300", "400", "700", "900"],
});
export const metadata: Metadata = {
title: "Khalil Rouabhi | Software Engineer & Data Scientist", description: "Master's degree holder specializing in AI, computer vision, IoT, and cloud solutions. View projects, skills, and experience in software engineering and data science.", keywords: "software engineer, data scientist, AI, machine learning, cloud computing, AWS, portfolio", metadataBase: new URL("https://khalil-rbh-portfolio.vercel.app"),
alternates: {
@@ -31,7 +24,8 @@ export const metadata: Metadata = {
],
},
twitter: {
card: "summary_large_image", title: "Khalil Rouabhi | Software Engineer & Data Scientist", description: "Building intelligent systems with AI, computer vision, and cloud solutions.", images: ["https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/modern-ai-and-machine-learning-visualiza-1772858984214-2a9c1ecd.png"],
card: "summary_large_image", title: "Khalil Rouabhi | Software Engineer & Data Scientist", description: "Building intelligent systems with AI, computer vision, and cloud solutions.", images: [
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/modern-ai-and-machine-learning-visualiza-1772858984214-2a9c1ecd.png"],
},
robots: {
index: true,
@@ -47,9 +41,7 @@ export default function RootLayout({
return (
<html lang="en" suppressHydrationWarning>
<ServiceWrapper>
<body
className={`${halant.variable} ${inter.variable} ${lato.variable} antialiased`}
>
<body className={`${dmSans.variable} ${inter.variable} antialiased`}>
<Tag />
{children}

85
src/app/page.tsx
View File

@@ -10,7 +10,19 @@ import BlogCardThree from "@/components/sections/blog/BlogCardThree";
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
import FooterBase from "@/components/sections/footer/FooterBase";
import { Sparkles, Zap, Award, Briefcase, TrendingUp, Github, Code, Brain, Cloud, Smartphone, Wrench } from "lucide-react";
import {
Sparkles,
Zap,
Award,
Briefcase,
TrendingUp,
Github,
Code,
Brain,
Cloud,
Smartphone,
Wrench,
} from "lucide-react";
export default function LandingPage() {
return (
@@ -59,15 +71,20 @@ export default function LandingPage() {
buttonAnimation="slide-up"
mediaItems={[
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/modern-ai-and-machine-learning-visualiza-1772858984214-2a9c1ecd.png", imageAlt: "AI and machine learning visualization"},
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/modern-ai-and-machine-learning-visualiza-1772858984214-2a9c1ecd.png", imageAlt: "AI and machine learning visualization"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/cloud-computing-infrastructure-diagram-w-1772858985400-2b841c71.png", imageAlt: "Cloud computing infrastructure"},
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/cloud-computing-infrastructure-diagram-w-1772858985400-2b841c71.png", imageAlt: "Cloud computing infrastructure"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/data-science-analytics-dashboard-with-ch-1772858985022-bafb1819.png", imageAlt: "Data science analytics dashboard"},
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/data-science-analytics-dashboard-with-ch-1772858985022-bafb1819.png", imageAlt: "Data science analytics dashboard"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/internet-of-things-iot-device-network-wi-1772858985290-f81ee707.png", imageAlt: "IoT device network"},
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/internet-of-things-iot-device-network-wi-1772858985290-f81ee707.png", imageAlt: "IoT device network"},
{
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/computer-vision-and-image-recognition-sy-1772858985045-9dc5e21e.png", imageAlt: "Computer vision system"},
imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/computer-vision-and-image-recognition-sy-1772858985045-9dc5e21e.png", imageAlt: "Computer vision system"},
]}
/>
</div>
@@ -96,22 +113,33 @@ export default function LandingPage() {
tagAnimation="slide-up"
features={[
{
title: "Programming & Databases", description: "Python, Java, JavaScript, SQL, MySQL, NoSQL databases with expertise in data preprocessing and API development.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/programming-languages-and-database-visua-1772858984951-1ee8a4e3.png", imageAlt: "Programming languages and databases", buttonIcon: Code,
title: "Programming & Databases", description:
"Python, Java, JavaScript, SQL, MySQL, NoSQL databases with expertise in data preprocessing and API development.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/programming-languages-and-database-visua-1772858984951-1ee8a4e3.png", imageAlt: "Programming languages and databases", buttonIcon: Code,
},
{
title: "AI & Machine Learning", description: "Scikit-learn, Pandas, TensorFlow, YOLOv8, CNN, OCR for building predictive models and computer vision applications.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/machine-learning-and-ai-tools-visualizat-1772858984883-60619b31.png", imageAlt: "Machine learning and AI tools", buttonIcon: Brain,
title: "AI & Machine Learning", description:
"Scikit-learn, Pandas, TensorFlow, YOLOv8, CNN, OCR for building predictive models and computer vision applications.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/machine-learning-and-ai-tools-visualizat-1772858984883-60619b31.png", imageAlt: "Machine learning and AI tools", buttonIcon: Brain,
},
{
title: "Cloud & Infrastructure", description: "AWS services including Lambda, DynamoDB, CloudWatch for building scalable, serverless applications and IoT solutions.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/aws-cloud-services-visualization-with-la-1772858985229-ff739ba5.png", imageAlt: "Cloud computing and AWS services", buttonIcon: Cloud,
title: "Cloud & Infrastructure", description:
"AWS services including Lambda, DynamoDB, CloudWatch for building scalable, serverless applications and IoT solutions.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/aws-cloud-services-visualization-with-la-1772858985229-ff739ba5.png", imageAlt: "Cloud computing and AWS services", buttonIcon: Cloud,
},
{
title: "Web & Mobile Development", description: "Django, React, Flutter, Dart, HTML, CSS for building responsive web applications and mobile solutions.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/web-and-mobile-development-frameworks-in-1772858985111-4cdf5238.png", imageAlt: "Web and mobile development frameworks", buttonIcon: Smartphone,
title: "Web & Mobile Development", description:
"Django, React, Flutter, Dart, HTML, CSS for building responsive web applications and mobile solutions.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/web-and-mobile-development-frameworks-in-1772858985111-4cdf5238.png", imageAlt: "Web and mobile development frameworks", buttonIcon: Smartphone,
},
{
title: "DevOps & Tools", description: "Docker, Hadoop, VMware, Jira, Packet Tracer, Wireshark for infrastructure management and network analysis.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/devops-and-infrastructure-tools-includin-1772858985097-5a6ff7ec.png", imageAlt: "DevOps and infrastructure tools", buttonIcon: Wrench,
title: "DevOps & Tools", description:
"Docker, Hadoop, VMware, Jira, Packet Tracer, Wireshark for infrastructure management and network analysis.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/devops-and-infrastructure-tools-includin-1772858985097-5a6ff7ec.png", imageAlt: "DevOps and infrastructure tools", buttonIcon: Wrench,
},
{
title: "Design & Documentation", description: "UML diagrams, Merise methodology, LaTeX documentation, Power BI analytics for professional system design and reporting.", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Design and documentation tools", buttonIcon: Code,
title: "Design & Documentation", description:
"UML diagrams, Merise methodology, LaTeX documentation, Power BI analytics for professional system design and reporting.", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Design and documentation tools", buttonIcon: Code,
},
]}
textboxLayout="default"
@@ -128,13 +156,17 @@ export default function LandingPage() {
tagAnimation="slide-up"
products={[
{
id: "fleetguard", name: "FleetGuard", price: "Driver Behavior AI", variant: "Real-time Detection • IoT • YOLOv8", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/fleetguard-driver-monitoring-system-inte-1772858985778-c21b624e.png", imageAlt: "FleetGuard driver monitoring system"},
id: "fleetguard", name: "FleetGuard", price: "Driver Behavior AI", variant: "Real-time Detection • IoT • YOLOv8", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/fleetguard-driver-monitoring-system-inte-1772858985778-c21b624e.png", imageAlt: "FleetGuard driver monitoring system"},
{
id: "kms", name: "KMS Cyber Defense", price: "Threat Detection", variant: "IoT Security • ML Models • Real-time Analytics", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/kms-cyber-attack-detection-system-interf-1772858985933-b4c4b5d1.png", imageAlt: "KMS cyber attack detection system"},
id: "kms", name: "KMS Cyber Defense", price: "Threat Detection", variant: "IoT Security • ML Models • Real-time Analytics", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/kms-cyber-attack-detection-system-interf-1772858985933-b4c4b5d1.png", imageAlt: "KMS cyber attack detection system"},
{
id: "handwriting", name: "Handwritten Text Recognition", price: "Deep Learning System", variant: "CNN • OCR • Image Processing", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/handwritten-text-recognition-system-show-1772858985480-51cf99cb.png", imageAlt: "Handwritten text recognition with CNN"},
id: "handwriting", name: "Handwritten Text Recognition", price: "Deep Learning System", variant: "CNN • OCR • Image Processing", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/handwritten-text-recognition-system-show-1772858985480-51cf99cb.png", imageAlt: "Handwritten text recognition with CNN"},
{
id: "iot-aws", name: "IoT AWS Cloud Platform", price: "Cloud Infrastructure", variant: "DynamoDB • Lambda • CloudWatch", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/aws-iot-cloud-platform-showing-dynamodb--1772858984982-a9450a23.png", imageAlt: "AWS IoT data storage and monitoring"},
id: "iot-aws", name: "IoT AWS Cloud Platform", price: "Cloud Infrastructure", variant: "DynamoDB • Lambda • CloudWatch", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/aws-iot-cloud-platform-showing-dynamodb--1772858984982-a9450a23.png", imageAlt: "AWS IoT data storage and monitoring"},
]}
gridVariant="uniform-all-items-equal"
animationType="slide-up"
@@ -152,11 +184,20 @@ export default function LandingPage() {
tagAnimation="slide-up"
blogs={[
{
id: "exp-1", category: "Freelancing", title: "Independent Software Engineer", excerpt: "Building custom solutions for clients using Python, AWS, and machine learning. Focus on delivering scalable, intelligent systems.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/freelance-software-engineering-workspace-1772858985331-8491e846.png", imageAlt: "Freelance software engineering work", authorName: "Current", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/professional-headshot-portrait-of-a-youn-1772858983636-c5c4bba6.png", date: "Jan 2025 - Present"},
id: "exp-1", category: "Freelancing", title: "Independent Software Engineer", excerpt:
"Building custom solutions for clients using Python, AWS, and machine learning. Focus on delivering scalable, intelligent systems.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/freelance-software-engineering-workspace-1772858985331-8491e846.png", imageAlt: "Freelance software engineering work", authorName: "Current", authorAvatar:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/professional-headshot-portrait-of-a-youn-1772858983636-c5c4bba6.png", date: "Jan 2025 - Present"},
{
id: "exp-2", category: "Internship", title: "Data Science Intern at Prodigy Infotech", excerpt: "Worked on data science projects using Python, Scikit-learn, and Pandas. Focused on data analysis, model development, and AWS deployment.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/professional-data-science-internship-env-1772858985699-ae712ad4.png", imageAlt: "Data science internship experience", authorName: "Completed", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/professional-headshot-portrait-of-a-youn-1772858983636-c5c4bba6.png", date: "Aug 2024 - Sep 2024"},
id: "exp-2", category: "Internship", title: "Data Science Intern at Prodigy Infotech", excerpt:
"Worked on data science projects using Python, Scikit-learn, and Pandas. Focused on data analysis, model development, and AWS deployment.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/professional-data-science-internship-env-1772858985699-ae712ad4.png", imageAlt: "Data science internship experience", authorName: "Completed", authorAvatar:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/professional-headshot-portrait-of-a-youn-1772858983636-c5c4bba6.png", date: "Aug 2024 - Sep 2024"},
{
id: "exp-3", category: "Education", title: "Master's Degree - Data Science & AI", excerpt: "Advanced studies in Data Science and Intelligent Systems. Specialized in AI algorithms, machine learning, and system design.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/master-s-degree-in-data-science-and-inte-1772858984359-0df452bf.png", imageAlt: "Master's degree in data science", authorName: "Graduated", authorAvatar: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/professional-headshot-portrait-of-a-youn-1772858983636-c5c4bba6.png", date: "Sep 2023 - Jun 2025"},
id: "exp-3", category: "Education", title: "Master's Degree - Data Science & AI", excerpt:
"Advanced studies in Data Science and Intelligent Systems. Specialized in AI algorithms, machine learning, and system design.", imageSrc:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/master-s-degree-in-data-science-and-inte-1772858984359-0df452bf.png", imageAlt: "Master's degree in data science", authorName: "Graduated", authorAvatar:
"https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AbPEe86WOehZZj9p8ov5OeeYAA/professional-headshot-portrait-of-a-youn-1772858983636-c5c4bba6.png", date: "Sep 2023 - Jun 2025"},
]}
animationType="slide-up"
textboxLayout="default"
@@ -233,8 +274,10 @@ export default function LandingPage() {
title: "Connect", items: [
{ label: "GitHub", href: "https://github.com/khalilrbh" },
{ label: "LinkedIn", href: "https://linkedin.com" },
{ label: "Portfolio", href: "https://khalil-rbh-portfolio.vercel.app" },
{ label: "Email", href: "mailto:mohamed.rouabhi@univ-constantine2.dz" },
{
label: "Portfolio", href: "https://khalil-rbh-portfolio.vercel.app"},
{
label: "Email", href: "mailto:mohamed.rouabhi@univ-constantine2.dz"},
],
},
{

4
src/app/styles/base.css
View File

@@ -11,7 +11,7 @@ html {
body {
background-color: var(--background);
color: var(--foreground);
font-family: var(--font-lato), sans-serif;
font-family: var(--font-inter), sans-serif;
position: relative;
min-height: 100vh;
overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
h4,
h5,
h6 {
font-family: var(--font-lato), sans-serif;
font-family: var(--font-dm-sans), sans-serif;
}

14
src/app/styles/variables.css
View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #f5f4ef;
--card: #dad6cd;
--foreground: #2a2928;
--primary-cta: #2a2928;
--background: #f6f0e9;
--card: #efe7dd;
--foreground: #2b180a;
--primary-cta: #2b180a;
--primary-cta-text: #f5f4ef;
--secondary-cta: #ecebea;
--secondary-cta: #efe7dd;
--secondary-cta-text: #2a2928;
--accent: #ffffff;
--background-accent: #c6b180;
--accent: #94877c;
--background-accent: #afa094;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);