Skip to content

Ruban2107/Client-Portal

Repository files navigation

Sure! Here’s a full README content tailored for your Client Management Web Application project:

# Client Management Web Application

## Overview

The **Client Management Web Application** is designed to help businesses, particularly architectural firms, manage their clients, meetings, and associated projects. The app allows users to store client information, schedule meetings, track tasks, and maintain a clear record of client portfolios. This project is developed as part of a phase-end project to demonstrate skills in front-end development, database design, and project management using Agile methodologies.

The web application is built using **Angular** for the frontend, **MySQL** for data storage, and managed using **GitHub** for version control. It is structured to allow easy addition of clients, scheduling of client meetings, and viewing of project-related tasks.

---

## Features

- **Client Management**: Add, update, and view client details (e.g., name, email, phone).
- **Meeting Scheduling**: Schedule, update, and delete meetings with clients. View upcoming meetings.
- **Portfolio Management**: Track client projects and related tasks.
- **Responsive Design**: The application is fully responsive, designed for both desktop and mobile devices.
- **Data Storage**: All client and meeting data is stored in a MySQL database for persistent data management.

---

## Technologies Used

- **Frontend**:
  - **Angular**: For building dynamic, responsive, and interactive user interfaces.
  - **HTML5, CSS3**: For layout and styling of the application.
  
- **Backend**:
  - **MySQL**: For storing and managing client and meeting data.

- **Version Control**:
  - **Git & GitHub**: For managing the codebase, version control, and collaboration.

- **Project Management**:
  - **Jira** (or any project management tool): For managing tasks and sprints in an Agile environment.

---

## Installation

Follow these steps to run the project locally:

### Prerequisites

Ensure you have the following installed:
- **Node.js**: Download and install from [here](https://nodejs.org/).
- **MySQL**: Install MySQL from [here](https://dev.mysql.com/downloads/).

### Clone the Repository

Clone this repository to your local machine using Git:

```bash
git clone https://github.com/yourusername/client-management-web-app.git

Frontend Setup

  1. Navigate to the project directory:

    cd client-management-web-app
  2. Install the necessary dependencies:

    npm install
  3. Run the Angular development server:

    ng serve
  4. Open the browser and go to http://localhost:4200 to view the application.

Database Setup

  1. Import the database schema into MySQL. You can find the SQL scripts under the database-scripts/ folder.

Here is an example SQL script to create the clients and meetings tables:

-- Create table for clients
CREATE TABLE clients (
  id INT AUTO_INCREMENT PRIMARY KEY,
  name VARCHAR(100),
  email VARCHAR(100),
  phone VARCHAR(15),
  created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);

-- Create table for meetings
CREATE TABLE meetings (
  id INT AUTO_INCREMENT PRIMARY KEY,
  client_id INT,
  meeting_date DATETIME,
  agenda TEXT,
  FOREIGN KEY (client_id) REFERENCES clients(id)
);
  1. Ensure MySQL is running and correctly connected to your Angular app's backend.

Usage

Once the application is up and running, you can:

  1. Add New Clients:

    • Navigate to the "Clients" section and add a new client by filling in their details such as name, email, and phone number.
  2. Schedule Client Meetings:

    • After adding a client, go to the "Meetings" section to schedule and track meetings with your clients.
  3. View Upcoming Meetings:

    • View upcoming meetings and client interactions in the "Upcoming Meetings" section on the dashboard.
  4. Edit or Delete Clients and Meetings:

    • Clients and meetings can be edited or deleted by accessing their respective details pages.

Database Schema

This application uses a MySQL database to store and manage client and meeting data.

Clients Table

Stores information about each client.

Column Type Description
id INT Unique identifier for each client
name VARCHAR(100) Name of the client
email VARCHAR(100) Client's email address
phone VARCHAR(15) Client's phone number
created_at TIMESTAMP Timestamp of when the client was added

Meetings Table

Stores information about meetings with clients.

Column Type Description
id INT Unique identifier for each meeting
client_id INT Foreign key to the client ID
meeting_date DATETIME Date and time of the meeting
agenda TEXT Agenda or description of the meeting

Contributing

Contributions to this project are welcome! If you'd like to contribute, please follow these steps:

  1. Fork the repository to your GitHub account.
  2. Create a new branch: git checkout -b feature-name.
  3. Make your changes and commit them: git commit -m 'Added feature'.
  4. Push your changes: git push origin feature-name.
  5. Create a pull request to the main repository.

License

This project is licensed under the MIT License - see the LICENSE file for details.


Acknowledgments

  • Thanks to Henna Solutions for providing the project idea.
  • Special thanks to the instructors and mentors who guided me throughout the development of this project.

### Explanation of the README Sections:

- **Project Overview**: Provides an introductory summary of the project.
- **Features**: Highlights the main functionalities of the web application.
- **Technologies Used**: Lists the key technologies used to build the project (Angular, MySQL, Git, etc.).
- **Installation**: Step-by-step instructions to help someone run the project on their local machine.
- **Screenshots**: Displays images or screenshots of the app to give recruiters a visual of the UI.
- **Usage**: Explains how to use the application once it's up and running.
- **Database Schema**: Details the tables and structure used in the database.
- **Contributing**: Explains how others can contribute to the project.
- **License**: Provides legal information about how others can use or modify the project.
- **Acknowledgments**: Credits anyone who contributed to the development of the project.

By using this template, you’ll have a clean, professional README that will make it easy for recruiters to understand your project, how it works, and how to interact with it.

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published