add project images and update projects data structure; include @types/node dependency

This commit is contained in:
Sascha 2026-01-23 15:19:18 +01:00
parent 0aa172a85a
commit e8c7d3d90d
6 changed files with 84 additions and 49 deletions

18
package-lock.json generated
View File

@ -16,6 +16,7 @@
},
"devDependencies": {
"@eslint/js": "^9.32.0",
"@types/node": "^25.0.10",
"@types/react": "^19.1.9",
"@types/react-dom": "^19.1.7",
"@types/react-router-dom": "^5.3.3",
@ -1707,6 +1708,16 @@
"dev": true,
"license": "MIT"
},
"node_modules/@types/node": {
"version": "25.0.10",
"resolved": "https://registry.npmjs.org/@types/node/-/node-25.0.10.tgz",
"integrity": "sha512-zWW5KPngR/yvakJgGOmZ5vTBemDoSqF3AcV/LrO5u5wTWyEAVVh+IT39G4gtyAkh3CtTZs8aX/yRM82OfzHJRg==",
"dev": true,
"license": "MIT",
"dependencies": {
"undici-types": "~7.16.0"
}
},
"node_modules/@types/react": {
"version": "19.2.7",
"resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.7.tgz",
@ -3807,6 +3818,13 @@
"typescript": ">=4.8.4 <6.0.0"
}
},
"node_modules/undici-types": {
"version": "7.16.0",
"resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.16.0.tgz",
"integrity": "sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw==",
"dev": true,
"license": "MIT"
},
"node_modules/update-browserslist-db": {
"version": "1.1.4",
"resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.1.4.tgz",

View File

@ -20,6 +20,7 @@
},
"devDependencies": {
"@eslint/js": "^9.32.0",
"@types/node": "^25.0.10",
"@types/react": "^19.1.9",
"@types/react-dom": "^19.1.7",
"@types/react-router-dom": "^5.3.3",

View File

@ -1,3 +1,8 @@
import portfolioImage from '@/assets/portfolio.PNG';
import ergoVRImage from '@/assets/ErgoVR.PNG';
import icaraceImage from '@/assets/icarace.PNG';
import dancaAlegriaImage from '@/assets/Danca-Alegria.png';
export const projects = {
title: 'Ausgewählte Projekte',
subtitle: 'Eine Übersicht meiner Arbeiten und persönlichen Projekte',
@ -9,24 +14,41 @@ export const projects = {
title: 'Portfolio-Website',
description:
'Eine persönliche Portfolio-Website zur Präsentation meiner Fähigkeiten, Projekte und Erfahrungen.',
image: portfolioImage,
technologies: ['React', 'TypeScript', 'SCSS', 'Github Copilot'],
year: '2025',
github: 'https://codeberg.org/saschab/portfolio-page',
live: 'https://www.sascha-bach.de',
},
{
id: 2,
title: 'ErgoVR',
description:
'Eine Virtual-Reality-Anwendung zur Analyse von Motion Sickness in VR-Umgebungen aus dem Jahr 2015.',
image: ergoVRImage,
technologies: ['Unity3D', 'C#', 'Oculus SDK'],
year: '2015',
github: 'https://github.com/LuciusShadow/ErgoVR',
},
{
id: 3,
title: 'Icarace',
description:
'Beteiligung an der Entwicklung einer Web-Plattform für ein Fitness-Rennspiel für die Icaros GmbH bis 2018.',
image: icaraceImage,
technologies: ['Angular 4', 'Typescript', 'HTML', 'CSS'],
year: '2018',
github: '',
},
{
id: 4,
title: 'Danca Alegria Vereins-Website',
description:
'Unterstützung bei freiwilligen Änderungen zur Einhaltung der WCAG 2.1 Level AA Barrierefreiheit.',
image: dancaAlegriaImage,
technologies: ['Wordpress', 'PHP', 'HTML', 'CSS'],
year: '2025',
live: 'https://www.danca-alegria.de',
}
],
};

View File

@ -1,3 +1,8 @@
import portfolioImage from '@/assets/portfolio.PNG';
import ergoVRImage from '@/assets/ErgoVR.PNG';
import icaraceImage from '@/assets/icarace.PNG';
import dancaAlegriaImage from '@/assets/Danca-Alegria.png';
export const projects = {
title: 'Featured Projects',
subtitle: 'A showcase of my work and personal projects',
@ -9,24 +14,41 @@ export const projects = {
title: 'Portfolio Website',
description:
'A personal portfolio website to showcase my skills, projects, and experience.',
image: portfolioImage,
technologies: ['React', 'TypeScript', 'SCSS', 'Github Copilot'],
year: '2025',
github: 'https://codeberg.org/saschab/portfolio-page',
live: 'https://www.sascha-bach.de',
},
{
id: 2,
title: 'ErgoVR',
description:
'A virtual reality application for analysis of motion sickness in VR environments from 2015.',
image: ergoVRImage,
technologies: ['Unity3D', 'C#', 'Oculus SDK'],
year: '2015',
github: 'https://github.com/LuciusShadow/ErgoVR',
},
{
id: 3,
title: 'Icarace',
description:
'Participated in the development of a web-platform for a fitness racing game for Icaros GmbH until 2018.',
image: icaraceImage,
technologies: ['Angular 4', 'Typescript', 'HTML', 'CSS'],
year: '2018',
github: 'https://github.com/LuciusShadow/ErgoVR',
},
{
id: 4,
title: 'Danca Alegria Association Website',
description:
'Assist in volunatary changes to accomodate WCAG 2.1 Level AA accessibility.',
image: dancaAlegriaImage,
technologies: ['Wordpress', 'PHP', 'HTML', 'CSS'],
year: '2025',
live: 'https://www.danca-alegria.de',
}
],
};

View File

@ -1,52 +1,14 @@
import portfolioImage from '../assets/portfolio.PNG';
import ergoVRImage from '../assets/ErgoVR.PNG';
import icaraceImage from '../assets/icarace.PNG';
import dancaAlegriaImage from '../assets/Danca-Alegria.png';
import { projects } from './locales/en/projects';
import type { Project } from '../data/Project';
const getProjectText = (id: number) => {
const item = projects.projectItems.find(p => p.id === id);
if (!item) throw new Error(`Project with id ${id} not found`);
return item;
};
export const projectsData: Project[] = [
{
id: 1,
title: getProjectText(1).title,
description: getProjectText(1).description,
image: portfolioImage,
technologies: ['React', 'TypeScript', 'SCSS', 'Github Copilot'],
year: '2025',
github: 'https://github.com/LuciusShadow/portfolio-page',
live: 'https://www.sascha-bach.de',
},
{
id: 2,
title: getProjectText(2).title,
description: getProjectText(2).description,
image: ergoVRImage,
technologies: ['Unity3D', 'C#', 'Oculus SDK'],
year: '2015',
github: 'https://github.com/LuciusShadow/ErgoVR',
},
{
id: 3,
title: getProjectText(3).title,
description: getProjectText(3).description,
image: icaraceImage,
technologies: ['Angular 4', 'Typescript', 'HTML', 'CSS'],
year: '2018',
github: 'https://github.com/LuciusShadow/ErgoVR'
},
{
id: 4,
title: getProjectText(4).title,
description: getProjectText(4).description,
image: dancaAlegriaImage,
technologies: ['Wordpress', 'PHP', 'HTML', 'CSS'],
year: '2025',
live: 'https://www.danca-alegria.de'
}
];
// Dynamically create projectsData from the locale configuration
export const projectsData: Project[] = projects.projectItems.map((item) => ({
id: item.id,
title: item.title,
description: item.description,
image: item.image,
technologies: item.technologies,
year: item.year,
github: item.github,
live: item.live,
}));

View File

@ -1,10 +1,20 @@
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import { fileURLToPath } from 'url';
import { dirname, resolve } from 'path';
const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);
// https://vite.dev/config/
export default defineConfig({
plugins: [react()],
base: '/',
resolve: {
alias: {
'@': resolve(__dirname, './src'),
},
},
optimizeDeps: {
include: ['lucide-react'],
entries: ['src/**/*.tsx', 'src/**/*.ts'],