Angular Search Application

This is a simple Angular application that allows users to search for names and display the results in a table.

Table of Contents

• Getting Started
  • Prerequisites
  • Installation
• Usage
  • Search
• UI Screenshot
  • Screenshot 1
  • Screenshot 2
• Project Structure
• Built With

Getting Started

Prerequisites

Before you begin, ensure you have met the following requirements:

• Node.js and npm installed on your local machine.
• Angular CLI installed globally.

Installation

1. Clone the repository:

   git clone https://github.com/MansiN5/search-management-ui.git

2. Navigate to the project directory:

 cd SearchManagement

3. Install dependencies:

  npm install

4. Update API Connection:

  Replace "apiUrl = 'https://localhost:7174/api/'" in name-list.service.ts with localhost port your api application is running on. 

5. Start the development server:

  ng serve

6. Open your web browser and visit http://localhost:4200 to view the application.

Usage

Search

• Enter a search query in the input box.
• Press the "Search" button or press "Enter" to initiate the search.
• The search results will be displayed in a table below the search box.

UI Screenshot

Screenshot 1

Screenshot 2

Project Structure

The project structure is organized as follows:

• src/ - Contains the application source code.
• app/ - The main application module and components.
• assets/ - Static assets such as images, styles, and fonts.
• environments/ - Environment configuration files.

Built With

• Angular - The web framework used for building the application.
• Angular CLI - A command-line tool for Angular development.
• Bootstrap - Used for styling the application.