Issue Tracker Application

| A fully responsive Single Page Application for tracking issues

http://ui.issue-tracker-ahmedalima.tk/issues

This repository contains the Back-End application. UI application is HERE

Live Demo:  Issue Tracker

Technology Stack (MERN Stack)

• MongoDB: NoSQL Database.

• Atlas: for cloud database hosting.

• ExpressJS: for configuring API and UI servers.

• React: Front-end and UI

• Bootstrap: for styling.

• NodeJS: Back-end server

Features

• Server-Side-Render(SSR).

  • full rendering with credentials.

• Adding a New Issue.

• Editing Existing Issue. - Requires authentication (Sign In).

• Report Page: List all Owners and number of Issue Types associated with them.

• Deleting Issue - Requires authentication (Sign In).

• Close Issue - Requires authentication (Sign In).

• Filter Issues.

• Sign In - Google OAuth2 Sign In

• Persistent Sign in on browser refreshing during session.

• Search the title and description fields.

• User credentials are saved in Javascript Web Token   JWT

• Session Cookies are used in storing and transferring JWT.

Each Issue has the following properties:

• ID => Unique Identification Number (Auto-Generated). Immutable.

• Status => (New, Assigned, Fixed, Closed) indicate current state of issue. Mutable

• Owner => Name of the issue owner. Mutable

• Created => Date Of creation - Auto-Generated - Immutable.

• Effort => Estimated number of days for finishing up the issue. Mutable

• Due => Date expected to finish up the issue. Mutable

• Title => The Issue's title. Mutable

• Description => Detailed Description of the Issue

To run locally:

• Run the API Application

  • API application Repository
    • https://github.com/ahmedalima/tracker-api

• npm install

  • To install Application Dependencies. First time only.

• npm run server-with-HMR

  • Compile (Babel) and bundle Server code using Webpack.

• Set environment variables. Either by creating "sample.env" file or defining them in you shell

  • Required Environment variables are listed below.

• npm start

  • Start the UI server.
  • Ui Server code runs "Webpack Dev and Hot Module Replacement" middleware for transforming and bundling UI code.

Required Environment variables

# DB URL string
DB_URL=YOUR-DATABASE-URL

# server listening port
PORT=DEFAULT 80

# CORS configuration
ENABLE_CORS=true

# Javascript Web token secret string
JWT_SECRET="YOUR-SECRET-STRING"

# UI server for that sends cookies bypassing cors setting
# UI_SERVER_ORIGIN=""


# parent domain for setting cookies
COOKIE_DOMAIN=""