starry-series/src/components/data/portfolioData.js


/**
 * @SofiDev Esto es JSDOC, si consideras que puede ser complicado solo borralo, es un comentario, no afectará en nada
 * @typedef PortafolioData
 * @property {string} imgSrc Url de la imagen
 * @property {string} title Titulo de la tarjeta
 * @property {string[]} skills Array con tus habilidades ej: ['React', 'CSS', 'JavaScript']
 * @property {string} descripcion La descripcion de la tarjeta
 * @property {string} demoURL Url de una pagina de demostración
 * @property {string} repoURL Url del repositorio, ej: https://github.com/usuario/repo
 * @property {string} anim La animación que se ejecutará cuando se cargue la tarjeta, ej: fade-up, fade-right, fade-left, fade-down
 * @property {number} averageBrightness Cuanto brillo tendrá el color de fondo de la tarjeta, ej: 0.1import myImage
 */

/**
 * @SofiDev Esto es JSDOC, si consideras que puede ser complicado solo borralo, es un comentario, no afectará en nada
 * @type {PortafolioData[]}
 */
export const portafolioData = [
	{
		imgSrc: 'https://dt2sdf0db8zob.cloudfront.net/wp-content/uploads/2021/06/copy-of-the-6-best-restaurant-website-templates-1.png',
		title: 'Centro Espírita',
		skills: ['Astro', 'StyledComponents'],
		descripcion:
			'Landing page do Centro Espírita Luz, Amor e Caridade',
		demoURL: '',
		repoURL: '',
		anim: 'fade-right',
	},
	{
		imgSrc: '/img/garagem274.jpg',
		title: 'Barbearia',
		skills: ['Astro', 'PY', 'DJANGO', 'MONGO'],
		descripcion:
			'Landing page da Barbearia Garagem 247, com funcionalidades como agendamento',
		demoURL: '',
		repoURL: '',
		anim: 'fade-right',
	},
	{
		imgSrc: '/img/API-estela.png',
		title: 'API',
		skills: ['PY', 'AWS', 'FAST', 'MONGO'],
		descripcion:
			'API de comida para um projeto de cardápio semanal da faculdade',
		demoURL: 'https://github.com/estelaoliveiradev/fastAPI-foods',
		repoURL: 'https://github.com/estelaoliveiradev/fastAPI-foods',
		anim: 'fade-right'
	},
	{
		imgSrc: '/img/python.jpg',
		title: 'API',
		skills: ['SPARK', 'AIRFLOW'],
		descripcion:
			'Pipeline de Dados com Airflow',
		demoURL: '',
		repoURL: '',
		anim: 'fade-right',
	}
];

const skillIcons = {
	JavaScript: 'skill-icons:javascript',
	React: 'skill-icons:react-dark',
	Astro: 'skill-icons:astro',
	CSS: 'skill-icons:css',
	Sass: 'skill-icons:sass',
	StyledComponents: 'skill-icons:styledcomponents',
	Bootstrap: 'skill-icons:bootstrap',
	Tailwind: 'skill-icons:tailwindcss-dark',
	AWS: 'skill-icons:aws-dark',
	FAST: 'skill-icons:fastapi',
	PY: 'skill-icons:python-light',
	DJANGO: 'skill-icons:django',
	API: 'skill-icons:fastapi',
	MONGO: 'skill-icons:mongodb',
	AIRFLOW: 'skill-icons:airlfow',
	SPARK: 'skill-icons:spark'
};

/**
 * @description Se mapea el portafolioData para que tenga los iconos de las habilidades
 * 	Puedes ver Array.map en https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map
 */
export const getPortafolioData = portafolioData.map((item) => {
	return {
		// Se coloca todo el contenido previo del item
		...item,
		// Se cambian las skills por los iconos correspondientes
		skills: item.skills.map((skill) => skillIcons[skill]),
		
	};
});