Role Management System

Project Overview

The Role Management System is a React-based application designed to manage users and roles. It allows administrators to create, update, delete, and assign roles to users seamlessly. The interface is user-friendly, making it easy to manage permissions and maintain organizational hierarchy. It is serverless and uses local storage.

Features

• Role Management: Add, edit, delete, and view roles with predefined permissions.
• User Management: Assign roles to users and manage their details.
• Dynamic Updates: Reflect changes in roles and users instantly (requires page refresh in current implementation).
• Responsive Design: Fully responsive and optimized for different screen sizes.

Setup Instructions

Prerequisites

Ensure you have the following installed:

• Node.js (v14 or later)
• Git (for cloning the repository)
• Netlify CLI (optional, for hosting on Netlify)

Installation Steps

1. Clone the Repository

   git clone https://github.com/Rohith2517/Role_system.git
   cd Role_system

2. Install Dependencies

   npm install

3. Run the Development Server

   npm start

   The application will be accessible at http://localhost:3000.

4. Build for Production

   To create a production-ready build, run:

   npm run build

   This generates a build/ folder that can be deployed.

Hosting Instructions

Deploying on Netlify

1. Build the project:

   npm run build

2. Drag and drop the build/ folder into your Netlify dashboard, or use the Netlify CLI:

   netlify deploy --prod

Hosting on GitHub Pages (Optional)

1. Install the GitHub Pages package:

   npm install gh-pages --save-dev

2. Add the following to your package.json:

   "homepage": "https://yourusername.github.io/Role_system",
   "scripts": {
     "predeploy": "npm run build",
     "deploy": "gh-pages -d build"
   }

3. Deploy using:

   npm run deploy

Project Structure

• src/: Contains all source files.
• components/: Includes reusable UI components like RoleTable, UserTable, and RoleForm.
• App.js: The main application file.
• public/: Contains static assets.
• build/: Generated after running npm run build, used for deployment.

Features Explanation

Role Management:

• Add roles with predefined permissions (e.g., Read, Write, Delete).
• Edit or delete roles dynamically.

User Management:

• Assign roles to users from a dropdown list.
• Users can be updated or removed.

UI & Navigation:

• The application features a responsive navigation bar with a Dashboard title and buttons for navigating between Role Management and User Management sections.

Notes

Dynamic Updates:

Currently, changes to roles are visible only after refreshing the page.
To implement real-time updates, you can use React Context or a state management library like Redux.

Future Improvements:

• Add backend integration for persistent data storage.
• Implement role-based access control for users.