https://github.com/a-tokyo/simple-portfolio-nextjs
👨🏻💻 A simple portfolio built using NextJS, TailwindCSS and Framer Motion.
https://github.com/a-tokyo/simple-portfolio-nextjs
framer framer-motion nextjs nextjs15 tailwindcss
Last synced: 8 months ago
JSON representation
👨🏻💻 A simple portfolio built using NextJS, TailwindCSS and Framer Motion.
- Host: GitHub
- URL: https://github.com/a-tokyo/simple-portfolio-nextjs
- Owner: a-tokyo
- License: mit
- Created: 2025-04-30T00:08:35.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-05-03T14:03:37.000Z (about 1 year ago)
- Last Synced: 2025-09-26T08:47:56.222Z (9 months ago)
- Topics: framer, framer-motion, nextjs, nextjs15, tailwindcss
- Language: JavaScript
- Homepage: https://simple-portfolio-nextjs.ahmedtokyo.com/
- Size: 1.81 MB
- Stars: 9
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Portfolio Website
This is a portfolio website built with Next.js and Tailwind CSS. It showcases your skills, projects, and achievements in an elegant and responsive design.
## Installation
1. Clone the repository: `git clone https://github.com/a-tokyo/simple-portfolio-nextjs.git`
2. Navigate to the project directory: `cd portfolio-website`
3. Install the dependencies: `npm install`
## Usage
1. Start the development server: `npm run dev`
2. Open your browser and visit `http://localhost:3000` to view the website.
## Dependencies
The following dependencies are required for this project:
- Next.js: A React framework for server-side rendering and static site generation.
- Tailwind CSS: A highly customizable CSS framework.
- React: A JavaScript library for building user interfaces.
- React Icons: A collection of popular icons for React projects.
- TypeScript: A typed superset of JavaScript that compiles to plain JavaScript.
- Resend: Resend is the email API for developers.
## Email Integration with Resend
This project uses Resend for handling email functionality in the contact form.
### Setting up Resend
1. Create a free account at [Resend](https://resend.com) if you don't have one.
2. Generate an API key from your Resend dashboard.
3. Create a `.env.local` file in the root directory with the following variables:
```
RESEND_API_KEY=your_resend_api_key_here
FROM_EMAIL=your_verified_email_address@example.com
```
4. Verify your sender email in the Resend dashboard.
5. Restart the development server for the changes to take effect.
6. Add the env variables to your deployment provider eg: Vercel
# Author
Built with 💜 by [Ahmed Tokyo](https://ahmedtokyo.com)