Rian's Personal Website - Monorepo

Welcome to my personal website repository! This is a monorepo containing both frontend and backend applications for my personal website.

🏗️ Project Structure

rianino.github.io/
├── frontend/          # React + TypeScript + Vite frontend
│   ├── src/
│   ├── public/
│   ├── package.json
│   └── ...
├── backend/           # Express + TypeScript backend API
│   ├── src/
│   ├── package.json
│   └── ...
├── package.json       # Root workspace configuration
└── .github/workflows/ # CI/CD workflows

🌟 Features

Frontend

• Portfolio - Showcase of my projects and technical skills
• Gallery - Visual collection of my life and work
• Blog - My thoughts, opinions, and technical articles
• CFD Simulations - Run simulations on Inductiva PCs
• Game - Interactive gaming experience
• Contact - Get in touch with me

Backend

• REST API - Backend services for the website
• Blog Management - API endpoints for blog posts
• Contact Form - Handle contact form submissions
• Health Monitoring - API health checks

🚀 Tech Stack

Frontend

• React 18 - Modern React with hooks
• TypeScript - Type-safe JavaScript
• Vite - Fast build tool and dev server
• Tailwind CSS - Utility-first CSS framework
• Radix UI - Accessible component primitives
• React Router - Client-side routing
• React Hook Form - Form handling
• Recharts - Data visualization

Backend

• Node.js - JavaScript runtime
• Express - Web framework
• TypeScript - Type-safe JavaScript
• Helmet - Security middleware
• CORS - Cross-origin resource sharing
• Morgan - HTTP request logger

🔧 Development

Prerequisites

• Node.js 18+
• npm

Installation

# Clone the repository
git clone https://github.com/rianino/rianino.github.io.git
cd rianino.github.io

# Install dependencies for all workspaces
npm install

Running the Applications

Frontend Development

# Start frontend development server
npm run dev:frontend
# or
npm run dev

# Build frontend for production
npm run build:frontend

Backend Development

# Start backend development server
npm run dev:backend

# Build backend for production
npm run build:backend

# Start backend in production mode
npm run start:backend

Scripts Overview

Root Level

• npm run dev - Start frontend dev server
• npm run build - Build frontend for production
• npm run dev:frontend - Start frontend dev server
• npm run dev:backend - Start backend dev server
• npm run build:frontend - Build frontend
• npm run build:backend - Build backend

🌐 Deployment

The frontend is automatically deployed to GitHub Pages when changes are pushed to the main branch using GitHub Actions.

Manual Deployment

# Build and preview frontend
npm run build:frontend
npm run preview

# Deploy backend (when ready)
npm run build:backend
npm run start:backend

📁 Key Directories

Frontend (/frontend)

• src/components/ - Reusable React components
• src/pages/ - Page components
• src/hooks/ - Custom React hooks
• src/lib/ - Utility functions
• public/ - Static assets

Backend (/backend)

• src/ - TypeScript source code
• src/controllers/ - Route handlers
• src/routes/ - API route definitions
• src/models/ - Data models
• src/middleware/ - Custom middleware
• src/config/ - Configuration files
• src/utils/ - Utility functions

🤝 Contributing

This is a personal website repository, but if you find any issues or have suggestions, feel free to open an issue or submit a pull request.

📄 License

MIT License - see LICENSE file for details.

📧 Contact

• Website: rianino.github.io
• GitHub: @rianino