[English] & [Türkçe] versions below.
Hey there! 👋
This is DevPortfolio — a modern, high-performance portfolio template I built because I honestly got tired of generic, static portfolio sites. As a backend developer, I wanted something that felt "native" to my workflow (think IDE themes, terminal vibes, data streams) but still looked impressive on the frontend.
It's not just a static page; it's a Full Stack application. It comes with its own lightweight backend so you can manage your projects without touching the code every time you build something new.
- IDE-Inspired Themes: Switch between themes like Obsidian, Cyber, Forest, and Neon. It feels like changing your VS Code theme.
- Full Stack & Dynamic: Comes with a Node.js + SQLite backend. You can log in and manage your projects dynamically.
- Performance First: Native animations, particle data flows, and 3D interactions that run smooth as butter (thanks to Framer Motion).
- Admin Dashboard: A secure
/adminpanel to add/edit/delete your showcased projects. No more hardcoding JSON files. - Gamer/Coder Aesthetic: Glitch effects, typewriter text, and a "circuit board" background that makes you look like you're hacking the mainframe.
Frontend:
- React 19 + TypeScript
- Tailwind CSS (Styling)
- Framer Motion (Animations)
- Lucide React (Icons)
Backend:
- Node.js + Express
- SQLite3 (Database)
- JWT (Auth)
-
Clone the repo
git clone https://github.com/yourusername/portfolio.git cd portfolio -
Install dependencies (This installs both frontend and backend stuff)
npm install
-
Run it!
npm run dev
This command creates the database, seeds it with sample data, and launches both the React app and the API server concurrently.
-
Admin Access
- Go to:
http://localhost:5173/login - Username:
admin - Password:
admin123
- Go to:
Selamlar! 👋
Burası DevPortfolio. Açıkçası, her yerde gördüğümüz o standart, birbirinin kopyası portfolyo sitelerinden sıkıldığım için bu projeyi yaptım. Bir backend geliştiricisi olarak, hem kod yazdığım ortamlara (IDE temaları, terminal, veri akışları) benzeyen hem de görsel olarak "ben buradayım" diyen bir şey istiyordum.
Burası sadece statik bir HTML sayfası değil, Full Stack çalışan yaşayan bir uygulama. Kendi yönetim paneli ve veritabanı var, yani yeni bir proje eklemek için her seferinde kodun içine girip uğraşmanıza gerek yok.
- IDE Temaları: Obsidian, Cyber, Forest, Neon gibi temalar arasında geçiş yapabiliyorsunuz. Tıpkı VS Code teması değiştirir gibi hissettiriyor.
- Full Stack & Dinamik: Arkada Node.js + SQLite çalışıyor. Admin paneline girip projelerinizi anlık olarak yönetebiliyorsunuz.
- Performans Odaklı: Framer Motion sağ olsun, animasyonlar, veri akışları ve 3D efektler yağ gibi akıyor.
- Yönetim Paneli:
/adminrotasında güvenli bir panel var. Projelerinizi buradan ekleyip, düzenleyip, silebilirsiniz. Hardcode JSON dosyalarıyla uğraşmaya son. - Gamer/Coder Estetiği: Glitch efektleri, daktilo animasyonları ve arkada akan "devre kartı" animasyonuyla tam bir teknoloji üssü.
Frontend (Önyüz):
- React 19 + TypeScript
- Tailwind CSS
- Framer Motion (Animasyonlar)
Backend (Arkayüz):
- Node.js + Express
- SQLite3 (Veritabanı)
- JWT (Kimlik Doğrulama)
-
Projeyi indirin
git clone https://github.com/ozaiithejava/portfolio.git cd portfolio -
Paketleri yükleyin (Hem ön hem arka yüz paketlerini kurar)
npm install
-
Başlatın
npm run dev
Bu komut veritabanını oluşturur, içine örnek verileri basar ve hem React uygulamasını hem de API sunucusunu aynı anda ayağa kaldırır.
-
Admin Girişi
- Adres:
http://localhost:5173/login - Kullanıcı adı:
admin - Şifre:
admin123
- Adres:
Built with ❤️ and a lot of caffeine.