Merge pull request #14 from ArthurDanjou/copilot/improve-readme-file

Enhance README with development setup and security documentation
2026-01-14 15:54:13 +01:00 · 2025-12-24 14:46:59 +01:00
parent b790113771 5a5f3c6319
commit 8d42b682e5
1 changed files with 223 additions and 13 deletions
--- a/README.md
+++ b/README.md
@@ -8,6 +8,9 @@ My professional portfolio built with modern Nuxt.js technologies, showcasing pro
 [![Vue.js](https://img.shields.io/badge/Vue.js-4FC08D?style=for-the-badge&logo=vue.js&logoColor=white)](https://vuejs.org/)
 [![TypeScript](https://img.shields.io/badge/TypeScript-3178C6?style=for-the-badge&logo=typescript&logoColor=white)](https://www.typescriptlang.org/)
 [![TailwindCSS](https://img.shields.io/badge/Tailwind_CSS-38B2AC?style=for-the-badge&logo=tailwind-css&logoColor=white)](https://tailwindcss.com/)
+[![Cloudflare](https://img.shields.io/badge/Cloudflare-F38020?style=for-the-badge&logo=cloudflare&logoColor=white)](https://cloudflare.com/)
+
+[🌐 Live Demo](https://arthurdanjou.fr/) | [🐛 Report Bug](https://github.com/ArthurDanjou/artsite/issues)

 </div>

@@ -15,8 +18,14 @@ My professional portfolio built with modern Nuxt.js technologies, showcasing pro

 - [Features](#-features)
 - [Tech Stack](#️-tech-stack)
+- [Prerequisites](#-prerequisites)
+- [Getting Started](#-getting-started)
+- [Development](#-development)
+- [Environment Variables](#-environment-variables)
 - [Project Structure](#-project-structure)
 - [Integrations](#-integrations)
+- [Deployment](#-deployment)
+- [Contributing](#-contributing)
 - [License](#-license)
 - [Contact](#-contact)

@@ -39,29 +48,175 @@ My professional portfolio built with modern Nuxt.js technologies, showcasing pro
 - **Design System** → [NuxtUI](https://ui.nuxt.com/)
 - **CMS & Editing** → [Nuxt Studio](https://nuxt.studio)
 - **Language** → [TypeScript](https://www.typescriptlang.org/)
- **Deployment** → [NuxtHub](https://hub.nuxt.com/)
+- **Deployment** → [NuxtHub](https://hub.nuxt.com/) on [Cloudflare](https://cloudflare.com/)
 - **Styling** → [Sass](https://sass-lang.com/) & [Tailwind CSS](https://tailwindcss.com/)
- **Package Manager** → [pnpm](https://pnpm.io/)
+- **Package Manager** → [Bun](https://bun.sh/)
 - **Internationalization** → [Nuxt i18n](https://i18n.nuxtjs.org/)
+- **Database** → [Cloudflare D1](https://developers.cloudflare.com/d1/) (SQLite)
 - **Database ORM** → [Drizzle](https://orm.drizzle.team/)
 - **Composables** → [VueUse](https://vueuse.org/)
 - **Validation** → [Zod](https://zod.dev/)
 - **Globe Visualization** → [Cobe](https://github.com/shuding/cobe)
 - **Icons** → [Iconify](https://iconify.design/)

+## 📦 Prerequisites
+
+Before you begin, ensure you have the following installed:
+
+- **Node.js** (v18 or higher recommended)
+- **Bun** (latest version) - [Install Bun](https://bun.sh/docs/installation)
+- **Git** for version control
+- **Cloudflare Account** (for deployment)
+
+## 🚀 Getting Started
+
+1. **Clone the repository**
+
+   ```bash
+   git clone https://github.com/ArthurDanjou/artsite.git
+   cd artsite
+   ```
+
+2. **Install dependencies**
+
+   ```bash
+   bun install
+   ```
+
+3. **Set up environment variables**
+
+   ```bash
+   cp .env.example .env
+   ```
+
+   Then edit `.env` and fill in your configuration values (see [Environment Variables](#-environment-variables) section).
+
+4. **Start the development server**
+
+   ```bash
+   bun run dev
+   ```
+
+   The application will be available at `http://localhost:3000` 🎉
+
+## 💻 Development
+
+### Available Scripts
+
+```bash
+# Start development server
+bun run dev
+
+# Build for production
+bun run build
+
+# Preview production build locally
+bun run preview
+
+# Lint code
+bun run lint
+
+# Deploy to Cloudflare
+bun run deploy
+
+# Generate Cloudflare types
+bun run cf-typegen
+```
+
+### Project Configuration
+
+The project uses:
+- **ESLint** for code linting with stylistic rules (single quotes, no trailing commas)
+- **TypeScript** for type safety
+- **Nuxt DevTools** enabled for enhanced development experience
+
+## 🔐 Environment Variables
+
+Create a `.env` file in the root directory with the following variables:
+
+```env
+# GitHub Studio Integration (for content management)
+STUDIO_GITHUB_CLIENT_ID=your_github_client_id
+STUDIO_GITHUB_CLIENT_SECRET=your_github_client_secret  # Keep this secret! Never commit to version control
+
+# Discord Integration (runtime config - keep private)
+NUXT_DISCORD_USER_ID=your_discord_user_id  # Private
+
+# WakaTime Integration (for coding statistics - keep private)
+NUXT_WAKATIME_USER_ID=your_wakatime_user_id  # Private
+NUXT_WAKATIME_CODING=your_coding_stats_api  # Private
+NUXT_WAKATIME_EDITORS=your_editors_stats_api  # Private
+NUXT_WAKATIME_LANGUAGES=your_languages_stats_api  # Private
+NUXT_WAKATIME_OS=your_os_stats_api  # Private
+
+# Status Page URL
+NUXT_STATUS_PAGE=your_status_page_url
+```
+
+> **Note:** Not all variables are required for basic development. The site will work without integrations, but some features may be disabled.
+
+> **Security:** Never commit your `.env` file or expose sensitive credentials like `STUDIO_GITHUB_CLIENT_SECRET`. Keep all API keys and secrets secure.
+
 ## 📂 Project Structure

 ```
-├── assets/              # Static assets like global styles
-├── components/          # Vue components
-├── layouts/             # Page layouts
-├── pages/               # Application pages
-├── public/              # Public static files
-├── server/              # Server API routes
-├── .env.example         # Example environment variables
-├── nuxt.config.ts       # Nuxt configuration
-├── package.json         # Dependencies and scripts
-└── README.md            # Project documentation
+artsite/
+├── app/                     # Application source code
+│   ├── assets/              # Static assets (CSS, images)
+│   ├── components/          # Vue components
+│   │   ├── content/         # Content-specific components
+│   │   └── home/            # Home page components
+│   ├── composables/         # Vue composables
+│   ├── pages/               # Application pages (file-based routing)
+│   │   ├── index.vue        # Home page
+│   │   ├── projects/        # Projects section
+│   │   ├── hobbies.vue      # Hobbies page
+│   │   ├── uses.vue         # Uses page
+│   │   └── ecosystem.vue    # Ecosystem page
+│   ├── app.config.ts        # App configuration
+│   ├── app.vue              # Root app component
+│   └── error.vue            # Error page
+├── content/                 # Content files (Markdown & JSON)
+│   ├── education/           # Education content
+│   │   ├── bachelor.md      # Bachelor's degree information
+│   │   ├── m1.md            # Master's 1st year information
+│   │   └── m2.md            # Master's 2nd year information
+│   ├── experiences/         # Professional experience content
+│   │   ├── artdanjproduction.md
+│   │   ├── erisium.md
+│   │   ├── hackathon-cnd.md
+│   │   ├── picard.md
+│   │   └── sevetys.md
+│   ├── projects/            # Project portfolio content
+│   │   ├── artchat.md
+│   │   ├── arthome.md
+│   │   ├── artlab.md
+│   │   ├── artstudies.md
+│   │   ├── bikes-glm.md
+│   │   ├── breast-cancer.md
+│   │   ├── dropout-reduces-underfitting.md
+│   │   ├── loan-ml.md
+│   │   ├── monte-carlo-project.md
+│   │   ├── schelling-segregation-model.md
+│   │   └── sevetys.md
+│   ├── contact.json         # Contact information data
+│   ├── hobbies.md           # Hobbies page content
+│   ├── index.md             # Home page content
+│   ├── languages.json       # Programming languages data
+│   ├── skills.json          # Skills and expertise data
+│   └── uses.md              # Tools and software used
+├── public/                  # Public static files
+├── server/                  # Server API routes and middleware
+│   ├── api/                 # API endpoints
+│   └── routes/              # Server routes
+├── types/                   # TypeScript type definitions
+├── .env.example             # Example environment variables
+├── content.config.ts        # Content module configuration
+├── nuxt.config.ts           # Nuxt configuration
+├── package.json             # Dependencies and scripts
+├── tsconfig.json            # TypeScript configuration
+├── wrangler.jsonc           # Cloudflare Workers configuration
+└── README.md                # Project documentation
 ```

 ## 🔌 Integrations
@@ -70,7 +225,62 @@ My professional portfolio built with modern Nuxt.js technologies, showcasing pro
 - **Discord** - Display real-time Discord status
 - **Nuxt Studio** - Headless CMS for content management
 - **Nuxt i18n** - Internationalization support
- **NuxtHub** - CI/CD and deployment
+- **NuxtHub** - CI/CD and deployment platform
+- **Cloudflare D1** - Serverless SQL database
+
+## 🚢 Deployment
+
+This project is configured to deploy on Cloudflare using NuxtHub.
+
+### Deploy to Production
+
+1. **Prerequisites**
+   - Cloudflare account
+   - Wrangler CLI configured (`wrangler login`)
+   - NuxtHub project created
+
+2. **Deploy**
+
+   ```bash
+   bun run deploy
+   ```
+
+   This will:
+   - Generate Cloudflare types
+   - Build the application
+   - Deploy to Cloudflare Workers
+
+### Automatic Deployments
+
+The project is set up with NuxtHub for automatic deployments on push to the main branch.
+
+## 🤝 Contributing
+
+Contributions are welcome! Here's how you can help:
+
+1. **Fork the repository**
+2. **Create a feature branch**
+   ```bash
+   git checkout -b feature/amazing-feature
+   ```
+3. **Make your changes**
+4. **Commit your changes**
+   ```bash
+   git commit -m 'Add some amazing feature'
+   ```
+5. **Push to the branch**
+   ```bash
+   git push origin feature/amazing-feature
+   ```
+6. **Open a Pull Request**
+
+### Development Guidelines
+
+- Follow the existing code style (enforced by ESLint)
+- Use TypeScript for type safety
+- Write descriptive commit messages
+- Test your changes locally before submitting
+- Update documentation if needed

 ## 📄 License