# 🛡️ Cybersecurity Engineer 3D Portfolio
Welcome to my digital fortress! This repository showcases my cutting-edge Cybersecurity Engineer portfolio in a fully interactive 3D experience, built with the power of React, TypeScript, and Three.js, and enhanced with stunning animations using Framer Motion.
Feel free to explore my world of cybersecurity, visualize data breaches, and see how I tackle cyber threats, all while enjoying the sleek and immersive interface of this virtual space.
🚀 Live Demo Visit my Portfolio
Warning: It's not just a portfolio — it's a statement! Be prepared to be amazed.
- React.js: Front-end framework for building interactive user interfaces.
- TypeScript: Type-safe programming to catch errors early and ensure code robustness.
- Three.js: Rendering 3D models and visualizations, giving depth to every detail.
- CSS3: Styling and layout for a professional, polished look.
- Framer Motion: Smooth animations and transitions for a delightful user experience.
- Babel: Transpiling code for maximum compatibility and performance.
Here's a breakdown of the main components of this project:
├── public/ # Static assets like images and icons
├── src/ # Source code for the portfolio
│ ├── assets/ # 3D models, textures, and media
│ ├── components/ # Reusable React components
│ ├── pages/ # Main pages (Home, About, Contact)
│ ├── styles/ # CSS and styling files
│ ├── App.tsx # Main React component
│ └── index.tsx # Entry point for the app
├── package.json # Project dependencies and scripts
└── README.md # This README file
- Browse through my cybersecurity projects using fully interactive 3D models built with Three.js.
- Rotate, zoom, and inspect every corner of my digital world.
- Adaptive layout that looks stunning on any device—desktop, tablet, or mobile.
- Dark and hacker-inspired theme to immerse you in the cybersecurity vibe.
- Dynamic transitions powered by Framer Motion for a seamless browsing experience.
- CSS3 animations for subtle, elegant effects.
- Visualize how I approach threat modeling, pentesting, and securing networks.
- See real-world scenarios of simulated data breaches and defense mechanisms.
To get a local copy up and running, follow these steps:
-
Clone the repository:
git clone https://github.com/joaomarcosjova/3D-portfolio-website.git
-
Install dependencies:
npm install
-
Run the development server:
npm run dev
Special thanks to the following tools and libraries that made this project possible:
Feel free to reach out if you have any questions or just want to connect!
Email: [email protected]
LinkedIn: Your LinkedIn