Data Science Portfolio Website

A modern, professional portfolio website built with React and Tailwind CSS. Perfect for showcasing your data science projects, skills, and experience.

🚀 Quick Start

1. Download the portfolio.html file
2. Customize your information (see below)
3. Deploy to your preferred platform (see deployment options below)

✏️ Customization

Open portfolio.html in any text editor and find the portfolioData object (around line 30). Update these fields:

const portfolioData = {
    name: "Charles Allias",
    title: "Data Scientist",
    tagline: "Be Curious not Judgemental",
    bio: "Charles Allias (Chuck) is an EMS Program Director at Penn State Fayette and data scientist with a Master's degree in Data Science from the University of Pittsburgh, where he applies advanced statistical analysis, machine learning, and predictive modeling to solve critical challenges in healthcare education and workforce development. He combines over 24 years of emergency medical education leadership with expertise in data visualization, clinical data warehousing, and forecasting models that transform complex datasets into actionable insights—driving measurable improvements including a 21% increase in paramedic certification pass rates and innovative statewide strategies to address EMS workforce shortages. His unique intersection of clinical expertise and data science enables evidence-based decision-making that enhances educational outcomes and shapes the future of emergency medical services across Pennsylvania.

",
    email: "chuckallias@gmail.com",
    github: "https://github.com/yourusername",
    linkedin: "https://linkedin.com/in/yourusername",
    // ... add your projects and skills
}

Adding Projects

In the projects array, add your own projects:

{
    title: "Your Project Name",
    description: "What does it do? What impact did it have?",
    tags: ["Python", "ML", "Flask"],
    github: "https://github.com/yourusername/project",
    demo: "https://your-demo-link.com" // or null if no demo
}

Updating Skills

Modify the skills array to match your expertise:

{
    category: "Your Category",
    items: ["Skill 1", "Skill 2", "Skill 3"]
}

🌐 Deployment Options

Option 1: GitHub Pages (Recommended)

Easiest for data scientists since your code is already on GitHub!

1. Create a new repository: yourusername.github.io
2. Rename portfolio.html to index.html
3. Push to GitHub
4. Your site will be live at https://yourusername.github.io

Quick commands:

git init
git add index.html
git commit -m "Initial portfolio"
git branch -M main
git remote add origin https://github.com/yourusername/yourusername.github.io.git
git push -u origin main

Option 2: Netlify

1. Go to netlify.com
2. Sign up (free)
3. Drag and drop your portfolio.html file
4. Done! You’ll get a URL like yourname.netlify.app

Custom domain: Netlify makes it easy to add your own domain in settings.

Option 3: Vercel

1. Go to vercel.com
2. Sign up (free)
3. Import your GitHub repo or upload the file
4. Deploy!

Option 4: Simple Local Testing

Just double-click portfolio.html to open it in your browser and preview your changes!

🎨 Customizing Colors & Style

The portfolio uses Tailwind CSS. To change colors, find these classes in the HTML:

• Primary accent: blue-400, blue-500, blue-600 → Change to purple, green, pink, etc.
• Background: slate-900, slate-800 → Change to gray, zinc, neutral
• Text: slate-300, slate-400 → Adjust for different contrasts

Example: To change from blue to purple theme, replace: - blue-400 → purple-400 - blue-500 → purple-500 - blue-600 → purple-600

📱 Features

✅ Fully responsive (looks great on mobile, tablet, desktop) ✅ Smooth scrolling navigation ✅ Modern gradient design ✅ Project showcase with tags ✅ Skills categorization ✅ Social media integration ✅ Single-file deployment (no build process needed!)

🔧 Adding More Sections

Want to add a blog or resume section? Just add a new section in the HTML:

<section id="blog" className="min-h-screen py-20 px-6">
    <div className="container mx-auto max-w-6xl">
        <h2 className="text-4xl md:text-5xl font-bold mb-12 text-center">
            Blog Posts
        </h2>
        <!-- Your content here -->
    </div>
</section>

And add it to the navigation:

{['about', 'projects', 'skills', 'blog', 'contact'].map(section => (
    // ... navigation button
))}

💡 Tips

• Keep project descriptions concise - 2-3 sentences max
• Use action verbs - “Built”, “Developed”, “Analyzed”, “Improved”
• Quantify impact - “Reduced processing time by 40%”
• Update regularly - Add new projects as you complete them
• Link to GitHub - Recruiters want to see your code!

📸 Adding a Profile Photo

Replace this line (around line 65):

<i className="fas fa-user"></i>

With:

<img src="your-photo-url.jpg" alt="Your Name" className="w-full h-full object-cover rounded-full" />

🆘 Need Help?

• Icons not showing? Make sure you have an internet connection (Font Awesome loads from CDN)
• Styles broken? Check that the Tailwind CDN link is working
• Want to add animations? Look into Tailwind’s animation classes or AOS library

📄 License

Free to use and modify for your own portfolio!

---

Built for data scientists, by Claude 🤖

Good luck with your portfolio! 🚀