Esse Portfólio foi desenvolvido como parte da entrega para o Checkpoint 2 para disciplina Web Development na FIAP, conforme detalhado na documentação de requisitos fornecida para esse projeto.
- React JS + Vite
- Tailwind CSS
- DaisyUI
- React Router Dom
- React Icons
- React GitHub Calendar
- Ts Particles
- Typewriter Effect
- Framer Motion
- React Bootstrap
{
"name": "portfolio",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"lint": "eslint .",
"preview": "vite preview"
},
"dependencies": {
"@material-tailwind/react": "^2.1.10",
"framer-motion": "^11.7.0",
"react": "^18.3.1",
"react-bootstrap": "^2.10.4",
"react-dom": "^18.3.1",
"react-github-calendar": "^4.3.1",
"react-icons": "^5.3.0",
"react-router-dom": "^6.26.2",
"react-tsparticles": "^2.12.2",
"tailwind-scrollbar": "^3.1.0",
"tsparticles": "^2.0.6",
"typewriter-effect": "^2.21.0"
},
"devDependencies": {
"@eslint/js": "^9.9.0",
"@types/react": "^18.3.3",
"@types/react-dom": "^18.3.0",
"@vitejs/plugin-react": "^4.3.1",
"autoprefixer": "^10.4.20",
"daisyui": "^4.12.10",
"eslint": "^9.9.0",
"eslint-plugin-react": "^7.35.0",
"eslint-plugin-react-hooks": "^5.1.0-rc.0",
"eslint-plugin-react-refresh": "^0.4.9",
"globals": "^15.9.0",
"postcss": "^8.4.47",
"tailwindcss": "^3.4.13",
"vite": "^5.4.1"
}
}Acesse a Demo do Portfólio publicado na Vercel 👉️ https://portfolio-ryanbrito.vercel.app/
Esse projeto foi elaborado com base no template do Vite e estilizado com o Biblioteca CSS Tailwind
Antes de qualquer coisa, certifique-se de que o Node.js está instalado na sua máquina, utilzando o comando:
node --versionCaso não, siga o passo a passo de instalação do Node.js da Alura 👇
https://www.alura.com.br/artigos/como-instalar-node-js-windows-linux-macos?srsltid=AfmBOopiIOrcWh6MtVgVvTWHUGHKmGL1DnZjAEYSebeYkIFMtvPmeXeM
Primeiro, utilize o comando npm install na raiz do projeto para inicializar a instalação do pacote node_modules baseado no package.json:
npm installLogo em seguida, utilize o comando para inicializar o servidor local:
npm run dev
# ou
yarn devAbra o seu http://localhost: no navegador de preferência e veja o resultado!
Você pode começar a editar os componetes localizados no diretório ..\src\components\Home\Home.jsx e poderá ver os elementos sendo alterados em tempo real. A página irá atualizar automaticamente e mostrar os novos dados.
As rotas para todas as seções do Portfólio podem ser acessadas no diretório ..\src\main.jsx
Para aprender um pouco mais sobre o React JS, leia a documentação oficial:
Gostaria de agradecer ao meu professor Caio Vinícius pela ótima didática em sala de aula e aos colegas que me apoiaram na realização desse projeto. Muito obrigado!
- Ryan Brito Pereira Ramos, RM554497
- Caio Vinícius Gonçalves de Oliveira, PC0486