Skip to main content
The PROFILE object in src/content/profileData.ts is the central configuration for your portfolio. It stores all your personal information, skills, education, and site metadata.

​
PROFILE Structure

The PROFILE object contains several key sections:
src/content/profileData.ts
export const PROFILE = {
  site: {
    SEO: {
      title: "Vaibhav Sharma (@Vaibhav227) - Learn, Share and Grow ❤️",
      description: "Learn and Grow ❤️ -- Software Engineer | Open Source Lover...",
    },
  },
  timezone: "Asia/Kolkata",
  language: "en-IN",
  firstName: "Vaibhav",
  name: "Vaibhav Sharma",
  headLine: "Learn and Grow ❤️",
  headLine2: "I enjoy building software...",
  website: "https://vaibhu.com",
  repo: "https://github.com/Vaibhav227/portfolio",
  shortIntros: [...],
  skills: [...],
  links: {...},
  studies: [...],
};

​
Configuration Sections

​
Site & SEO

site: {
  SEO: {
    title: "Your Name - Your Tagline",
    description: "A detailed description for search engines and social media",
  },
}
SEO title and description appear in search results and when sharing your portfolio on social media.

​
Personal Information

timezone: "Asia/Kolkata",
language: "en-IN",
firstName: "Vaibhav",
name: "Vaibhav Sharma",
headLine: "Learn and Grow ❤️",
headLine2: "I enjoy building software and bring ideas to life...",
website: "https://vaibhu.com",
repo: "https://github.com/Vaibhav227/portfolio",
PropertyTypeDescription
timezonestringYour timezone (e.g., “America/New_York”)
languagestringLocale code for date formatting
firstNamestringYour first name
namestringYour full name
headLinestringShort tagline or motto
headLine2stringLonger bio or description
websitestringYour portfolio URL
repostringLink to your portfolio’s source code

​
Short Intros

An array of bullet points displayed on your homepage:
src/content/profileData.ts
shortIntros: [
  "💻 Software Engineer ",
  '🧑🏻\u200d💻 Building <a href="https://justcall.io/product/ai-voice-agent/" target="_blank" rel="noopener" style="color:#3939ed; text-decoration:underline; font-weight:bold;">JustCall\'s AI Voice Agent</a> at SaaS Labs',
  "☘️ Passionate about User Experience(UX) Improvement and bringing ideas to life",
  "📈 Unprofessional Investor",
  "🎧 Music Lover",
],
HTML is supported in shortIntros for links and formatting. Make sure to escape quotes properly.

​
Skills Array

List your technical skills:
src/content/profileData.ts
skills: [
  "HTML",
  "CSS",
  "Remix.run",
  "Nextjs",
  "Typescript",
  "React",
  "Tailwind CSS",
  "Cloud Computing",
  "Docker",
  "Node.js",
  "Astro",
  "React Query",
  "Zustand",
  "Turborepo",
  "SQL",
  "Zod"
]
Skills are automatically linked to their corresponding tag pages if content exists with that tag:
src/components/sections/AboutMe.astro
{
  skills.map((skill) => {
    if (tagsMap.has(skill)) {
      return (
        <li>
          <a href=`/tags/${skill}` class="hover:font-bold">
            {skill}
          </a>
        </li>
      )
    } else {
      return (
        <li>
          <span>{skill}</span>
        </li>
      )
    }
  })
}
Define your social media and contact links:
src/content/profileData.ts
links: {
  github: "https://github.com/Vaibhav227",
  mail: "mailto:[email protected]",
  linkedin: "https://www.linkedin.com/in/vaibhav-sharma-844847204/",
  instagram: "https://www.instagram.com/sharmavaibhav227/",
},
These links are used throughout the site for social icons and contact information.

​
Education & Studies

Track your educational background:
src/content/profileData.ts
studies: [
  {
    title: "B.Tech in Computer Science and Engineering",
    level: "Bachelor",
    score: "9 CGPA",
    endYear: "2023",
  },
  {
    title: "Class 12th (CBSE)",
    level: "Intermediate",
    score: "95%",
    endYear: "2019",
  },
  {
    title: "Class 10th (CBSE)",
    level: "Secondary",
    score: "10 CGPA",
    endYear: "2017",
  },
]

​
Using PROFILE Data

​
In Astro Components

src/pages/index.astro
---
import { PROFILE } from "../content/profileData";
const SITE = PROFILE.site
---

<BaseLayout
  title={SITE.SEO.title}
  description={SITE.SEO.description}
>

​
In Utility Functions

The PROFILE object is commonly imported in utility functions:
src/lib/utils.ts
import { PROFILE } from "@/content/profileData.ts";

const getLocalLanguage = (): string => {
  return PROFILE.language;
}

export const formateLocalDate = (
  date: Date,
  timeZone: string = PROFILE.timezone,
): string => {
  return new Intl.DateTimeFormat(getLocalLanguage(), {
    year: "numeric",
    month: "short",
    day: "2-digit",
    timeZone: timeZone,
  }).format(date);
};

​
Customization Guide

1

Edit Basic Info

Update name, firstName, headLine, and headLine2 with your information
2

Configure SEO

Customize site.SEO.title and site.SEO.description for better search visibility
3

Set Timezone & Language

Update timezone and language to match your locale for proper date formatting
4

Add Your Skills

Replace the skills array with your technical expertise
5

Update Social Links

Modify the links object with your social media profiles
6

Add Education

Update the studies array with your educational background
After modifying profileData.ts, the dev server will hot-reload your changes automatically.

​
Best Practices

Keep It Current

Regularly update your skills, education, and links to reflect your current status

SEO Optimization

Write clear, descriptive SEO titles and descriptions (50-60 chars for title, 150-160 for description)

Consistent Formatting

Use consistent formats for dates, scores, and URLs across all entries

Valid Timezones

Use IANA timezone identifiers (e.g., “America/New_York”, “Europe/London”)

Build docs developers (and LLMs) love

Get started for freeTalk to us