Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/lgomegarc/mi-portfolio/llms.txt

Use this file to discover all available pages before exploring further.

Mi Portfolio is pre-configured for Vercel deployment using @sveltejs/adapter-vercel. Deploying is a zero-config process — connect the GitHub repo to Vercel and it builds automatically.

​
Prerequisites

Before deploying, make sure you have:
  • A Vercel account (the free Hobby tier is sufficient)
  • The repository pushed to GitHub (fork of lgomegarc/mi-portfolio or your own copy)
  • (Optional) EmailJS credentials for the contact form — see EmailJS Credentials

​
Deploy from GitHub

1

Import the repository on Vercel

Go to https://vercel.com/new and click Import next to the lgomegarc/mi-portfolio GitHub repository (or your fork). You may need to grant Vercel access to your GitHub account if this is your first time.
2

Confirm the framework preset

Vercel automatically detects SvelteKit via the svelte.config.js file. The framework preset will be set to SvelteKit and no build settings need to be changed — the build command, output directory, and install command are all inferred correctly.
3

Add environment variables (optional)

If you want the contact form to send real emails, expand the Environment Variables section on the configuration screen and add the following variables before deploying:
  • VITE_EMAILJS_SERVICE_ID
  • VITE_EMAILJS_TEMPLATE_ID
  • VITE_EMAILJS_PUBLIC_KEY
You can also add or update these after deployment from the project settings.
4

Deploy

Click Deploy. Vercel runs npm run build (which calls vite build), processes the output through @sveltejs/adapter-vercel, and publishes the site to a .vercel.app URL. The initial deployment typically completes in under two minutes.

​
Build Command and Output

Vercel invokes the build script from package.json: 
{
  "scripts": {
    "build":   "vite build",
    "preview": "vite preview"
  }
}
During vite build, SvelteKit compiles the application and @sveltejs/adapter-vercel transforms the output into the .vercel/output/ directory structure that Vercel’s deployment infrastructure expects. This directory contains the static assets, serverless function bundles, and the Vercel routing configuration — all generated automatically with no manual configuration required.

​
Environment Variables on Vercel

Vite only exposes variables prefixed with VITE_ to browser-side code. Variables without this prefix are available only in server-side contexts and will be undefined in the client bundle. The following environment variables are used by the contact form:
VariableDescription
VITE_EMAILJS_SERVICE_IDEmailJS service identifier
VITE_EMAILJS_TEMPLATE_IDEmailJS email template identifier
VITE_EMAILJS_PUBLIC_KEYEmailJS public API key
To add or update these values after the initial deployment, go to Vercel Dashboard → Project → Settings → Environment Variables. Changes take effect on the next deployment — trigger a redeploy from the Deployments tab to apply them immediately.

​
Vercel Analytics

Mi Portfolio includes @vercel/analytics as a production dependency. It is activated in src/hooks.client.js: 
import { injectAnalytics } from '@vercel/analytics/sveltekit';

injectAnalytics();
This provides real-time visitor analytics — page views, unique visitors, top pages, and referrers — visible in the Vercel dashboard at no extra cost on the free tier.
Vercel Analytics is already integrated in the project via @vercel/analytics. Enable it in your Vercel project settings under the Analytics tab.

​
Custom Domain

To serve the portfolio from your own domain (e.g. leila.dev), no code changes are needed. Navigate to Vercel Dashboard → Project → Settings → Domains, enter your domain, and follow the DNS configuration instructions Vercel provides. Vercel automatically provisions and renews a TLS certificate via Let’s Encrypt.

​
Local Build Preview

Before pushing to production, you can verify the production build locally: 
npm run build && npm run preview
vite preview serves the compiled .svelte-kit/output (local build artifacts) on http://localhost:4173 by default, giving you a close approximation of the production environment before deploying.
Vercel auto-deploys on every push to the main branch. Create a separate branch for development work to avoid unintended production deploys.

Build docs developers (and LLMs) love

Get started for freeTalk to us