Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 6 additions & 6 deletions docs/how-to/agent-instructions.md
Original file line number Diff line number Diff line change
Expand Up @@ -30,8 +30,8 @@ Here's what you need to know to navigate and contribute effectively.
- Visualizes emission data from CSV files
- Run with: `uv run task carbonboard`

4. **🌐 webapp/** - Next.js Web Dashboard
- Modern React/Next.js web application
4. **🌐 webapp/** - Web Dashboard
- Modern React web application
- Connects to the API backend
- Run with: `cd webapp && pnpm dev`

Expand Down Expand Up @@ -83,7 +83,7 @@ Here's what you need to know to navigate and contribute effectively.
# Python dashboard
uv run task carbonboard

# Next.js webapp
# Js webapp
cd webapp
pnpm install
pnpm dev
Expand Down Expand Up @@ -122,7 +122,7 @@ Here's what you need to know to navigate and contribute effectively.

### Dashboard Development
1. **Python Dashboard**: Uses Dash + Plotly, see `codecarbon/viz`
2. **Next.js Dashboard**: Modern React components in `webapp/src/`
2. **React Dashboard**: Modern React components in `webapp/src/`
3. **Connect to API**: Set `CODECARBON_API_URL=http://localhost:8008` for local development

## Environment Management
Expand Down Expand Up @@ -155,7 +155,7 @@ uv run task -l
- **[CONTRIBUTING.md](https://docs.codecarbon.io/latest/how-to/contributing/)**: Detailed contribution guidelines and setup
- **[README.md](https://github.com/mlco2/codecarbon/blob/master/README.md)**: Project overview and quickstart
- **[carbonserver/README.md](https://github.com/mlco2/codecarbon/blob/master/carbonserver/README.md)**: API architecture and database schema
- **[webapp/README.md](https://github.com/mlco2/codecarbon/blob/master/webapp/README.md)**: Next.js dashboard setup
- **[webapp/README.md](https://github.com/mlco2/codecarbon/blob/master/webapp/README.md)**: React dashboard setup
- **[carbonserver/tests/TESTING.md](https://github.com/mlco2/codecarbon/blob/master/carbonserver/tests/TESTING.md)**: Comprehensive testing guide

### VS Code Debugging
Expand All @@ -177,7 +177,7 @@ The repository includes VS Code launch configurations in `docs/how-to/contributi
│ (package) │───▶│ (API) │◀───│ (2 versions) │
│ │ │ │ │ │
│ • CLI tools │ │ • FastAPI │ │ • Dash (Python) │
│ • Tracking core │ │ • PostgreSQL │ │ • Next.js (Web) │
│ • Tracking core │ │ • PostgreSQL │ │ • React (Web) │
│ • Data output │ │ • Authentication│ │ • Visualization │
└─────────────────┘ └─────────────────┘ └─────────────────┘
```
Expand Down
57 changes: 25 additions & 32 deletions webapp/README.md
Original file line number Diff line number Diff line change
@@ -1,63 +1,56 @@
# Next.js Code Carbon Web Application Project
# Code Carbon Web Application Project

Welcome to the Code Carbon Next.js Project! This README will guide you through the process of setting up and running the project on your local machine.
Welcome to the Code Carbon Project! This README will guide you through the process of setting up and running the project on your local machine.

## Prerequisites

Before you begin, ensure you have the following installed on your system:

- Node.js (version 14 or later)
- pnpm (better alternative to npm)
- Git
- Node.js (version 14 or later)
- pnpm (better alternative to npm)
- Git

## Getting Started

Follow these steps to get the project up and running on your local machine:

1. **Open a terminal and go to the /webapp folder**

```bash
cd webapp
```
```bash
cd webapp
```

2. **Install dependencies**

```bash
pnpm install
```
```bash
pnpm install
```

3. **Set up environment variables**

This project uses environment variables for configuration. You need to create a `.env` file in the root directory of the project.
This project uses environment variables for configuration. You need to create a `.env` file in the root directory of the project.

- Copy the `.env.example` file and rename it to `.env`:
- Copy the `.env.example` file and rename it to `.env`:

```bash
cp .env.example .env
```
```bash
cp .env.example .env
```

- Open the `.env` file and fill in the necessary values for your local environment.
- Open the `.env` file and fill in the necessary values for your local environment.

4. **Run the development server**

```bash
pnpm dev
```
```bash
pnpm dev
```

The application should now be running on [http://localhost:3000](http://localhost:3000).
The application should now be running on [http://localhost:3000](http://localhost:3000).

## Available Scripts

In the project directory, you can run:

- `pnpm dev`: Runs the app in development mode
- `pnpm build`: Builds the app for production
- `pnpm start`: Runs the built app in production mode
- `pnpm lint`: Runs the linter to check for code style issues

## Learn More

To learn more about Next.js, check out the following resources:

- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
- `pnpm dev`: Runs the app in development mode
- `pnpm build`: Builds the app for production
- `pnpm start`: Runs the built app in production mode
- `pnpm lint`: Runs the linter to check for code style issues
Loading