Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/aminagr/nextportfolio
next.js multilingual portfolio with TailwindCSS, SEO, responsive design, and EmailJS integration. Easily customizable for any portfolio
https://github.com/aminagr/nextportfolio
emailjs i18n multilingual next-intl nextjs portfolio-template portfolio-website react reactjs seo tailwindcss web-development
Last synced: about 1 month ago
JSON representation
next.js multilingual portfolio with TailwindCSS, SEO, responsive design, and EmailJS integration. Easily customizable for any portfolio
- Host: GitHub
- URL: https://github.com/aminagr/nextportfolio
- Owner: aminagr
- Created: 2024-11-04T19:35:04.000Z (about 2 months ago)
- Default Branch: main
- Last Pushed: 2024-11-04T20:15:35.000Z (about 2 months ago)
- Last Synced: 2024-11-04T20:38:02.760Z (about 2 months ago)
- Topics: emailjs, i18n, multilingual, next-intl, nextjs, portfolio-template, portfolio-website, react, reactjs, seo, tailwindcss, web-development
- Language: JavaScript
- Homepage:
- Size: 4.03 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Next.js Portfolio Starter Template
A fully responsive, SEO-optimized, multilingual, and ready-to-use portfolio template built with Next.js, React, Tailwind CSS, and CSS modules. This template includes all the essentials for a beautiful and functional portfolio, ready for easy customization.
## Features
- 🌐 **Multilingual Support**: Powered by `next-intl`, the template supports English and French. Easily extend to any language by adding a JSON file in the `messages` folder (e.g., `es.json`, `it.json`).
- 💌 **Contact Form**: Integrated with EmailJS for handling form submissions.
- 📱 **Fully Responsive**: Designed with mobile-first principles for a seamless experience across devices.
- 🧩 **Reusable Components**: Modular structure with essential sections: Hero, Services, Projects, Contact, and About.
- ⚙️ **App Router & SEO**: Utilizes Next.js App Router for efficient page routing and metadata generation, with robust SEO settings.
- 🎨 **Tailwind CSS & CSS Modules**: Styled with Tailwind for rapid design and CSS modules for custom styles.
## 📸 Screenshots
## Getting Started
**1. Clone the Repository**
```bash
git clone https://github.com/aminagr/NextPortfolio.git
cd NextPortfolio
```
**2. Install Dependencies**
```bash
npm install
```
**3. Configure Environment Variables**
If you wish to enable the contact form via EmailJS, Sign up at [EmailJS](https://www.emailjs.com/) to obtain your keys, uncomment the code in the ContactForm component and add the following environment variables in .env.local
```bash
NEXT_PUBLIC_EMAILJS_PUBLIC_KEY=your_public_key
NEXT_PUBLIC_EMAILJS_SERVICE_ID=your_service_id
NEXT_PUBLIC_EMAILJS_TEMPLATE_ID=your_template_id
```
**4. Change the content**
Update the language files (`en.json`, `fr.json`) in the `public/messages` folder for supported translations and you can extend to new languages by adding JSON files in `public/messages`and update `next-intl` to recognize them.
**5. Run the Development Server**
```bash
npm run dev
```
Your application will be live at http://localhost:3000
# 🤝 Contributing
Contributions are welcome! Open an issue or submit a pull request to share your suggestions and improvements.
# 📜 License
This work, including the source code and template, is licensed under the [Creative Commons Attribution-NonCommercial 4.0 International (CC BY-NC 4.0)](https://creativecommons.org/licenses/by-nc/4.0). You are free to copy, modify, and distribute this work under the following conditions:
- **Attribution**: You must give appropriate credit to the original author, Amina Gmine, by mentioning her name and linking to the original GitHub repository.
- **Non-Commercial**: You may not use the material for commercial purposes without prior permission from the author.