🏰 CyberFortress-Frontend

CyberFortress-Frontend is a powerful and intuitive React-based dashboard for API security management. Built with React and styled with Tailwind CSS, it provides a comprehensive view of your API security health.

🌟 Features

• 📊 Dynamic security health dashboard
• 🚨 Real-time alert system
• 📈 Graphical representation of security status
• 🔐 Secure authentication using Firebase
• 📑 Detailed API inventory management

🚀 Getting Started

Prerequisites

• Node.js (v14.0.0 or later)
• npm (v6.0.0 or later)

Installation

1. Clone the repository:

   git clone https://github.com/Captain-T2004/CyberFortress-Frontend.git
   

2. Navigate to the project directory:

   cd CyberFortress-Frontend
   

3. Install dependencies:

   npm install
   

4. Set up environment variables:

   • Create a .env file in the root directory
   • Add necessary environment variables (e.g., Firebase configuration)

5. Start the development server:

   npm start
   

🏗️ Project Structure

CyberFortress-Frontend/
├── src/
│   ├── components/
│   ├── pages/
│   └── App.js
├── public/
├── .env
└── package.json

🔧 Configuration

Update the .env file with your specific configuration:

REACT_APP_FIREBASE_API_KEY=your_firebase_api_key
REACT_APP_FIREBASE_AUTH_DOMAIN=your_firebase_auth_domain
// Add other necessary environment variables

🚢 Deployment

Build the project:

npm run build

🔮 Future Scope

• Implement real-time updates using WebSockets
• Add support for custom alert rules
• Develop a mobile app version
• Implement advanced data visualization options

🙏 Acknowledgements

• React
• Tailwind CSS
• Firebase
• React Icons