fjrodafo/portfolio repository overview

⁠Portfolio

My professional minimalist portfolio!

⁠Index

1. Introduction⁠
2. Download the code⁠
3. Set up the project⁠
4. Install dependencies⁠
5. Final steps⁠
6. Using Docker⁠
   1. Run with Docker Compose (Recommended)⁠
   2. Build Docker image manually⁠
7. Learn More⁠
8. Deploy on Vercel⁠
9. Credits⁠

⁠Introduction

My professional minimalist portfolio made with Next.js⁠, bootstrapped with create-next-app⁠, powered by ▲Vercel⁠!

/
├── public/
│   ├── fonts/
│   │   └── *.woff2
│   ├── icons/
│   │   ├── .../
│   │   │   └── *.svg
│   │   └── *.svg
│   ├── images/
│   │   ├── .../
│   │   │   └── *.png
│   │   └── *.jpg
│   └── favicon.ico
├── src/
│   ├── app/
│   │   ├── api/
│   │   │   └── send/
│   │   │       └── route.js
│   │   ├── layout.jsx
│   │   └── page.jsx
│   ├── components/
│   │   ├── context/
│   │   │   └── .../
│   │   │       └── *.jsx
│   │   ├── layout/
│   │   │   └── .../
│   │   │       └── *.jsx
│   │   ├── sections/
│   │   │   └── .../
│   │   │       └── *.jsx
│   ├── styles/
│   │   └── *.css
│   └── translations/
│       └── *.json
├── .env
├── docker-compose.yaml
├── Dockerfile
├── jsconfig.json
├── next.config.mjs
├── package-lock.json
└── package.json

⁠Download the code

Open your directory where you save your repositories and clone it with the following command:

# From GitHub
git clone https://github.com/FJrodafo/Portfolio.git

⁠Set up the project

This project needs a .env file based on .env.example with your environment variables related to your email service (Make sure you have an Resend account created, you can create one in the Resend⁠ official website):

RESEND_API_KEY=your_resend_api_key

⁠Install dependencies

As well, this project must be initialized and the necessary dependencies installed with the following command:

npm install

⁠Final steps

If you have Node v22.14 or higher installed on your machine, then you are good to go!

To check if you already have Node installed on your machine, run node -v in your terminal. Otherwise, you will need to install Node v22.14 or higher or, as a last option, check out the Docker⁠ alternative.

Finally, if you have Node installed, type the following command to run the development server:

npm run dev
# Press 'Ctrl + C' to exit

Open http://localhost:3000⁠ in your favorite browser to see the result (The page auto-updates as you edit the project files).

⁠Using Docker

This project can be run using Docker without installing Node.js locally.

You can find a Docker image of this project ready to be pulled on GitHub Packages⁠ or Docker Hub⁠ website!

Pull the image with the following commands:

# Docker Hub
docker pull fjrodafo/portfolio:1.0.0

# GitHub Packages
docker pull ghcr.io/fjrodafo/portfolio:1.0.0

⁠Run with Docker Compose (Recommended)

Make sure to create and configurate the .env file correctly with your environment variables (This file is used only at runtime, is ignored by Git and Docker, and is not included in the image):

RESEND_API_KEY=****

Build the container:

docker compose build

Run the container:

docker compose up -d

Stop the container:

docker compose down

Open http://localhost:3000⁠ in your favorite browser to see the result.

⁠Build Docker image manually

If you prefer not to use Docker Compose, you can build and run the image manually.

If you don't have Node v22.14 or higher installed on your machine, you can build a Docker image by running the Dockerfile⁠.

Open a terminal and run the following command:

docker build -t portfolio .

After the build completes, you can run your container with the following command:

docker run -dp 3000:3000 --env-file .env portfolio

You can even specify the environment variable value directly with the following command:

docker run -dp 3000:3000 -e RESEND_API_KEY=your_resend_api_key portfolio

Open http://localhost:3000⁠ in your favorite browser to see the result.

⁠Learn More

To learn more about Next.js, take a look at the following resources:

• Next.js Documentation⁠ - learn about Next.js features and API.
• Learn Next.js⁠ - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository⁠ - your feedback and contributions are welcome!

⁠Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform⁠ from the creators of Next.js.

Check out our Next.js deployment documentation⁠ for more details.

⁠Credits

Icons from Boxicons⁠ and IconScout⁠.