Skip to content

Building a task assignment website for College of Information and Communication Technology

License

Notifications You must be signed in to change notification settings

Zenfection/project-management

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Task Management CTU by Zen

icons8-angularjs.png Frontend (Angular 17)

Graph (2)..png

1. Technology used

Technology Description Version Source
95998d2a-00f2-4e8e-9ebc-0b06de97c37f.webp Tool for managing large projects in a monorepo structure, offering features like code organization, code sharing, and architectural consistency. 17.1.1 Nx Monorepo
material.png A comprehensive UI component library developed by the Angular team, offering a wide range of pre-built and customizable components following the Material Design guidelines. 17.0.0 Angular Material
badge.svg A powerful state management library for Angular applications, based on the Redux pattern, enabling predictable and scalable state management. 16.3.0 NgRX
logo.png A localization library for Angular applications, simplifying the implementation of internationalization (i18n) with features like translation management and dynamic loading of language files. 6.0.0 Transloco
5ff2f47bc8595fc2acbbdc9e_rive.png A versatile and powerful animation design tool that allows developers and designers to create interactive and captivating animations. 2.7.3 Rive Animation
apexcharts-logo-trimmed.svg Javascript Charting library that enables developers to create interactive and visually appealing charts and graphs for data visualization 3.44.0 apexcharts
quickstart---quill.png Library Rich Editor is a flexible and user-friendly WYSIWYG text editor designed. 1.3.7 quill rich editor
logo.webp A lightweight JavaScript library for adding sleek and customizable scrollbars to web applications. 1.5.5 perfect scrollbar
rxjs-1.svg Providing powerful tools for handling asynchronous operations, managing data streams, and simplifying complex workflows 7.8.1 Rxjs
tailwind-css-icon-512x307-1v56l8ed.png Utility-first CSS framework that allows developers to rapidly build modern and responsive web interfaces 3.3.3 tailwindCSS
ESLint_logo.svg.png A highly configurable JavaScript linter that identifies and reports coding errors, stylistic issues, and problematic patterns in code, helping developers maintain code quality and adhere to coding standards. 8.53.0 EsLint
prettier-icon-light.png A code formatting tool that enforces consistent code styles across projects, improving code readability and maintainability. 3.0.3 Prettier
cypress-logo-circle-dark.png A robust end-to-end testing framework for web applications, offering fast and reliable testing capabilities with user interaction simulation, real-time reloading, and debugging features. 13.5.0 Cypress

2. Changelog Optimize Code

3. Demo

icons8-nestjs.png Backend (NestJS 10)

'Nx Workspace Graph (1)..png

1. Roadmap Evolution

Status Task Commit Source
Use SWC compiler #31b37b7 swc.png SWC
Register OpenAPI Swagger #5ac0ab6 Swagger-logo.pngSwagger
Init Docker Container with postgreSQL and Redis Database #520bd26 icons8-docker.png Docker
 icons8-postgresql.pngpostgreSQL
icons8-redis.pngRedis
Create Compodoc Documentation #5905606 23202313.png Compodoc
Intergate PrismaORM with nestjs-prisma #3deacad prisma-logo-3805665B69-seeklogo.com.png Prisma
Create Hashing Password Service #1dac614 bcrypt
Setup Authentication SignIn / SignUp by  JWT includes: access-token and refreshtoken #78f749a pic_logo.svgjwt
Implement Guard for all authentication method #65d1c61 passportJS300x300pngpassport
Intergrate Redis to save refresh-token instead of client-cookie #d101d84 ioredis
Use cookie express store token via Redis #d060876 express-session
connect-redis
Add 2FA Authentication Method #cb7d0c7 otplib
qrcode
Add Google Authentication Method
Build Roles Authorization with Decorator and Guard #4ea237a
Build Cloud Storage with Cloudflare R2 and Rate Limiting #24a599b cloudflare-r2.pngCloudFlare R2
throtter
Intergated Nx Monorepo #1b64fab 95998d2a-00f2-4e8e-9ebc-0b06de97c37f.webpNx Monorepo
Build SMTP Mailer

2. Changelog Optimize Code

  • Build UserService with Prisma Serivce without DTO and Entity #d57cf4e, #f813be6
  • Improve database and build seed data #4929b8b
  • Add upload avatar method for users #8034221

3. Note

Database

db.png

.env

# postgreSQL with Docker
POSTGRES_USER=<YOUR USER>
POSTGRES_PASSWORD=<YOUR PASSWORD>
POSTGRES_DB=<YOUR DATABASE>

# Redis with Docker
REDIS_URL=redis://localhost:6379

# Prisma
DATABASE_URL=postgresql://${POSTGRES_USER}:${POSTGRES_PASSWORD}@localhost:5432/${POSTGRES_DB}?schema=public

# JWT TOKEN
JWT_SECRET=secret
JWT_AUDIENCE=localhost:3000
JWT_ISSUER=localhost:3000
JWT_ACESSS_TOKEN_TTL=3600
JWT_REFRESH_TOKEN_TTL=86400

# SESSION
SESSION_SECRET=<YOUR SECRET>

# TFA SECRET
TFA_APP_NAME=<YOUR TFA NAME>


# Cloudflare R2
ACCOUNT_ID=<YOUR ACCOUNT ID>
ACCESS_KEY_ID=<YOUR ACCESS ID>
SECRET_ACCESS_KEY=<YOUR SECRET ACCESS KEY>
BUCKET_NAME=<YOUR NAME BUCKET>

# Rate Limit
UPLOAD_RATE_TTL=60
UPLOAD_RATE_LIMIT=10