João Loureiro
fe8bbf05f6
- Integrated Space Grotesk font alongside Inter in layout. - Added FloatingSocials component for social media links. - Updated Footer with a new background color. - Modified Header to improve spacing and added LanguageSwitcher. - Refactored LanguageSwitcher to use a dropdown for language selection. - Updated ProjectCard to include images and improved layout. - Revamped About section to include categorized skills with animations. - Enhanced Contact section with animations and improved form styling. - Updated Hero section with type animation for dynamic text display. - Refactored Projects section to include animations for project cards. - Removed Skills section as it was integrated into the About section. - Updated global styles for light and dark themes, including new animations. - Updated translations for new skills and hero section text.
Personal Portfolio & Blog - Frontend
This is the frontend for my personal portfolio, built with Next.js, Tailwind CSS, and TypeScript. The project is designed to be a modern, responsive, and performant showcase of my skills and projects.
✨ Features
- Internationalization (i18n): Supports both English and Portuguese, with language switching capabilities.
- Dark Mode: A sleek dark mode that can be toggled by the user, with preferences saved in local storage.
- Component-Based Architecture: Built with reusable React components for maintainability and scalability.
- Responsive Design: Fully responsive layout that looks great on all devices, from mobile phones to desktop screens.
- Contact Form: A functional contact form that communicates with a backend service to send emails.
🛠️ Tech Stack
- Framework: Next.js 15
- Styling: Tailwind CSS 4
- Language: TypeScript
- Internationalization: next-intl
- Icons: Heroicons & React Icons
- Linting: ESLint
🚀 Getting Started
To get a local copy up and running, follow these simple steps.
Prerequisites
- Node.js (v18.18 or later)
- npm, yarn, or pnpm
Installation & Development
-
Clone the repository:
git clone <your-repository-url> cd <your-repository-folder>/frontend -
Install dependencies:
npm install -
Run the development server: The development server uses Turbopack for faster performance.
npm run dev -
Open your browser: Navigate to http://localhost:3000 to see the result.
Building for Production
To create a production-ready build, run:
npm run build