🚀 SRE | Systems Engineer | Platform Engineer
Exploring the world of SRE, Systems, and Platform Engineering, one system crash (oops, incident) at a time. When I'm not debugging or building, you'll find me buried in mangas, sipping coffee, and obsessing over that one perfect setup.
| Designation | Organization | Duration |
|---|---|---|
| SRE | One2N | Jun'24 - Present |
| SRE | Media.Net | Jul'23 - Jun'24 |
| SRE Intern | Media.Net | Jan'23 - Jun'23 |
From firefighting production issues to building scalable platforms, the journey's been a wild ride!
📄 Check out my detailed experience in my RESUME
Whether it's about DevOps musings, system design discussions, or just sharing memes - I'm always up for a good conversation! You can find me at:
- Portfolio: barundebnath.com
- Twitter: @heydensetsu
- LinkedIn: Barun Debnath
- Medium: Barun Debnath
- Email: barundebnath91@gmail.com
Grab a coffee, poke around, and don't forget to say hi!
This portfolio is built using Astro Micro - a minimal template that comes with:
- Full type safety
- Sitemap generation
- RSS feed support
- Markdown + MDX support
- TailwindCSS styling
- System, light, and dark themes
Special thanks to Trevor Tyler Lee for creating this amazing template!
- Node.js 18+ or use devbox for environment management
- npm or your preferred package manager
-
Install devbox:
curl -fsSL https://get.jetify.com/devbox | bash -
Install direnv:
# Ubuntu/Debian sudo apt install direnv # macOS brew install direnv
-
Add direnv hook to your shell (add to ~/.bashrc, ~/.zshrc, etc.):
eval "$(direnv hook bash)" # for bash eval "$(direnv hook zsh)" # for zsh
-
Clone the repository and navigate to the project directory:
git clone <your-repo-url> cd portfolio
-
Allow direnv and enter the devbox environment:
direnv allow
This will automatically activate the devbox environment with Python 3.11, uv, and direnv whenever you enter the directory.
-
Install Node.js dependencies:
npm install
Alternative: If you prefer manual devbox usage without direnv:
devbox shell # Enter the development environment manually-
Install Node.js 18+ (you can use nvm):
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.40.3/install.sh | bash source ~/.bashrc nvm install --lts nvm use --lts
-
Install dependencies:
npm install
-
Copy the environment example file:
cp .env.example .env
-
Configure Cloudflare R2 settings in
.env(optional, for media storage):R2_ACCESS_KEY_ID=your_r2_access_key_id R2_SECRET_ACCESS_KEY=your_r2_secret_access_key R2_ENDPOINT_URL=https://your_account_id.r2.cloudflarestorage.com R2_BUCKET_NAME=your_bucket_name R2_PUBLIC_URL=https://your_custom_domain.com
Start the development server:
npm run devThe site will be available at http://localhost:4321
Build the project for production:
npm run buildPreview the production build:
npm run previewnpm run dev- Start development servernpm run build- Type check and build for productionnpm run preview- Preview production buildnpm run astro- Run Astro CLI commands
devbox run setup-hooks- Manually setup git hooksdevbox run migrate-giphy- Manually run Giphy migration script
The project includes an automatic git pre-commit hook that:
- Scans blog posts for Giphy links on every commit
- Downloads GIFs and uploads them to Cloudflare R2
- Replaces Giphy links with R2 URLs in your markdown files
- Automatically adds modified files to the commit
The hook is automatically set up when you enter the devbox environment. To bypass the hook for a specific commit:
git commit --no-verifyThis blog supports both Mermaid and D2lang diagrams with automatic theme switching and responsive design.
Mermaid diagrams are rendered client-side and automatically adapt to your theme preference.
```mermaid
graph TD
A[Start] --> B[End]
```- Flowcharts
- Sequence diagrams
- Gantt charts
- Class diagrams
- State diagrams
- Entity Relationship diagrams
- User Journey diagrams
- Git graphs
- Pie charts
- Requirement diagrams
- C4 diagrams
- Mindmaps
- Timeline diagrams
- And more!
- ✅ Client-side rendering (privacy-friendly)
- ✅ Automatic theme switching
- ✅ All Mermaid diagram types supported
- ✅ Works offline after initial load
- ✅ Zero configuration needed
D2 diagrams are rendered at build-time, providing optimized SVG output with advanced layout algorithms.
```d2
server -> database: query
database -> server: results
```- ✅ Build-time rendering (faster page loads)
- ✅ Advanced layout algorithms
- ✅ Better for complex system diagrams
- ✅ Optimized SVG output
- ✅ CSS-based theme styling
```d2
title: System Architecture
users: Users {
shape: person
style.fill: "#e1f5fe"
}
api: API Server {
shape: hexagon
style.fill: "#4caf50"
}
db: Database {
shape: cylinder
style.fill: "#ff9800"
}
users -> api: HTTP requests
api -> db: SQL queries
db -> api: Results
api -> users: JSON response
```Both diagram types automatically adapt to your site's theme:
- Light Mode: Clean, professional appearance with subtle colors
- Dark Mode: High contrast with theme-appropriate colors
- Smooth Transitions: Seamless switching between themes
- Mermaid: 100% client-side rendering, no external dependencies at runtime
- D2: Build-time processing, no runtime overhead
- Corporate Friendly: No external API calls, works in restricted environments
- Offline Capable: Both solutions work completely offline
Check out the Diagram Showcase post to see both diagram types in action with various examples and theme switching demonstrations.
src/
├── components/ # Reusable Astro components
├── content/ # MDX content (blog posts, notes, etc.)
├── layouts/ # Page layouts
├── pages/ # Route pages
├── styles/ # Global styles
└── utils/ # Utility functions