blob: 9ccf1a9a8a850950500d3d2d46ce3a17a0c37623 (
plain) (
tree)
|
|
# Admin Panel Application
This project is a full-stack application built with React.js for the frontend and Node.js/Express.js for the backend. It includes user authentication using Firebase, routing using React Router DOM, and data storage using MongoDB.
## Getting Started
To get started with this project, follow these steps:
### Prerequisites
- Node.js and npm should be installed on your machine.
- MongoDB should be installed and running locally or accessible remotely.
### Installation
1. Clone the repository to your local machine:
```
git clone <repository_url>
cd admin-panel
```
2. Install dependencies for both the server and the client:
```
# Install server dependencies
cd server
npm install
# Install client dependencies
cd ../src
npm install
```
### Configuration
#### Server Configuration
1. **Environment Variables**:
- Create a `.env` file in the `server` directory and configure it with necessary environment variables (e.g., MongoDB URI, Firebase configuration).
Example `.env` file:
```
PORT=5000
MONGODB_URI=mongodb://localhost:27017/admin-panel
FIREBASE_API_KEY=your_firebase_api_key
FIREBASE_AUTH_DOMAIN=your_firebase_auth_domain
FIREBASE_PROJECT_ID=your_firebase_project_id
```
2. **Database Setup**:
- Ensure MongoDB is running. Modify the `MONGODB_URI` in `.env` to match your MongoDB setup.
3. **Firebase Configuration**:
- Update the Firebase configuration in `src/firebase/firebaseConfig.js` with your Firebase project credentials.
#### Client Configuration
1. **React Router DOM**:
- Ensure routes are correctly defined in `src/App.js` using `BrowserRouter`, `Route`, and `Switch` from `react-router-dom`.
2. **Firebase Integration**:
- Ensure Firebase authentication and Firestore integration is set up correctly in `src/firebase/firebaseConfig.js`.
### Running the Application
1. Start the server:
```
# From the server directory
cd server
npm start
```
The server should start on port specified in your `.env` file.
2. Start the React application:
```
# From the src directory
cd ../src
npm start
```
The React application should start and open in your default web browser.
### Usage
- The application includes user authentication using Firebase. Users can sign up, log in, and log out.
- Private routes are implemented using `PrivateRoute.js` to protect routes that require authentication.
- MongoDB is used for storing user data and other application-related data.
- React components are organized under `src/components`, and Firebase configuration is under `src/firebase`.
### Troubleshooting
- If encountering `react-chartjs-2` or other dependency-related issues, ensure all dependencies are installed (`npm install`).
- Check console logs for errors related to Firebase initialization, React Router DOM setup, or MongoDB connection issues.
### License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
|