Angular Mini Kullanıcı Yönetim Uygulaması

Angular, ExpessJS ve PostgreSQL kullanılarak geliştirilmiş mini kullanıcı yönetim uygulamasıdır. Yöneticilerin kullanıcı ekleme,düzenleme ve silme işlemleri yapabildiği; kullanıcıların ise sadece diğer kullanıcıları görüntüleyebildiği bir web uygulamasıdır.

Kullanılar Teknolojiler

• HTML
• CSS - Bootstrap
• Angular - Typescript
• NodeJS - ExpressJS
• JSON Web Token
• Bcrypt

Kurulum

user.sql dosyasını pgAdminde 'userManagementDB' ismindeki database'e query tool yardımı ile yazılabilir. Database adı, kullanıcı adı ve şifresi gibi bilgileri /backend/db.js dosyasından değiştirebilirsiniz.

Akabinde sırasıyla backend ve ng-frontend klasörleri içinde npm install komutu çalıştırılmalı.

Gerekli npm modülleri indirildikten sonra 2 klasörde de npm start komutu ile projeyi çalışır duruma getirebilirsiniz.

Frontend http://localhost:4200 Backend http://localhost:3000 adreslerinde çalışır. Frontend'de bir port çakışması durumunda CLI otomatik olarak başka bir port'a geçmek için soru soracaktır. Backend'de backend/app.js dosyasında PORT değişkenini değiştirebilirsiniz.

Tanımlı kullanıcı adları ve şifreleri

Yönetici hesabı

• Kullanıcı Adı: admin
• Şifre: test

Kullanıcı hesabı:

• Kullanıcı Adı: acanh
• Şifre: test

Kullanıcı hesabı:

• Kullanıcı Adı: deniz7erdem
• Şifre: test

Kullanım ve görseller

Giriş ekranı

• Yanlış bilgi girildiğinde

Kullanıcı hesabı için Anasayfa

Yönetici hesabı için Anasayfa

• Kullanıcı eklendiğinde, kullanıcı listeside yenilenerek hemen güncel durum gösterilir
• Çakışma durumunda uyarı gelir

Kullanıcı ayrıntısı görüntüleme

Kullanıcı düzenleme

• Kulanıcı düzenlendiğinde gelen alert

• Kullanıcı adı çakıiması durumunda gelen alert